/**
 * StudySphere Sage Green Theme Styles
 * Add this to any page that needs theme support
 * 
 * NEW COLOR PALETTE:
 * Main Color: #6d9886 (Sage Green)
 * Dark Theme Background: #0c1f16 (Deep Forest)
 * Light Theme Background: #f5f3f0 (Warm Cream)
 */

/* Base body transitions */
body {
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* ========================================
   GLOBAL FONT SIZE SETTINGS
   ======================================== */
body.font-small { font-size: 13px !important; }
body.font-medium { font-size: 14px !important; }
body.font-large { font-size: 16px !important; }
body.font-xlarge { font-size: 18px !important; }

/* ========================================
   REDUCE ANIMATIONS SETTING
   ======================================== */
body.reduce-animations,
body.reduce-animations * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
}

/* ========================================
   COMPACT SIDEBAR SETTING
   ======================================== */
body.compact-sidebar .sidebar {
    width: 60px !important;
}

body.compact-sidebar .sidebar:hover {
    width: 60px !important;
}

body.compact-sidebar .sidebar .app-name,
body.compact-sidebar .sidebar .profile-info,
body.compact-sidebar .sidebar .menu-label,
body.compact-sidebar .sidebar .footer-badge {
    display: none !important;
}

/* ========================================
   SAGE GREEN THEME - ACTIVE
   Main: #6d9886 | Dark BG: #0c1f16 | Light BG: #f5f3f0
   ======================================== */

body.light-theme {
    background: #f5f3f0 !important;
    color: #1a2e24 !important;
}

body.light-theme .sidebar {
    background: #FFFFFF !important;
    border-right-color: rgba(109, 152, 134, 0.2) !important;
}

body.light-theme .card,
body.light-theme .widget {
    background: #FFFFFF !important;
    border-color: rgba(109, 152, 134, 0.2) !important;
    color: #1a2e24 !important;
}

body.light-theme input,
body.light-theme textarea,
body.light-theme select {
    background: #FFFFFF !important;
    color: #1a2e24 !important;
    border-color: rgba(109, 152, 134, 0.2) !important;
}

body.light-theme button.btn-primary,
body.light-theme .btn-primary {
    background: linear-gradient(135deg, #6d9886, #4a6b5c) !important;
    color: white !important;
}

body.light-theme .accent-text {
    color: #6d9886 !important;
}

body.light-theme .text-secondary {
    color: #4a6b5c !important;
}