/* FirestickDownloader Phase 1.2: refined language switcher layout.
   Keeps AI pages excluded via existing PHP and only improves visual integration. */

/* Base styles shared by desktop and mobile instances */
.premium-site-wrapper .fd-lang-switcher {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.premium-site-wrapper .fd-lang-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  text-decoration: none !important;
  white-space: nowrap;
  box-sizing: border-box;
  border-radius: 999px;
  color: #dcecff !important;
  background: rgba(14, 26, 45, 0.88);
  border: 1px solid rgba(79, 173, 230, 0.26);
  transition: background .25s ease, border-color .25s ease, color .25s ease, transform .2s ease, box-shadow .25s ease;
}
.premium-site-wrapper .fd-lang-link:hover,
.premium-site-wrapper .fd-lang-link:focus-visible,
.premium-site-wrapper .fd-lang-link.is-active {
  color: #fff !important;
  border-color: rgba(0, 163, 255, 0.95);
  background: rgba(0, 120, 215, 0.24);
  box-shadow: 0 0 0 1px rgba(0, 163, 255, 0.14), 0 8px 20px rgba(0, 40, 86, 0.18);
}
.premium-site-wrapper .fd-lang-link:hover { transform: translateY(-1px); }
.premium-site-wrapper .fd-lang-link:focus-visible {
  outline: 2px solid #ffb25e;
  outline-offset: 2px;
}
.premium-site-wrapper .fd-lang-flag {
  font-size: 14px;
  line-height: 1;
}
.premium-site-wrapper .fd-lang-code {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .03em;
  line-height: 1;
}

/* DESKTOP: integrate inside existing nav row */
.premium-site-wrapper .fd-lang-switcher--desktop {
  margin-right: 2px;
}
.premium-site-wrapper .fd-lang-switcher--desktop .fd-lang-link {
  min-height: 30px;
  padding: 0 10px;
}
.premium-site-wrapper .fd-lang-switcher--desktop + a,
.premium-site-wrapper .fd-lang-switcher--desktop + .dropdown {
  margin-left: 4px;
}
.premium-site-wrapper .fd-lang-switcher--mobile {
  display: none;
}

