.hdr-pro {
    position: relative;
    display: inline-block;
    overflow: hidden;

    /* Podstawowy tonemapping */
    filter:
        contrast(1.25)
        brightness(1.12)
        saturate(1.18)
        sepia(0.03);

    /* Subtelne micro-sharpening */
    mix-blend-mode: normal;
}

/* Bloom highlightów (subtelny efekt) */
.hdr-pro::after {
    content: "";
    position: absolute;
    inset: 0;
    background: inherit;
    filter:
        blur(18px)
        brightness(1.7)
        saturate(1.5);
    opacity: 0.25;
    pointer-events: none;
    z-index: 2;
}

/* hdr */

/* Dynamiczne bindowanie wartości */
:root {
    --hdr-filter: var(--hdr-filter-value);
    --hdr-bloom: var(--hdr-bloom-value);
    --hdr-opacity: var(--hdr-opacity-value);
}

/* Każdy preset definiuje swój zestaw */
:root[theme-hdr="none"] {
    --hdr-filter-value: none;
    --hdr-bloom-value: none;
    --hdr-opacity-value: 0;
}

:root[theme-hdr="lightroom"] {
    --hdr-filter-value: contrast(1.25) brightness(1.12) saturate(1.18) sepia(.03);
    --hdr-bloom-value: blur(18px) brightness(1.7) saturate(1.5);
    --hdr-opacity-value: .25;
}

:root[theme-hdr="glow"] {
    --hdr-filter-value: contrast(1.15) brightness(1.2) saturate(1.1);
    --hdr-bloom-value: blur(30px) brightness(2.2) saturate(1.7);
    --hdr-opacity-value: .35;
}

:root[theme-hdr="dramatic"] {
    --hdr-filter-value: contrast(1.45) brightness(.95) saturate(1.15) grayscale(.12);
    --hdr-bloom-value: blur(12px) brightness(1.3) saturate(1.2);
    --hdr-opacity-value: .18;
}

/* ───────────────────────────────────────── */
/*  HDR: Neo Tokyo (Cyberpunk / Neon)       */
/* ───────────────────────────────────────── */
:root[theme-hdr="neotokyo"] {
    --hdr-filter-value:
        contrast(1.35)
        brightness(1.1)
        saturate(1.6)
        hue-rotate(25deg);
    --hdr-bloom-value:
        blur(26px)
        brightness(2.1)
        saturate(1.8);
    --hdr-opacity-value: .32;
}

/* ───────────────────────────────────────── */
/*  HDR: Kodachrome (Retro warm film)        */
/* ───────────────────────────────────────── */
:root[theme-hdr="kodachrome"] {
    --hdr-filter-value:
        contrast(1.18)
        brightness(1.12)
        saturate(1.25)
        sepia(.15)
        hue-rotate(5deg);
    --hdr-bloom-value:
        blur(12px)
        brightness(1.35)
        saturate(1.15);
    --hdr-opacity-value: .18;
}

/* ───────────────────────────────────────── */
/*  HDR: Faded Film (70s look)               */
/* ───────────────────────────────────────── */
:root[theme-hdr="fadedfilm"] {
    --hdr-filter-value:
        contrast(0.88)
        brightness(1.15)
        saturate(0.85)
        sepia(.12);
    --hdr-bloom-value:
        blur(8px)
        brightness(1.1)
        saturate(.85);
    --hdr-opacity-value: .12;
}

/* ───────────────────────────────────────── */
/*  HDR: Ultra Pop (Vivid / Comic)           */
/* ───────────────────────────────────────── */
:root[theme-hdr="ultrapop"] {
    --hdr-filter-value:
        contrast(1.55)
        brightness(1.12)
        saturate(2.0);
    --hdr-bloom-value:
        blur(20px)
        brightness(1.9)
        saturate(2.4);
    --hdr-opacity-value: .30;
}

/* ───────────────────────────────────────── */
/*  HDR: Bleach Bypass (Hollywood Silver)    */
/* ───────────────────────────────────────── */
:root[theme-hdr="bleach"] {
    --hdr-filter-value:
        contrast(1.45)
        brightness(.96)
        saturate(.65)
        grayscale(.2);
    --hdr-bloom-value:
        blur(14px)
        brightness(1.4)
        saturate(.5);
    --hdr-opacity-value: .22;
}

/* ───────────────────────────────────────── */
/*  HDR: Matte Dark Film                     */
/* ───────────────────────────────────────── */
:root[theme-hdr="mattedark"] {
    --hdr-filter-value:
        contrast(1.25)
        brightness(.92)
        saturate(1.1)
        sepia(.05);
    --hdr-bloom-value:
        blur(10px)
        brightness(1.3)
        saturate(1.1);
    --hdr-opacity-value: .16;
}

/* ───────────────────────────────────────── */
/*  HDR: Hyperreal                           */
/* ───────────────────────────────────────── */
:root[theme-hdr="hyperreal"] {
    --hdr-filter-value:
        contrast(1.6)
        brightness(1.05)
        saturate(1.3)
        sharpen(12px); /* działa w Chrome */
    --hdr-bloom-value:
        blur(25px)
        brightness(2.0)
        saturate(1.5);
    --hdr-opacity-value: .28;
}

/* ───────────────────────────────────────── */
/*  HDR: Dream Glow (Pastel / Soft)          */
/* ───────────────────────────────────────── */
:root[theme-hdr="dreamglow"] {
    --hdr-filter-value:
        contrast(1.05)
        brightness(1.2)
        saturate(1.15)
        hue-rotate(8deg);
    --hdr-bloom-value:
        blur(35px)
        brightness(2.4)
        saturate(1.4);
    --hdr-opacity-value: .38;
}

/* ───────────────────────────────────────── */
/*  HDR: Vintage Sepia                        */
/* ───────────────────────────────────────── */
:root[theme-hdr="sepia"] {
    --hdr-filter-value:
        contrast(1.1)
        brightness(1.05)
        saturate(1.0)
        sepia(.45);
    --hdr-bloom-value:
        blur(8px)
        brightness(1.4)
        saturate(1.2);
    --hdr-opacity-value: .2;
}

/* ───────────────────────────────────────── */
/*  HDR: Noir Dramatic                        */
/* ───────────────────────────────────────── */
:root[theme-hdr="noir"] {
    --hdr-filter-value:
        contrast(1.75)
        brightness(.85)
        saturate(0)
        grayscale(1);
    --hdr-bloom-value:
        blur(6px)
        brightness(1.2)
        saturate(0);
    --hdr-opacity-value: .12;
}

.hdr-pro {
    filter: var(--hdr-filter);
    position: relative;
    display: block;
}

.hdr-pro::after {
    content: "";
    position: absolute;
    inset: 0;
    filter: var(--hdr-bloom);
    opacity: var(--hdr-opacity);
    pointer-events: none;
}