/*
 * SOMA9 Real Estate — Public-facing token bridge.
 *
 * Maps plugin tokens to Okane theme tokens (--ok-*) when available,
 * with fallbacks for non-Okane themes.
 *
 * Public pages use the Okane luxury aesthetic (dark/cream).
 * Dashboard pages (loaded separately) use SOMA9 DS tokens (purple/amber).
 */

:root {
  /* ── Surface ── */
  --s9p-bg:             var(--ok-cream, #e1d8cb);
  --s9p-bg-alt:         var(--ok-off-white, #f8f6f3);
  --s9p-bg-dark:        var(--ok-dark, #1a1714);
  --s9p-bg-surface:     var(--ok-dark-surface, #262220);
  --s9p-card-bg:        var(--ok-white, #ffffff);
  --s9p-card-hover:     var(--ok-off-white, #f8f6f3);
  --s9p-white:          var(--ok-white, #fff);
  --s9p-dark-mid:       var(--ok-dark-mid, #201d18);
  --s9p-dark-light:     var(--ok-dark-light, #2a2520);
  --s9p-dark-surface:   var(--ok-dark-surface, #262220);
  --s9p-dark-btn:       var(--ok-dark-btn, #2A2725);
  --s9p-beige-light:    var(--ok-beige-light, #ece6dd);
  --s9p-beige-mid:      var(--ok-beige-mid, #d4c9b8);

  /* ── Text ── */
  --s9p-text:           var(--ok-text-dark, #1a1714);
  --s9p-text-dark:      var(--ok-text-dark, #1a1714);
  --s9p-text-muted:     var(--ok-gray-text, #6b635b);
  --s9p-text-subtle:    var(--ok-gray-warm, #9a9088);
  --s9p-text-on-dark:   var(--ok-cream, #e1d8cb);

  /* ── Cream alpha variants ── */
  --s9p-cream-80:       var(--ok-cream-80, rgba(225,216,203,0.8));
  --s9p-cream-60:       var(--ok-cream-60, rgba(225,216,203,0.6));
  --s9p-cream-40:       var(--ok-cream-40, rgba(225,216,203,0.4));
  --s9p-cream-30:       var(--ok-cream-30, rgba(225,216,203,0.3));
  --s9p-cream-15:       var(--ok-cream-15, rgba(225,216,203,0.15));
  --s9p-cream-08:       var(--ok-cream-08, rgba(225,216,203,0.08));

  /* ── Borders ── */
  --s9p-border:         var(--ok-beige-mid, #d4c9b8);
  --s9p-border-light:   var(--ok-cream-15, rgba(225,216,203,0.15));

  /* ── Typography ── */
  --s9p-font:           var(--ok-font-primary, 'Host Grotesk', sans-serif);
  --s9p-font-display:   var(--ok-font-display, 'Montserrat', sans-serif);

  /* ── Spacing ── */
  --s9p-gutter:         var(--ok-gutter, clamp(20px, 4vw, 64px));
  --s9p-radius:         var(--ok-radius, 6px);
  --s9p-radius-lg:      var(--ok-radius-lg, 16px);
  --s9p-radius-pill:    var(--ok-radius-pill, 30px);
  --s9p-navbar-h:       var(--ok-navbar-h, 64px);

  /* ── Motion ── */
  --s9p-ease:           var(--ok-ease, cubic-bezier(0.4, 0, 0.2, 1));
  --s9p-transition:     var(--ok-transition, 0.35s cubic-bezier(0.4, 0, 0.2, 1));
  --s9p-transition-fast: var(--ok-transition-fast, 0.2s ease);

  /* ── Buttons ── */
  --s9p-btn-bg:         var(--ok-dark, #1a1714);
  --s9p-btn-text:       var(--ok-cream, #e1d8cb);
  --s9p-btn-hover:      var(--ok-btn-light, #F4EFE7);
  --s9p-btn-hover-text: var(--ok-btn-hover-text, #A79D8E);

  /* ── Status ── */
  --s9p-success:        #22c55e;
  --s9p-warning:        #f59e0b;
  --s9p-error:          #ef4444;
  --s9p-info:           #3b82f6;

  /* ── Price ── */
  --s9p-price-color:    var(--ok-dark, #1a1714);
  --s9p-price-size:     clamp(1.25rem, 1.1rem + 0.5vw, 1.75rem);
}