/* Akkukauppa custom Klaro tyyli — neliömäisempi modaali */

.klaro .cookie-modal .cm-modal,
.klaro .cookie-notice {
    max-width: 540px !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 32px rgba(15, 23, 42, .25) !important;
}

/* Modaali keskelle */
.klaro .cookie-modal {
    align-items: center !important;
    justify-content: center !important;
}

.klaro .cookie-notice:not(.cookie-modal-notice) {
    /* Banneri (jos ei modaalina) yläosaan keskitettynä */
    top: 16px !important;
    bottom: auto !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: calc(100% - 32px) !important;
    max-width: 540px !important;
}

/* Otsikot / typografia */
.klaro .cm-header h1,
.klaro .cm-header .title {
    font-size: 18px !important;
    font-weight: 700 !important;
}

/* Evästebannerin napit — TASAVERTAISET (12.9.2026).
   EDPB: hylkäämisen pitää olla yhtä helppoa ja yhtä erottuva kuin hyväksymisen.
   Sama koko, sama typografia, sama reunanleveys molemmille. */
.klaro .cm-btn,
.klaro .cookie-notice .cm-btn,
.klaro .cookie-modal .cm-btn {
    border-radius: 8px !important;
    padding: 10px 18px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    min-width: 150px !important;
    border: 2px solid transparent !important;
    text-align: center !important;
}

.klaro .cm-btn-success,
.klaro .cm-btn-accept,
.klaro .cm-btn-accept-all {
    background: #00C882 !important;
    border-color: #00C882 !important;
    color: #fff !important;
}
.klaro .cm-btn-success:hover,
.klaro .cm-btn-accept:hover,
.klaro .cm-btn-accept-all:hover {
    background: #00A96E !important;
    border-color: #00A96E !important;
}

/* Toggle-kytkimet vihreäksi kun päällä */
.klaro .cm-list-input:checked + .cm-list-label .slider {
    background-color: #00C882 !important;
}

/* Modaalin sisäreunan padding */
.klaro .cookie-modal .cm-modal .cm-body,
.klaro .cookie-modal .cm-modal .cm-header,
.klaro .cookie-modal .cm-modal .cm-footer {
    padding-left: 24px !important;
    padding-right: 24px !important;
}


/* Hylkää-nappi. HUOM: napin luokat ovat `cm-btn cm-btn-danger cn-decline` —
   aiempi `.cm-btn-decline` EI osunut mihinkään, joten nappi peri Klaron oman
   perusvarin #777 (harmaa). Valkoinen pohja + tumma 2px reuna antaa saman
   visuaalisen painon kuin taytetty hyvaksyntanappi, kontrasti ~15:1. */
.klaro .cm-btn.cm-btn-danger,
.klaro .cm-btn.cn-decline,
.klaro .cookie-notice .cm-btn.cn-decline,
.klaro .cookie-modal .cm-btn.cm-btn-danger {
    background: #fff !important;
    background-color: #fff !important;
    border-color: #212428 !important;
    color: #212428 !important;
}
.klaro .cm-btn.cm-btn-danger:hover,
.klaro .cm-btn.cn-decline:hover {
    background: #F3F4F6 !important;
    background-color: #F3F4F6 !important;
    border-color: #212428 !important;
    color: #212428 !important;
}

/* 19.9.2026: uutiskirjepopup peitti bannerin napit -> varmistetaan pinojarjestys */
.klaro .cookie-notice, .klaro .cookie-modal { z-index: 2147483000 !important; }