/**
 * Broker Legacy Design-System Bridge
 * Maps older Broker page systems to the new --brk-* tokens.
 */

/* ---------------------------------------------------------
 * R9 / broker-ui global variables
 * --------------------------------------------------------- */
:root {
  --bk-bg: var(--brk-ivory);
  --bk-surface: var(--brk-white);
  --bk-surface-alt: var(--brk-ivory-100);
  --bk-ink: var(--brk-green);
  --bk-ink-2: var(--brk-charcoal);
  --bk-muted: var(--brk-text-muted);
  --bk-gold: var(--brk-sand-600);
  --bk-gold-deep: #8f7744;
  --bk-gold-soft: var(--brk-sand);
  --bk-border: var(--brk-border);
  --bk-border-strong: #cfc3b1;
  --bk-strong-border: #cfc3b1;
  --bk-white: var(--brk-white);
  --bk-shadow-1: var(--brk-shadow-sm);
  --bk-shadow-2: var(--brk-shadow-md);
  --bk-r8: var(--brk-radius-sm);
  --bk-r12: 12px;
  --bk-r16: var(--brk-radius-md);
  --bk-r24: var(--brk-radius-lg);
  --bk-r999: var(--brk-radius-pill);
}

/* ---------------------------------------------------------
 * Single-project system
 * --------------------------------------------------------- */
.broker-project-master {
  --petrol: var(--brk-green);
  --deep: var(--brk-text);
  --bronze: var(--brk-sand-600);
  --ivory: var(--brk-ivory);
  --paper: var(--brk-white);
  --sage: var(--brk-ivory-300);
  --muted: var(--brk-text-muted);
  --line: var(--brk-border);
  --white: var(--brk-white);
  font-family: var(--brk-font-ar);
}

.broker-project-master h1,
.broker-project-master h2,
.broker-project-master h3,
.broker-project-master p,
.broker-project-master li,
.broker-project-master summary,
.broker-project-master table,
.broker-project-master button,
.broker-project-master input,
.broker-project-master select,
.broker-project-master textarea,
.broker-project-master label {
  font-family: var(--brk-font-ar);
}

.broker-project-master .bp-btn.primary,
.broker-project-master .bp-hero-submit,
.broker-project-master .bp-form-shortcode button,
.broker-project-master .bp-form-shortcode .ff-btn-submit {
  background: var(--brk-green) !important;
  border-color: var(--brk-green) !important;
  color: var(--brk-white) !important;
}

.broker-project-master .bp-btn.primary:hover,
.broker-project-master .bp-hero-submit:hover,
.broker-project-master .bp-form-shortcode button:hover,
.broker-project-master .bp-form-shortcode .ff-btn-submit:hover {
  background: var(--brk-green-900) !important;
  border-color: var(--brk-green-900) !important;
}

.broker-project-master .bp-form-section,
.broker-project-master .bp-wa-sticky {
  background: var(--brk-green);
}

.broker-project-master .bp-kicker,
.broker-project-master .bp-feature-label,
.broker-project-master .bp-market-card .stage {
  color: #8f7744;
}

.broker-project-master .bp-kicker::before {
  background: var(--brk-sand-600);
}

/* ---------------------------------------------------------
 * Projects archive
 * --------------------------------------------------------- */
.bcpa-page {
  background: var(--brk-ivory) !important;
  color: var(--brk-text) !important;
  font-family: var(--brk-font-ar) !important;
}

.bcpa-hero {
  background:
    radial-gradient(circle at 18% 20%, rgba(228, 215, 185, .18) 0 140px, transparent 141px),
    linear-gradient(180deg, var(--brk-ivory) 0%, var(--brk-ivory-100) 100%) !important;
  border-bottom-color: var(--brk-border) !important;
}

.bcpa-hero h1,
.bcpa-card-title a {
  color: var(--brk-green) !important;
}

.bcpa-filter,
.bcpa-card,
.bcpa-empty,
.bcpa-hero-art {
  background: var(--brk-white) !important;
  border-color: var(--brk-border) !important;
}

