/* Loomia Web - banner e preferenze dei cookie in vetro chiaro (stile Apple).
 *
 * Vale per tutte le pagine: quelle Nuxt (libreria nel bundle) e quelle fatte a
 * mano (kreea-cookie.js). Il vetro e' abbastanza opaco da tenere il testo
 * scuro leggibile anche quando sotto passa una sezione nera. Nel banner
 * c'e' solo "Accetta": "Rifiuta tutti" sta nelle preferenze.
 * I selettori partono da "html body" per battere le regole del bundle e di
 * loomia-web.css, che usano !important.
 */
html body #cc-main{
  --cc-font-family:"Geist","Inter","Helvetica Neue",Arial,sans-serif;
  --cc-bg:rgba(255,255,255,.74);
  --cc-primary-color:#16161a;
  --cc-secondary-color:#45433f;
  --cc-link-color:#16161a;
  --cc-separator-border-color:rgba(22,22,26,.1);
  --cc-modal-border-radius:22px;
  --cc-btn-border-radius:999px;
  --cc-prefs-section-radius:14px;
  --cc-btn-primary-bg:#D2F68D;--cc-btn-primary-color:#0D0D0D;--cc-btn-primary-border-color:#D2F68D;
  --cc-btn-primary-hover-bg:#c6ef75;--cc-btn-primary-hover-color:#0D0D0D;--cc-btn-primary-hover-border-color:#c6ef75;
  --cc-btn-secondary-bg:rgba(255,255,255,.6);--cc-btn-secondary-color:#16161a;--cc-btn-secondary-border-color:rgba(22,22,26,.14);
  --cc-btn-secondary-hover-bg:rgba(255,255,255,.95);--cc-btn-secondary-hover-color:#16161a;--cc-btn-secondary-hover-border-color:rgba(22,22,26,.22);
  --cc-toggle-on-bg:#16161a;--cc-toggle-off-bg:rgba(22,22,26,.22);--cc-toggle-on-knob-bg:#fff;--cc-toggle-off-knob-bg:#fff;
  --cc-toggle-readonly-bg:rgba(22,22,26,.4);--cc-toggle-readonly-knob-bg:#fff;--cc-toggle-readonly-knob-icon-color:rgba(22,22,26,.4);
  --cc-toggle-enabled-icon-color:#16161a;--cc-toggle-disabled-icon-color:rgba(22,22,26,.45);
  --cc-cookie-category-block-bg:rgba(255,255,255,.5);--cc-cookie-category-block-border:rgba(22,22,26,.08);
  --cc-cookie-category-block-hover-bg:rgba(255,255,255,.75);--cc-cookie-category-block-hover-border:rgba(22,22,26,.12);
  --cc-cookie-category-expanded-block-bg:rgba(255,255,255,.4);--cc-cookie-category-expanded-block-hover-bg:rgba(255,255,255,.6);
  --cc-section-category-border:rgba(22,22,26,.08);
  --cc-overlay-bg:rgba(22,22,26,.28);
  --cc-footer-bg:transparent;--cc-footer-color:#45433f;--cc-footer-border-color:rgba(22,22,26,.08);
  --cc-modal-margin:16px;
}
html body #cc-main,html body #cc-main *{font-family:var(--cc-font-family)!important;letter-spacing:normal}

/* il vetro */
html body #cc-main .cm,html body #cc-main .pm{
  background:var(--cc-bg)!important;color:#16161a!important;
  backdrop-filter:blur(26px) saturate(180%);-webkit-backdrop-filter:blur(26px) saturate(180%);
  border:1px solid rgba(255,255,255,.7)!important;
  box-shadow:0 18px 50px -12px rgba(22,22,26,.32),0 2px 8px rgba(22,22,26,.08),inset 0 1px 0 rgba(255,255,255,.8)!important}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  html body #cc-main .cm,html body #cc-main .pm{background:rgba(250,249,246,.97)!important}}
html body #cc-main .pm-overlay{backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}

/* banner piu' piccolo */
html body #cc-main .cm--box{max-width:330px!important;width:calc(100vw - 32px)!important}
html body #cc-main .cm__body{padding:0!important}
html body #cc-main .cm__texts{padding:18px 18px 4px!important}
html body #cc-main .cm__title{font-size:15px!important;font-weight:600!important;color:#16161a!important;padding:0 28px 0 0!important}
html body #cc-main .cm__desc{font-size:13px!important;line-height:1.5!important;color:#45433f!important;margin-top:6px!important;padding:0!important;max-height:none!important}
html body #cc-main .cm__desc a,html body #cc-main .pm a{color:#16161a!important;font-weight:500}
html body #cc-main .cm__btns{padding:12px 18px 16px!important;border-top:0!important;flex-direction:column!important;gap:6px!important}
html body #cc-main .cm__btn-group{display:flex!important;flex-direction:row!important;gap:8px!important;margin:0!important;width:100%}
html body #cc-main .cm__btn-group+.cm__btn-group{margin:0!important;justify-content:center}
html body #cc-main .cm__btn{min-height:0!important;font-size:13.5px!important;font-weight:500!important;padding:10px 14px!important;margin:0!important;flex:1 1 0!important;line-height:1.2!important}

