/* DropCashCasino 2026 — Navbar (fichier unique, zéro legacy) */

.dcc-nav {
  --dcc-nav-h: 72px;
  --dcc-nav-h-mobile: 64px;
  --dcc-nav-gap: clamp(0.35rem, 1vw, 0.85rem);
  position: sticky;
  top: 0;
  z-index: var(--dcc-z-header);
  height: var(--dcc-nav-h);
  background: rgba(5, 6, 17, 0.88);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--dcc-line);
  box-sizing: border-box;
}

.dcc-nav.is-scrolled {
  background: rgba(5, 6, 17, 0.97);
  box-shadow: var(--dcc-shadow-sm);
}

.dcc-nav__bar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(0.75rem, 2vw, 1.5rem);
  width: min(100% - 2rem, var(--dcc-container));
  max-width: var(--dcc-container);
  height: 100%;
  margin-inline: auto;
  padding-inline: clamp(0.5rem, 2vw, 1rem);
}

/* Logo */
.dcc-nav__logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  line-height: 0;
  text-decoration: none;
}

.dcc-nav__logo img {
  display: block;
  width: 140px;
  height: 34px;
  object-fit: contain;
}

/* Menu central */
.dcc-nav__menu {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--dcc-nav-gap);
  min-width: 0;
  margin: 0;
  padding: 0;
}

.dcc-nav__list {
  display: flex;
  align-items: center;
  gap: var(--dcc-nav-gap);
  list-style: none;
  margin: 0;
  padding: 0;
}

.dcc-nav__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  height: 40px;
  padding: 0 0.7rem;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #dfe2ff;
  font-family: var(--dcc-font-body);
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
  transition: color 0.18s ease, background 0.18s ease;
}

.dcc-nav__link:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.07);
}

.dcc-nav__link.is-active {
  color: #fff;
  background: rgba(124, 60, 255, 0.16);
  box-shadow: inset 0 0 0 1px rgba(124, 60, 255, 0.32);
}

.dcc-nav__link:focus-visible {
  outline: 2px solid var(--dcc-cyan);
  outline-offset: 2px;
}

.dcc-nav__link[hidden] {
  display: none !important;
}

.dcc-nav__icon,
.dcc-nav__link .icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  display: inline-flex;
}

.dcc-nav__icon {
  object-fit: contain;
  display: none;
}

.dcc-nav__caret {
  font-size: 0.6rem;
  opacity: 0.75;
  margin-left: 0.15rem;
}

/* Dropdown Plus */
.dcc-nav__more {
  position: relative;
  flex-shrink: 0;
}

.dcc-nav__dropdown {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 200px;
  margin: 0;
  padding: 0.35rem;
  list-style: none;
  border-radius: var(--dcc-radius-md);
  background: rgba(8, 10, 24, 0.98);
  border: 1px solid var(--dcc-line-2);
  box-shadow: var(--dcc-shadow-md);
  z-index: var(--dcc-z-dropdown);
}

.dcc-nav__dropdown .dcc-nav__link {
  width: 100%;
  justify-content: flex-start;
  height: auto;
  min-height: 40px;
  padding: 0.55rem 0.75rem;
  border-radius: var(--dcc-radius-sm);
}

.dcc-nav__more.is-open .dcc-nav__caret {
  transform: rotate(180deg);
}

.dcc-nav__drawer-only,
.dcc-nav__drawer-foot {
  display: none;
}

/* Actions droite */
.dcc-nav__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.45rem;
  flex-shrink: 0;
}

.dcc-nav__actions .btn {
  height: 40px;
  min-height: 40px;
  padding: 0 0.85rem;
  font-size: 0.72rem;
}

.dcc-nav__actions .btn-icon {
  width: 16px;
  height: 16px;
}

/* Burger */
.dcc-nav__burger {
  display: none;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid var(--dcc-line);
  border-radius: var(--dcc-radius-sm);
  background: rgba(255, 255, 255, 0.05);
  cursor: pointer;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.dcc-nav__burger span {
  display: block;
  width: 18px;
  height: 2px;
  margin: 2.5px 0;
  border-radius: 99px;
  background: #fff;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.dcc-nav__burger.is-open span:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.dcc-nav__burger.is-open span:nth-child(2) { opacity: 0; }
.dcc-nav__burger.is-open span:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }

/* Backdrop mobile */
.dcc-nav__backdrop {
  position: fixed;
  inset: 0;
  top: var(--dcc-nav-h-mobile);
  background: rgba(4, 5, 16, 0.55);
  backdrop-filter: blur(4px);
  z-index: calc(var(--dcc-z-header) - 1);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

body.dcc-nav-open { overflow: hidden; }
body.dcc-nav-open .dcc-nav__backdrop {
  opacity: 1;
  pointer-events: auto;
}

/* Auth dans navbar */
.dcc-nav__actions .auth-user-menu { position: relative; }

.dcc-nav__actions .auth-user-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  height: 40px;
  padding: 0 0.6rem 0 0.3rem;
  border-radius: 999px;
  border: 1px solid rgba(0, 213, 255, 0.22);
  background: rgba(0, 213, 255, 0.06);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
}

.dcc-nav__actions .auth-user-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
}

