/*
  dl-ca-entry.css - sitewide stylesheet for Daily CA article components.

  Replaces the per-post inline <style> block that was previously shipped in
  every CA article's post_content (~8.7 KB each). At 15000 pages that was
  ~130 MB of repeated CSS in HTML responses. Centralising here saves the
  storage + serves a single cached file per origin.

  Loaded conditionally via inc/dl-modern-loader.php on:
    is_singular('current_affairs')

  Component roster:
    .dl-ca-entry           article shell
    .dl-ca-header          title-area block
    .dl-ca-meta / -tag     small meta strip (date · topic · tags)
    .dl-ca-title           inline h1 (deprecated for new CA - theme h1 is used)
    .dl-ca-deck            italic intro
    .dl-ca-pull-quote      blockquote with terracotta rule
    .dl-ca-section h2      sentence-case section title
    .dl-ca-channel-card    4-tile grid for transmission channels
    .dl-ca-timeline-item   horizontal timeline beats
    .dl-ca-data-table      numeric summary table
    .dl-ca-upsc dl/dt/dd   syllabus mapping
    .dl-ca-prelims li      bullet list with terracotta middot
    .dl-ca-gaps            dashed-bordered scope-limit note
    .dl-ca-sources         footer source list
    .dl-ca-disclaimer      short editorial disclaimer
    .dl-ca-figure          inline brand SVG figures
    .dl-ca-disclaimer-heading  <h3>Disclaimer</h3> label

  Locked 2026-05-11 per feedback_css_scale_15000_pages.md.
*/

/* Constrain the Astra container on CA pages to match blog posts. Astra
   assigns the wider `normal` content layout (1240px container) to the
   current_affairs CPT by default, whereas single posts use the narrower
   850px "content-boxed" layout. Force parity here so CA articles read
   at the same column width as blog posts (714px content). 2026-05-11. */
body.single-current_affairs .ast-container {
    max-width: 850px;
}

