/* ==============================
   Stacking: modals, footer, chat
   ============================== */

/* WHMCS modals always above sticky/footer bits */
.modal-backdrop { z-index: 1040 !important; }
.modal          { z-index: 1050 !important; }


#modalChooseLanguage,
#modalChooseLanguage .modal-dialog { z-index: 5001 !important; }

/* Footer baseline (only matters if footer is sticky/positioned) */
footer, .footer { position: relative; z-index: 100; }

/* Tawk chat above everything (incl. cookie UI) */
#tawkchat-container,
#tawkchat-minified-wrapper {
  z-index: 2147483647 !important;
  position: fixed !important;
}

/* Keep the minimized bubble pinned on desktop */
@media (min-width: 992px){
  #tawkchat-minified-wrapper{
    right: 16px !important;
    bottom: 16px !important;
  }
}

/* ======================================
   Cookie banner & preferences modal (UI)
   ====================================== */
#cookie-banner[hidden],
#cookie-modal[hidden] { display: none !important; }

/* Toast banner */
.cookie-banner{
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 22000;
  width: min(420px, calc(100vw - 32px));
  background:#111; color:#fff;
  border-radius: 10px;
  padding: 12px 14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.45);
  display:flex; gap:12px; align-items:flex-start;
}
.cookie-banner__text{ font-size:.9rem; line-height:1.35; }
.cookie-banner__actions{ margin-left:auto; display:flex; gap:8px; flex-wrap:wrap; }

/* True overlay modal */
.cookie-modal{
  position: fixed !important;
  inset: 0 !important;
  z-index: 23000 !important;
  display:flex; align-items:center; justify-content:center;
  padding: 20px;
  background: rgba(0,0,0,.6);
  overscroll-behavior: contain;
}
.cookie-modal__window{
  width: min(560px, calc(100vw - 32px));
  max-height: 92svh;
  overflow:auto;
  background:#121212; color:#fff;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0,0,0,.55);
  padding: 18px 20px;
  outline: 0;
}

/* Lock page scroll while modal is open */
body.cookie-modal-open{ position: fixed; width:100%; overflow:hidden; }

/* =========================
   Responsive adjustments
   ========================= */

/* Desktop: stack banner actions vertically for readability */
@media (min-width: 992px){
  .cookie-banner{
    right: 24px; bottom: 24px;
    width: min(560px, calc(100vw - 48px));
    padding: 16px 18px;
    flex-direction: column; align-items: stretch;
  }
  .cookie-banner__text{ margin-bottom: 12px; }
  .cookie-banner__actions{ flex-direction:column; gap:8px; margin-left:0; }
  #cookie-accept{ font-weight:600; padding:12px 18px; font-size:1rem; }
  #cookie-customize, #cookie-reject{ font-size:.9rem; padding:8px 12px; }
}

/* Mobile layout for banner + modal */
@media (max-width: 576px){
  .cookie-banner{
    left:0; right:0; bottom:0; width:100%;
    border-radius:0;
    padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
    flex-direction:column; align-items:stretch;
  }
  .cookie-banner__actions .btn{ width:100%; }
  .cookie-modal{ padding:12px; }
  .cookie-modal__window{
    width:100%; max-width:none; max-height:92svh; margin:0; border-radius:10px;
  }
}

/* =======================================
   Support hint chip (outside Tawk iframe)
   ======================================= */
#support-hint{
  position: fixed !important;
  right: 72px !important;       /* just left of the bubble */
  bottom: 16px !important;      /* JS will raise this when banner shows */
  z-index: 2147483000 !important;
  background:#111; color:#fff;
  border-radius: 9999px;
  padding: 8px 12px;
  font-size: 14px; line-height:1;
  box-shadow: 0 8px 24px rgba(0,0,0,.35);
  opacity: 0; transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease;
  pointer-events: none;
}
#support-hint.show{ opacity:1; transform: translateY(0); }

