:root {
    /* Primary Colors - Loaded from SiteConfiguration */
    --primary-color: #6ccf7f;
    --primary-hover: #4fae63;
    --secondary-color: #a8e6c2;
    --secondary-hover: #8fd9b0;
    
    /* Text Colors */
    --text-color: #2f5e3b;
    --text-secondary: #5f7f6a;
    --text-on-primary: #ffffff;
    
    /* Background Colors */
    --background-color: #F6FBF7;
    --card-background-color: #FFFFFF;
    --border-color: #7ed89a;
    
    /* Status Colors */
    --status-success: #48BB78;
    --status-warning: #F6E05E;
    --status-danger: #F56565;
    --status-info: #4299E1;
    
    /* UI Elements */
    --btn-primary-inactive: #d9f2e3;
    --signup-bar-bg-color: #FFD700;
    
    /* Star/Rating Color */
    --star-color: #FFD700;
    
    /* Derived colors based on primary */
    --btn-primary-active: #6ccf7f;
    --btn-primary-active-border: #6ccf7f;
    --btn-primary-active-header: #4fae63;
    
    /* Transparencies */
    --primary-color-light-transparent: rgba(108,207,127, 0.3);
    --primary-color-dark-transparent: rgba(108,207,127, 0.6);
    --primary-shadow-color: rgba(108,207,127, 0.4);
    
    /* Keep other CSS variables from main.css */
    --white: #fff;
    --transparent: transparent;
    --card-background-light-transparent: rgba(255, 255, 255, 0.8);
    --card-background-mid-transparent: rgba(255, 255, 255, 0.50);
    --card-background-dark-transparent: rgba(255, 255, 255, 0.95);
    --black-shadow-light: rgba(0, 0, 0, 0.05);
    --toast-shadow: rgba(0, 0, 0, 0.15);
    --thead-background-color: #F7FAFC;
    --card-image-background: #F7FAFC;
    --disable-color: #F56565;
}