/*
 * Scrollbar temático compartido para las invitaciones públicas.
 *
 * El marcador lo agrega InvitationPageRenderer al elemento raíz. Así el
 * scrollbar del documento —que pertenece a html, no siempre a body— recibe
 * el tema correcto sin depender de selectores propietarios de cada diseño.
 */
html[data-b13-template] {
    --b13-scrollbar-thumb: #6d6d6d;
    --b13-scrollbar-track: #f3f3f3;
    scrollbar-color: var(--b13-scrollbar-thumb) var(--b13-scrollbar-track);
    scrollbar-width: thin;
}

html[data-b13-template="arlin"] { --b13-scrollbar-thumb: #ff1b98; --b13-scrollbar-track: #fff0f8; }
html[data-b13-template="atelier13"] { --b13-scrollbar-thumb: #a9c9c5; --b13-scrollbar-track: #f1f7f6; }
html[data-b13-template="couple-heart"] { --b13-scrollbar-thumb: #118d89; --b13-scrollbar-track: #e9f6f5; }
html[data-b13-template="eternity"] { --b13-scrollbar-thumb: #8f302a; --b13-scrollbar-track: #f7eceb; }
html[data-b13-template="feelings"] { --b13-scrollbar-thumb: #a88489; --b13-scrollbar-track: #f6f0f1; }
html[data-b13-template="liebe"] { --b13-scrollbar-thumb: #b6bad6; --b13-scrollbar-track: #f3f3f8; }
html[data-b13-template="lovelove"] { --b13-scrollbar-thumb: #d4b0a5; --b13-scrollbar-track: #f9f3f1; }
html[data-b13-template="lovely"] { --b13-scrollbar-thumb: #5e9a8e; --b13-scrollbar-track: #edf5f3; }
html[data-b13-template="neela"] { --b13-scrollbar-thumb: #4f7584; --b13-scrollbar-track: #edf2f4; }
html[data-b13-template="olivia"] { --b13-scrollbar-thumb: #805f31; --b13-scrollbar-track: #f3efe9; }
html[data-b13-template="sukun"] { --b13-scrollbar-thumb: #c9a98c; --b13-scrollbar-track: #f8f3ee; }
html[data-b13-template="weddingo"] { --b13-scrollbar-thumb: #8b4e30; --b13-scrollbar-track: #f5ede9; }

html[data-b13-template]::-webkit-scrollbar {
    height: 10px;
    width: 10px;
}

html[data-b13-template]::-webkit-scrollbar-track {
    background: var(--b13-scrollbar-track);
}

html[data-b13-template]::-webkit-scrollbar-thumb {
    background: var(--b13-scrollbar-thumb);
    border: 2px solid var(--b13-scrollbar-track);
    border-radius: 999px;
}

html[data-b13-template]::-webkit-scrollbar-thumb:hover {
    filter: brightness(0.85);
}

@media (forced-colors: active) {
    html[data-b13-template] {
        scrollbar-color: auto;
    }

    html[data-b13-template]::-webkit-scrollbar-thumb {
        background: ButtonText;
        border-color: Canvas;
    }
}