/*
Theme Name: dance-credit
Author: <a href="https://t.me/rursul">Ursul Roman Mihailovich</a>
Description: base wp theme
Version: 4.0
*/

nav .df {
    max-width: 800px;
    margin: 10px auto;
    padding: 0;
    text-align: center;
}

nav .df .sub-menu {
    display: none;
}

nav .df li {
    display: block;
}

nav .df > li > a {
    display: block;
    margin: 5px 7px;
    
}

nav .df a {
    color: #007bff;
    text-decoration:none;
}

nav .df a:hover {
    color: #0056b3;
}

nav .df > li li + li {
    margin-top: 10px;
}

nav .df > li li > a {
    display: block;
    line-height: 1.2em;
}

.header .df{
	justify-content: space-between;
	align-items: center;
	max-width: 800px;	
	margin: 0 auto;
}

@media screen and (max-width: 1000px){
	.footer_menu .df {
		flex-wrap: wrap;
		text-align: left;
	}
	.footer_menu .df li a {
		font-size: 14px;
	}
	
}

@media screen and (min-width: 768px){
    nav .df {
        display: flex;
        align-items: center;
        justify-content: center;
        //flex-wrap: wrap;
    }
    nav > ul > li {
        position: relative;
		text-align: left;
    }
    nav > ul > li > ul {
        position: absolute;
        left: 0;
        top: 27px;
        width: 200px;
        padding: 10px;
        border-radius: 10px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.1);
        background: #fff;
		z-index: 100;
    }
	nav > ul > li:nth-last-child(2) > ul,
	nav > ul > li:last-child > ul {
		right: 0;
		left: auto;
	}
    nav > ul > li:hover > ul {
        display: block !important;
    }
    .header_menu .df .sub-menu li a {
        font-size: 14px;
    }
}

@media screen and (max-width: 769px){
    .header_menu > ul {
        display: none;
    }
    #mmenu {
      cursor: pointer;
      padding: 10px;
      width: 44px;
      height: 36px;
      box-sizing: border-box;
      margin: 0;
      display: block !important;
    }
    #mmenu span {
      display: block;
      background: #000;
      margin-top: 5px;
      height: 2px;
      width: 23px;
      transition: All 0.2s ease-in-out;
      -webkit-transition: All 0.2s ease-in-out;
      -moz-transition: All 0.2s ease-in-out;
      -o-transition: All 0.2s ease-in-out;
    }
    #mmenu span:nth-child(1) {
      margin-top: 0;
    }
    #mmenu.open span:last-child {
      opacity: 0;
    }
    #mmenu.open span:nth-child(1) {
      margin-top: 0;
      margin-top: 7px;
      position: relative;
      top: 2px;
      -moz-transform: rotate(45deg);
      -webkit-transform: rotate(45deg);
      -o-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg);
    }
    #mmenu.open span:nth-child(2) {
      margin-top: 0;
      -moz-transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
      -o-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      transform: rotate(-45deg);
    }
    .header_menu > ul.open {
        display: block !important;
        width: 300px;
        position: absolute;

        padding: 10px;
        border-radius: 10px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.1);
        background: #fff;
        
        left: 50%;
        top: 50px;
        transform: translate(-50%, 0);
    }
    .header_menu .df .sub-menu li + li {
         margin-top: 5px;
    }
    .header_menu .df > li + li {
        margin-top: 10px;
    }
    .header_menu .df > li > a {
        font-size: 18px;
    }
    .header_menu .df .sub-menu {
        display: block;
        padding: 0;
        font-size: 16px;
        margin: 10px 0;
    }
	nav .df > li li > a {
		font-size: 14px;
	}
}

.df {
	display: flex;
}

