
/* __DESIGN_SITE__ */
html:not(#_) .sidebar-inner{background:transparent;box-shadow:none;}
/* ^ posé par design_site.py : le panneau blanc d'Astro recouvrait le fond du .sidebar */
/* ============================================================
   sextreff-sachsen.de — « velours de nuit »
   Palette : aubergine profond + cuivre chaud.
   Zones : barre latérale desktop, bandeau + barre d'onglets mobile, pied de page.
   ============================================================ */

html:not(#_){
  --dfs-aubergine-950:#170b1d;
  --dfs-aubergine-900:#221030;
  --dfs-aubergine-800:#341a44;
  --dfs-aubergine-700:#472359;
  --dfs-copper:#c9793c;
  --dfs-copper-light:#f0b479;
  --dfs-copper-dark:#7c4520;
  --dfs-cream:#f5e9da;
  --dfs-mauve-muted:#cdb8d6;
}

/* ------------------------------------------------------------
   1. Barre latérale desktop — dégradé vertical, logo en médaillon
   ------------------------------------------------------------ */

/* Fond en dégradé vertical + lueur cuivre discrète derrière le logo.
   (jamais d'animation ni de position sur .sidebar lui-même) */
html:not(#_) .sidebar{
  background:
    radial-gradient(120% 55% at 50% 0%, rgba(201,121,60,.16), transparent 62%),
    linear-gradient(180deg, var(--dfs-aubergine-800) 0%, var(--dfs-aubergine-900) 55%, var(--dfs-aubergine-950) 100%);
  border-right:1px solid rgba(201,121,60,.22);
}
html:not(#_) .sidebar-inner{
  animation:dfsSideIn .5s ease-out both;
}
@keyframes dfsSideIn{ from{opacity:0; transform:translateX(-6px);} to{opacity:1; transform:translateX(0);} }

/* Logo → médaillon centré (disposition : plus en ligne, mais empilé et centré) */
html:not(#_) .sb-logo{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  padding:22px 12px 18px; text-align:center;
  border-bottom:1px solid rgba(201,121,60,.28);
  margin-bottom:10px;
}
html:not(#_) .sb-logo-dot{
  width:46px; height:46px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:radial-gradient(circle at 35% 30%, var(--dfs-copper-light), var(--dfs-copper) 65%, var(--dfs-copper-dark) 100%);
  border:2px solid rgba(240,180,121,.55);
  box-shadow:0 0 0 4px rgba(201,121,60,.12), 0 4px 14px rgba(0,0,0,.45);
  animation:dfsGlow 3.6s ease-in-out infinite alternate;
}
html:not(#_) .sb-logo-dot svg{ color:var(--dfs-aubergine-950); stroke:var(--dfs-aubergine-950); width:20px; height:20px; }
@keyframes dfsGlow{
  from{ box-shadow:0 0 0 4px rgba(201,121,60,.10), 0 4px 14px rgba(0,0,0,.45); }
  to{   box-shadow:0 0 0 7px rgba(201,121,60,.20), 0 4px 18px rgba(0,0,0,.5); }
}
html:not(#_) .sb-logo-text{
  color:var(--dfs-copper-light); font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; font-size:13px;
}

/* Navigation principale */
html:not(#_) .sb-nav{ padding:0 10px; display:flex; flex-direction:column; gap:2px; }
html:not(#_) .sb-link{
  position:relative; display:flex; align-items:center; gap:10px;
  padding:10px 12px 10px 16px; border-radius:10px;
  color:var(--dfs-mauve-muted); text-decoration:none;
  font-size:13px; letter-spacing:.03em;
  transition:color .2s ease, background-color .2s ease;
  overflow:hidden;
}
html:not(#_) .sb-link::before{
  content:""; position:absolute; left:4px; top:14%; bottom:14%; width:3px;
  border-radius:3px;
  background:linear-gradient(180deg, var(--dfs-copper-light), var(--dfs-copper-dark));
  transform:scaleY(0); transform-origin:center; transition:transform .25s ease;
}
html:not(#_) .sb-link:hover, html:not(#_) .sb-link:focus-visible{
  color:var(--dfs-cream); background:rgba(201,121,60,.12);
}
html:not(#_) .sb-link:hover::before, html:not(#_) .sb-link:focus-visible::before{ transform:scaleY(1); }
html:not(#_) .sb-link.active{
  color:var(--dfs-copper-light); background:rgba(201,121,60,.16);
  font-weight:600;
}
html:not(#_) .sb-link.active::before{ transform:scaleY(1); }
html:not(#_) .sb-ico{
  display:flex; align-items:center; justify-content:center;
  width:26px; height:26px; border-radius:50%;
  background:rgba(201,121,60,.10); flex:none;
  transition:background-color .2s ease;
}
html:not(#_) .sb-link:hover .sb-ico, html:not(#_) .sb-link.active .sb-ico{ background:rgba(201,121,60,.22); }

/* Section « Villes de la région » */
html:not(#_) .sb-section{ padding:14px 10px 8px; margin-top:6px; border-top:1px solid rgba(201,121,60,.18); }
html:not(#_) .sb-map-quick-link{
  display:flex; align-items:center; gap:8px; margin:0 6px 10px;
  padding:7px 12px; border-radius:999px; font-size:12px;
  color:var(--dfs-copper-light); border:1px solid rgba(201,121,60,.4);
  text-decoration:none; transition:background-color .2s ease, color .2s ease;
}
html:not(#_) .sb-map-quick-link:hover{ background:rgba(201,121,60,.15); color:var(--dfs-cream); }
html:not(#_) .sb-section-title{
  color:var(--dfs-copper); text-transform:uppercase; letter-spacing:.16em;
  font-size:10.5px; font-weight:700; padding:2px 6px 8px;
}
html:not(#_) .sb-silo-region{
  display:flex; align-items:center; justify-content:space-between;
  padding:7px 8px; border-radius:8px; color:var(--dfs-mauve-muted);
  text-decoration:none; font-size:12.5px; transition:color .2s ease, background-color .2s ease;
}
html:not(#_) .sb-silo-region:hover{ color:var(--dfs-cream); background:rgba(201,121,60,.10); }
html:not(#_) .sb-chevron{ transition:transform .25s ease; color:var(--dfs-copper); }
html:not(#_) .sb-silo-group.open .sb-chevron{ transform:rotate(90deg); }
html:not(#_) .sb-silo-villes{ padding-left:14px; border-left:1px dashed rgba(201,121,60,.28); margin:2px 0 6px 12px; }
html:not(#_) .sb-silo-ville{
  display:block; padding:5px 8px; font-size:12px; color:var(--dfs-mauve-muted);
  text-decoration:none; border-radius:6px; transition:color .2s ease, background-color .2s ease;
}
html:not(#_) .sb-silo-ville:hover{ color:var(--dfs-copper-light); background:rgba(201,121,60,.10); }

/* ------------------------------------------------------------
   2. Bandeau mobile — assorti + CTA en dégradé cuivre
   ------------------------------------------------------------ */
html:not(#_) .mobile-guest-top{
  background:linear-gradient(135deg, var(--dfs-aubergine-800), var(--dfs-aubergine-950) 85%);
  border-bottom:1px solid rgba(201,121,60,.3);
}
html:not(#_) .mobile-guest-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 14px; border-bottom:1px solid rgba(201,121,60,.16);
}
html:not(#_) .mobile-guest-brand{
  color:var(--dfs-cream); font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; text-decoration:none; font-size:14px;
}
html:not(#_) .mobile-guest-login{
  color:var(--dfs-copper-light); text-decoration:none; font-size:12.5px;
  padding:6px 14px; border:1px solid rgba(201,121,60,.5); border-radius:999px;
  transition:background-color .2s ease, color .2s ease;
}
html:not(#_) .mobile-guest-login:hover{ background:rgba(201,121,60,.18); color:var(--dfs-cream); }

html:not(#_) .mobile-guest-cta{ padding:12px 14px 14px; }
html:not(#_) .mobile-guest-cta-offer{ color:var(--dfs-copper-light); font-size:11px; letter-spacing:.04em; margin:0; }
html:not(#_) .mobile-guest-cta-kw{ color:var(--dfs-cream); font-weight:700; font-size:15px; margin:2px 0 0; }
html:not(#_) .mobile-guest-timer-label{ color:var(--dfs-mauve-muted); font-size:10px; display:block; }
html:not(#_) .mobile-guest-timer{ color:var(--dfs-copper-light); font-weight:700; font-size:14px; }

html:not(#_) .mobile-guest-cta-btn{
  display:block; text-align:center; margin-top:10px; padding:13px 18px;
  border-radius:999px; min-height:44px;
  color:var(--dfs-aubergine-950); font-weight:800; letter-spacing:.05em;
  text-transform:uppercase; font-size:13px; text-decoration:none;
  background:linear-gradient(100deg, var(--dfs-copper-dark), var(--dfs-copper-light), var(--dfs-copper) 80%);
  background-size:220% 100%;
  box-shadow:0 6px 16px rgba(201,121,60,.35);
  animation:dfsShimmer 5s linear infinite;
}
@media (prefers-reduced-motion: reduce){
  html:not(#_) .mobile-guest-cta-btn{ animation:none; background-position:0 0; }
}
@keyframes dfsShimmer{ 0%{background-position:0% 50%;} 100%{background-position:200% 50%;} }

/* Barre d'onglets basse */
html:not(#_) .bottom-bar{
  background:var(--dfs-aubergine-950);
  border-top:1px solid rgba(201,121,60,.3);
}
html:not(#_) .btab{ color:var(--dfs-mauve-muted); }
html:not(#_) .btab-ico{
  display:flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:50%; margin:0 auto;
  transition:background-color .2s ease, color .2s ease, transform .2s ease;
}
html:not(#_) .btab-lbl{ font-size:10px; letter-spacing:.03em; }
html:not(#_) .btab.active{ color:var(--dfs-copper-light); }
html:not(#_) .btab.active .btab-ico{
  background:rgba(201,121,60,.22); box-shadow:0 0 0 1px rgba(201,121,60,.4) inset;
  transform:translateY(-1px);
}

/* ------------------------------------------------------------
   3. Pied de page — colonnes séparées par des filets cuivre
   ------------------------------------------------------------ */
html:not(#_) .footer-v1{
  background:
    radial-gradient(90% 140% at 50% 0%, rgba(201,121,60,.08), transparent 60%),
    linear-gradient(180deg, var(--dfs-aubergine-900), var(--dfs-aubergine-950));
  border-top:1px solid rgba(201,121,60,.25);
}
html:not(#_) .footer-col:empty{ display:none; }
html:not(#_) .footer-col{ position:relative; padding-left:6px; }
html:not(#_) .footer-col:not(:first-child)::before{
  content:""; position:absolute; left:-16px; top:4px; bottom:4px; width:1px;
  background:linear-gradient(180deg, transparent, var(--dfs-copper) 30%, var(--dfs-copper) 70%, transparent);
  opacity:.55;
}
html:not(#_) .footer-col h4{
  color:var(--dfs-copper-light); text-transform:uppercase; letter-spacing:.12em;
  font-size:12px; font-weight:700; padding-bottom:8px;
  border-bottom:1px solid var(--dfs-copper-dark); width:fit-content;
}
html:not(#_) .footer-col p{ color:var(--dfs-mauve-muted); font-size:13px; }
html:not(#_) .footer-col a{
  color:var(--dfs-mauve-muted); text-decoration-line:underline;
  text-decoration-color:transparent; text-underline-offset:3px;
  transition:color .2s ease, text-decoration-color .2s ease;
}
html:not(#_) .footer-col a:hover{ color:var(--dfs-cream); text-decoration-color:var(--dfs-copper-light); }
html:not(#_) .footer-bottom{
  border-top:1px solid rgba(201,121,60,.2); color:var(--dfs-mauve-muted);
  font-size:11.5px; letter-spacing:.03em; text-align:center;
}

/* ------------------------------------------------------------
   Confort de lecture — barre de défilement de la sidebar
   ------------------------------------------------------------ */
html:not(#_) .sidebar-inner{ scrollbar-width:thin; scrollbar-color:rgba(201,121,60,.4) transparent; }

@media (prefers-reduced-motion: reduce){
  html:not(#_) .sidebar-inner, html:not(#_) .sb-logo-dot, html:not(#_) .mobile-guest-cta-btn{ animation:none !important; }
  html:not(#_) .sb-link::before, html:not(#_) .sb-chevron, html:not(#_) .btab-ico, html:not(#_) .footer-col a{ transition:none !important; }
}

@media (prefers-reduced-motion: reduce){html:not(#_) .sidebar-inner{animation:none !important;transition:none !important;}}
/* __END_DESIGN_SITE__ */
