/**
 * MyVdo brand theme — shared across admin & user portals
 * Colors extracted from official logo (teal + charcoal on white)
 */
:root {
    --brand-teal: #00C897;
    --brand-teal-hover: #00B386;
    --brand-teal-dark: #009E73;
    --brand-teal-light: rgba(0, 200, 151, 0.12);
    --brand-teal-glow: rgba(0, 200, 151, 0.25);

    --brand-charcoal: #1F2124;
    --brand-charcoal-soft: #2D3136;
    --brand-charcoal-muted: #4B5563;

    --brand-white: #FFFFFF;
    --brand-bg: #F4F7F6;
    --brand-surface: #FFFFFF;
    --brand-surface-elevated: #FFFFFF;
    --brand-border: #E2E8E6;
    --brand-border-strong: #CBD5D1;

    --brand-text: #1F2124;
    --brand-text-muted: #6B7280;
    --brand-text-light: #9CA3AF;

    --brand-danger: #DC2626;
    --brand-danger-hover: #B91C1C;
    --brand-success: #00C897;
    --brand-warning: #D97706;

    --brand-radius: 10px;
    --brand-radius-sm: 6px;
    --brand-shadow: 0 4px 24px rgba(31, 33, 36, 0.08);
    --brand-shadow-lg: 0 12px 40px rgba(31, 33, 36, 0.12);
    --brand-font: 'Segoe UI', -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif;
    --brand-nav-h: 64px;
}

/* Logo */
.brand-logo-img {
    height: 36px;
    width: auto;
    display: block;
}

.brand-logo-img-lg {
    height: 48px;
}

.brand-logo-text {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--brand-charcoal);
    letter-spacing: -0.5px;
}

.brand-logo-text span { color: var(--brand-teal); }