.dropdown {
  position: relative;
}
.dropdown.dropdown_up .dropdown-menu {
  top: auto;
  bottom: calc(100% + 3px);
}
.dropdown .dropdown-toggle {
  color: #007bff;
  cursor: pointer;
  position: relative;
  align-items: center;
  user-select: none;
  font-size: 16px;
  font-weight: 600;
  transition: All 0.2s ease-in-out;
  -webkit-transition: All 0.2s ease-in-out;
  -moz-transition: All 0.2s ease-in-out;
  -o-transition: All 0.2s ease-in-out;
}
.dropdown .dropdown-toggle span {
  border-bottom: 1px dashed;
  display: block;
  line-height: 1.2em;
}
.dropdown .dropdown-toggle:hover {
  color: #007bff;
}
.dropdown .dropdown-toggle:hover .arrow {
  border-color: #007bff;
}
.dropdown .dropdown-toggle .arrow {
  margin-left: 10px;
  padding: 4px;
  border-width: 0 1px 1px 0;
  top: -1px;
  transition: All 0.2s ease-in-out;
  -webkit-transition: All 0.2s ease-in-out;
  -moz-transition: All 0.2s ease-in-out;
  -o-transition: All 0.2s ease-in-out;
  border-color: transparent #007bff #007bff transparent;
}
.dropdown .dropdown-menu {
  display: none;
  position: absolute;
  right: 0;
  top: calc(100% + 3px);
  z-index: 100;
  display: none;
  padding: 10px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  min-width: 60px;
  height: auto;
}
.dropdown .dropdown-menu li {
  display: block;
}
.dropdown .dropdown-menu li + li {
  padding-top: 18px;
}
.dropdown .dropdown-menu li a {
  font-size: 14px;
  text-decoration: none;
  color: #007bff;
}
.dropdown .dropdown-menu li a:hover {
  text-decoration: underline;
}
.dropdown.show .dropdown-toggle .arrow {
  top: 2px;
  -moz-transform: rotate(225deg);
  -webkit-transform: rotate(225deg);
  -o-transform: rotate(225deg);
  -ms-transform: rotate(225deg);
  transform: rotate(225deg);
}
.dropdown.show .dropdown-menu {
  display: block;
}
i.arrow {
  display: inline-block;
  padding: 3px;
  border: solid black;
  border-width: 0 2px 2px 0;
  position: relative;
  transition: All 0.2s ease-in-out;
  -webkit-transition: All 0.2s ease-in-out;
  -moz-transition: All 0.2s ease-in-out;
  -o-transition: All 0.2s ease-in-out;
}
i.arrow.arrow_right {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
i.arrow.arrow_left {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}
i.arrow.arrow_up {
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}
i.arrow.arrow_down {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}


.author-photo.author-photo_xl {
	width: 100%;
	height: 100%;
	max-width: 300px;
	max-height: 300px;
}




/* Контейнер блока комментариев */
.comments-area {
	max-width: 700px;
	margin: 0 auto;
	padding: 20px;
	background: #f9f9f9;
	border-radius: 12px;
	font-family: 'Montserrat', sans-serif;
}

/* Заголовок блока */
.comments-area .title_1 {
	font-size: 1.6rem;
	font-weight: 700;
	margin-bottom: 24px;
	color: #222;
}

/* Форма комментария */
.comment-form textarea {
	width: 100%;
	padding: 12px;
	font-size: 1rem;
	font-family: 'Montserrat', sans-serif;
	border: 1px solid #ced4da;
	border-radius: 8px;
	box-sizing: border-box;
	resize: vertical;
	min-height: 140px;
	margin-bottom: 20px;
	transition: border-color 0.2s ease;
}

.comment-form textarea:focus {
	outline: none;
	border-color: #007bff; /* Цвет при фокусе */
}

/* Контейнер для двух колонок с input */
.comment-form .df {
	display: flex;
	gap: 16px;
	margin-bottom: 20px;
}

.comment-form .col {
	flex: 1;
}

/* Инпуты для имени и email */
.comment-form input[type="text"],
.comment-form input[type="email"] {
	width: 100%;
	padding: 12px;
	font-size: 1rem;
	font-family: 'Montserrat', sans-serif;
	border: 1px solid #ced4da;
	border-radius: 8px;
	box-sizing: border-box;
	transition: border-color 0.2s ease;
}

.comment-form input[type="text"]:focus,
.comment-form input[type="email"]:focus {
	outline: none;
	border-color: #007bff;
}

/* Чекбокс согласия */
.comment-form-cookies-consent {
	font-size: 0.875rem;
	color: #555;
	margin-bottom: 24px;
}

.comment-form-cookies-consent input[type="checkbox"] {
	margin-right: 8px;
	vertical-align: middle;
	cursor: pointer;
}

/* Кнопка отправки (используя ваши текущие стили) */
.form-submit .submit {
	padding: 12px 25px;
	border: none;
	border-radius: 8px;
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s ease;
	font-family: 'Montserrat', sans-serif;
	background-color: #007bff;
	color: white;
	display: inline-block;
}

.form-submit .submit:hover {
	background-color: #0056b3;
}
