/**
 * MagikTap Brand Color System
 * ===========================
 * MAGIK-535: Website Color Realignment
 * Date: 2026-02-20
 *
 * Derived from the MagikTap logo light blue (#5b9bd5),
 * refined for a modern SaaS aesthetic.
 *
 * Usage: Reference these custom properties throughout the theme.
 * Example: color: var(--mt-primary);
 */

:root {
    /* ─── Primary Blue ──────────────────────────── */
    --mt-primary:          #4A90D9;
    --mt-primary-dark:     #2E6DB5;
    --mt-primary-light:    #E8F1FB;
    --mt-primary-50:       #F0F6FD;
    --mt-primary-rgb:      74, 144, 217;

    /* ─── Accent (CTA Orange — retained) ────────── */
    --mt-accent:           #F26522;
    --mt-accent-dark:      #D95A1E;
    --mt-accent-rgb:       242, 101, 34;

    /* ─── Text ──────────────────────────────────── */
    --mt-text-dark:        #1A1A2E;
    --mt-text-default:     #3D3D5C;
    --mt-text-medium:      #6B6B8D;
    --mt-text-light:       #9B9BB0;

    /* ─── Borders ───────────────────────────────── */
    --mt-border:           #DDE3ED;
    --mt-border-light:     #EDF0F7;

    /* ─── Backgrounds ───────────────────────────── */
    --mt-bg:               #FFFFFF;
    --mt-bg-alt:           #F5F7FB;
    --mt-bg-accent:        #E8F1FB;
    --mt-bg-dark:          #1B2A4A;
    --mt-bg-footer:        #152238;
    --mt-dark-text:        #C5D5EA;

    /* ─── Semantic ──────────────────────────────── */
    --mt-success:          #22A06B;
    --mt-error:            #E53935;
    --mt-warning:          #F5A623;
    --mt-info:             #4A90D9;

    /* ─── Shadows ───────────────────────────────── */
    --mt-shadow-sm:        0 1px 3px rgba(0, 0, 0, 0.06);
    --mt-shadow-md:        0 4px 12px rgba(74, 144, 217, 0.15);
    --mt-shadow-lg:        0 8px 24px rgba(0, 0, 0, 0.08);
    --mt-shadow-btn:       0 2px 8px rgba(74, 144, 217, 0.25);
    --mt-shadow-btn-hover: 0 4px 12px rgba(46, 109, 181, 0.3);

    /* ─── Transitions ───────────────────────────── */
    --mt-transition:       0.2s ease;

    /* ─── Gradients ─────────────────────────────── */
    --mt-gradient-hero:    linear-gradient(135deg, #1B2A4A 0%, #243B5E 100%);
    --mt-gradient-light:   linear-gradient(180deg, #F5F7FB 0%, #E8F1FB 100%);
    --mt-gradient-btn:     linear-gradient(135deg, #4A90D9 0%, #5B9BD5 100%);
}