/* BOOTH AI STUDIO — cookies (i223, revu i224) : petite carte à côté du cookie + panneau aux couleurs du site */
#bas-consent { --bc-noir: #14110d; --bc-noir2: #1d1913; --bc-or: var(--or, #c9a962); --bc-iv: var(--ivoire, #f5ebdd);
  --bc-iv2: var(--ivoire-2, #b9ad9a); --bc-hair: rgba(245,235,221,.14);
  font-family: var(--sans, system-ui, sans-serif); letter-spacing: 0; line-height: 1.5; color: var(--bc-iv); }
#bas-consent [hidden] { display: none !important; }
#bas-consent button { font: inherit; cursor: pointer; }

/* Boutons */
.bc-btn { border-radius: 999px; padding: 9px 18px; font-size: .9rem; font-weight: 500; letter-spacing: .02em; border: 1px solid transparent;
  transition: transform .15s, background .2s, border-color .2s; }
.bc-btn.gold { background: linear-gradient(135deg, #e7c66f, var(--bc-or)); color: #1a1408; }
.bc-btn.line { background: transparent; color: var(--bc-iv); border-color: rgba(245,235,221,.35); }
.bc-btn.line:hover { border-color: var(--bc-or); color: #fff; }
.bc-btn:hover { transform: translateY(-1px); }
.bc-btn:focus-visible, .bc-lien:focus-visible, .bc-icon:focus-visible, .bc-x:focus-visible { outline: 2px solid var(--bc-or); outline-offset: 2px; }

/* Le cookie */
.bc-icon { position: fixed; z-index: 999; inset-inline-start: 16px; bottom: calc(16px + env(safe-area-inset-bottom));
  width: 48px; height: 48px; border-radius: 50%; border: 0; padding: 0; background: transparent;
  filter: drop-shadow(0 6px 14px rgba(0,0,0,.5)); transition: transform .25s; }
.bc-icon:hover { transform: rotate(-14deg) scale(1.07); }
.bc-icon svg { width: 100%; height: 100%; display: block; }
.bc-icon.bc-hop { animation: bc-hop 1.6s ease .8s 2; }
@keyframes bc-hop { 0%,100% { transform: none } 20% { transform: translateY(-6px) rotate(-12deg) } 40% { transform: none } }

/* La petite carte, à côté du cookie */
.bc-pop { position: fixed; z-index: 998; inset-inline-start: 76px; bottom: calc(16px + env(safe-area-inset-bottom));
  width: min(340px, calc(100vw - 96px)); background: var(--bc-noir2); border: 1px solid rgba(201,169,98,.45);
  border-radius: 18px; padding: 16px 18px 12px; box-shadow: 0 18px 50px rgba(0,0,0,.55);
  animation: bc-in .35s ease both; }
.bc-pop::before { content: ""; position: absolute; inset-inline-start: -8px; bottom: 16px; width: 14px; height: 14px;
  background: var(--bc-noir2); border-inline-start: 1px solid rgba(201,169,98,.45); border-bottom: 1px solid rgba(201,169,98,.45);
  transform: rotate(45deg); }
[dir="rtl"] .bc-pop::before { transform: rotate(-45deg); }
.bc-pop-t { margin: 0 0 12px; font-size: .9rem; color: var(--bc-iv2); }
.bc-pop-b { display: flex; gap: 8px; }
.bc-pop-b .bc-btn { flex: 1; padding: 8px 10px; }
.bc-lien { background: none; border: 0; padding: 8px 0 0; color: var(--bc-or); font-size: .85rem; }
@keyframes bc-in { from { opacity: 0; transform: translateY(10px) } to { opacity: 1; transform: none } }

/* Le panneau */
.bc-voile { position: fixed; inset: 0; z-index: 1001; background: rgba(5,4,3,.62); backdrop-filter: blur(3px); }
.bc-panel { position: fixed; z-index: 1002; inset: 0; margin: auto; height: fit-content;
  width: min(560px, calc(100vw - 24px)); max-height: 90vh; overflow: auto; background: var(--bc-noir2);
  border: 1px solid rgba(201,169,98,.4); border-radius: 22px; box-shadow: 0 30px 80px rgba(0,0,0,.6); animation: bc-in .3s ease both; }
.bc-x { position: absolute; top: 10px; inset-inline-end: 12px; width: 36px; height: 36px; border-radius: 50%;
  background: rgba(245,235,221,.06); border: 1px solid var(--bc-hair); color: var(--bc-iv); font-size: 1.3rem; line-height: 1; }
.bc-x:hover { border-color: var(--bc-or); }
.bc-head { padding: 26px 28px 18px; text-align: center; border-bottom: 1px solid var(--bc-hair); }
.bc-head-ic { display: inline-block; width: 46px; height: 46px; margin-bottom: 6px; }
.bc-head-ic svg { width: 100%; height: 100%; }
.bc-head h2 { font-family: var(--serif, Georgia, serif); font-weight: 500; font-size: 1.6rem; margin: 0 0 8px; color: var(--bc-iv); }
.bc-head p { margin: 0; color: var(--bc-iv2); font-size: .9rem; }
.bc-cat { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 28px; border-bottom: 1px solid var(--bc-hair); }
.bc-cat h3 { font-family: var(--sans, system-ui, sans-serif); font-size: 1rem; font-weight: 600; margin: 0 0 4px; color: var(--bc-iv); }
.bc-cat h3 label { cursor: pointer; }
.bc-cat p { margin: 0; font-size: .86rem; color: var(--bc-iv2); }
.bc-toujours { flex: none; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--bc-or);
  border: 1px solid rgba(201,169,98,.45); border-radius: 999px; padding: 4px 10px; margin-top: 2px; }
.bc-more { background: none; border: 0; color: var(--bc-or); padding: 8px 0 0; font-size: .82rem; }
.bc-list { margin: 8px 0 0; padding: 10px 12px; background: rgba(245,235,221,.05); border-radius: 10px; font-size: .82rem; color: var(--bc-iv2); }
.bc-list a { color: var(--bc-or); text-decoration: underline; }

/* L'interrupteur */
.bc-switch { flex: none; position: relative; width: 50px; height: 28px; margin-top: 2px; cursor: pointer; }
.bc-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.bc-switch span { position: absolute; inset: 0; border-radius: 999px; background: rgba(245,235,221,.16); transition: background .2s; pointer-events: none; }
.bc-switch span::after { content: ""; position: absolute; top: 3px; inset-inline-start: 3px; width: 22px; height: 22px; border-radius: 50%;
  background: #fff; transition: transform .2s; box-shadow: 0 2px 6px rgba(0,0,0,.3); }
.bc-switch input:checked + span { background: var(--bc-or); }
.bc-switch input:checked + span::after { transform: translateX(22px); }
[dir="rtl"] .bc-switch input:checked + span::after { transform: translateX(-22px); }
.bc-switch input:focus-visible + span { outline: 2px solid var(--bc-or); outline-offset: 2px; }

.bc-foot { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; padding: 18px 28px 22px; }

@media (max-width: 600px) {
  .bc-icon { bottom: calc(80px + env(safe-area-inset-bottom)); width: 42px; height: 42px; }   /* au-dessus de la barre « Essayer » collante */
  .bc-pop { inset-inline: 12px; width: auto; bottom: calc(132px + env(safe-area-inset-bottom)); }
  .bc-pop::before { inset-inline-start: 18px; bottom: -8px; transform: rotate(-45deg); }
  [dir="rtl"] .bc-pop::before { transform: rotate(45deg); }
  .bc-head, .bc-cat, .bc-foot { padding-inline: 18px; }
  .bc-foot .bc-btn { flex: 1 1 100%; }
}
