:root {
    /* Google Fonts & Spacing */
    --font-family: 'Roboto', 'Google Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    --font-brand: 'Outfit', 'Roboto', sans-serif;
    --border-radius-sm: 8px;
    --border-radius-md: 16px;
    --border-radius-lg: 24px;
    --border-radius-pill: 9999px;
    
    /* Layout Sizes */
    --header-height: 64px;
    --sidebar-width: 256px;
    --minibar-width: 72px;
}

/* Light Theme Variables */
.light-theme {
    --bg-canvas: #f6f8fc;
    --bg-surface: #ffffff;
    --bg-sidebar: #f6f8fc;
    --bg-active-pill: #d3e3fd;
    --text-active-pill: #041e49;
    --hover-row: #f2f6fc;
    --selected-row: #e2ebf9;
    --border-color: #e0e4ec;
    --text-primary: #1f1f1f;
    --text-secondary: #5e5e5e;
    --text-muted: #80868b;
    --compose-bg: #c2e7ff;
    --compose-text: #001d35;
    --compose-hover: #b3dbf5;
    --accent-blue: #0b57d0;
    --accent-blue-hover: #0842a0;
    --header-btn-hover: #e8eaed;
    --shadow-sm: 0 1px 2px 0 rgba(60,64,67,0.3), 0 1px 3px 1px rgba(60,64,67,0.15);
    --shadow-md: 0 4px 8px 3px rgba(60,64,67,0.15), 0 1px 3px 0 rgba(60,64,67,0.3);
    
    /* Workspace loading animation colors */
    --loader-blue: #4285f4;
    --loader-red: #ea4335;
    --loader-yellow: #fbbc05;
    --loader-green: #34a853;
}

/* Dark Theme Variables */
.dark-theme {
    --bg-canvas: #111318;
    --bg-surface: #1e1f24;
    --bg-sidebar: #111318;
    --bg-active-pill: #004a77;
    --text-active-pill: #c2e7ff;
    --hover-row: #2a2b2f;
    --selected-row: #2f3b4e;
    --border-color: #31353d;
    --text-primary: #e3e3e3;
    --text-secondary: #c4c7c5;
    --text-muted: #8e918f;
    --compose-bg: #004a77;
    --compose-text: #c2e7ff;
    --compose-hover: #085a8a;
    --accent-blue: #a8c7fa;
    --accent-blue-hover: #8ab4f8;
    --header-btn-hover: #303134;
    --shadow-sm: 0 1px 3px 0 rgba(0,0,0,0.3), 0 4px 8px 3px rgba(0,0,0,0.15);
    --shadow-md: 0 6px 10px 4px rgba(0,0,0,0.3), 0 2px 3px 0 rgba(0,0,0,0.3);
    
    /* Workspace loading animation colors */
    --loader-blue: #8ab4f8;
    --loader-red: #f28b82;
    --loader-yellow: #fdd663;
    --loader-green: #81c995;
}

/* Weed Theme Variables */
.weed-theme {
    --bg-canvas: #0b120c;
    --bg-surface: #121c13;
    --bg-sidebar: #0b120c;
    --bg-active-pill: #1f4227;
    --text-active-pill: #a8e5b4;
    --hover-row: #1b2d1e;
    --selected-row: #253e2a;
    --border-color: #243828;
    --text-primary: #e6f3e8;
    --text-secondary: #9cbca4;
    --text-muted: #6b8d74;
    --compose-bg: #2d6a3f;
    --compose-text: #ffffff;
    --compose-hover: #40916c;
    --accent-blue: #52b788;
    --accent-blue-hover: #74c69d;
    --header-btn-hover: #1f3323;
    --shadow-sm: 0 1px 3px 0 rgba(0,0,0,0.5), 0 4px 8px 3px rgba(0,0,0,0.3);
    --shadow-md: 0 6px 10px 4px rgba(0,0,0,0.5), 0 2px 3px 0 rgba(0,0,0,0.5);
    
    /* Workspace loading animation colors (Greens & Gold) */
    --loader-blue: #2d6a3f;
    --loader-red: #40916c;
    --loader-yellow: #a8e5b4;
    --loader-green: #e5c158;
}
