/*
Theme Name: Affvidco Child
Theme URI: https://vidcogroup.com/
Description: Child theme for Affvidco Theme. Editorial Indigo & Gold palette on cool slate — visually distinct from the warm Teal+Coral parent.
Author: Vidco Team
Author URI: https://vidcogroup.com/
Template: affvidco
Version: 1.0.1
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: affiliatecms-child
*/

/* ==========================================================================
   Affvidco Child — Editorial Indigo Theme
   Override parent design tokens. Higher specificity not needed since the
   stylesheet is enqueued AFTER the parent (see functions.php).
   ========================================================================== */

:root {
    /* Primary — Royal Indigo (replaces parent Teal) */
    --color-primary: #4F46E5;
    --color-primary-hover: #4338CA;
    --color-primary-dark: #3730A3;
    --color-primary-light: #EEF2FF;
    --color-primary-rgb: 79, 70, 229;

    /* Accent — Amber Gold (replaces parent Coral) */
    --color-accent: #F59E0B;
    --color-accent-hover: #D97706;
    --color-accent-light: #FEF3C7;

    /* Neutrals — Cool slate (replaces warm beige) */
    --color-text: #0F172A;
    --color-text-secondary: #334155;
    --color-text-muted: #64748B;
    --color-text-subtle: #94A3B8;

    /* Surfaces — Cool off-white with subtle blue undertone */
    --color-bg: #F8FAFC;
    --color-bg-alt: #F1F5F9;
    --color-surface: #FFFFFF;
    --color-surface-raised: #FFFFFF;
    --color-surface-hover: #F1F5F9;

    /* Borders — Cool gray */
    --color-border: #E2E8F0;
    --color-border-subtle: #EDF2F7;
    --color-border-strong: #CBD5E1;

    /* Overlay */
    --color-overlay: rgba(15, 23, 42, 0.55);

    /* Colored Shadows — Indigo + Amber tint */
    --shadow-primary: 0 4px 14px rgba(79, 70, 229, 0.22);
    --shadow-accent: 0 4px 14px rgba(245, 158, 11, 0.22);

    /* Tighter, editorial radii (parent feels softer) */
    --radius-sm: 0.125rem;  /* 2px */
    --radius-md: 0.25rem;   /* 4px */
    --radius-lg: 0.375rem;  /* 6px */
    --radius-xl: 0.5rem;    /* 8px */
    --radius-2xl: 0.75rem;  /* 12px */
    --radius-3xl: 1rem;     /* 16px */

    /* Editorial type — serif headings for differentiation */
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-serif: 'Playfair Display', Georgia, 'Times New Roman', serif;
}

/* Dark mode — Cool deep indigo night */
[data-theme="dark"] {
    --color-primary: #818CF8;
    --color-primary-hover: #A5B4FC;
    --color-primary-dark: #6366F1;
    --color-primary-light: rgba(129, 140, 248, 0.15);
    --color-primary-rgb: 129, 140, 248;

    --color-accent: #FCD34D;
    --color-accent-hover: #FBBF24;
    --color-accent-light: rgba(252, 211, 77, 0.15);

    --color-text: #F1F5F9;
    --color-text-secondary: #CBD5E1;
    --color-text-muted: #94A3B8;
    --color-text-subtle: #64748B;

    --color-bg: #0B1020;
    --color-bg-alt: #11172A;
    --color-surface: #161D33;
    --color-surface-raised: #1D2540;
    --color-surface-hover: #232C4A;

    --color-border: #2A3454;
    --color-border-subtle: #1E2742;
    --color-border-strong: #3A4670;

    --shadow-primary: 0 4px 14px rgba(129, 140, 248, 0.3);
    --shadow-accent: 0 4px 14px rgba(252, 211, 77, 0.28);
}

/* ==========================================================================
   Editorial Headings — Serif for h1-h3, sans for body
   Single load of Playfair Display from Google Fonts
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700;800&display=swap');

h1, h2, h3,
.site-title,
.entry-title,
.page-title {
    font-family: var(--font-serif);
    letter-spacing: var(--tracking-tight);
}

/* Subtle gradient underline on primary buttons for an editorial accent */
.btn-primary,
.button-primary,
button.acms-btn-primary {
    background-image: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    border: 0;
}

.btn-primary:hover,
.button-primary:hover,
button.acms-btn-primary:hover {
    background-image: linear-gradient(135deg, var(--color-primary-hover) 0%, var(--color-primary-dark) 100%);
    transform: translateY(-1px);
}

/* Hairline divider style — editorial magazine feel */
hr {
    border: 0;
    height: 1px;
    background-image: linear-gradient(90deg, transparent, var(--color-border-strong) 50%, transparent);
}