/* Hide the hint chip on tablet/desktop */
@media (min-width: 768px){ #support-hint{ display:none !important; } }

/* Keep Tawk bubble text visible initially; JS may add .hide-text later */
.tawk-button span{ display:inline-block !important; opacity:1 !important; transition:opacity 1s ease-in-out; }
.tawk-button.hide-text span{ opacity:0 !important; }

/* ==========================================
   Mobile: positions + banner-visible bumping
   ========================================== */
@media (max-width: 767.98px){
  /* Baseline positions */
  #tawkchat-minified-wrapper{
    right: 16px !important;
    bottom: 16px !important;
  }
  #tawkchat-container{ right: 16px !important; }

  /* Leave room when banner is visible (CSS fallback;
     JS further fine-tunes using actual banner height) */
  body.cc-banner-visible #tawkchat-minified-wrapper,
  body.cc-banner-visible #tawkchat-container,
  body.cc-banner-visible #support-hint{
    bottom: 96px !important;
  }

  /* Only add page padding on small screens */
  body.cc-banner-visible{ padding-bottom: 96px; }
}
/* === Z-index fixes: support > cookie modal > cookie banner > footer === */

/* Keep footer low */
footer, .footer { position: relative; z-index: 100 !important; }

/* Toast by footer */
#cookie-banner,
.cookie-banner { z-index: 2147482000 !important; }

/* Popup above the banner */
#cookie-modal,
.cookie-modal { z-index: 2147483600 !important; }

/* Support chip above the popup (but below the Tawk iframe) */
#support-hint { z-index: 2147483620 !important; }

/* Tawk stays on top of everything it owns */
#tawkchat-container,
#tawkchat-minified-wrapper { z-index: 2147483647 !important; }

/* Developers page styles */
/* ===== Imperium Developers Page (brand tuned) ===== */
/* ===== Imperium Developers Page (brand tuned, Bootstrap 4 friendly) ===== */
:root{
  --ih-bg-dark:#0e1014;
  --ih-panel:#11141a;
  --ih-text-muted:#a8b0ba;
  --ih-red-1:#ff6b6b;
  --ih-red-2:#e24e4e;
  --ih-red-3:#c23a3a;
  --ih-border:rgba(255,255,255,.08);
  --ih-card:#141821;
  --ih-white:#ffffff;
}

