/* Style Vseriale */
@import url('/style/styles.css');
@import url('/style/engine.css');
/* Конец основных стилей Vseriale - Эти строки не удалять, редактировать через ФМ */

/* Скрываем сортировку комментариев, по мне вещь бесполезная, если надо, то удалите эти строки */
.com-order-block {display: none !important;}
/* ------------------------------------------------------------------------------------------- */



.l-over{
 display:none;
 position:fixed; inset:0;
 background: rgba(0,0,0,.45);
 z-index: 9998;
}

.l-box{
 display:none;
 position:fixed;
 top:50%; left:50%;
 transform:translate(-50%,-50%);
 z-index: 9999;
 background:#fff;
 padding:16px;
 border-radius:12px;
 max-width:420px;
 width: calc(100% - 24px);
}




/* Затемнение */
.l-over{
 display:none;
 position:fixed; inset:0;
 background: rgba(0,0,0,.55);
 z-index: 9998;
}

/* Окно */
.l-box{
 display:none;
 position:fixed;
 top:50%; left:50%;
 transform:translate(-50%,-50%);
 z-index: 9999;

 width: min(520px, calc(100% - 24px));
 background:#fff;
 border-radius: 16px;
 box-shadow: 0 24px 80px rgba(0,0,0,.35);

 padding: 18px 18px 16px;
}

/* Заголовок */
.l-head{ padding-right: 34px; }
.l-title{ font-size: 18px; font-weight: 800; color:#1f2a37; }
.l-subtitle{ margin-top: 4px; font-size: 12px; color:#6b7280; }

/* Контент */
.l-body{ margin-top: 14px; }

/* Кнопка закрытия */
.l-close{
 position:absolute;
 top:10px; right:10px;
 width:32px; height:32px;
 border:0;
 border-radius:10px;
 background:#f3f4f6;
 color:#111827;
 cursor:pointer;
 font-size: 18px;
 line-height: 32px;
}
.l-close:hover{ background:#e5e7eb; }

/* Чуть приятнее для содержимого uCoz-формы */
.l-box form{ margin:0; }
.l-box input[type="text"],
.l-box input[type="password"]{
 width:100%;
 box-sizing:border-box;
 padding:10px 12px;
 border:1px solid #d1d5db;
 border-radius:10px;
 font-size: 14px;
}
.l-box input[type="submit"], .l-box button[type="submit"]{
 width:100%;
 margin-top:10px;
 padding:10px 12px;
 border:0;
 border-radius:10px;
 background:#5b2b82;
 color:#fff;
 font-weight:700;
 cursor:pointer;
}

/* На мобильном — чуть меньше отступы */
@media (max-width: 480px){
 .l-box{ padding: 14px 14px 12px; border-radius: 14px; }
 .l-title{ font-size: 16px; }
}





/* Соц-иконки в футере */
.footer__soc{
 display:flex;
 align-items:center;
 gap:10px;
}

.footer__soc-item{
 width:36px;
 height:36px;
 border-radius:50%;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 background: rgba(255,255,255,.10);
 transition: transform .2s ease, background .2s ease, opacity .2s ease;
 opacity: .95;
}

.footer__soc-item:hover{
 transform: translateY(-2px);
 background: rgba(255,255,255,.16);
 opacity: 1;
}

.footer__soc-item img{
 width:18px;
 height:18px;
 object-fit: contain;
 display:block;
}



.footer__soc-item{
 width:36px;
 height:36px;
 border-radius:50%;
 display:inline-flex;
 align-items:center;
 justify-content:center;
}

.footer__soc-item.tlg{ background:#2AABEE; } /* Telegram */
.footer__soc-item.vk{ background:#0077FF; } /* VK */
.footer__soc-item.pinterest{background:#E53935;} /* pinterest */

.footer__soc-item img{
 width:18px;
 height:18px;
 filter: brightness(0) invert(1) !important; /* делаем значок белым */
}




/* Друзья сайта */
#friends-left .friends-grid{
 display:flex;
 flex-wrap:wrap;
 gap:10px;
}

#friends-left .friend-item{
 width:calc(50% - 5px);
 display:flex;
 flex-direction:column;
 align-items:center;
 text-align:center;
 text-decoration:none;
}

#friends-left .friend-item img{
 width:120px;
 height:70px;
 object-fit:cover;
 border-radius:8px;
 display:block;
}

#friends-left .friend-item span{
 margin-top:6px;
 font-size:12px;
 line-height:1.2;
 opacity:.9;
}

/* Друзья сайта: плитки з рамкою + тінь при наведенні */
#friends-left .friend-item{
 border:1px solid rgba(0,0,0,.12);
 border-radius:10px;
 background:#fff;
 padding:8px 8px 10px;
 box-sizing:border-box;

 transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}

#friends-left .friend-item:hover{
 border-color: rgba(0,0,0,.20);
 box-shadow:0 8px 20px rgba(0,0,0,.18);
 transform: translateY(-2px);
}

/* Щоб картинка теж була акуратна */
#friends-left .friend-item img{
 border-radius:8px;
 display:block;
}

/* Трохи відступу для підпису */
#friends-left .friend-item span{
 margin-top:8px;
}


/* запасной универсальный фикс для uCoz-окон (для ответа в коментариях пользователей, было белым по белому, фиксил) */
.myWinCont textarea,
.myWinCont input[type="text"],
.myWinCont input[type="email"],
.myWinCont input[type="url"]{
 color: #111 !important;
 background: #fff !important;
 caret-color: #111 !important;
}