/* ==========================================================================
   Frontend Theme: Ocean  —  Teal / Sea Blue
   Overrides only the brand color tokens from main.css.
   Semantic colors (success/error/warning/info), typography, and spacing
   are intentionally left unchanged.
   ========================================================================== */

:root {
    /* Brand */
    --c-primary:        #1a7a8a;
    --c-primary-dark:   #0d5f6c;
    --c-primary-light:  #3d9dae;
    --c-primary-bg:     #e7f5f7;

    /* Gradients */
    --gradient-primary: linear-gradient(135deg, #1a7a8a 0%, #0d5f6c 100%);
    --gradient-hero:    linear-gradient(135deg, #0d5f6c 0%, #063e49 100%);

    /* Shadows (tinted to match new hue) */
    --shadow-sm:   0 1px 4px  rgba(10, 50, 55, 0.08);
    --shadow-md:   0 4px 16px rgba(10, 50, 55, 0.10);
    --shadow-lg:   0 8px 32px rgba(10, 50, 55, 0.12);
    --shadow-card: 0 4px 20px rgba(10, 50, 55, 0.08);

    /* Focus ring */
    --focus-ring: 0 0 0 3px rgba(26, 122, 138, 0.50);
}

/* Dark-mode variant */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --c-primary:       #3d9dae;
        --c-primary-dark:  #5bbdcc;
        --c-primary-light: #1a7a8a;
        --c-primary-bg:    #0a2830;
    }
}

[data-theme="dark"] {
    --c-primary:       #3d9dae;
    --c-primary-dark:  #5bbdcc;
    --c-primary-light: #1a7a8a;
    --c-primary-bg:    #0a2830;
}