/*--------------------------------------------------------------
# AuthorPro Base Styles & Design Token System
# Description: CSS Custom Properties, Semantic Reset, and Typography
--------------------------------------------------------------*/

/* =============================================================
   1. Design Token System (:root)
   ============================================================= */
:root {
    /* --- Dynamic Customizer Colors (Defaults) --- */
    --authorpro-color-brand-600: #ea580c;
    --authorpro-color-brand-700: #c2410c;
    --authorpro-color-slate-900: #0f172a;
    --authorpro-color-slate-600: #475569;

    /* --- Static Palette System --- */
    --authorpro-color-brand-50: #fef2f2;
    --authorpro-color-brand-100: #fee2e2;
    --authorpro-color-brand-500: #ef4444;

    --authorpro-color-slate-50: #f8fafc;
    --authorpro-color-slate-100: #f1f5f9;
    --authorpro-color-slate-200: #e2e8f0;
    --authorpro-color-slate-300: #cbd5e1;
    --authorpro-color-slate-400: #94a3b8;
    --authorpro-color-slate-500: #64748b;
    --authorpro-color-slate-700: #334155;
    --authorpro-color-slate-800: #1e293b;

    --authorpro-color-white: #ffffff;
    --authorpro-color-black: #000000;

    /* --- Typography Tokens --- */
    --authorpro-font-heading: 'Libre Baskerville', serif;
    --authorpro-font-body: 'Inter', sans-serif;
    --authorpro-font-mono: 'JetBrains Mono', monospace;

    /* --- Layout & Dimensions --- */
    --authorpro-container-padding: 1.5rem;
    --authorpro-container-max-width: 1400px;
    --authorpro-content-size: 800px;
    --authorpro-wide-size: 1400px;

    /* --- Border Radius Scale --- */
    --authorpro-radius-xs: 0.125rem;   /* 2px */
    --authorpro-radius-sm: 0.25rem;    /* 4px */
    --authorpro-radius-md: 0.375rem;   /* 6px */
    --authorpro-radius-lg: 0.5rem;     /* 8px */
    --authorpro-radius-xl: 0.75rem;    /* 12px */
    --authorpro-radius-2xl: 1rem;      /* 16px */
    --authorpro-radius-3xl: 1.5rem;    /* 24px */
    --authorpro-radius-full: 9999px;

    /* --- Elevation & Shadows --- */
    --authorpro-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --authorpro-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --authorpro-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --authorpro-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --authorpro-shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
    --authorpro-shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);

    /* --- Transitions --- */
    --authorpro-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --authorpro-transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1);
    --authorpro-transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);

    /* =============================================================
       Backward Compatibility & Bridge Aliases
       ============================================================= */
    --color-brand-600: var(--authorpro-color-brand-600);
    --color-brand-700: var(--authorpro-color-brand-700);
    --color-brand-50: var(--authorpro-color-brand-50);
    --color-brand-100: var(--authorpro-color-brand-100);
    --color-brand-500: var(--authorpro-color-brand-500);
    --color-slate-50: var(--authorpro-color-slate-50);
    --color-slate-100: var(--authorpro-color-slate-100);
    --color-slate-200: var(--authorpro-color-slate-200);
    --color-slate-300: var(--authorpro-color-slate-300);
    --color-slate-400: var(--authorpro-color-slate-400);
    --color-slate-500: var(--authorpro-color-slate-500);
    --color-slate-600: var(--authorpro-color-slate-600);
    --color-slate-700: var(--authorpro-color-slate-700);
    --color-slate-800: var(--authorpro-color-slate-800);
    --color-slate-900: var(--authorpro-color-slate-900);
    --color-white: var(--authorpro-color-white);
    --color-black: var(--authorpro-color-black);

    --font-heading: var(--authorpro-font-heading);
    --font-body: var(--authorpro-font-body);
    --font-mono: var(--authorpro-font-mono);

    --content-size: var(--authorpro-content-size);
    --wide-size: var(--authorpro-wide-size);
    --wp--style--global--content-size: var(--authorpro-content-size);
    --wp--style--global--wide-size: var(--authorpro-wide-size);

    --radius-xs: var(--authorpro-radius-xs);
    --radius-sm: var(--authorpro-radius-sm);
    --radius-md: var(--authorpro-radius-md);
    --radius-lg: var(--authorpro-radius-lg);
    --radius-xl: var(--authorpro-radius-xl);
    --radius-2xl: var(--authorpro-radius-2xl);
    --radius-3xl: var(--authorpro-radius-3xl);
    --radius-full: var(--authorpro-radius-full);

    --shadow-sm: var(--authorpro-shadow-sm);
    --shadow-md: var(--authorpro-shadow-md);
    --shadow-lg: var(--authorpro-shadow-lg);
    --shadow-xl: var(--authorpro-shadow-xl);
    --shadow-2xl: var(--authorpro-shadow-2xl);
    --shadow-inner: var(--authorpro-shadow-inner);

    --transition-fast: var(--authorpro-transition-fast);
    --transition-base: var(--authorpro-transition-base);
    --transition-slow: var(--authorpro-transition-slow);

    /* Gutenberg Preset Bridges */
    --wp--preset--font-family--heading: var(--authorpro-font-heading);
    --wp--preset--font-family--body: var(--authorpro-font-body);
    --wp--preset--color--brand-600: var(--authorpro-color-brand-600);
    --wp--preset--color--brand-700: var(--authorpro-color-brand-700);
    --wp--preset--color--slate-900: var(--authorpro-color-slate-900);
    --wp--preset--color--slate-600: var(--authorpro-color-slate-600);
    --wp--preset--color--slate-50: var(--authorpro-color-slate-50);
    --wp--preset--color--white: var(--authorpro-color-white);
}

