/* ══════════════════════════════════════════════════════════════
   blog-apple.css  —  Apple-inspired design (shared blog pages)
   guide-cv-professionnel · cv-ats-recruteurs · erreurs-cv
   score-cv-ia · modeles-cv-gratuits
   Gold/purple → Apple blue  |  Serif → System font
══════════════════════════════════════════════════════════════ */

/* ── POLICE SYSTÈME ── */
html, body, button, input,
.logo, .back-link, .btn-cta,
.eyebrow, .lead, .tip-label,
.footer-tagline, .footer-col-title {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text',
               'Helvetica Neue', 'Segoe UI', Arial, sans-serif !important;
}

/* ── CSS VARIABLES ── */
:root {
  --gold:        #0a84ff;
  --gold-lt:     #409cff;
  --gold-dim:    rgba(10,132,255,.2);
  --gold-pale:   rgba(10,132,255,.07);
  --purple:      #0a84ff;
  --purple-lt:   #409cff;
  --purple-dim:  rgba(10,132,255,.2);
  --purple-pale: rgba(10,132,255,.07);
  --ink:         #000000;
  --ink-2:       #1c1c1e;
  --ink-3:       #2c2c2e;
  --muted:       rgba(235,235,245,.55);
  --text:        #f5f5f7;
  --border:      rgba(255,255,255,.1);
  --border-2:    rgba(255,255,255,.06);
}

