/* site-core.css — squelette commun PAP/LCL/OBB.
   Layout, responsive, menu mobile, ascenseur. Aucun choix de palette ici ;
   les couleurs viennent de site-themes.css via les variables CSS --bg/--ink/--accent/etc. */

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body, ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif);
  line-height:1.6;
  font-size:var(--font-size-base, 16px);
}
a{color:var(--accent);}
h1,h2,h3,h4,h5,h6{font-family:var(--font-headline, ui-serif,Georgia,serif);font-weight:var(--font-headline-weight, 700);}

/* Layout principal */
.site-shell{
  display:grid;
  grid-template-columns:minmax(250px,288px) minmax(0,1fr);
  gap:28px;
  align-items:start;
  max-width:1180px;
  margin:0 auto;
  padding:20px 22px 64px;
}
.site-sidebar{
  position:sticky;
  top:18px;
  max-height:calc(100vh - 36px);
  overflow-y:auto;
  overscroll-behavior:contain;
  min-width:0;
  padding-right:4px;
}
.site-sidebar::-webkit-scrollbar{width:8px;}
.site-sidebar::-webkit-scrollbar-thumb{background:var(--line);border-radius:8px;}

/* Brand (logo + nom + tagline) */
.site-brand{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding-bottom:18px;
  border-bottom:1px solid var(--line);
  margin-bottom:18px;
  /* Conteneur du long-press : on retire le menu contextuel iOS sur le logo */
  -webkit-touch-callout:none;
}
.site-brand a.logo{display:block;position:relative;}
.site-brand img{
  max-width:var(--logo-max-width, 170px);
  height:auto;
  display:block;
  border-radius:var(--logo-radius, 0);
  box-shadow:var(--logo-shadow, none);
  filter:var(--logo-filter, none);
  transition:transform .25s ease;
  -webkit-user-drag:none;user-select:none;
}
.site-brand a.logo:hover img{transform:var(--logo-hover-transform, none);}
.site-brand .name{
  font-family:var(--font-headline, ui-serif,Georgia,serif);
  font-size:1.25em;
  font-weight:700;
  color:var(--ink);
  text-decoration:none;
}
.site-brand .tagline{color:var(--muted);font-size:.9em;}

/* Indicateur visuel du long-press (anneau qui se remplit) */
.site-brand a.logo::after{
  content:"";
  position:absolute;
  inset:-4px;
  border-radius:50%;
  border:2px solid transparent;
  pointer-events:none;
  transition:border-color .15s ease;
}
.site-brand a.logo.is-pressing::after{
  border-color:var(--accent);
  animation:logo-press 1s linear forwards;
}
@keyframes logo-press{
  0%{transform:scale(.95);opacity:.4;}
  100%{transform:scale(1.05);opacity:1;}
}

/* Navigation */
.site-nav h2{
  font-size:.78em;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted);
  margin-bottom:12px;
}
.site-nav ul{list-style:none;}
.site-nav li{margin:0 0 4px;}
.site-nav a{
  display:block;
  padding:9px 12px;
  border-radius:var(--btn-radius, 8px);
  color:var(--ink);
  text-decoration:none;
  font-size:.97em;
  transition:background .15s,color .15s;
}
.site-nav a:hover{background:var(--card);}
.site-nav a.current{background:var(--card);color:var(--accent);font-weight:600;}
.site-nav .sub a{padding-left:26px;font-size:.92em;color:var(--muted);}

.site-main{min-width:0;}

/* Footer (licences + copyright) */
.site-foot{
  margin-top:56px;
  padding-top:22px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:.82em;
  line-height:1.7;
}
.site-foot a{color:var(--muted);}
.site-foot strong{color:var(--ink);}
.site-foot small{display:block;margin-top:10px;font-size:.86em;opacity:.85;}