/* Accetta: lime. Rifiuta: vetro, stessa misura. Personalizza: un link */
/* "Rifiuta" resta nascosto nel banner, per scelta di Alvaro: si rifiuta con la X o dalle preferenze */
html body #cc-main .cm__btn[data-role=necessary]{display:none!important}
html body #cc-main .cm__btn[data-role=all],html body #cc-main .pm__btn[data-role=all]{
  background:#D2F68D!important;border:1px solid #D2F68D!important;color:#0D0D0D!important}
html body #cc-main .cm__btn[data-role=all]:hover,html body #cc-main .pm__btn[data-role=all]:hover{background:#c6ef75!important;border-color:#c6ef75!important}
html body #cc-main .cm__btn[data-role=necessary],html body #cc-main .pm__btn[data-role=necessary],html body #cc-main .pm__btn[data-role=save]{
  background:rgba(255,255,255,.6)!important;border:1px solid rgba(22,22,26,.14)!important;color:#16161a!important}
html body #cc-main .cm__btn[data-role=necessary]:hover,html body #cc-main .pm__btn[data-role=necessary]:hover,html body #cc-main .pm__btn[data-role=save]:hover{
  background:rgba(255,255,255,.95)!important;border-color:rgba(22,22,26,.22)!important}
html body #cc-main .cm__btn[data-role=show]{
  background:transparent!important;border:0!important;color:#45433f!important;flex:0 0 auto!important;
  font-size:12.5px!important;padding:6px 4px 0!important;text-decoration:underline;text-underline-offset:3px}
html body #cc-main .cm__btn[data-role=show]:hover{color:#16161a!important;background:transparent!important}

/* chiudi */
html body #cc-main .cm__btn--close,html body #cc-main .pm__close-btn{background:transparent!important;border:0!important;top:12px!important;right:12px!important}
html body #cc-main .cm__btn--close svg,html body #cc-main .pm__close-btn svg{stroke:#16161a!important}
html body #cc-main .pm__close-btn:hover{background:rgba(22,22,26,.06)!important}

/* preferenze */
html body #cc-main .pm--box{max-width:480px!important}
html body #cc-main .pm__header,html body #cc-main .pm__footer{border-color:rgba(22,22,26,.08)!important;background:transparent!important}
html body #cc-main .pm__title{font-size:17px!important;font-weight:600!important;color:#16161a!important}
html body #cc-main .pm__section-title{font-size:14px!important;font-weight:600!important;color:#16161a!important}
/* il tema di prima scriveva questi in crema, per il fondo scuro: sul vetro chiaro sparivano */
html body #cc-main .pm__section:not(.pm__section--toggle) .pm__section-title{color:#16161a!important}
html body #cc-main .pm__section-desc a{color:#16161a!important}
html body #cc-main .pm__section-desc,html body #cc-main .pm__section-desc-wrapper,html body #cc-main .pm__body p{font-size:13px!important;line-height:1.5!important;color:#45433f!important}
html body #cc-main .pm__section,html body #cc-main .pm__section--toggle .pm__section-title{background:rgba(255,255,255,.5)!important;border-color:rgba(22,22,26,.08)!important}
html body #cc-main .pm__section--toggle .pm__section-title:hover{background:rgba(255,255,255,.8)!important}
html body #cc-main .pm__section--toggle .pm__section-desc-wrapper{background:rgba(255,255,255,.35)!important;border-color:rgba(22,22,26,.08)!important}
html body #cc-main .pm__btn{font-size:13.5px!important;font-weight:500!important;padding:11px 16px!important;min-height:0!important}
html body #cc-main .pm__badge{background:rgba(22,22,26,.08)!important;color:#16161a!important}

@media (prefers-reduced-transparency:reduce){
  html body #cc-main .cm,html body #cc-main .pm{background:rgba(250,249,246,.98)!important;backdrop-filter:none;-webkit-backdrop-filter:none}}
@media (max-width:640px){
  html body #cc-main .cm--box{max-width:none!important}
}