/* TABLET / MOBILE: compact header switcher near the hamburger */
@media (max-width: 1200px) {
  .premium-site-wrapper .fd-lang-switcher--desktop {
    display: none !important;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile {
    display: inline-flex;
    margin-left: auto;
    margin-right: 8px;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile .fd-lang-link {
    width: 42px;
    min-width: 42px;
    height: 42px;
    padding: 0;
    border-radius: 12px;
    gap: 0;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile .fd-lang-code {
    display: none;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile .fd-lang-flag {
    font-size: 18px;
  }

  .premium-site-wrapper .glass-header {
    gap: 8px;
  }
  .premium-site-wrapper .menu-toggle {
    margin-left: 0 !important;
    flex-shrink: 0;
  }
  .premium-site-wrapper .nav-links {
    max-height: min(77dvh, 640px);
  }
  .premium-site-wrapper .nav-links .dropdown-content a {
    padding-top: 9px;
    padding-bottom: 9px;
  }
}

@media (max-width: 600px) {
  .premium-site-wrapper .glass-header {
    padding: 12px 4% !important;
  }
  .premium-site-wrapper .glass-header .logo-seo {
    font-size: clamp(15px, 4.9vw, 22px) !important;
    letter-spacing: -.35px;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile {
    gap: 5px;
    margin-right: 6px;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile .fd-lang-link {
    width: 38px;
    min-width: 38px;
    height: 38px;
    border-radius: 11px;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile .fd-lang-flag {
    font-size: 16px;
  }
  .premium-site-wrapper .hero-section {
    padding-top: 32px !important;
    padding-bottom: 22px !important;
  }
  .premium-site-wrapper .hero-section .seo-h1 {
    font-size: clamp(24px, 7vw, 34px) !important;
    line-height: 1.16 !important;
    margin-bottom: 14px !important;
  }
  .premium-site-wrapper .hero-section .hero-subtitle {
    font-size: 15px !important;
    line-height: 1.52 !important;
  }
}

@media (max-width: 390px) {
  .premium-site-wrapper .fd-lang-switcher--mobile {
    margin-right: 4px;
    gap: 4px;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile .fd-lang-link {
    width: 34px;
    min-width: 34px;
    height: 34px;
    border-radius: 10px;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile .fd-lang-flag {
    font-size: 15px;
  }
}

/* V1.3: Correct header layout - avoid any overflowing or wrapped controls */
@media (min-width: 1201px) {
  .premium-site-wrapper .glass-header {
    display: flex !important; align-items:center !important;
    flex-wrap:nowrap !important; gap:16px !important;
    padding:15px clamp(20px, 3%, 55px) !important;
  }
  .premium-site-wrapper .glass-header .logo-seo {
    flex:0 0 auto; font-size:clamp(18px,1.65vw,24px) !important;
  }
  .premium-site-wrapper .glass-header .nav-links {
    display:flex !important; flex:1 1 auto; min-width:0;
    justify-content:flex-end !important; flex-wrap:nowrap !important;
    column-gap:clamp(6px, .85vw, 14px) !important;
  }
  .premium-site-wrapper .glass-header .nav-links > a,
  .premium-site-wrapper .glass-header .nav-links > .dropdown > a {
    font-size:clamp(10px,.85vw,13px) !important; white-space:nowrap;
  }
  .premium-site-wrapper .glass-header .nav-links .forum-btn,
  .premium-site-wrapper .glass-header .nav-links .ai-nav-btn {
    padding:9px 11px !important; margin-left:0 !important;
  }
  .premium-site-wrapper .fd-lang-switcher--desktop {gap:4px; margin:0 2px 0 0;}
  .premium-site-wrapper .fd-lang-switcher--desktop .fd-lang-link {
    min-height:28px; padding:0 7px;
  }
  .premium-site-wrapper .fd-lang-switcher--desktop .fd-lang-flag {font-size:12px;}
  .premium-site-wrapper .fd-lang-switcher--desktop .fd-lang-code {font-size:10px;}
}
@media (max-width:1200px) {
  .premium-site-wrapper .glass-header {
    display:flex !important; align-items:center !important;
    flex-wrap:nowrap !important; min-width:0; width:100%;
    box-sizing:border-box; gap:8px !important;
  }
  .premium-site-wrapper .glass-header .logo-seo {
    flex:0 1 auto; min-width:0;
    overflow:hidden; text-overflow:clip;
    white-space:nowrap; font-size:clamp(14px,4.1vw,21px) !important;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile {
    flex:0 0 auto; position:relative; display:flex !important;
    gap:0; margin:0 0 0 auto !important;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile .fd-lang-trigger {
    display:flex; align-items:center; justify-content:center; gap:4px;
    min-width:42px; height:42px; padding:0 7px;
    border-radius:12px; border:1px solid rgba(79,173,230,.45);
    background:#122038; color:#fff; cursor:pointer;
    font-size:17px; line-height:1;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile .fd-lang-trigger .fd-lang-caret {font-size:9px; color:#00a3ff;}
  .premium-site-wrapper .fd-lang-switcher--mobile .fd-lang-panel {
    display:none; position:absolute; top:calc(100% + 10px); right:0;
    min-width:150px; padding:6px;
    background:#0b1525; border:1px solid rgba(79,173,230,.4);
    border-radius:12px; box-shadow:0 12px 25px rgba(0,0,0,.5);
    z-index:2005;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile.is-open .fd-lang-panel {display:grid;gap:4px;}
  .premium-site-wrapper .fd-lang-switcher--mobile .fd-lang-link {
    width:100%; height:38px; min-width:0; border-radius:8px;
    justify-content:flex-start; padding:0 10px; gap:10px;
  }
  .premium-site-wrapper .fd-lang-switcher--mobile .fd-lang-code {display:inline; font-size:12px;}
  .premium-site-wrapper .glass-header .menu-toggle {
    flex:0 0 44px; width:44px; min-width:44px; max-width:44px;
    margin:0 !important; padding:0 !important;
    font-size:28px !important; box-sizing:border-box;
  }
}
@media (max-width:390px) {
  .premium-site-wrapper .glass-header {gap:5px !important; padding:11px 3% !important;}
  .premium-site-wrapper .glass-header .logo-seo {font-size:clamp(13px,4vw,16px) !important;}
  .premium-site-wrapper .fd-lang-switcher--mobile .fd-lang-trigger {min-width:37px;height:37px;padding:0 4px;}
  .premium-site-wrapper .glass-header .menu-toggle {flex-basis:40px;width:40px;min-width:40px;max-width:40px;}
}

/* FAZ 1.4 - Restore compact four-device hero showcase on small screens. */
@media (max-width: 767px) {
  .premium-site-wrapper .hero-section .hero-device-showcase {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    align-items: center !important;
    justify-items: center !important;
    column-gap: clamp(5px, 2vw, 12px) !important;
    row-gap: 0 !important;
    width: min(100%, 420px) !important;
    max-width: 420px !important;
    margin: 28px auto 0 !important;
    padding: 0 6px !important;
    box-sizing: border-box !important;
  }
  .premium-site-wrapper .hero-section .hero-device-showcase > a {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .premium-site-wrapper .hero-section .hero-device-showcase > a > img {
    display: block !important;
    width: 100% !important;
    max-width: 76px !important;
    height: 72px !important;
    max-height: 72px !important;
    object-fit: contain !important;
    box-sizing: border-box !important;
    border-radius: 10px !important;
  }
  .premium-site-wrapper .hero-section .hero-actions {gap:12px !important;}
  .premium-site-wrapper .hero-section .hero-subtitle {margin-bottom:24px !important;}
}
@media (max-width: 390px) {
  .premium-site-wrapper .hero-section .hero-device-showcase > a > img {
    max-width: 66px !important;
    height: 64px !important;
    max-height: 64px !important;
  }
}


/* FAZ 2.0 – hamburger visual integration; no interaction changes. */
@media (max-width: 1200px) {
  .premium-site-wrapper .glass-header .menu-toggle {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    justify-content: center;
    align-items: center;
    border: 1px solid rgba(79,173,230,.32) !important;
    border-radius: 12px !important;
    background: rgba(14,26,45,.88) !important;
    box-shadow: none !important;
    color: #e7f3ff !important;
    font-size: 26px !important;
    line-height: 1 !important;
    cursor: pointer;
    flex-shrink: 0;
    -webkit-tap-highlight-color: transparent;
  }
  .premium-site-wrapper .glass-header .menu-toggle:hover {
    background: rgba(0,120,215,.22) !important;
    border-color: rgba(0,163,255,.7) !important;
  }
}
@media (max-width: 600px) {
  .premium-site-wrapper .glass-header .menu-toggle {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    font-size: 24px !important;
  }
}
@media (max-width: 390px) {
  .premium-site-wrapper .glass-header .menu-toggle {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    font-size: 22px !important;
  }
}
