/* HENSEL styling for Klaro. Loaded after klaro.min.css.
   Klaro exposes its palette as CSS variables with fallbacks, so overriding the
   variables is enough - no need to fight its selectors.

   Contrast measured against the panel background #00365b:
     white   #ffffff  12.51:1   headings, body text
     sky-200 #bae6fd   9.43:1   descriptions, "1 Dienst" caret  (Klaro default #7c7c7c = 3.00:1, fails)
     button  #005794 on white 7.52:1
*/
.klaro {
    --font-family: inherit;
    --border-radius: 4px;

    --dark1: #00365b;   /* panel background  (henselbluedark) */
    --dark2: #005794;   /* buttons           (henselblue)     */
    --dark3: #bae6fd;   /* list descriptions - was #7c7c7c    */

    --light1: #ffffff;  /* primary text  */
    --light2: #e0f2fe;
    --light3: #bae6fd;  /* caret, purpose labels - was #a0a0a0 */

    --white1: #ffffff;
    --white2: #f2f2f2;
    --white3: #e6e6e6;

    /* Klaro's green #1a936f gives only 3.85:1 with white text. Blue passes at 7.52:1
       and keeps the toggles distinguishable against the dark panel. */
    --green1: #005794;
    --green2: #2581c4;
    --green3: #7dd3fc;

    /* Notice to the bottom left: bottom right covers the hero button on the
       start page, so the first visit shows the call to action behind a dialog. */
    --notice-left: 20px;
    --notice-right: auto;
}

/* Primary action: white on blue, matching the buttons in the page hero. */
.klaro .cookie-modal .cm-btn.cm-btn-success,
.klaro .cookie-notice .cm-btn.cm-btn-success {
    background-color: #ffffff;
    color: #005794;
    font-weight: 700;
}
.klaro .cookie-modal .cm-btn.cm-btn-success:hover,
.klaro .cookie-notice .cm-btn.cm-btn-success:hover { background-color: #e8eef4; }

/* Decline must be as easy to find as accept - outlined, not hidden away. */
.klaro .cookie-modal .cm-btn.cm-btn-danger,
.klaro .cookie-notice .cm-btn.cm-btn-decline {
    background-color: transparent;
    color: #ffffff;
    border: 2px solid rgba(255,255,255,.75);
    font-weight: 700;
}

/* Visible keyboard focus - Klaro ships none of its own. */
.klaro .cm-btn:focus-visible,
.klaro a:focus-visible,
.klaro input:focus-visible + .cm-list-label .slider {
    outline: 3px solid #ffffff;
    outline-offset: 2px;
}

.klaro .cookie-notice a,
.klaro .cookie-modal a { color: #ffffff; text-decoration: underline; }