.dl-ca-entry {
    /* Article shell - body-substitute when post_content renders inside WP.
       Inherits column width from .entry-content (now 714px via the
       container override above), matching blog posts exactly. */
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 0 96px;
    font-family: 'Georgia', 'Charter', serif;
    color: var(--dl-ink, #1a1714);
    background: transparent;
    line-height: 1.65;
    font-size: 18px;
}

/* Body type (paragraph + lists) reads at 17px on the wider CA column for
   comfortable line length. Headings + tables retain their sizes. */
.dl-ca-entry > p,
.dl-ca-section > p,
.dl-ca-section > ul,
.dl-ca-section > ol,
.dl-ca-section > ul li,
.dl-ca-section > ol li {
    font-size: 17px;
}

/* Context badge on CA pages: solid ink pill with terracotta accent text,
   single "CURRENT AFFAIRS" label (sub-subject hidden - redundant with
   the article body context). Distinct from the soft terracotta-tint pill
   used on blog posts where subject + sub-subject convey real navigation
   info. 2026-05-11 per user direction. */
body.single-current_affairs .dl-context-badge {
    display: inline-flex;
    align-items: center;
    background: var(--dl-ink, #1a1714);
    border: 0;
    border-radius: 4px;
    padding: 8px 14px;
    margin: 0 0 28px;
    box-shadow: none;
}
body.single-current_affairs .dl-context-badge .dl-context-subject {
    color: #ffffff;
    font-size: 11.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
}
body.single-current_affairs .dl-context-badge .dl-context-subsubject,
body.single-current_affairs .dl-context-badge .dl-context-sep {
    display: none;
}

/* Featured image at the top of every CA article. Prepended via the
   canonical dl-featured-image.php filter on the current_affairs CPT
   (extended 2026-05-11 to cover CA alongside `post`). dl-blog-post.css
   only enqueues on `post` type so we mirror the same hero treatment
   here for parity. */
body.single-current_affairs .dl-featured-image {
    display: block;
    width: 100%;
    margin: 0 auto 36px;
    padding: 0;
    line-height: 0;
    border-radius: 6px;
    overflow: hidden;
    background: var(--dl-cream-soft, #ede5d4);
    box-shadow: 0 4px 14px rgba(20,18,16,0.06);
}
body.single-current_affairs .dl-featured-image img,
body.single-current_affairs .dl-featured-image .dl-featured-image-img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 6px;
}

.dl-ca-header {
    border-bottom: 1px solid var(--dl-rule-strong, rgba(26, 23, 20, 0.22));
    padding-bottom: 28px;
    margin-bottom: 36px;
}
.dl-ca-meta {
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 13px;
    color: var(--dl-text-muted, #2a2520);
    margin-bottom: 18px;
}
.dl-ca-date { font-weight: 600; color: var(--dl-ink, #1a1714); }
.dl-ca-divider { color: var(--dl-rule-strong, rgba(26, 23, 20, 0.22)); margin: 0 8px; }
.dl-ca-tag {
    display: inline-block; margin-left: 4px; padding: 2px 9px;
    border: 1px solid var(--dl-rule-strong, rgba(26, 23, 20, 0.22));
    border-radius: 3px;
    font-size: 12px;
    color: var(--dl-terracotta, #E63946); background: transparent;
}
.dl-ca-title {
    font-size: 30px; font-weight: 700; line-height: 1.18;
    margin: 0 0 16px; letter-spacing: -0.01em;
    color: var(--dl-ink, #1a1714);
}
.dl-ca-deck {
    font-size: 19px; line-height: 1.55;
    color: var(--dl-ink-soft, #2a2520); margin: 0; font-style: italic;
}

.dl-ca-pull-quote {
    border-left: 4px solid var(--dl-terracotta, #E63946);
    padding: 8px 0 8px 22px; margin: 36px 0;
    font-size: 19px; line-height: 1.55; color: var(--dl-ink, #1a1714);
}
.dl-ca-pull-quote p { margin: 0 0 10px; }
.dl-ca-pull-quote cite {
    display: block; font-style: normal;
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 13px; color: var(--dl-ink-soft, #2a2520);
    letter-spacing: 0.02em;
}

.dl-ca-section { margin: 44px 0; }
.dl-ca-section h2 {
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 20px; font-weight: 600; line-height: 1.32;
    letter-spacing: -0.005em; color: var(--dl-ink, #1a1714);
    margin: 0 0 14px; padding-bottom: 8px;
    border-bottom: 1px solid var(--dl-rule, rgba(26, 23, 20, 0.12));
}
.dl-ca-section p { margin: 0 0 16px; }
.dl-ca-section blockquote {
    margin: 12px 0; padding: 4px 0 4px 18px;
    border-left: 2px solid var(--dl-rule-strong, rgba(26, 23, 20, 0.22));
    font-style: italic; color: var(--dl-ink-soft, #2a2520);
}
.dl-ca-note {
    font-size: 15px; color: var(--dl-ink-soft, #2a2520);
    font-style: italic; margin-bottom: 22px;
}

.dl-ca-channel-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px; margin-top: 14px;
}
.dl-ca-channel-card {
    background: var(--dl-cream-soft, #ede5d4);
    border: 1px solid var(--dl-rule, rgba(26, 23, 20, 0.12));
    border-radius: 4px; padding: 16px 18px;
}
.dl-ca-channel-card h3 {
    margin: 0 0 8px;
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 14px; font-weight: 600;
    color: var(--dl-terracotta, #E63946);
}
.dl-ca-channel-card p { margin: 0 0 6px; font-size: 15px; line-height: 1.5; }
.dl-ca-channel-card p:last-child { margin-bottom: 0; }

.dl-ca-timeline { margin-top: 14px; }
.dl-ca-timeline-item {
    background: var(--dl-cream-soft, #ede5d4);
    border-top: 3px solid var(--dl-terracotta, #E63946);
    padding: 20px 24px; margin-bottom: 16px;
    border-radius: 0 0 4px 4px;
}
.dl-ca-timeline-date {
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 13px; font-weight: 600;
    color: var(--dl-ink-soft, #2a2520); margin: 0 0 6px;
}
.dl-ca-timeline-item h3 { margin: 0 0 10px; font-size: 17px; color: var(--dl-ink, #1a1714); }
.dl-ca-timeline-item p { margin: 0 0 10px; line-height: 1.6; font-size: 16px; }
.dl-ca-timeline-item p:last-child { margin-bottom: 0; }

/* Data tables. Body cells inherit the article serif (Georgia) so the
   table reads as part of the article copy rather than a sans-serif
   sidebar widget. Headers remain Inter-uppercase (editorial eyebrow
   convention). Numeric column keeps tabular-nums for column alignment.
   Mobile-safe: horizontal scroll fallback when the table is wider than
   the column, no clipped cells. 2026-05-11. */
.dl-ca-data-table-wrap,
.dl-ca-data-table {
    width: 100%;
    max-width: 100%;
}
body.dl-modern .dl-ca-data-table,
.dl-ca-data-table {
    border-collapse: collapse;
    margin: 14px 0 0;
    font-family: inherit;
    font-size: 15px;
    table-layout: auto;
    color: var(--dl-ink, #1a1714);
}
.dl-ca-data-table th, .dl-ca-data-table td {
    text-align: left;
    padding: 10px 12px;
    border-bottom: 1px solid var(--dl-rule, rgba(26, 23, 20, 0.12));
    vertical-align: top;
    overflow-wrap: break-word;
    word-break: normal;
}
.dl-ca-data-table th {
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--dl-text-muted, #2a2520);
    border-bottom: 2px solid var(--dl-rule-strong, rgba(26, 23, 20, 0.22));
}
.dl-ca-data-table td.num {
    font-variant-numeric: tabular-nums;
    text-align: right;
    color: var(--dl-ink, #1a1714);
}

/* Mobile: shrink type + padding. Wrap the table in horizontal scroll
   when its natural width exceeds the column - preserves word integrity
   instead of forcing mid-word breaks. */
@media (max-width: 600px) {
    .dl-ca-data-table {
        font-size: 14px;
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        max-width: 100%;
    }
    .dl-ca-data-table th, .dl-ca-data-table td {
        padding: 8px 10px;
        white-space: normal;
    }
}

.dl-ca-data-source {
    font-size: 13px;
    color: var(--dl-text-muted, #2a2520);
    margin-top: 10px;
    font-family: inherit;
    font-style: italic;
}

.dl-ca-upsc dl { margin: 14px 0 0; }
.dl-ca-upsc dt {
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 14px; font-weight: 600;
    color: var(--dl-terracotta, #E63946); margin: 16px 0 6px;
}
.dl-ca-upsc dt:first-child { margin-top: 0; }
.dl-ca-upsc dd { margin: 0; line-height: 1.55; }

/* Both `<ul class="dl-ca-prelims">` (current markup) and
   `<div class="dl-ca-prelims"><ul>...` (legacy) are covered.
   Without this fix the default `<ul>` disc bullet rendered alongside the
   ::before terracotta middot - the user-reported "double bullet". */
ul.dl-ca-prelims,
.dl-ca-prelims ul,
.dl-ca-prelims { list-style: none; padding: 0; margin: 14px 0 0; }
.dl-ca-prelims li {
    padding: 10px 0 10px 22px;
    border-bottom: 1px solid var(--dl-rule, rgba(26, 23, 20, 0.12));
    position: relative;
    font-size: 16px; line-height: 1.5;
}
.dl-ca-prelims li:before {
    content: "\00B7"; position: absolute; left: 6px; top: 7px;
    color: var(--dl-terracotta, #E63946); font-weight: 700;
    font-size: 24px; line-height: 1;
}
.dl-ca-prelims li:last-child { border-bottom: 0; }
.dl-ca-prelims .src {
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 12px; color: var(--dl-text-muted, #2a2520);
    margin-left: 4px;
}

.dl-ca-gaps {
    background: transparent;
    border: 1px dashed var(--dl-rule-strong, rgba(26, 23, 20, 0.22));
    padding: 18px 22px; margin: 28px 0; border-radius: 4px;
}
.dl-ca-gaps h3 {
    margin: 0 0 8px;
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 14px; font-weight: 600;
    color: var(--dl-text-muted, #2a2520);
}
.dl-ca-gaps ul {
    margin: 0; padding-left: 18px;
    font-size: 15px; line-height: 1.55;
    color: var(--dl-ink-soft, #2a2520);
}
.dl-ca-gaps li { margin-bottom: 4px; }

.dl-ca-sources {
    margin-top: 56px; padding-top: 28px;
    border-top: 1px solid var(--dl-rule-strong, rgba(26, 23, 20, 0.22));
}
.dl-ca-sources h2 {
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 20px; font-weight: 600;
    color: var(--dl-ink, #1a1714); margin: 0 0 14px;
}
.dl-ca-sources ol {
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 14px; line-height: 1.55;
    padding-left: 22px; margin: 0 0 18px;
}
.dl-ca-sources li { margin-bottom: 8px; color: var(--dl-ink-soft, #2a2520); }
.dl-ca-sources li a {
    color: var(--dl-terracotta, #E63946); text-decoration: none;
    border-bottom: 1px solid var(--dl-tan, #d4a373);
}
.dl-ca-sources li a:hover { border-bottom-color: var(--dl-terracotta, #E63946); }
.dl-ca-disclaimer {
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 12px; color: var(--dl-text-muted, #2a2520);
    line-height: 1.55;
    margin: 0; padding: 14px 0 0;
    border-top: 1px dashed var(--dl-rule, rgba(26, 23, 20, 0.12));
}
.dl-ca-disclaimer-heading {
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 16px; font-weight: 600;
    color: var(--dl-ink, #1a1714);
    margin: 20px 0 6px;
}

/* Figure block - inline-brand SVG figures within CA articles */
.dl-ca-figure { margin: 32px 0; }
.dl-ca-figure svg {
    width: 100%; height: auto; display: block;
    border-radius: 4px;
}
.dl-ca-figure figcaption {
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    font-size: 13px; line-height: 1.55;
    color: var(--dl-text-muted, #2a2520);
    margin-top: 10px; padding-left: 12px;
    border-left: 2px solid var(--dl-rule, rgba(26, 23, 20, 0.12));
}

/* Defeat Astra's inline-head `.ast-single-post .entry-content a {
   text-decoration: underline }` on every CA-article anchor. Higher
   specificity +. dl-blog-post.css carries the equivalent
   for `post` type, but it's enqueued only on is_singular('post') so
   CPTs need this rule here too. */
html body.single-current_affairs .entry-content a,
html body.single-current_affairs .entry-content a:visited,
html body.single-current_affairs .entry-content a:hover,
html body.single-current_affairs .entry-content a *,
html body.ast-single-post .entry-content a,
html body.ast-single-post .entry-content a:visited,
html body.ast-single-post .entry-content a:hover,
html body.ast-single-post .entry-content a * {
    text-decoration: none;
    border-bottom: 0;
}
/* Sources list - explicit border-bottom on links (decorative under-rule) */
.dl-ca-sources li a {
    border-bottom: 1px solid var(--dl-tan, #d4a373);
}
.dl-ca-sources li a:hover {
    border-bottom-color: var(--dl-terracotta, #E63946);
}

/* h1 (.entry-title) override has been migrated to dl-astra-overrides.css
   (specificity boost, no). 2026-05-11. */

@media (max-width: 600px) {
    .dl-ca-entry { padding: 32px 18px 64px; font-size: 17px; }
    .dl-ca-title { font-size: 24px; }
    .dl-ca-deck { font-size: 17px; }
}


/* ---------------------------------------------------------------------------
 * Link styling on CA entries (locked 2026-05-27 after wetlands G8 rev-2).
 * Astra's parent-theme rule `a { text-decoration: underline }` was winning
 * over child overrides, leading to underlined Sources block links. Higher
 * specificity via the .dl-ca-entry ancestor restores the no-underline default
 * with a hover/focus underline for affordance.
 * ------------------------------------------------------------------------- */
.dl-ca-entry a,
.dl-ca-entry a:link,
.dl-ca-entry a:visited,
.dl-ca-entry .dl-sources a,
.dl-ca-entry .dl-sources a:link,
.dl-ca-entry .dl-sources a:visited {
    text-decoration: none;
}
.dl-ca-entry a:hover,
.dl-ca-entry a:focus,
.dl-ca-entry .dl-sources a:hover,
.dl-ca-entry .dl-sources a:focus {
    text-decoration: underline;
}

/* ============================================================================
   User feedback 2026-05-29 (every CA/blog page). Two font fixes:
   1) MCQ prompt line (.dl-mcq-q-outro) was 400-italic General Sans. General Sans
      (Fontshare) ships no true italic, so the browser synthesises/falls back and
      it reads as a DIFFERENT font. Match the question stem: upright, 600, 16px.
   2) Editorial disclaimer + author bio: match the body font (General Sans, not the
      latent 'Plus Jakarta Sans') and set slightly SMALLER than body prose (15px).
   #dl-main + !important so these win over the modern/combined overrides.
   ========================================================================== */
#dl-main#dl-main .dl-mcq-q-outro {
    font-style: normal !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    color: var(--dl-ink, #1a1714);
}
#dl-main#dl-main .dl-ca-disclaimer {
    font-family: inherit !important;   /* General Sans, not Plus Jakarta Sans */
    font-size: 15px !important;
}
#dl-main#dl-main .dl-eeat-author-block .dl-eeat-bio,
#dl-main#dl-main .dl-eeat-bio {
    font-size: 15px !important;
}
