/* seo-hydrate.css
 * Overlay UI for hydrated SEO pre-rendered pages. Floating action bar + toast.
 * Le sélecteur « Ajouter à mon agenda » porte ses propres styles
 * (js/add-to-calendar.js). Designed to coexist with any host stylesheet —
 * uses scoped class names (.seo-fab, .seo-toast) and
 * minimal inheritance from the page.
 */

.seo-fab{
  position:fixed;bottom:18px;left:50%;transform:translateX(-50%);display:flex;gap:8px;padding:8px;background:rgba(10,8,5,0.92);border:1px solid rgba(255,255,255,0.08);border-radius:999px;box-shadow:0 12px 28px rgba(0,0,0,0.55), 0 2px 6px rgba(0,0,0,0.4);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:9000;font-family:'Public Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:0;font-weight:500;font-variant-numeric:tabular-nums;
}

.seo-fab-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 14px;
  background:transparent;
  border:0;
  color:#F5EFE6;
  font:inherit;
  cursor:pointer;
  border-radius:999px;
  transition:background 140ms, color 140ms;
}
.seo-fab-btn:hover{ background:rgba(255,255,255,0.06); }
.seo-fab-btn:focus-visible{ outline:2px solid #E8562C; outline-offset:2px; }
.seo-fab-btn[aria-pressed="true"]{ color:#E8562C; }

.seo-fab-icon{ font-size:14px; line-height:1; }
.seo-fab-label{ display:inline-block; }

@media (max-width:540px){
  .seo-fab{ bottom:12px; padding:6px; gap:4px; }
  .seo-fab-btn{ padding:8px 12px; }
  .seo-fab-label{ display:none; }
  .seo-fab-icon{ font-size:16px; }
}


/* ── Variante posée dans la page (fiche concert « Programme ») ─────────
 * Même markup, même JS : seule la position change. Tokens Night Bureau
 * (le thème jour suit), pas les couleurs figées de la barre flottante. */
.seo-fab--inline{
  position:static;
  transform:none;
  padding:0;
  gap:8px;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  font-family:'Public Sans', system-ui, sans-serif;
  font-size:13px;
  letter-spacing:0;
  flex-wrap:wrap;
}
.seo-fab--inline .seo-fab-btn{
  padding:9px 14px;
  border:1px solid var(--edge, rgba(244,236,222,0.4));
  border-radius:var(--r-m, 9px);
  color:var(--creme, #F4ECDE);
  font-weight:600;
  gap:7px;
}
.seo-fab--inline .seo-fab-btn:hover{ background:var(--c04, rgba(244,236,222,0.04)); border-color:var(--creme, #F4ECDE); }
.seo-fab--inline .seo-fab-btn[aria-pressed="true"]{ color:var(--braise, #E8562C); border-color:var(--braise, #E8562C); }
.seo-fab--inline .seo-fab-icon{ font-size:14px; }
@media (max-width:540px){
  .seo-fab--inline .seo-fab-btn{ padding:9px 12px; }
  .seo-fab--inline .seo-fab-label{ display:inline-block; }
}

/* ── Toast ─────────────────────────────────────────────────── */
.seo-toast{
  position:fixed;bottom:80px;left:50%;transform:translateX(-50%) translateY(8px);background:rgba(10,8,5,0.95);color:#F5EFE6;border:1px solid rgba(255,255,255,0.08);padding:10px 18px;border-radius:999px;font-family:'Public Sans',system-ui,-apple-system,sans-serif;font-size:11px;letter-spacing:0;opacity:0;pointer-events:none;transition:opacity 200ms, transform 200ms;z-index:9200;font-weight:500;font-variant-numeric:tabular-nums;
}
.seo-toast.on{ opacity:1; transform:translateX(-50%) translateY(0); }