:root{

  --cb-bg:#0b0b13; --cb-fg:#f1e9d0; --cb-accent:#d4af37; --cb-btn:#1f1f2b;

  --cb-btn-border:#2c2c3a; --cb-accept:#7a0c0c; --cb-shadow:0 12px 28px rgba(0,0,0,.45);

  --cb-radius:12px; --cb-maxw:1200px;

}



.mm-cookiebar{

  position:fixed; left:50%; transform:translateX(-50%); bottom:12px;

  width:min(96vw, var(--cb-maxw));

  background:var(--cb-bg); color:var(--cb-fg);

  box-shadow:var(--cb-shadow); border-radius:var(--cb-radius);

  border:1px solid rgba(212,175,55,.2);

  z-index:9999;

  padding:12px 14px 12px 16px;

  display:none;                  /* mostrata dal JS */

  align-items:center; gap:12px; font-size:14px;

}



.mm-cookiebar__text{ flex:1; min-width:0 }

.mm-cookiebar__actions{ display:flex; gap:8px; flex-wrap:wrap }



.mm-btn{

  border:1px solid var(--cb-btn-border);

  background:var(--cb-btn); color:var(--cb-fg);

  padding:8px 12px; border-radius:9px; cursor:pointer; font-weight:700;

}

.mm-btn:hover{ filter:brightness(1.1) }

.mm-btn--accept{ background:var(--cb-accept); border-color:#5c0909 }

.mm-btn--accept:hover{ filter:brightness(1.05) }



/* X inline a destra su desktop */

.mm-close{

  border:none; background:transparent; color:#cbbd93;

  font-size:20px; cursor:pointer; line-height:1;

  margin-left:auto;                 /* spinge la X a destra nella riga */

}

.mm-close:hover{ color:#fff }



/* ---------- Modal ---------- */

.mm-cookie-modal{

  position:fixed; inset:0; display:none; align-items:center; justify-content:center;

  background:rgba(0,0,0,.55); z-index:10000; padding:16px;

}

.mm-cookie-card{

  width:min(560px, 96vw); background:#111; color:#fff; border-radius:14px;

  box-shadow:0 16px 44px rgba(0,0,0,.5); padding:18px;

  border:1px solid rgba(212,175,55,.2);

}

.mm-cookie-card__header{ display:flex; justify-content:space-between; align-items:center; margin-bottom:8px }

.mm-cookie-card__title{ margin:0; font-size:18px; color:var(--cb-accent) }

.mm-switch-row{

  display:flex; align-items:center; justify-content:space-between;

  padding:10px 0; border-bottom:1px solid rgba(255,255,255,.08); gap:10px;

}

.mm-switch-row:last-child{ border-bottom:none }

.mm-switch-row small{ color:#b7b7c7 }

.mm-switch{ width:44px; height:24px; border-radius:999px; background:#2b2b3a; position:relative; cursor:pointer }

.mm-switch input{ display:none }

.mm-switch span{

  position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:999px;

  background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.4);

  transition:left .18s ease, background .18s ease;

}

.mm-switch input:checked + span{ left:23px; background:var(--cb-accent) }

.mm-cookie-card__footer{ display:flex; justify-content:flex-end; gap:8px; margin-top:14px }



/* ---------- Mobile (testo sopra, bottoni sotto) ---------- */

@media (max-width:520px){

  .mm-cookiebar{

    flex-direction:column;          /* testo in alto, bottoni sotto */

    align-items:stretch;

    text-align:left;

    padding:12px 44px 12px 12px;    /* spazio per la X assoluta */

  }

  .mm-cookiebar__actions{ justify-content:flex-start }

  /* X in alto a destra, assoluta */

  .mm-close{

    position:absolute; top:6px; right:8px;

    margin-left:0;                  /* annulla quello desktop */

  }

  .mm-btn{ padding:7px 10px }

}