/* HERO */
.ih-hero{
  position:relative; overflow:hidden; border-radius:1rem;
  background:linear-gradient(180deg,#0b0f16 0%,#121823 100%);
}
.ih-hero::after{
  content:""; position:absolute; left:0; top:0; right:0; bottom:0;
  background:
    radial-gradient(circle at 20% -10%, rgba(255,255,255,.18), transparent 35%),
    radial-gradient(circle at 120% 20%, rgba(226,78,78,.18), transparent 30%);
  pointer-events:none;
}

/* Pills / badges */
.ih-pill{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.35rem .75rem; border:1px solid rgba(255,255,255,.22);
  border-radius:999px; background:rgba(255,255,255,.04);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
}
.ih-badge{
  border:1px solid var(--ih-border); border-radius:.75rem; padding:.5rem .75rem;
  display:inline-flex; align-items:center; gap:.5rem;
  background:var(--ih-card); color:var(--ih-white);
}
.badge.ih-badge-red{
  background:linear-gradient(135deg,var(--ih-red-1) 0%,var(--ih-red-3) 100%);
  color:#fff; border:none;
}

/* Cards / sections */
.ih-card{
  border-radius:1rem; box-shadow:0 10px 30px rgba(0,0,0,.18);
  border:1px solid var(--ih-border); background:var(--ih-panel); color:var(--ih-white);
}
.ih-section{ padding:3rem 0; }
.ih-divider{ height:1px; background:linear-gradient(90deg,rgba(255,255,255,.08),rgba(255,255,255,.03)); margin:2rem 0; }

/* Grid helpers */
.ih-grid{ display:grid; grid-gap:1rem; }
.ih-grid-3{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
.ih-grid-4{ grid-template-columns:repeat(4, minmax(0, 1fr)); }
@media (max-width:992px){
  .ih-grid-3{ grid-template-columns:1fr; }
  .ih-grid-4{ grid-template-columns:repeat(2, 1fr); }
}

/* List bullets / checks */
.ih-check{
  width:.85rem; height:.85rem; border-radius:999px;
  border:2px solid var(--ih-red-2); display:inline-block; margin-right:.5rem;
}

/* KPIs & muted text */
.ih-kpi{ font-size:2rem; font-weight:700; color:#fff; }
.ih-muted{ color:var(--ih-text-muted); }
.ih-small{ font-size:.9rem; }
.ih-mono{ font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace; }

/* CTA buttons */
.ih-cta{
  background:linear-gradient(135deg,var(--ih-red-1) 0%,var(--ih-red-3) 100%);
  color:#fff !important; border:none; border-radius:.75rem; padding:.9rem 1.25rem;
  font-weight:700; display:inline-block; box-shadow:0 6px 18px rgba(194,58,58,.35);
  transition:transform .06s ease, filter .15s ease;
}
.ih-cta:hover{ filter:brightness(1.06); transform:translateY(-1px); color:#fff !important; }

/* Outline button on dark bg */
.btn-outline-light{ border-color:rgba(255,255,255,.35) !important; color:#fff !important; }
.btn-outline-light:hover{ background:rgba(255,255,255,.08) !important; }

/* Logo row images */
.ih-logo-row img{ max-height:36px; opacity:.9; }

/* FAQ button look (Bootstrap 4 .btn-link override) */
.ih-faq-toggle{ font-weight:700; color:var(--ih-white); text-decoration:none; }
.ih-faq-toggle:hover{ color:var(--ih-red-1); text-decoration:none; }
.card-header{ background:var(--ih-panel); border-bottom:1px solid var(--ih-border); }
.card{ background:var(--ih-panel); border:1px solid var(--ih-border); border-radius:.75rem; }
.card-body{ color:#e8ecf2; }
/* Spacing polish */
.ih-card p, .ih-card li { line-height:1.5; }
.ih-section h2, .ih-section h3 { color:#f5f7fb; }

/* Optional darker overlay to lift text contrast over the hero image */
.ih-hero::before{
  content:""; position:absolute; left:0; top:0; right:0; bottom:0;
  background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55));
  z-index:0;
}
.ih-hero > *{ position:relative; z-index:1; }

/* Keep outline look even when Bootstrap marks it .active */
.btn-outline-light.active,
.btn-outline-light:active,
.show > .btn-outline-light.dropdown-toggle {
  background-color: transparent !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.35) !important;
}

/* Hover/focus state for outline button */
.btn-outline-light:hover,
.btn-outline-light:focus {
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.5) !important;
  box-shadow: none !important;
}
/* Icon bullets */
.ih-list-none { list-style:none; padding-left:0; }
.ih-list-none li { margin:.45rem 0; display:flex; gap:.5rem; align-items:flex-start; }
.ih-list-none li i { margin-top:.25rem; width:1.1rem; text-align:center; color: var(--ih-red-1); }

/* FAQ toggle color on dark */
.ih-faq-toggle{ font-weight:700; color:#fff; text-decoration:none; }
.ih-faq-toggle:hover{ color:var(--ih-red-1); text-decoration:none; }
/* Hero icon sizing & layout */
.ih-hero-icon{ max-width:420px; margin:0 auto; }
.ih-hero-icon i{
  display:block;
  font-size:clamp(64px, 8vw, 128px);  /* responsive 64–128px */
  line-height:1;                      /* prevents tall inline box */
  color:var(--ih-red-1);
  margin:0 auto .5rem;
}
.ih-hero-icon .caption{ margin-top:.25rem; }

/* Streamers page Push first section below sticky navbar + promo ribbon */
.ih-top-offset { margin-top: 96px; }               /* desktop default */

@media (max-width: 991.98px) {                     /* tablets */
  .ih-top-offset { margin-top: 112px; }
}

@media (max-width: 575.98px) {                     /* phones (header usually taller) */
  .ih-top-offset { margin-top: 128px; }
}