:root {
    /* Primary colors */
    --primary: #2D8C57;
    --primary-hover: #3A9A65;
    --primary-dark: #66A986;
    --primary-light: #8CBBA2;
    --primary-dark-20: #66A98633;
    --primary-dark-30: #66A9864D;
    /* Secondary colors */
    /* Status colors */
    --status-red: #dc3545;
    --status-error-main: #842029;
    --status-error-background: #f8d7da;
    --status-error-border: #f5c2c7;
    --status-error-shadow: #FEEEEF;
    --status-success-main: #0f5132;
    --status-success-background: #d1e7dd;
    --status-success-border: #badbcc;
    --status-warning-main: #664d03;
    --status-warning-background: #fff3cd;
    --status-warning-border: #ffecb5;
    --status-info-main: #055160;
    --status-info-background: #cff4fc;
    --status-info-border: #b6effb;
    /* Text colors */
    --text-primary: #333333;
    --text-secondary: #444444;
    /* Background colors */
    --bg-white: #ffffff;
    --bg-white-shadow: #00000008;
    --bg-gray: #efefef;
    --bg-light-gray: #f8f9fa;
    /* Border colors */
    --brd-gray: #efefef;
    --brd-dark: #c0c0c0;
    --divider: #efefef;
    --hover-gray: #E8E8E8;
    /* Border colors */
    --chart-green: #2D8C57;
    --chart-blue: #008FFB;
    --chart-orange: #FF9800;
    --chart-purple: #9C27B0;
    --chart-bluegray: #607D8B;
    --chart-red: #DC3545;
    /* Interactive element shadows */
    --shadow-hover-size: 0 0 0 3px;
    --shadow-focus-size: 0 0 0 3px;
    --shadow-active-size: 0 0 0 4px;
    /* Card shadows*/
    --card-shadow: 0 4px 6px rgba(0, 0, 0, 0.07);
    
}