/* ============================================================
   ui-tweaks.css — правки шапки (десктоп):
   1) выбор языка в виде «ENG ⌄» рядом с LOGIN/REGISTER (как в макете);
   2) выпадающие меню (База данных и пр.) — визуально как меню языка.
   Подключается последним. Откат = убрать <link>.
   ============================================================ */

/* --- 1. Переключатель языка: код + стрелка, в блоке auth --- */
.main-menu-other .auth .langsel{
  display:inline-block;
  position:relative;
  vertical-align:middle;
  margin-right:14px;
}
.main-menu-other .auth .langsel .langcur{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#fff;                 /* белый, как просили */
  text-transform:uppercase;
  cursor:pointer;
  padding:5px;
  border:none;
  background:none;
  white-space:nowrap;
  font-size:16px;             /* как у LOGIN/REGISTER */
  font-weight:400;            /* перебиваем базовое 600 */
}
.main-menu-other .auth .langsel:hover .langcur{ color:#fff266; }
.main-menu-other .auth .langsel .langcur i{
  font-size:.7em;
  transition:transform .25s;
}
.main-menu-other .auth .langsel:hover .langcur i{ transform:rotate(180deg); }

/* выпадающее меню языка — тёмный бокс, открывается под кодом */
.main-menu-other .auth .langsel .langmenu{
  left:0;
  right:auto;
  top:100%;
}
.main-menu-other .auth .langsel .langmenu li{
  float:none;
  width:auto;
  margin:0;
}
.main-menu-other .auth .langsel .langmenu li a{
  display:block;
  padding:9px 16px;
  color:#cfe0f2;
  text-transform:none;
}
.main-menu-other .auth .langsel .langmenu li a:hover{
  background:rgba(255,194,75,.15);
  color:#fff;
}

/* --- 4. Кнопка PLAY — вариант Dark glass (тест) --- */
@media screen and (min-width:993px){
  .header-medium .play .btn-play{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:14px !important;
    width:auto !important;
    min-width:300px !important;
    height:auto !important;
    aspect-ratio:auto !important;
    padding:20px 64px !important;
    background-image:none !important;
    /* вариант 10 (эмбос), но полупрозрачный внутри */
    background:linear-gradient(180deg, rgba(28,40,60,.55), rgba(10,17,28,.62)) !important;
    -webkit-backdrop-filter:blur(5px) !important;
    backdrop-filter:blur(5px) !important;
    border:2px solid rgba(255,194,75,.75) !important;
    border-radius:14px !important;
    box-shadow:0 14px 32px rgba(0,0,0,.5), 0 0 26px rgba(255,194,75,.25), inset 0 2px 0 rgba(255,255,255,.12), inset 0 -7px 16px rgba(0,0,0,.45) !important;
    -webkit-filter:none !important;
    filter:none !important;
    -webkit-transition:transform .18s ease, box-shadow .25s ease, -webkit-filter .25s ease !important;
    transition:transform .18s ease, box-shadow .25s ease, filter .25s ease !important;
  }
  .header-medium .play .btn-play::before{
    content:"" !important;
    display:block;
    width:0; height:0;
    border-style:solid;
    border-width:11px 0 11px 18px;
    border-color:transparent transparent transparent #ffd97a;
  }
  .header-medium .play .btn-play:hover{
    transform:scale(1.06) !important;             /* увеличивается */
    border-color:rgba(255,214,120,1) !important;
    box-shadow:
      0 0 0 2px rgba(255,194,75,.55),
      0 0 16px rgba(255,194,75,.85),
      0 0 38px rgba(255,194,75,.6),
      0 0 70px rgba(255,194,75,.4),
      inset 0 2px 0 rgba(255,255,255,.14),
      inset 0 -7px 16px rgba(0,0,0,.4) !important;  /* подсветка по периметру */
  }
  .header-medium .play .btn-play .playnow-txt{
    position:static !important;
    top:auto !important; left:auto !important; right:auto !important;
    -webkit-transform:none !important;
    transform:none !important;
    color:#ffd97a !important;
    font-family:'Museo Cyrl 500',sans-serif !important;
    font-size:32px !important;
    letter-spacing:2px !important;
    line-height:1 !important;
    text-shadow:0 1px 6px rgba(255,170,40,.55) !important;
  }
  .header-medium .play .btn-play::after{ content:none !important; }
}

/* --- 3. Карточка таймера сервера (сбоку кракена) — десктоп --- */
@media screen and (min-width:993px){
  .header-medium .server.right{
    background:linear-gradient(180deg, rgba(9,16,27,.975), rgba(4,9,16,.985)) !important;
    background-image:none !important;
    -webkit-backdrop-filter:blur(3px) !important;
    backdrop-filter:blur(3px) !important;
    border:1px solid rgba(255,194,75,.55) !important;
    border-radius:16px !important;
    box-shadow:0 18px 48px rgba(0,0,0,.65), 0 0 0 1px rgba(255,194,75,.10), inset 0 1px 0 rgba(255,255,255,.05) !important;
    width:286px !important;
    height:auto !important;
    padding:18px 14px 20px !important;
    margin-top:172px !important;   /* ниже */
    margin-left:128px !important;  /* правее */
    text-transform:none !important;
    z-index:3 !important;          /* ниже выпадающих меню (меню сверху) */
  }
  /* заголовок FORTUNE ISLAND */
  .header-medium .server.right .name{
    color:#ffc24b !important;
    font-size:15px !important;
    font-weight:700 !important;
    letter-spacing:2.5px !important;
    text-align:center !important;
    text-transform:uppercase !important;
    padding:0 !important;
    margin:0 0 4px !important;
    border:none !important;
    text-shadow:0 1px 6px rgba(255,170,40,.35) !important;
  }
  /* дата запуска + золотой разделитель */
  .header-medium .server.right .srv-date{
    text-align:center !important;
    color:#e7c878 !important;
    font-size:11px !important;
    letter-spacing:1.5px !important;
    text-transform:uppercase !important;
    margin:0 0 14px !important;
    padding:0 0 12px !important;
    border-bottom:1px solid rgba(255,194,75,.22) !important;
  }
  /* ряд из 4 ячеек */
  .header-medium .server.right .eTimer{
    display:flex !important;
    justify-content:space-between !important;
    gap:7px !important;
    padding:0 !important;
    background:none !important;
    box-shadow:none !important;
  }
  .header-medium .server.right .etTitle,
  .header-medium .server.right .etSep{ display:none !important; }
  /* ячейка units */
  .header-medium .server.right .etUnit,
  .header-medium .server.right .etUnit.etDays{
    flex:1 1 0 !important;
    box-sizing:border-box !important;   /* чтобы рамка не вылезала за ячейку */
    min-width:0 !important;
    overflow:hidden !important;         /* подписи не вылезают за ячейку */
    display:block !important;
    text-align:center !important;
    background:rgba(255,255,255,.045) !important;
    border:1px solid rgba(255,194,75,.18) !important;
    border-radius:9px !important;
    padding:9px 2px 7px !important;
    width:auto !important;
    margin:0 !important;
  }
  /* цифры */
  .header-medium .server.right .etUnit .etNumber{
    display:inline-block !important;
    font-family:'Museo Cyrl 500',sans-serif !important;
    color:#ffd97a !important;
    font-size:23px !important;
    font-weight:700 !important;
    line-height:1 !important;
    width:auto !important;
    padding:0 !important;
    margin:0 !important;
    background:none !important;
    box-shadow:none !important;
    text-shadow:0 1px 4px rgba(255,150,20,.35) !important;
  }
  /* подпись days/hours/... */
  .header-medium .server.right .etUnit .etSign{
    display:block !important;
    width:100% !important;
    margin-top:7px !important;
    font-family:'Museo Cyrl 500',sans-serif !important;
    font-size:8.5px !important;
    letter-spacing:0 !important;
    color:#9fb3c8 !important;
    text-transform:uppercase !important;
    text-align:center !important;
    white-space:nowrap !important;
  }
}

/* --- 2. Выпадающие меню навигации (База данных и пр.) как у языка --- */
@media screen and (min-width:993px){
  .main-menu-li .sub-menu{
    background:#0b1a2b !important;
    border:1px solid rgba(255,194,75,.35) !important;
    border-radius:8px !important;
    padding:6px 0 !important;
    box-shadow:0 10px 30px rgba(0,0,0,.5) !important;
    top:100% !important;
  }
  .main-menu-li .sub-menu li{
    padding:0 !important;
    border-radius:0 !important;
    background:transparent !important;
  }
  .main-menu-li .sub-menu li a{
    display:block !important;
    padding:9px 16px !important;
    color:#cfe0f2 !important;
    font-size:14px !important;
    text-transform:none !important;
    white-space:nowrap;
  }
  .main-menu-li .sub-menu li a:hover{
    background:rgba(255,194,75,.15) !important;
    color:#fff !important;
  }
}