/*!
 * RE/MAX Princess · Shared Design Tokens
 * v1.0.0 · 2026-04-12
 *
 * Single source of truth for colors, typography, radii, shadows, and spacing.
 * Values extracted 1:1 from the canonical Rent2buy CSS so existing pages that
 * already use --b / --r / --g* keep working without any code change.
 *
 * Served from: https://remaxprincess.com/shared/rmxp-tokens.css
 * Import with: <link rel="stylesheet" href="https://remaxprincess.com/shared/rmxp-tokens.css">
 */

:root {
  /* Brand */
  --rmxp-blue:       #003da5;
  --rmxp-blue-50:    #eef3fc;
  --rmxp-blue-100:   #d4e0f7;
  --rmxp-blue-dark:  #001d5a;
  --rmxp-blue-xdark: #080e1e;
  --rmxp-red:        #dc1c2e;
  --rmxp-red-hover:  #b81625;
  --rmxp-wa:         #25d366;
  --rmxp-wa-hover:   #1da851;

  /* Neutral */
  --rmxp-white:      #ffffff;
  --rmxp-off:        #f7f8fa;
  --rmxp-g50:        #f9fafb;
  --rmxp-g100:       #f1f3f5;
  --rmxp-g200:       #e1e4e8;
  --rmxp-g300:       #c8cdd3;
  --rmxp-g400:       #8c95a2;
  --rmxp-g500:       #5c6673;
  --rmxp-g600:       #3d4654;
  --rmxp-g700:       #2a3140;
  --rmxp-g800:       #1a1f2e;
  --rmxp-g900:       #0d1017;

  /* Semantic */
  --rmxp-green:      #0d9f6e;
  --rmxp-green-50:   #ecfdf5;

  /* Radii */
  --rmxp-rd:         8px;
  --rmxp-rl:         14px;
  --rmxp-rx:         20px;

  /* Typography */
  --rmxp-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* Shadows */
  --rmxp-shadow-sm:  0 1px 2px rgba(0, 0, 0, .04);
  --rmxp-shadow-md:  0 4px 12px rgba(0, 0, 0, .08);
  --rmxp-shadow-lg:  0 24px 48px rgba(0, 0, 0, .18);

  /* Layout */
  --rmxp-max-w:      1200px;
  --rmxp-nav-h:      60px;
  --rmxp-drawer-w:   360px;
}

/* Legacy alias layer — keeps the original Rent2buy-era variables alive so pages
   that already reference --b, --r, --wa, --g500 etc. keep rendering identically.
   New code should prefer the --rmxp-* names above for clarity. */
:root {
  --b:   var(--rmxp-blue);
  --b50: var(--rmxp-blue-50);
  --b100:var(--rmxp-blue-100);
  --bd:  var(--rmxp-blue-dark);
  --bx:  var(--rmxp-blue-xdark);
  --r:   var(--rmxp-red);
  --rh:  var(--rmxp-red-hover);
  --w:   var(--rmxp-white);
  --off: var(--rmxp-off);
  --g50: var(--rmxp-g50);
  --g100:var(--rmxp-g100);
  --g200:var(--rmxp-g200);
  --g300:var(--rmxp-g300);
  --g400:var(--rmxp-g400);
  --g500:var(--rmxp-g500);
  --g600:var(--rmxp-g600);
  --g700:var(--rmxp-g700);
  --g800:var(--rmxp-g800);
  --g900:var(--rmxp-g900);
  --gn:  var(--rmxp-green);
  --gnl: var(--rmxp-green-50);
  --rd:  var(--rmxp-rd);
  --rl:  var(--rmxp-rl);
  --rx:  var(--rmxp-rx);
  --wa:  var(--rmxp-wa);
}