:root {

    /* ===== Brand ===== */

    --vahu-mint: #a8e6cf;
    --vahu-mint-light: #bcefdc;
    --vahu-mint-hover: #d5f8eb;

    --vahu-peach: #ffd3b6;
    --vahu-peach-light: #ffe3cd;

    --vahu-gradient:
        linear-gradient(135deg,
            var(--vahu-mint) 0%,
            var(--vahu-mint-light) 20%,
            var(--vahu-peach-light) 75%,
            var(--vahu-peach) 100%);

    --vahu-gradient-hover:
        linear-gradient(135deg,
            var(--vahu-mint-hover) 0%,
            var(--vahu-mint-light) 20%,
            var(--vahu-peach-light) 75%,
            var(--vahu-peach) 100%);

    /* ===== Szövegek ===== */

    --vahu-text: #5a3528;
    --vahu-text-light: #777777;
    --vahu-text-white: #ffffff;

    /* ===== Állapotok ===== */

    --vahu-danger: #d96a6a;
    --vahu-danger-hover: #c85858;
    --vahu-danger-text: #ffffff;

    --vahu-success: #53b46b;
    --vahu-warning: #e4b43c;

    /* ===== Keretek ===== */

    --vahu-border: #dddddd;
    --vahu-border-light: #eeeeee;
    --vahu-radius: 8px;

    /* ===== Árnyék ===== */

    --vahu-shadow:
        0 4px 10px rgba(0, 0, 0, .08);

    --vahu-shadow-hover:
        0 8px 18px rgba(0, 0, 0, .15);

    /* Felületek */

    --vahu-surface: #fffaf2;
    --vahu-surface-light: #fffdf8;
    --vahu-surface-hover: #fff6eb;

    /* Semleges */

    --vahu-beige: #f8f1e8;
    --vahu-beige-hover: #f2e8dc;

    /* Mégse */

    --vahu-cancel: #ffd8c2;
    --vahu-cancel-hover: #ffe5d6;
    --vahu-cancel-border: #efb08a;
    --vahu-cancel-text: #8b4c2f;

    /* ==========================================================
   BUTTON - DELETE
   ========================================================== */

    --vahu-btn-delete-bg: linear-gradient(135deg,
            #f6b2a5 0%,
            #e98b8b 45%,
            #d96a6a 100%);

    --vahu-btn-delete-bg-hover: linear-gradient(135deg,
            #f8c1b7 0%,
            #eca0a0 45%,
            #c85858 100%);

    --vahu-btn-delete-text: #5a3528;

    /* ==========================================================
   RED PALETTE
   ========================================================== */

    --vahu-red-lightest: #f8c1b7;
    --vahu-red-lighter: #f3b8b0;
    --vahu-red-light: #eca0a0;
    --vahu-red: #e98b8b;
    --vahu-red-dark: #df7d7d;
    --vahu-red-darker: #d96a6a;
    --vahu-red-hover: #c85858;


    /* ==========================================================
   BUTTON - DELETE
   ========================================================== */

    --vahu-btn-delete-bg: linear-gradient(135deg,
            var(--vahu-peach) 0%,
            var(--vahu-peach-light) 25%,
            var(--vahu-red) 65%,
            var(--vahu-red-darker) 100%);

    --vahu-btn-delete-bg-hover: linear-gradient(135deg,
            var(--vahu-peach-light) 0%,
            var(--vahu-red-lighter) 25%,
            var(--vahu-red-dark) 65%,
            var(--vahu-red-hover) 100%);

    --vahu-btn-delete-text: var(--vahu-text);
}