/* Bandeau de consentement et panneau « Gérer les cookies » de la vitrine et du portail
   (web/shared/static/mesure.js). Couleurs de la vitrine (or) par défaut, du portail avec .portail. */

.consent[hidden], .consent-panel[hidden], .consent-veil[hidden], [data-cookies][hidden] { display: none !important; }

.consent {
  --c-bg: rgba(10, 14, 26, .97); --c-line: rgba(217, 179, 91, .4); --c-text: #e8edfa; --c-text-2: #b6bfd6;
  --c-accent: #d9b35b; --c-accent-1: #f6dc96; --c-soft: rgba(217, 179, 91, .13); --c-hover: rgba(217, 179, 91, .24);
  position: fixed; z-index: 1000; inset-inline: 1.25rem; bottom: 1rem; margin-inline: auto; max-width: 1560px;
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .8rem 1.6rem; align-items: center;
  padding: .8rem 1.2rem; border-radius: 14px; border: 1px solid var(--c-line); background: var(--c-bg);
  box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .9); backdrop-filter: blur(12px);
  color: var(--c-text); font: 15px/1.5 "Inter", "Segoe UI", system-ui, -apple-system, sans-serif; text-align: start;
}
.consent-panel {
  --c-line: rgba(217, 179, 91, .4); --c-text: #e8edfa; --c-text-2: #b6bfd6; --c-accent: #d9b35b; --c-accent-1: #f6dc96;
  --c-soft: rgba(217, 179, 91, .13); --c-hover: rgba(217, 179, 91, .24);
  position: fixed; z-index: 1002; inset: 0; margin: auto; width: min(620px, calc(100% - 2rem)); height: fit-content;
  max-height: calc(100% - 2rem); overflow: auto; border-radius: 18px; border: 1px solid var(--c-line); background: #0b1020;
  box-shadow: 0 30px 80px -24px rgba(0, 0, 0, .95); color: var(--c-text);
  font: 15px/1.55 "Inter", "Segoe UI", system-ui, -apple-system, sans-serif; text-align: start;
}
.consent.portail, .consent-panel.portail {
  --c-line: rgba(61, 126, 255, .45); --c-accent: #3d7eff; --c-accent-1: #9dbcff; --c-soft: rgba(61, 126, 255, .14);
  --c-hover: rgba(61, 126, 255, .26);
}
.consent-title, .cp-head h2, .cp-item h3 {
  font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif; text-transform: none; letter-spacing: normal;
}
.consent-title { display: flex; align-items: center; gap: .5rem; margin: 0 0 .15rem; font-weight: 650; font-size: .98rem; color: #fff; }
.consent-title svg { width: 1.2rem; height: 1.2rem; flex: none; color: var(--c-accent); }
.consent p { margin: 0; color: var(--c-text-2); font-size: .9rem; }
/* Les deux paragraphes du bandeau se suivent sur les mêmes lignes : le bandeau reste bas. */
.consent p:not(.consent-title) { display: inline; }
.consent a, .consent-panel a { color: var(--c-accent-1); text-decoration: underline; text-underline-offset: 2px; }
.consent-actions { display: flex; gap: .5rem; justify-content: flex-end; }
.consent-btn {
  appearance: none; border: 1px solid var(--c-line); background: var(--c-soft); color: var(--c-accent-1); font: inherit;
  font-weight: 600; font-size: .92rem; line-height: 1.3; padding: .56rem .95rem; border-radius: 10px; cursor: pointer;
  min-width: 8.2rem; white-space: nowrap; transition: background .15s;
}
.consent-btn:hover { background: var(--c-hover); }
.consent-btn:focus-visible, .cp-close:focus-visible, .cp-switch input:focus-visible + .track {
  outline: 2px solid var(--c-accent-1); outline-offset: 2px;
}
.consent-btn.plain { background: transparent; border-color: rgba(182, 191, 214, .32); color: var(--c-text); min-width: 0; }
.consent-btn.plain:hover { background: rgba(255, 255, 255, .06); }

.consent-veil { position: fixed; inset: 0; z-index: 1001; background: rgba(3, 5, 10, .66); backdrop-filter: blur(3px); }
.cp-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.35rem .2rem; }
.cp-head h2 { margin: 0; font-size: 1.15rem; font-weight: 650; line-height: 1.3; color: #fff; }
.cp-close {
  appearance: none; flex: none; border: 1px solid rgba(182, 191, 214, .3); background: transparent; color: var(--c-text-2);
  width: 2.1rem; height: 2.1rem; border-radius: 9px; font: 400 1.2rem/1 system-ui, sans-serif; cursor: pointer;
}
.cp-close:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.cp-intro { margin: .3rem 1.35rem .9rem; color: var(--c-text-2); font-size: .92rem; }
.cp-item { margin: 0 1.35rem .75rem; padding: .9rem 1rem; border-radius: 12px; border: 1px solid rgba(182, 191, 214, .16);
  background: rgba(255, 255, 255, .025); }
.cp-item-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .35rem; }
.cp-item h3 { margin: 0; font-size: .98rem; font-weight: 650; line-height: 1.3; color: #fff; }
.cp-item p { margin: 0; color: var(--c-text-2); font-size: .9rem; }
.cp-item p + p, .cp-item ul + p { margin-top: .45rem; }
.cp-item ul { margin: .45rem 0 0; padding-inline-start: 1.1rem; color: var(--c-text-2); font-size: .88rem; }
.cp-always { flex: none; font-size: .8rem; font-weight: 600; color: #2fbf71; padding: .15rem .55rem; border-radius: 999px;
  background: rgba(47, 191, 113, .14); }
.cp-switch { position: relative; flex: none; display: inline-flex; align-items: center; cursor: pointer; }
.cp-switch input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.cp-switch .track { position: relative; width: 2.6rem; height: 1.45rem; border-radius: 999px; background: #1b2540; border: 1px solid #2d3b5e; }
.cp-switch .track::after { content: ""; position: absolute; top: 50%; inset-inline-start: .16rem; width: 1.05rem; height: 1.05rem;
  border-radius: 50%; background: #7f8cac; transform: translateY(-50%); transition: transform .15s; }
.cp-switch input:checked + .track { background: var(--c-accent); border-color: var(--c-accent); }
.cp-switch input:checked + .track::after { background: #fff; transform: translate(1.13rem, -50%); }
[dir="rtl"] .cp-switch input:checked + .track::after { transform: translate(-1.13rem, -50%); }
.cp-note { margin: .2rem 1.35rem 0; color: var(--c-text-2); font-size: .86rem; }
.cp-foot { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .55rem; padding: 1rem 1.35rem 1.2rem; }
.cp-foot .consent-btn { min-width: 0; flex: 1 1 auto; }

@media (max-width: 980px) {
  .consent { grid-template-columns: minmax(0, 1fr); gap: .7rem; }
}
@media (max-width: 720px) {
  .consent { inset-inline: .6rem; bottom: .6rem; padding: .85rem .9rem; }
  .consent p { font-size: .86rem; }
  .consent-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .consent-actions .consent-btn { min-width: 0; white-space: normal; }
  .consent-actions .plain { grid-column: 1 / -1; order: 3; }
  .cp-foot { display: grid; grid-template-columns: 1fr 1fr; }
  .cp-foot .plain { grid-column: 1 / -1; order: 3; }
}
@media (prefers-reduced-motion: reduce) {
  .consent-btn, .cp-switch .track::after { transition: none; }
}