/* Barre mobile (uniquement < 901px) */
.site-mobile-bar{
  display:none;
  position:sticky;
  top:0;
  z-index:40;
  background:var(--card);
  border-bottom:1px solid var(--line);
  padding:10px 14px;
  align-items:center;
  gap:12px;
}
.site-burger{
  background:transparent;
  border:1px solid var(--line);
  border-radius:9px;
  width:44px;
  height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
  flex:0 0 auto;
}
.site-burger span,
.site-burger span::before,
.site-burger span::after{
  display:block;
  width:22px;
  height:2px;
  background:var(--ink);
  position:relative;
  border-radius:2px;
}
.site-burger span::before,
.site-burger span::after{content:'';position:absolute;left:0;}
.site-burger span::before{top:-7px;}
.site-burger span::after{top:7px;}
.site-mobile-title{
  font-weight:600;
  color:var(--ink);
  font-size:1.02em;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.site-backdrop{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  z-index:50;
  opacity:0;
  transition:opacity .2s ease;
}

/* Bouton "remonter en haut" */
.site-elevator{
  position:fixed;
  right:18px;
  bottom:18px;
  width:48px;
  height:48px;
  border-radius:50%;
  background:var(--accent);
  color:#fff;
  border:none;
  box-shadow:0 4px 16px rgba(0,0,0,.28);
  cursor:pointer;
  font-size:20px;
  line-height:1;
  display:none;
  align-items:center;
  justify-content:center;
  z-index:45;
  transition:transform .18s ease,opacity .18s ease;
}
.site-elevator:hover{transform:translateY(-2px);}
.site-elevator.is-visible{display:inline-flex;}

@media (max-width:900px){
  .site-shell{grid-template-columns:1fr;gap:0;padding:0 16px 48px;}
  .site-mobile-bar{display:flex;}
  .site-sidebar{
    position:fixed;
    top:0;
    left:0;
    bottom:0;
    width:min(84vw,340px);
    max-height:none;
    background:var(--bg);
    border-right:1px solid var(--line);
    padding:22px 20px;
    z-index:60;
    transform:translateX(-105%);
    transition:transform .24s ease;
    box-shadow:2px 0 28px rgba(0,0,0,.4);
  }
  body.nav-open{overflow:hidden;}
  body.nav-open .site-sidebar{transform:translateX(0);}
  body.nav-open .site-backdrop{display:block;opacity:1;}
  .site-main{padding-top:14px;}
  .site-drawer-close{display:inline-flex;}
}
@media (min-width:901px){
  .site-mobile-bar{display:none!important;}
  .site-drawer-close{display:none;}
}
.site-drawer-close{
  align-items:center;
  justify-content:center;
  position:absolute;
  top:12px;
  right:12px;
  width:38px;
  height:38px;
  border-radius:9px;
  border:1px solid var(--line);
  background:transparent;
  color:var(--ink);
  font-size:20px;
  cursor:pointer;
  display:none;
}

/* Theme picker modal (déclenché par long-press logo) */
.site-theme-picker{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.6);
  z-index:80;
  display:none;
  align-items:center;
  justify-content:center;
  padding:20px;
}
.site-theme-picker.is-open{display:flex;}
.site-theme-picker__panel{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:14px;
  padding:24px;
  max-width:440px;
  width:100%;
  max-height:90vh;
  overflow-y:auto;
  color:var(--ink);
  box-shadow:0 20px 60px rgba(0,0,0,.5);
}
.site-theme-picker__panel h3{
  font-family:var(--font-headline, ui-serif,Georgia,serif);
  font-size:1.15em;
  margin-bottom:6px;
}
.site-theme-picker__panel .lead{color:var(--muted);font-size:.88em;margin-bottom:18px;}
.site-theme-picker__group{margin-bottom:18px;}
.site-theme-picker__group label{
  display:block;
  font-size:.78em;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted);
  margin-bottom:8px;
}
.site-theme-picker__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;}
.site-theme-picker__grid.x3{grid-template-columns:repeat(3,1fr);}
.site-theme-picker__btn{
  background:var(--bg);
  border:1px solid var(--line);
  color:var(--ink);
  padding:10px 14px;
  border-radius:var(--btn-radius, 8px);
  cursor:pointer;
  font:inherit;
  font-size:.95em;
  text-align:center;
  transition:all .15s ease;
}
.site-theme-picker__btn:hover{border-color:var(--accent);}
.site-theme-picker__btn.is-active{
  background:var(--accent);
  color:#fff;
  border-color:var(--accent);
}
.site-theme-picker__close{
  margin-top:8px;
  width:100%;
  background:transparent;
  border:1px solid var(--line);
  color:var(--muted);
  padding:10px;
  border-radius:var(--btn-radius, 8px);
  cursor:pointer;
  font:inherit;
}
.site-theme-picker__hint{
  font-size:.78em;
  color:var(--muted);
  margin-top:10px;
  line-height:1.5;
}