/* =============================================================
   2. Modern Semantic Reset
   ============================================================= */
*,
*::before,
*::after {
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color: var(--authorpro-color-slate-200);
}

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    max-width: 100%;
    overflow-x: hidden;
    position: relative;
}

body {
    margin: 0;
    padding: 0;
    line-height: 1.5;
    font-family: var(--authorpro-font-body);
    color: var(--authorpro-color-slate-800);
    background-color: var(--authorpro-color-white);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    max-width: 100%;
    overflow-x: hidden;
    position: relative;
}

/* =============================================================
   3. Global Typography Defaults & Zero-Specificity Editorial Engine
   ============================================================= */
h1, h2, h3, h4, h5, h6,
.authorpro-heading {
    font-family: var(--authorpro-font-heading);
    color: var(--authorpro-color-slate-900);
    margin-top: 0;
    margin-bottom: 0.5rem;
    font-weight: 700;
    line-height: 1.25;
}

.authorpro-body-font {
    font-family: var(--authorpro-font-body);
}

.authorpro-mono-font {
    font-family: var(--authorpro-font-mono);
}

.authorpro-font-bold {
    font-weight: 700;
}

p {
    margin-top: 0;
    margin-bottom: 1rem;
}

p:last-child {
    margin-bottom: 0;
}

a {
    color: inherit;
    text-decoration: none;
    transition: color var(--authorpro-transition-base), background-color var(--authorpro-transition-base), border-color var(--authorpro-transition-base);
}

hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
    border-color: var(--authorpro-color-slate-200);
    margin: 2rem 0;
}

/* -------------------------------------------------------------
   3.1 Zero-Specificity Content Typography (.entry-content, .authorpro-entry-content)
   ------------------------------------------------------------- */