.dcc-nav__actions .auth-user-name {
  max-width: 90px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dcc-nav__actions .auth-user-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 210px;
  padding: 0.45rem;
  border-radius: var(--dcc-radius-md);
  background: rgba(8, 10, 24, 0.98);
  border: 1px solid var(--dcc-line-2);
  box-shadow: var(--dcc-shadow-md);
  z-index: var(--dcc-z-dropdown);
}

.auth-menu-link {
  display: block;
  padding: 0.55rem 0.7rem;
  border-radius: var(--dcc-radius-sm);
  color: var(--dcc-text);
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none;
}

.auth-menu-link:hover { background: rgba(255, 255, 255, 0.06); color: #fff; }
.auth-menu-admin { color: var(--dcc-cyan); }
.auth-menu-logout { color: #ffb3be; border-top: 1px solid var(--dcc-line); margin-top: 0.25rem; }

.auth-user-dropdown-head {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.55rem;
  border-bottom: 1px solid var(--dcc-line);
  margin-bottom: 0.3rem;
}

.auth-user-dropdown-head img {
  width: 36px;
  height: 36px;
  border-radius: 50%;
}

.filter-bar { top: var(--dcc-nav-h); }
.faq-categories { top: calc(var(--dcc-nav-h) + 6px); }

@media (min-width: 1280px) {
  .dcc-nav__icon { display: block; }
}

@media (max-width: 1279px) and (min-width: 1024px) {
  .dcc-nav__link { padding-inline: 0.5rem; font-size: 0.78rem; }
}

@media (max-width: 1023px) {
  .dcc-nav {
    height: var(--dcc-nav-h-mobile);
    background: rgba(5, 6, 17, 0.98);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .dcc-nav__bar {
    grid-template-columns: minmax(0, auto) minmax(0, 1fr) auto;
    width: 100%;
    max-width: var(--dcc-container);
    padding-inline: 10px;
    gap: 0.45rem;
  }

  .dcc-nav__logo { min-width: 0; max-width: 124px; overflow: hidden; }
  .dcc-nav__logo img { width: 116px; height: 30px; }
  .dcc-nav__actions { min-width: 0; max-width: 100%; gap: 0.35rem; }
  .dcc-nav__actions > .dcc-nav__discord,
  .dcc-nav__actions > .dcc-nav__auth { display: none; }

  .dcc-nav__burger {
    display: inline-flex;
    width: var(--dcc-control-min, 44px);
    height: var(--dcc-control-min, 44px);
  }

  .dcc-nav__menu {
    position: fixed;
    top: var(--dcc-nav-h-mobile);
    left: 0;
    right: auto;
    bottom: auto;
    width: 100%;
    max-width: 100vw;
    height: calc(100dvh - var(--dcc-nav-h-mobile));
    min-height: calc(100vh - var(--dcc-nav-h-mobile));
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    padding: 14px 14px max(20px, env(safe-area-inset-bottom));
    margin: 0;
    background: rgba(5, 6, 17, 0.99);
    border-top: 1px solid var(--dcc-line);
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translate3d(100%, 0, 0);
    transition: transform .22s var(--dcc-ease), opacity .16s ease, visibility 0s linear .22s;
    contain: layout paint;
    z-index: var(--dcc-z-menu);
  }

  .dcc-nav__menu.is-open {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transform: translate3d(0, 0, 0);
    transition-delay: 0s;
  }

  .dcc-nav__list,
  .dcc-nav__drawer-only,
  .dcc-nav__drawer-foot { min-width: 0; max-width: 100%; }

  .dcc-nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: 0.2rem;
    width: 100%;
  }

  .dcc-nav__list .dcc-nav__link {
    width: 100%;
    min-width: 0;
    min-height: var(--dcc-control-min, 44px);
    height: auto;
    justify-content: flex-start;
    padding: 0.7rem 0.85rem;
    font-size: 0.88rem;
    line-height: 1.25;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .dcc-nav__list .dcc-nav__icon { display: block; width: 20px; height: 20px; }
  .dcc-nav__more { display: none; }
  .dcc-nav__drawer-only { display: block; width: 100%; }
  .dcc-nav__drawer-only .dcc-nav__list {
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--dcc-line);
  }
  .dcc-nav__drawer-foot {
    display: block;
    width: 100%;
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid var(--dcc-line);
  }
  .dcc-nav__drawer-foot .btn { width: 100%; min-height: var(--dcc-control-min, 44px); }

  .dcc-nav__actions .btn-ghost,
  .dcc-nav__actions .btn-primary[data-discord-login] { display: none; }
  .dcc-nav__actions .auth-user-name,
  .dcc-nav__actions .auth-user-caret { display: none; }

  .dcc-nav__backdrop {
    inset: var(--dcc-nav-h-mobile) 0 0;
    width: 100%;
    max-width: 100vw;
  }

  body.dcc-nav-open {
    overflow: hidden;
    overscroll-behavior: none;
    touch-action: none;
  }
  body.dcc-nav-open .dcc-nav__menu { touch-action: pan-y; }
}

@media (max-width: 420px) {
  .dcc-nav__logo img { width: 102px; height: 28px; }
  .dcc-nav__bar { gap: 6px; padding-inline: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  .dcc-nav__menu,
  .dcc-nav__burger span,
  .dcc-nav__backdrop { transition: none; }
}


/* Language and country are intentionally separate controls. */
.dcc-lang{position:relative;display:inline-flex;align-items:center;z-index:20}
.dcc-lang__current{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;min-width:64px;height:36px;padding:0 .65rem;border:1px solid var(--dcc-line,rgba(255,255,255,.12));border-radius:999px;background:rgba(255,255,255,.045);color:inherit;font:inherit;font-size:.78rem;line-height:1;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease}
.dcc-lang__current:hover,.dcc-lang__current[aria-expanded="true"]{border-color:rgba(124,92,255,.55);background:rgba(124,92,255,.12);transform:translateY(-1px)}
.dcc-lang__menu{position:absolute;right:0;top:calc(100% + 9px);display:grid;gap:4px;width:190px;padding:8px;border:1px solid var(--dcc-line,rgba(255,255,255,.12));border-radius:14px;background:rgba(8,10,24,.98);box-shadow:0 18px 55px rgba(0,0,0,.42);backdrop-filter:blur(14px)}
.dcc-lang__menu[hidden]{display:none}.dcc-lang__menu a{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:.55rem;min-height:40px;padding:.4rem .6rem;border-radius:10px;text-decoration:none;color:inherit;font-size:.78rem;border:1px solid transparent;background:rgba(255,255,255,.025)}
.dcc-lang__menu a:hover{background:rgba(255,255,255,.08)}.dcc-lang__menu a.is-current{border-color:rgba(124,92,255,.65);background:rgba(124,92,255,.15)}
.dcc-lang__menu strong{font-size:.72rem;letter-spacing:.06em}.dcc-lang__menu span{color:var(--dcc-text-muted,#a8acc7)}
.dcc-nav__drawer-label{list-style:none;padding:.8rem .85rem .3rem;color:var(--dcc-text-muted,#a8acc7);font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.dcc-nav__country{min-width:auto;padding-inline:.65rem;font-size:.75rem}
@media (max-width:1023px){.dcc-lang__current{min-width:44px;height:var(--dcc-control-min,44px);padding:0 .5rem}.dcc-lang__menu{right:-4px}.dcc-nav__actions .dcc-nav__country{min-width:var(--dcc-control-min,44px);height:var(--dcc-control-min,44px);padding-inline:.5rem}}


/* g12 — language flags via open-source flag-icons assets */
.dcc-flag-wrap{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.dcc-flag-icon{display:block;border-radius:4px;box-shadow:0 0 0 1px rgba(255,255,255,.12)}
.dcc-flag-wrap--lang{width:20px;height:15px}
.dcc-flag-icon--lang{width:20px;height:15px;object-fit:cover}
.dcc-flag-fallback{display:none;font-size:.95rem;line-height:1}
.dcc-flag-wrap.is-flag-error .dcc-flag-icon{display:none}
.dcc-flag-wrap.is-flag-error .dcc-flag-fallback{display:inline}
.dcc-lang__current{gap:.45rem}
.dcc-lang__code{font-weight:800;letter-spacing:.04em}
.dcc-lang__menu a{grid-template-columns:24px 34px 1fr}
.dcc-lang__menu-code{font-size:.72rem;letter-spacing:.06em}
.dcc-lang__menu-name{color:var(--dcc-text-muted,#a8acc7)}
@media (max-width:420px){.dcc-lang__current{gap:0}.dcc-lang__code{display:none}.dcc-lang__menu a{grid-template-columns:24px 30px 1fr}}

/* g13 — open-source SVG flags (lipis/flag-icons via jsDelivr) */
.dcc-flag-icon{display:block!important;flex:0 0 auto;object-fit:cover;border-radius:3px;box-shadow:0 0 0 1px rgba(255,255,255,.14)}
.dcc-flag-icon--lang{width:24px!important;height:18px!important}
.dcc-lang__current{min-width:70px}
.dcc-lang__menu a{grid-template-columns:24px 34px 1fr!important}

@media (max-width: 1023px) {
  .dcc-lang__menu a { min-height: var(--dcc-control-min, 44px); }
}