/* ── BODY / HTML ── */
html { background: #000 !important; color: #f5f5f7 !important; }
body { background: #000 !important; }

body::before {
  background:
    radial-gradient(ellipse 70% 50% at 50% 0%, rgba(10,132,255,.08) 0%, transparent 60%),
    radial-gradient(ellipse 50% 40% at 10% 80%, rgba(10,132,255,.04) 0%, transparent 60%) !important;
}

/* ── TOPBAR ── */
.topbar {
  background: rgba(0,0,0,.72) !important;
  backdrop-filter: saturate(180%) blur(20px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px) !important;
  border-bottom-color: rgba(255,255,255,.1) !important;
}

/* Logo — blanc en dark, jamais bleu */
.logo { color: #f5f5f7 !important; }
.logo strong { color: #fff !important; }

.back-link:hover { color: #409cff !important; }
.theme-toggle:hover { border-color: rgba(10,132,255,.5) !important; }

/* ── HERO ── */
.eyebrow {
  color: #409cff !important;
  background: rgba(10,132,255,.07) !important;
  border-color: rgba(10,132,255,.2) !important;
}
h1 em { color: #409cff !important; }

/* ── CONTENU ── */
.content h2 { border-left-color: #0a84ff !important; }
.content h3 { color: #409cff !important; }

/* ── TIP BOX ── */
.tip-box {
  background: rgba(10,132,255,.06) !important;
  border-color: rgba(10,132,255,.2) !important;
}
.tip-label { color: #409cff !important; }

/* ── TOC ── */
.toc a { color: #409cff !important; }
.toc a:hover { color: #fff !important; }

/* ── RÈGLES / RULE CARDS (cv-ats) ── */
.rule-num { color: #409cff !important; }

/* ── SCORE RING (score-cv-ia) ── */
.score-ring.mid {
  border-color: #0a84ff !important;
  color: #409cff !important;
  background: rgba(10,132,255,.07) !important;
}

/* ── TEMPLATE CARDS (modeles-cv-gratuits) ── */
.tpl-badge {
  color: #409cff !important;
  background: rgba(10,132,255,.07) !important;
  border-color: rgba(10,132,255,.2) !important;
}
.tpl-card:hover { border-color: rgba(10,132,255,.3) !important; }
.tpl-for { color: #409cff !important; }

/* ── CTA BLOCK ── */
.cta-block {
  background: linear-gradient(135deg, rgba(10,132,255,.07), rgba(10,132,255,.03)) !important;
  border-color: rgba(10,132,255,.2) !important;
}

/* ── BOUTON CTA — pill bleu ── */
.btn-cta {
  background: #0a84ff !important;
  border-radius: 980px !important;
  box-shadow: 0 8px 32px rgba(10,132,255,.35) !important;
}
.btn-cta:hover {
  background: #409cff !important;
  box-shadow: 0 12px 40px rgba(10,132,255,.5) !important;
}

/* ── FOOTER ── */
.footer { background: #1c1c1e !important; border-top-color: rgba(255,255,255,.07) !important; }

/* Footer logo — blanc, jamais bleu */
.footer-brand a { color: #fff !important; }
.footer-brand a span[style] { color: #fff !important; }
.footer-brand a b { color: #fff !important; }

.footer-col-links a:hover { color: #409cff !important; }
.footer-bottom-links a:hover { color: #409cff !important; }

/* ══════════════════════════════════════════════════════════════
   LIGHT MODE
══════════════════════════════════════════════════════════════ */
html[data-theme="light"] {
  --gold:        #0071e3;
  --gold-lt:     #0077ed;
  --gold-dim:    rgba(0,113,227,.18);
  --gold-pale:   rgba(0,113,227,.07);
  --purple:      #0071e3;
  --purple-lt:   #0077ed;
  --purple-dim:  rgba(0,113,227,.15);
  --purple-pale: rgba(0,113,227,.06);
  --ink:         #f5f5f7;
  --ink-2:       #eef1f8;
  --ink-3:       #e4e8f0;
  --muted:       rgba(0,0,0,.5);
  --text:        #1d1d1f;
  --border:      rgba(0,0,0,.1);
  --border-2:    rgba(0,0,0,.06);
}

html[data-theme="light"] html { background: #f5f5f7 !important; color: #1d1d1f !important; }
html[data-theme="light"] body { background: #f5f5f7 !important; }

html[data-theme="light"] body::before {
  background:
    radial-gradient(ellipse 70% 50% at 50% 0%, rgba(0,113,227,.05) 0%, transparent 60%),
    radial-gradient(ellipse 50% 40% at 10% 80%, rgba(0,113,227,.03) 0%, transparent 60%) !important;
}

html[data-theme="light"] .topbar {
  background: rgba(245,245,247,.88) !important;
  border-bottom-color: rgba(0,0,0,.1) !important;
}

/* Logo light — #1d1d1f, jamais bleu */
html[data-theme="light"] .logo { color: #1d1d1f !important; }
html[data-theme="light"] .logo strong { color: #1d1d1f !important; }
html[data-theme="light"] .back-link { color: rgba(0,0,0,.45) !important; }
html[data-theme="light"] .back-link:hover { color: #0071e3 !important; }
html[data-theme="light"] .theme-toggle:hover { border-color: rgba(0,113,227,.4) !important; }

html[data-theme="light"] .eyebrow {
  color: #0071e3 !important;
  background: rgba(0,113,227,.06) !important;
  border-color: rgba(0,113,227,.18) !important;
}
html[data-theme="light"] h1 em { color: #0071e3 !important; }
html[data-theme="light"] h1 { color: #1d1d1f !important; }

html[data-theme="light"] .content h2 {
  border-left-color: #0071e3 !important;
  color: #1d1d1f !important;
}
html[data-theme="light"] .content h3 { color: #0071e3 !important; }
html[data-theme="light"] .content p { color: rgba(0,0,0,.65) !important; }

html[data-theme="light"] .tip-box {
  background: rgba(0,113,227,.05) !important;
  border-color: rgba(0,113,227,.18) !important;
}
html[data-theme="light"] .tip-label { color: #0071e3 !important; }

html[data-theme="light"] .toc { background: #e4e8f0 !important; border-color: rgba(0,0,0,.1) !important; }
html[data-theme="light"] .toc a { color: #0071e3 !important; }
html[data-theme="light"] .toc a:hover { color: #1d1d1f !important; }

html[data-theme="light"] .rule-num { color: #0071e3 !important; }
html[data-theme="light"] .rule-card { background: #fff !important; border-color: rgba(0,0,0,.09) !important; }

html[data-theme="light"] .score-ring.mid {
  border-color: #0071e3 !important;
  color: #0071e3 !important;
  background: rgba(0,113,227,.06) !important;
}
html[data-theme="light"] .criteria-card { background: #fff !important; border-color: rgba(0,0,0,.09) !important; }
html[data-theme="light"] .criteria-card h3 { color: #1d1d1f !important; }

html[data-theme="light"] .tpl-badge {
  color: #0071e3 !important;
  background: rgba(0,113,227,.06) !important;
  border-color: rgba(0,113,227,.18) !important;
}
html[data-theme="light"] .tpl-card {
  background: #fff !important;
  border-color: rgba(0,0,0,.09) !important;
}
html[data-theme="light"] .tpl-card:hover { border-color: rgba(0,113,227,.25) !important; }
html[data-theme="light"] .tpl-name { color: #1d1d1f !important; }
html[data-theme="light"] .tpl-for { color: #0071e3 !important; }
html[data-theme="light"] .tpl-desc { color: rgba(0,0,0,.5) !important; }

html[data-theme="light"] .cta-block {
  background: linear-gradient(135deg, rgba(0,113,227,.06), rgba(0,113,227,.03)) !important;
  border-color: rgba(0,113,227,.18) !important;
}
html[data-theme="light"] .cta-block h2 { color: #1d1d1f !important; }

html[data-theme="light"] .btn-cta {
  background: #0071e3 !important;
  box-shadow: 0 8px 32px rgba(0,113,227,.25) !important;
}
html[data-theme="light"] .btn-cta:hover {
  background: #0077ed !important;
  box-shadow: 0 12px 40px rgba(0,113,227,.38) !important;
}

html[data-theme="light"] .footer { background: #eef1f8 !important; border-top-color: rgba(0,0,0,.07) !important; }
html[data-theme="light"] .footer-tagline { color: rgba(0,0,0,.4) !important; }
html[data-theme="light"] .footer-brand a { color: #1d1d1f !important; }
html[data-theme="light"] .footer-brand a span[style] { color: #1d1d1f !important; }
html[data-theme="light"] .footer-brand a b { color: #1d1d1f !important; }
html[data-theme="light"] .footer-col-title { color: rgba(0,0,0,.5) !important; }
html[data-theme="light"] .footer-col-links a { color: rgba(0,0,0,.45) !important; }
html[data-theme="light"] .footer-col-links a:hover { color: #0071e3 !important; }
html[data-theme="light"] .footer-copy { color: rgba(0,0,0,.35) !important; }
html[data-theme="light"] .footer-bottom-links a { color: rgba(0,0,0,.4) !important; }
html[data-theme="light"] .footer-bottom-links a:hover { color: #0071e3 !important; }
