/* ==========================================================================
   JEAN LLESES — accent override for the ported pages
   --------------------------------------------------------------------------
   The property, blog, guide and computation pages keep the design they were
   built with: dark ground, night-shot hero photography, white type, elegant
   serif display. That system is already contrast-tested and it is the look
   every high-end PH property site uses.

   The only part of it that belonged to the previous agent was the GOLD, so
   this file redefines the gold ramp — and only the gold ramp — to Jean's
   blue. It must load AFTER the page's inline <style> blocks so its :root wins.

   Do NOT reintroduce ground or ink overrides here. An earlier version flipped
   --dark to paper and --white to ink; that stranded every hard-coded
   rgba(255,255,255,.x) on a pale background and produced hundreds of
   invisible-text failures. The grounds stay dark on purpose.
   ========================================================================== */

/* NOTE — there is deliberately no :root override here.
   _tools/retheme_hex.py rewrites the gold ramp inside each page's OWN :root,
   which is both sufficient and safer. An override at this level also clobbered
   pages that carry a DIFFERENT palette on purpose: fortis-residences.html
   ships DMCI Exclusive's own warm gold (#C4973B), and forcing the luminous
   blue onto it put a light accent on that page's cream sections at 2.0:1.
   Per-page rewriting leaves bespoke palettes intact. */

