/* ============================================================
   DARK GOLD THEME
   Replace this file (or swap the @import in globals.css)
   to change the entire color palette without touching any
   TypeScript or component files.
   ============================================================ */
:root {
    /* --- Brand palette --- */
    --color-1-opacity:       20 20 20;
    --color-1:               #141414;
    --color-2:               #6B4919;
    --color-3-opacity:       0 0 0;
    --color-3:               #000000;
    --color-4-opacity:       255 255 255;
    --color-4:               #FFFFFF;
    --color-5-opacity:       207 175 123;
    --color-5:               #CFAF7B;
    --color-6:               #332503;
    --color-7-opacity:       22 21 21;
    --color-7:               #161515;
    --color-8:               #E2B655;
    --color-9-opacity:       107 73 5;
    --color-9:               #6B4905;
    --color-10-opacity:      23 19 6;
    --color-10:              #171306; /* Primary text */
    --color-11:              #121211; /* Form text */
    --color-12:              #6D4B06; /* Form Text */
    --color-13:              #252320; /* Dropdown */
    --color-14:              #1D1302; /* Icon */
    --color-15-opacity:      19 16 11;
    --color-15:              #13100B; /* Sidemenu 2 */
    --color-16-opacity:      26 25 24;
    --color-16:              #1A1917; /* bg category | Card */
    --color-17-opacity:      192 138 31;
    --color-17:              #C08A1F; /* Label */
    --color-18:              #151108; /* Form Text */
    --color-19-opacity:      26 25 24; /* BG Popup */
    --color-19:              #1A1918; /* BG Popup */
    --color-20:              #262626; /* Outline Popup */
    --color-21-opacity:      17 17 17;
    --color-21:              #111111;
    --color-22:              #FD3C3C; /* Text Error */
    --color-23:              #2DEC07; /* Text Success */
    --color-24:              #FFBC20; /* Text Validation */
    --color-25:              #EE0000; /* Required Remark */
    --color-26:              #E39D00; /* Button Primary */
    --color-27:              #B07900; /* Button Disable */
    --color-28:              #0F0B02; /* Button Secondary */
    --color-29-opacity:      44 43 38;
    --color-29:              #2C2B26; /* Button Secondary */

    /* --- Semantic colors --- */
    --primary:               #6B4905;
    --secondary:             #FBB314;
    --success:               #6FF082;
    --pending:               #FEB944;
    /* can't delete it because it's used in lib as well */
    --rejected:              #FB3E63;

    /* --- Gradients --- */
    --gradient-primary:         linear-gradient(180deg, rgb(var(--color-9-opacity) / 0) 0%, var(--color-9) 100%);
    --gradient-down:    linear-gradient(180deg, var(--color-9) 0%, rgb(var(--color-9-opacity) / 0) 100%);
    --gradient-sidebar:    linear-gradient(187.1deg, var(--color-15) 9.54%, var(--color-7) 136.69%);
    --search-dropdown:       linear-gradient(131.62deg, var(--color-17) 17.04%, rgb(var(--color-17-opacity) / 0) 54.06%);
    --gradient-to-br:   linear-gradient(139.34deg, var(--color-9) 11.03%, rgb(var(--color-9-opacity) / 0) 51.24%);
    --custom-gradient:       linear-gradient(63.37deg, var(--color-8) 34.38%, var(--color-27) 137.45%);
    --radial-primary:   radial-gradient(ellipse 110% 58% at 50% 0%, rgb(var(--color-9-opacity) / 0.32) 0%, transparent 70%);
    --gradient-see-all:   linear-gradient(180deg, rgb(var(--color-9-opacity) / 0) 0%, var(--color-9) 100%);
    --gradient-verify-whatsapp: linear-gradient(76.32deg, rgb(var(--color-9-opacity) / 0.48) 12.6%, rgb(var(--color-9-opacity) / 0) 51.19%);
    --gradient-card-smartico: linear-gradient(180deg, var(--color-29) -0.29%, var(--color-1) 100.18%);
    --gradient-card-smartico-hover: linear-gradient(360deg, var(--color-2) -0.18%, var(--color-29) 100.29%);
    --gradient-card-smartico-home: linear-gradient(180deg, var(--color-29) 0%, var(--color-1) 100%);
}