@import url('https://fonts.googleapis.com/css2?family=Readex+Pro:wght@400;500;600;700;800&display=swap');
/* Riquo design C, "Cairo nights" — chosen by the owner on 14 Nov 2026, with a yellow-and-blue palette.
   Colours live in brand-tokens.css (landing) and dashboard-tokens.css (dashboard); this file adds design C's
   type (Readex Pro, Latin and Arabic) and shapes (rounded tiles, 12px buttons). Loaded last on index.html,
   yalla.html (and the entry/organisations pages). The 9 Nov designs A and B and their switch were removed.
   Palette: navy #0e1a2b (dark surfaces), raised navy #172a44, yellow #ffd23f (accent on dark, highlights),
   blue #1f4fbf (text and buttons on light), shape blue #3d7bf0 (icons and lines only), cream #faf9f5,
   pale yellow #fff3c2, slate #4b5768 (muted on light), mist #b9c6d8 (muted on dark). Every text pair ≥ 4.5:1. */

:root {
  --rq-font-display: "Readex Pro", system-ui, sans-serif; --rq-font-poster: "Readex Pro", system-ui, sans-serif;
  --rq-font-body: "Readex Pro", system-ui, sans-serif; --rq-font-arabic: "Readex Pro", "IBM Plex Sans Arabic", sans-serif;
  /* Dashboard: light grey-blue page, white cards, navy sidebar, yellow active tab, blue actions. */
  --d-paper: #f2f4f7; --d-sheet: #ffffff; --d-ink: #0e1a2b; --d-muted: #4b5768; --d-green: #1f4fbf; --d-deep: #0e1a2b;
  --d-ochre: #ffd23f; --d-ochre-soft: #fff3c2; --d-sage: #e3ebf7; --d-line: #d6dce5; --d-mist: #b9c6d8; --d-error: #9b2c1f;
}

/* ---------- Landing ---------- */
:is(h1, h2, .rq-display, .rq-h1, .rq-h2, #hero-title, #agencies-title, #yalla-title, #rq-title),
html[lang="ar"] :is(h1, h2, .rq-display, .rq-h1, .rq-h2, #hero-title, #agencies-title, #yalla-title, #rq-title) { font-family: "Readex Pro", system-ui, sans-serif; font-weight: 700; letter-spacing: -.03em; }
html[lang="ar"] :is(h1, h2, .rq-display, .rq-h1, .rq-h2) { letter-spacing: 0; }
.rq-btn { border-radius: 12px; }
.home-hero, .yalla-section, .site-header, .site-footer { background: #0e1a2b; }
.site-header { border-block-end: 3px solid #ffd23f; }
.hero-photo, .hero-photo img { border-radius: 28px; }
:is(.outing-card, .day-feature, .agency-empty, .agency-card-v, .trip-card-y, .alert-feature) { border-radius: 24px; }
.pillar { border-radius: 20px; }
.discovery-tab.active { background: #0e1a2b; color: #faf9f5; }
.floating-ask { background: #ffd23f; color: #0e1a2b; }

/* ---------- Dashboard ---------- */
body.dash { font-family: "Readex Pro", system-ui, sans-serif; }
body.dash :is(.rq-h1, .rq-h2, .rq-h3) { font-family: "Readex Pro", system-ui, sans-serif; font-weight: 700; letter-spacing: -.02em; }
html[lang="ar"] body.dash :is(.rq-h1, .rq-h2, .rq-h3) { letter-spacing: 0; }
body.dash .dash-top { background: #0e1a2b; }
body.dash .dash-top::after { block-size: 4px; background-image: none; background-color: #ffd23f; }
body.dash .dash-nav::after { background-image: none; }
body.dash :is(.y-card, .dash-stat > div, .dash-choice, .y-trip, .y-filters) { border-radius: 18px; box-shadow: 0 1px 2px rgba(14, 26, 43, .06); }
body.dash .rq-btn { border-radius: 10px; }
body.dash .dash-choice.agency { border-color: #c9a100; }

/* Sign in with Google (Google's branding: white button, grey outline, multicolour G, "Continue with Google"). */
.y-google { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-block-size: 48px; padding: 0 18px; border-radius: 10px;
  background: #ffffff; color: #1f1f1f; border: 1px solid #747775; font: 600 1rem "Readex Pro", system-ui, sans-serif; text-decoration: none; }
.y-google:hover { background: #f2f2f2; }
.y-google svg { flex: none; }
.y-or { display: flex; align-items: center; gap: 12px; margin: 14px 0; color: #4b5768; font-size: .9375rem; }
.y-or::before, .y-or::after { content: ""; flex: 1; border-block-start: 1px solid #d6dce5; }