/* Focus rings and selection follow the accent. */
:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
::selection { background: rgba(143, 184, 223, 0.30); color: #fff; }

/* ══════════════════════════════════════════════════════════════════════════
   CONTRAST REPAIRS
   Every rule below fixes a measured WCAG AA failure found by auditing all 133
   pages at 1280px. Each carries its measured "before" ratio. None of them
   predate this site — they are in the source pages too.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Footer credit and legal links ─────────────────────────────────────────
   0.25–0.35 alpha white on #07090f is 2.1–3.1:1. This is the single most
   widespread failure on the site (109 pages). 0.62 gives ~6.4:1. */
.footer-bar, .footer-copy,
.footer-credit, .footer-credit div, .site-credit {
  color: rgba(255, 255, 255, 0.62) !important;
}
.footer-bar a, .footer-copy a,
.footer-credit a, .site-credit a,
.footer-legal a {
  color: rgba(255, 255, 255, 0.74) !important;
}

/* ── Category chips ────────────────────────────────────────────────────────
   The chips are filled with mid-tone category colours — accent #8FB8DF,
   green #16a34a, amber #b45309 — and set in the page's LIGHT body text, which
   measured 1.31:1, 2.07:1 and 3.15:1. Near-black type passes on all three
   (≈9:1, ≈5.4:1, ≈4.6:1) without touching the category colours themselves. */
.article-cat, .blog-cat-badge, .cat-badge, .post-cat { font-weight: 700 !important; }

/* ── Accent-filled buttons and labels ──────────────────────────────────────
   --gold is a LUMINOUS colour: it is legible as text on the dark ground, and
   as a fill it needs DARK text on top. White on #8FB8DF is 1.9:1. The source
   design already knew this (its gold buttons used `color: var(--dark)`) —
   these are the few places that hard-coded white instead. */
.uk-bookbar-btn.gold, .btn-gold, .cb-lbl {
  color: #07090F !important;
}

/* ── Accent on LIGHT panels ───────────────────────────────────────────────
   A few sections (floor-plan captions, the computation panels) sit on white.
   The luminous accent is built for the dark ground and measures 2.1:1 there;
   the deep step is the correct one on paper. */
/* Pages tagged .jdl-light are the light-grounded tools and presentations.
   The luminous accent is 2.1:1 on their white ground, so those get the deep
   step instead. Everything else keeps the accent it was designed with. */
.jdl-light .sec, .jdl-light .panel-title, .jdl-light .plan-label,
.jdl-light .light-panel .accent { color: #2C455D !important; }
.jdl-light .note, .jdl-light span.l, .jdl-light .lbl-sm {
  color: #565B70 !important; opacity: 1;
}

/* On the dark pages the same labels inherit and dim rather than take a hex —
   a blue dark enough to pass on white is 1.9:1 on #0e1016. */
.plan-label { color: inherit !important; opacity: .82; }

/* The "page last updated" line carries an inline opacity:.6 on top of an
   already-muted colour, which lands at 3.0:1 on 95 pages. The colour alone
   is 6.6:1 and still reads as secondary. */
.uk-updated { opacity: 1 !important; }

/* Chips whose fill was darkened by the build take white type. Chips filled
   with var(--gold) already set dark type themselves and must keep it — the
   accent is a LIGHT colour. */
.article-cat[style*="background"], .blog-cat-badge[style*="background"],
.cat-badge[style*="background"], .post-cat[style*="background"] {
  color: #FFFFFF !important;
}

/* Share row: the WhatsApp tile uses the light brand green. */
.share-btn.share-wa { background: #0F7A6C !important; color: #FFFFFF !important; }

/* ── Faded labels inside dark cards ───────────────────────────────────────
   0.4 alpha white on the #0e2338 card is 3.7:1. */
.role, .cb-role { color: rgba(255, 255, 255, 0.72) !important; }

/* ── Valeron "not discounted" panel ───────────────────────────────────────
   Salmon numerals on the red ground are 2.4:1. */
.vcmp-scope-n { color: #FFFFFF !important; }

/* ── Light-ground comparison pages ────────────────────────────────────────
   A few standalone tools (the Valeron 10% comparison, the payment-term
   comparisons) are light pages, not dark ones. Their muted greys and amber
   highlight sit at 2.2-4.4:1 on white and cream. */
.strike, .strike.nodisc { color: #6B7089 !important; }
td.hl, span.n, .amber { color: #8A5B0F !important; }

/* .note and .l appear on BOTH light and dark pages, so no single hex works —
   #565B70 passes on white and fails at 2.8:1 on #0d1220. Inheriting the
   surrounding text colour and dimming it is correct on either ground. */
.note, span.l, .lbl-sm { color: inherit !important; opacity: .74; }

/* Success chip on its pale green ground: 3.0:1. */
.status.now, .status-ok { color: #1B7A4E !important; }

/* ── WhatsApp button ───────────────────────────────────────────────────────
   White on WhatsApp's light brand green #25D366 is 2.0:1. Their dark brand
   green is the correct pairing for white type and keeps the button
   recognisably WhatsApp: ≈5.2:1 at the small size these buttons use. */
.btn-whatsapp {
  background: #0F7A6C !important;
  color: #FFFFFF !important;
}

/* ── Computation tool ──────────────────────────────────────────────────────
   Its contact band renders emoji in a dark ink on a dark blue panel (1.1:1)
   and sets the hours line at 0.35 alpha (3.0:1). */
.cb-icon { color: #FFFFFF !important; }
.cb-hours, .cb-card span { color: rgba(255, 255, 255, 0.72) !important; }

/* ── Marginal small copy ──────────────────────────────────────────────────
   4.3-4.35:1 at 11-13px — just under AA. Lifted to full white / full accent. */
.ukofficial { color: #FFFFFF !important; }
.pt-note { color: var(--gold) !important; }

/* ── Accent-on-accent button ──────────────────────────────────────────────
   A "View Full Listing" button set in the light accent ON the light accent
   (1.5:1). Same rule as every other accent fill: dark type. */
.btn-primary { color: #07090F !important; }

/* ── Fortis Residences: cream sections on a dark page ─────────────────────
   This page carries DMCI Exclusive's own warm palette, not Jean's, and four
   of its sections are cream while the rest of the page is near-black. Its
   gold (#C4973B, 2.5:1 on cream) and grey (#8A857C, 3.5:1) were tuned for the
   dark ground and fail on the light one.

   Custom properties inherit, so redefining the two tokens ON the cream
   sections fixes every element inside them — headings, stat figures, labels,
   body copy — while the dark sections keep the palette they were designed
   with. No per-element rules, and nothing to keep in sync. */
.overview-section, .units-section, .features-section, .invest-section {
  --gray: #5C574E;         /* 3.5:1 -> 6.1:1 on #FAF8F3 */
  --gold: #8A6620;         /* 2.5:1 -> 5.2:1 */
  --gold-light: #A87D2C;
}
/* .unit-card is a DARK card nested inside the cream units section. Inherited
   custom properties would hand it the darkened cream palette, so it takes the
   page's original values back — this is why the fix is two rules and not one. */
.unit-card {
  --gray: #8A857C;
  --gold: #C4973B;
  --gold-light: #D4B06A;
}

/* The promo pill renders near-black on near-black in this page's palette. */
.uknav-promo-pill { color: #FFF3D6 !important; }

/* ── Valeron comparison scope labels ───────────────────────────────────────
   Muted grey on the red "not discounted" panel is 1.9:1. */
.vcmp-scope-lbl, .vcmp-scope-s { color: #FFFFFF !important; }

/* ── Print ────────────────────────────────────────────────────────────────
   Buyers print computation sheets and property pages. Paper is white, so the
   dark ground has to invert here or the sheet comes out a black rectangle. */
@media print {
  :root { --dark: #fff; --dark-2: #fff; --dark-3: #f4f4f6; --dark-4: #ececef;
          --white: #111; --text-body: #333; --text-muted: #666;
          --gold: #2c455d; --gold-light: #416180; }
  body { background: #fff !important; color: #111 !important; }
  .uk-fab-group, .uk-bookbar, .uk-share-fab, #ukProgress,
  .uknav, .uknav-mobile, .nav, video { display: none !important; }
}