/* Headings (h1 - h6) */
.authorpro-entry-content :where(h1, h2, h3, h4, h5, h6),
.entry-content :where(h1, h2, h3, h4, h5, h6) {
    font-family: var(--authorpro-font-heading);
    color: var(--authorpro-color-slate-900, #0f172a);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.015em;
}

.authorpro-entry-content :where(h1),
.entry-content :where(h1) {
    font-size: 2.25rem;
    margin-top: 2.5rem;
    margin-bottom: 1.25rem;
}

.authorpro-entry-content :where(h2),
.entry-content :where(h2) {
    font-size: 1.875rem;
    margin-top: 2.25rem;
    margin-bottom: 1rem;
}

.authorpro-entry-content :where(h3),
.entry-content :where(h3) {
    font-size: 1.5rem;
    margin-top: 2rem;
    margin-bottom: 0.875rem;
}

.authorpro-entry-content :where(h4),
.entry-content :where(h4) {
    font-size: 1.25rem;
    margin-top: 1.75rem;
    margin-bottom: 0.75rem;
}

.authorpro-entry-content :where(h5),
.entry-content :where(h5) {
    font-size: 1.125rem;
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
}

.authorpro-entry-content :where(h6),
.entry-content :where(h6) {
    font-size: 1rem;
    margin-top: 1.25rem;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.authorpro-entry-content > :where(h1, h2, h3, h4, h5, h6):first-child,
.entry-content > :where(h1, h2, h3, h4, h5, h6):first-child {
    margin-top: 0;
}

/* Paragraphs & Narrative Flow */
.authorpro-entry-content :where(p),
.entry-content :where(p) {
    font-family: var(--authorpro-font-body);
    color: var(--authorpro-color-slate-700, #334155);
    font-size: 1.125rem;
    line-height: 1.8;
    margin-top: 0;
    margin-bottom: 1.75rem;
}

.authorpro-entry-content > :where(p):last-child,
.entry-content > :where(p):last-child {
    margin-bottom: 0;
}

.authorpro-entry-content :where(.is-style-lead),
.entry-content :where(.is-style-lead) {
    font-size: 1.25rem;
    line-height: 1.7;
    color: var(--authorpro-color-slate-800, #1e293b);
}

/* Excerpts & Summaries */
.authorpro-card-excerpt :where(p),
.authorpro-search-excerpt :where(p),
.entry-summary :where(p) {
    font-family: var(--authorpro-font-body);
    color: var(--authorpro-color-slate-600, #475569);
    font-size: 0.9375rem;
    line-height: 1.6;
    margin: 0;
}

/* Links inside Content & Editor Canvas */
.authorpro-entry-content :where(a),
.entry-content :where(a),
.editor-styles-wrapper :where(a) {
    color: var(--authorpro-color-brand-600);
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: color var(--authorpro-transition-fast);
}

.authorpro-entry-content :where(a:hover),
.entry-content :where(a:hover),
.editor-styles-wrapper :where(a:hover),
.editor-styles-wrapper :where(a:focus) {
    color: var(--authorpro-color-brand-700);
}

/* Literary Drop Caps */
.authorpro-entry-content :where(.has-drop-cap:not(:focus)::first-letter),
.entry-content :where(.has-drop-cap:not(:focus)::first-letter) {
    font-family: var(--authorpro-font-heading);
    font-size: 4.5rem;
    line-height: 0.85;
    float: left;
    margin: 0.25rem 0.75rem 0 0;
    color: var(--authorpro-color-brand-600);
    font-weight: 700;
}

/* Blockquotes & Editorial Citations */
.authorpro-entry-content :where(blockquote, .wp-block-quote),
.entry-content :where(blockquote, .wp-block-quote) {
    border-left: 3px solid var(--authorpro-color-brand-600);
    padding-left: 1.5rem;
    margin: 2rem 0;
    font-style: italic;
    color: var(--authorpro-color-slate-800, #1e293b);
    line-height: 1.7;
    font-size: 1.125rem;
    background-color: transparent;
}

.authorpro-entry-content :where(blockquote p, .wp-block-quote p),
.entry-content :where(blockquote p, .wp-block-quote p) {
    margin-bottom: 0.75rem;
}

.authorpro-entry-content :where(blockquote cite, .wp-block-quote cite),
.entry-content :where(blockquote cite, .wp-block-quote cite) {
    display: block;
    margin-top: 0.75rem;
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 600;
    color: var(--authorpro-color-slate-500, #64748b);
}

/* Hierarchical Lists */
.authorpro-entry-content :where(ul, ol),
.entry-content :where(ul, ol) {
    padding-left: 1.75rem;
    margin-top: 0;
    margin-bottom: 1.75rem;
    line-height: 1.75;
    color: var(--authorpro-color-slate-700, #334155);
    font-size: 1.125rem;
}

.authorpro-entry-content :where(li),
.entry-content :where(li) {
    margin-bottom: 0.5rem;
}

.authorpro-entry-content :where(li:last-child),
.entry-content :where(li:last-child) {
    margin-bottom: 0;
}

.authorpro-entry-content :where(ul),
.entry-content :where(ul) {
    list-style-type: disc;
}

.authorpro-entry-content :where(ul ul),
.entry-content :where(ul ul) {
    list-style-type: circle;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.authorpro-entry-content :where(ul ul ul),
.entry-content :where(ul ul ul) {
    list-style-type: square;
}

.authorpro-entry-content :where(ol),
.entry-content :where(ol) {
    list-style-type: decimal;
}

.authorpro-entry-content :where(ol ol),
.entry-content :where(ol ol) {
    list-style-type: lower-alpha;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.authorpro-entry-content :where(ol ol ol),
.entry-content :where(ol ol ol) {
    list-style-type: lower-roman;
}

/* Definition Lists */
.authorpro-entry-content :where(dl),
.entry-content :where(dl) {
    margin-bottom: 1.75rem;
    line-height: 1.7;
}

.authorpro-entry-content :where(dt),
.entry-content :where(dt) {
    font-weight: 700;
    color: var(--authorpro-color-slate-900, #0f172a);
    margin-top: 1rem;
}

.authorpro-entry-content :where(dd),
.entry-content :where(dd) {
    margin-left: 1.5rem;
    margin-bottom: 0.5rem;
    color: var(--authorpro-color-slate-700, #334155);
}

/* Tables & Data */
.authorpro-entry-content :where(table, .wp-block-table),
.entry-content :where(table, .wp-block-table) {
    width: 100%;
    border-collapse: collapse;
    margin: 2rem 0;
    font-size: 0.9375rem;
}

.authorpro-entry-content :where(th),
.entry-content :where(th) {
    background-color: var(--authorpro-color-slate-50, #f8fafc);
    font-weight: 600;
    color: var(--authorpro-color-slate-900, #0f172a);
    text-align: left;
    padding: 0.75rem 1rem;
    border: 1px solid var(--authorpro-color-slate-200, #e2e8f0);
}

.authorpro-entry-content :where(td),
.entry-content :where(td) {
    padding: 0.75rem 1rem;
    border: 1px solid var(--authorpro-color-slate-200, #e2e8f0);
    color: var(--authorpro-color-slate-700, #334155);
}

.authorpro-entry-content :where(tr:nth-child(even) td),
.entry-content :where(tr:nth-child(even) td) {
    background-color: rgba(248, 250, 252, 0.5);
}

/* Figures, Images & Captions */
.authorpro-entry-content :where(figure),
.entry-content :where(figure) {
    margin: 2rem 0;
}

.authorpro-entry-content :where(img),
.entry-content :where(img) {
    max-width: 100%;
    height: auto;
}

.authorpro-entry-content :where(figcaption),
.entry-content :where(figcaption) {
    font-size: 0.875rem;
    color: var(--authorpro-color-slate-500, #64748b);
    text-align: center;
    font-style: italic;
    margin-top: 0.75rem;
    line-height: 1.5;
}

/* Semantic Inlines & Code */
.authorpro-entry-content :where(code),
.entry-content :where(code) {
    font-family: var(--authorpro-font-mono);
    font-size: 0.875em;
    padding: 0.2rem 0.4rem;
    background-color: var(--authorpro-color-slate-100, #f1f5f9);
    color: var(--authorpro-color-slate-900, #0f172a);
    border-radius: var(--authorpro-radius-sm, 0.25rem);
}

.authorpro-entry-content :where(pre),
.entry-content :where(pre) {
    padding: 1.25rem;
    background-color: var(--authorpro-color-slate-900, #0f172a);
    color: #f8fafc;
    border-radius: var(--authorpro-radius-md, 0.375rem);
    overflow-x: auto;
    font-family: var(--authorpro-font-mono);
    font-size: 0.875rem;
    line-height: 1.6;
    margin: 2rem 0;
}

.authorpro-entry-content :where(pre code),
.entry-content :where(pre code) {
    background: transparent;
    color: inherit;
    padding: 0;
    font-size: inherit;
}

.authorpro-entry-content :where(mark),
.entry-content :where(mark) {
    background-color: #fef08a;
    color: #854d0e;
    padding: 0.1rem 0.35rem;
    border-radius: 2px;
}

.authorpro-entry-content :where(kbd),
.entry-content :where(kbd) {
    font-family: var(--authorpro-font-mono);
    font-size: 0.8125rem;
    padding: 0.15rem 0.4rem;
    background-color: var(--authorpro-color-slate-100);
    border: 1px solid var(--authorpro-color-slate-300);
    border-radius: 3px;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
}

.authorpro-entry-content :where(abbr[title]),
.entry-content :where(abbr[title]) {
    text-decoration: underline dotted;
    cursor: help;
}

.authorpro-entry-content :where(hr, .wp-block-separator),
.entry-content :where(hr, .wp-block-separator) {
    border: 0;
    border-top: 1px solid var(--authorpro-color-slate-200);
    margin: 3rem auto;
    max-width: 120px;
}

/* =============================================================
   4. Media Elements & Embeds
   ============================================================= */
img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
    display: block;
    vertical-align: middle;
    max-width: 100%;
    height: auto;
}

/* =============================================================
   5. Form Controls & Inputs Reset
   ============================================================= */
button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
    margin: 0;
    padding: 0;
}

button,
select {
    text-transform: none;
}

button,
[type='button'],
[type='reset'],
[type='submit'] {
    -webkit-appearance: button;
    background-color: transparent;
    background-image: none;
    cursor: pointer;
}

input[type="search"],
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea,
select {
    border: 1px solid var(--authorpro-color-slate-300);
    border-radius: var(--authorpro-radius-md);
    padding: 0.5rem 0.75rem;
    background-color: var(--authorpro-color-white);
    color: var(--authorpro-color-slate-900);
    outline: none;
    transition: border-color var(--authorpro-transition-fast), box-shadow var(--authorpro-transition-fast);
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--authorpro-color-brand-600);
    box-shadow: 0 0 0 2px rgba(234, 88, 12, 0.2);
}

/* =============================================================
   6. Accessibility & State Helpers
   ============================================================= */
.screen-reader-text,
.authorpro-sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.screen-reader-text:focus,
.authorpro-sr-only:focus {
    position: static !important;
    width: auto !important;
    height: auto !important;
    padding: 0.75rem 1.25rem !important;
    margin: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
    z-index: 100000 !important;
}

.authorpro-hidden {
    display: none !important;
}

.authorpro-visible {
    visibility: visible !important;
}

.authorpro-invisible {
    visibility: hidden !important;
}

.authorpro-opacity-0 {
    opacity: 0 !important;
}

.authorpro-opacity-100 {
    opacity: 1 !important;
}

.authorpro-scale-95 {
    transform: scale(0.95) !important;
}

.authorpro-scale-100 {
    transform: scale(1) !important;
}

.authorpro-rotate-180 {
    transform: rotate(180deg) !important;
}