.bcpa-filter-submit,
.bcpa-more,
.bcpa-btn-primary {
  background: var(--brk-green) !important;
  border-color: var(--brk-green) !important;
  color: var(--brk-white) !important;
}

.bcpa-filter-submit:hover,
.bcpa-more:hover,
.bcpa-btn-primary:hover {
  background: var(--brk-green-900) !important;
  border-color: var(--brk-green-900) !important;
}

.bcpa-btn-secondary {
  border-color: var(--brk-border) !important;
  color: var(--brk-green) !important;
}

.bcpa-field input,
.bcpa-field select {
  background: var(--brk-ivory-100) !important;
  border-color: var(--brk-border) !important;
  color: var(--brk-text) !important;
}

/* ---------------------------------------------------------
 * Area / location landing pages
 * --------------------------------------------------------- */
.unified-project-card,
.project-card,
.property-path-card,
.price-example-card,
.area-strip-item {
  background: var(--brk-white) !important;
  border-color: var(--brk-border) !important;
  border-radius: var(--brk-radius-lg) !important;
  box-shadow: none !important;
}

.unified-project-card:hover,
.project-card:hover,
.property-path-card:hover,
.area-strip-item:hover {
  border-color: var(--brk-sand-600) !important;
  box-shadow: var(--brk-shadow-sm) !important;
}

.property-path-icon {
  background: var(--brk-sand) !important;
  color: var(--brk-green) !important;
}

.property-paths-section,
.area-strip-section {
  background: var(--brk-ivory-100) !important;
}

.property-paths-head h2,
.area-strip-head h2,
.project-card h3,
.unified-project-card h3 {
  color: var(--brk-green) !important;
}

.hero-main-cta {
  background: var(--brk-green) !important;
  border-color: var(--brk-green) !important;
  color: var(--brk-white) !important;
  border-radius: var(--brk-radius-md) !important;
}

.hero-main-secondary {
  background: var(--brk-sand) !important;
  border-color: var(--brk-sand) !important;
  color: var(--brk-green) !important;
  border-radius: var(--brk-radius-md) !important;
}

/* ---------------------------------------------------------
 * Property-type archives
 * --------------------------------------------------------- */
.ba-hero {
  background: var(--brk-charcoal) !important;
  color: var(--brk-ivory) !important;
}

.ba-hero h1,
.ba-hero h2,
.ba-hero h3 {
  color: var(--brk-white) !important;
}

.ba-filter,
.ba-filter-shell,
.ba-card {
  background: var(--brk-white) !important;
  border-color: var(--brk-border) !important;
}

.ba-card {
  border-radius: var(--brk-radius-lg) !important;
  box-shadow: none !important;
}

.ba-card:hover {
  border-color: var(--brk-sand-600) !important;
  box-shadow: var(--brk-shadow-sm) !important;
}

/* ---------------------------------------------------------
 * Blog
 * --------------------------------------------------------- */
.blog-wrap .post-wrap {
  background: var(--brk-white) !important;
  border-color: var(--brk-border) !important;
  border-radius: var(--brk-radius-lg) !important;
  box-shadow: none !important;
}

.blog-wrap .post-wrap:hover {
  border-color: var(--brk-sand-600) !important;
  box-shadow: var(--brk-shadow-sm) !important;
}

.blog-wrap .post-title-wrap h2,
.blog-wrap .post-title-wrap h2 a {
  color: var(--brk-green) !important;
}

.blog-wrap .post-excerpt-wrap p {
  color: var(--brk-text-muted) !important;
}

.brk-blog-tags a {
  background: var(--brk-white) !important;
  border-color: var(--brk-sand-600) !important;
  color: var(--brk-green) !important;
}

.brk-blog-tags a:hover {
  background: var(--brk-green) !important;
  color: var(--brk-white) !important;
}

/* ---------------------------------------------------------
 * Shared focus treatment
 * --------------------------------------------------------- */
.broker-ui a:focus-visible,
.broker-ui button:focus-visible,
.broker-project-master a:focus-visible,
.broker-project-master button:focus-visible,
.bcpa-page a:focus-visible,
.bcpa-page button:focus-visible {
  outline: 2px solid var(--brk-sand-600) !important;
  outline-offset: 3px !important;
}