/* ==========================================================================
   ERE Profile Themes - CSS Custom Property Overrides
   Modern implementations inspired by legacy member templates (1-14).
   Applied via .profile-theme-N class on .profile-page element.
   ========================================================================== */

/* ==========================================================================
   Split Layout Helper
   Photo LEFT, Info CENTER, Logo RIGHT
   Uses display:contents to break .profile-images wrapper so its children
   participate directly in the header row's flex layout.
   ========================================================================== */

/* ==========================================================================
   Light Themes
   ========================================================================== */

/* ---------- 1 - Sage Garden ---------- */
.profile-page.profile-theme-1 {
  --profile-primary: #0000a0;
  --profile-primary-dark: #000070;
  --profile-accent: #cc0000;
  --profile-bg: #e2e9e8;
  --profile-card-bg: #ffffff;
  --profile-text: #212529;
  --profile-text-muted: #4f5880;
  --profile-link-color: #0000a0;
  --profile-link-hover: #000070;
  --profile-address-bg: rgba(0, 0, 160, 0.03);
}

/* ---------- 2 - Warm Parchment (Split) ---------- */
.profile-page.profile-theme-2 {
  --profile-primary: #7e5112;
  --profile-primary-dark: #5a3a0d;
  --profile-accent: #950000;
  --profile-bg: #fdf7ea;
  --profile-card-bg: #ffffff;
  --profile-text: #212529;
  --profile-text-muted: #4f5880;
  --profile-link-color: #7e5112;
  --profile-link-hover: #5a3a0d;
  --profile-address-bg: rgba(126, 81, 18, 0.04);
}

/* ---------- 3 - Lavender Mist ---------- */
.profile-page.profile-theme-3 {
  --profile-primary: #0000a0;
  --profile-primary-dark: #000070;
  --profile-accent: #800000;
  --profile-bg: #f1f1fa;
  --profile-card-bg: #ffffff;
  --profile-text: #212529;
  --profile-text-muted: #800000;
  --profile-link-color: #0000a0;
  --profile-link-hover: #000070;
  --profile-address-bg: rgba(0, 0, 160, 0.03);
}

/* ---------- 4 - Slate Professional (Split) ---------- */
.profile-page.profile-theme-4 {
  --profile-primary: #364d5a;
  --profile-primary-dark: #243540;
  --profile-accent: #846262;
  --profile-bg: #e6e6e6;
  --profile-card-bg: #ffffff;
  --profile-text: #212529;
  --profile-text-muted: #846262;
  --profile-link-color: #364d5a;
  --profile-link-hover: #243540;
  --profile-address-bg: rgba(54, 77, 90, 0.04);
}

/* ---------- 5 - Sage Elegant (circular photo, centered, light weight) ---------- */
.profile-page.profile-theme-5 {
  --profile-primary: #0000a0;
  --profile-primary-dark: #000070;
  --profile-accent: #cc0000;
  --profile-bg: #e2e9e8;
  --profile-card-bg: #ffffff;
  --profile-text: #212529;
  --profile-text-muted: #4f5880;
  --profile-link-color: #0000a0;
  --profile-link-hover: #000070;
  --profile-address-bg: rgba(0, 0, 160, 0.03);
}

.profile-page.profile-theme-5 .profile-photo img {
  border-radius: 50%;
  aspect-ratio: 1;
  object-fit: cover;
}

.profile-page.profile-theme-5 .profile-info {
  text-align: center;
}

.profile-page.profile-theme-5 .profile-info .designations {
  justify-content: center;
}

.profile-page.profile-theme-5 .phone-numbers {
  align-items: center;
  justify-content: center;
}

.profile-page.profile-theme-5 .agent-name {
  font-weight: 400;
  letter-spacing: 0;
}

.profile-page.profile-theme-5 .profile-header {
  padding: 2rem 1.25rem;
}

/* ---------- 6 - Warm Parchment (Reverse Split: logo left, photo right) ---------- */
.profile-page.profile-theme-6 {
  --profile-primary: #7e5112;
  --profile-primary-dark: #5a3a0d;
  --profile-accent: #950000;
  --profile-bg: #fdf7ea;
  --profile-card-bg: #ffffff;
  --profile-text: #212529;
  --profile-text-muted: #4f5880;
  --profile-link-color: #7e5112;
  --profile-link-hover: #5a3a0d;
  --profile-address-bg: rgba(126, 81, 18, 0.04);
}

/* ---------- 7 - Lavender Editorial (sharp corners, bordered, editorial typography) ---------- */
.profile-page.profile-theme-7 {
  --profile-primary: #2d2d7a;
  --profile-primary-dark: #1a1a5c;
  --profile-accent: #5c2d82;
  --profile-bg: #e8e8f4;
  --profile-card-bg: #ffffff;
  --profile-text: #212529;
  --profile-text-muted: #5c2d82;
  --profile-link-color: #2d2d7a;
  --profile-link-hover: #1a1a5c;
  --profile-address-bg: rgba(45, 45, 122, 0.03);
  --profile-border-radius: 0;
  --profile-card-border: 1px solid #2d2d7a;
}

.profile-page.profile-theme-7 .profile-card {
  box-shadow: none;
}

/* Top accent bar */
.profile-page.profile-theme-7 .profile-header {
  padding: 1.25rem;
  border-top: 4px solid #5c2d82;
}

.profile-page.profile-theme-7 .profile-content {
  padding: 1.25rem;
}

/* Editorial typography — uppercase name with wide tracking */
.profile-page.profile-theme-7 .agent-name {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
}

/* Uppercase section headings with underline */
.profile-page.profile-theme-7 .sub-section h3,
.profile-page.profile-theme-7 .other-links h3 {
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.85rem;
  border-bottom: 1px solid rgba(45, 45, 122, 0.2);
  padding-bottom: 0.35rem;
  margin-bottom: 0.5rem;
}

.profile-page.profile-theme-7 .contact-link {
  border-radius: 0;
}

.profile-page.profile-theme-7 .listings-link .btn {
  border-radius: 0;
}

/* ---------- 8 - Slate Professional (Stacked, same colors as 4) ---------- */
.profile-page.profile-theme-8 {
  --profile-primary: #364d5a;
  --profile-primary-dark: #243540;
  --profile-accent: #846262;
  --profile-bg: #e6e6e6;
  --profile-card-bg: #ffffff;
  --profile-text: #212529;
  --profile-text-muted: #846262;
  --profile-link-color: #364d5a;
  --profile-link-hover: #243540;
  --profile-address-bg: rgba(54, 77, 90, 0.04);
}

/* ==========================================================================
   Dark Themes
   ========================================================================== */

/* ---------- 9 - Royal Blue (Split) ---------- */
.profile-page.profile-theme-9 {
  --profile-primary: #f3d00c;
  --profile-primary-dark: #d4b50a;
  --profile-accent: #e9d8b6;
  --profile-bg: #000040;
  --profile-card-bg: #0000a0;
  --profile-text: #ffffff;
  --profile-text-muted: #e9d8b6;
  --profile-crs-bg: #000070;
  --profile-link-color: #f3d00c;
  --profile-link-hover: #ffffa0;
  --profile-address-bg: rgba(255, 255, 255, 0.05);
}

/* ---------- 10 - Midnight ---------- */
.profile-page.profile-theme-10 {
  --profile-primary: #ffffff;
  --profile-primary-dark: #dddddd;
  --profile-accent: #ff4444;
  --profile-bg: #111111;
  --profile-card-bg: #000000;
  --profile-text: #ffffff;
  --profile-text-muted: #dddddd;
  --profile-crs-bg: #1a1a1a;
  --profile-link-color: #ddddff;
  --profile-link-hover: #ffffce;
  --profile-address-bg: rgba(255, 255, 255, 0.04);
}

/* ---------- 11 - Twilight Slate ---------- */
.profile-page.profile-theme-11 {
  --profile-primary: #f0f0ff;
  --profile-primary-dark: #d0d0e0;
  --profile-accent: #ffdd8c;
  --profile-bg: #3a3e5e;
  --profile-card-bg: #5a5e7e;
  --profile-text: #ffffff;
  --profile-text-muted: #d0d0e0;
  --profile-crs-bg: #4a4e6e;
  --profile-link-color: #ffff00;
  --profile-link-hover: #ffffff;
  --profile-address-bg: rgba(255, 255, 255, 0.05);
}

/* ---------- 12 - Earth & Timber (Split) ---------- */
.profile-page.profile-theme-12 {
  --profile-primary: #ffff00;
  --profile-primary-dark: #ffdd8c;
  --profile-accent: #ffdd8c;
  --profile-bg: #3a2510;
  --profile-card-bg: #684217;
  --profile-text: #ffffff;
  --profile-text-muted: #f0f0ff;
  --profile-crs-bg: #583717;
  --profile-link-color: #ffff00;
  --profile-link-hover: #ffffff;
  --profile-address-bg: rgba(255, 255, 255, 0.05);
}

/* Dark theme shared overrides */
.profile-page.profile-theme-9 .contact-link:hover,
.profile-page.profile-theme-9 .contact-link:focus,
.profile-page.profile-theme-10 .contact-link:hover,
.profile-page.profile-theme-10 .contact-link:focus,
.profile-page.profile-theme-11 .contact-link:hover,
.profile-page.profile-theme-11 .contact-link:focus,
.profile-page.profile-theme-12 .contact-link:hover,
.profile-page.profile-theme-12 .contact-link:focus {
  color: #000;
}

.profile-page.profile-theme-9 .listings-link .btn,
.profile-page.profile-theme-10 .listings-link .btn,
.profile-page.profile-theme-11 .listings-link .btn,
.profile-page.profile-theme-12 .listings-link .btn {
  color: #000;
}

.profile-page.profile-theme-9 .crea-card .card-body,
.profile-page.profile-theme-10 .crea-card .card-body,
.profile-page.profile-theme-11 .crea-card .card-body,
.profile-page.profile-theme-12 .crea-card .card-body {
  color: var(--profile-text);
}

.profile-page.profile-theme-9 hr,
.profile-page.profile-theme-10 hr,
.profile-page.profile-theme-11 hr,
.profile-page.profile-theme-12 hr {
  border-color: rgba(255, 255, 255, 0.2);
}

/* ==========================================================================
   Bordered Themes
   ========================================================================== */

/* ---------- 13 - Antique Tan ---------- */
.profile-page.profile-theme-13 {
  --profile-primary: #684217;
  --profile-primary-dark: #4a2f10;
  --profile-accent: #443e8c;
  --profile-bg: #f5eed9;
  --profile-card-bg: #fdf7ea;
  --profile-text: #212529;
  --profile-text-muted: #6d502e;
  --profile-link-color: #684217;
  --profile-link-hover: #c09e50;
  --profile-address-bg: rgba(104, 66, 23, 0.04);
  --profile-card-border: 2px solid #c09e50;
}

/* ---------- 14 - Classic Navy (Split) ---------- */
.profile-page.profile-theme-14 {
  --profile-primary: #000080;
  --profile-primary-dark: #000060;
  --profile-accent: #800000;
  --profile-bg: #e0e0f0;
  --profile-card-bg: #f1f1fa;
  --profile-text: #212529;
  --profile-text-muted: #800000;
  --profile-link-color: #000080;
  --profile-link-hover: #8000ff;
  --profile-address-bg: rgba(0, 0, 128, 0.03);
  --profile-card-border: 2px solid #000080;
}

/* ==========================================================================
   Split Layout Assignments
   Photo LEFT, Info CENTER, Logo RIGHT.
   display:contents on .profile-images dissolves the wrapper so <figure>
   children become direct flex items of the header row.
   ========================================================================== */

@media (min-width: 48rem) {
  /* Break the images wrapper so photo and logo become independent flex items */
  .profile-page.profile-theme-2 .profile-images,
  .profile-page.profile-theme-4 .profile-images,
  .profile-page.profile-theme-6 .profile-images,
  .profile-page.profile-theme-9 .profile-images,
  .profile-page.profile-theme-12 .profile-images,
  .profile-page.profile-theme-14 .profile-images {
    display: contents;
  }

  /* Photo stays on the left (standard split) */
  .profile-page.profile-theme-2 .profile-photo,
  .profile-page.profile-theme-4 .profile-photo,
  .profile-page.profile-theme-9 .profile-photo,
  .profile-page.profile-theme-12 .profile-photo,
  .profile-page.profile-theme-14 .profile-photo {
    order: 1;
    flex-shrink: 0;
    max-width: 13rem;
    padding-right: 1rem;
    margin-bottom: 0;
  }

  /* Info moves to center (all split themes) */
  .profile-page.profile-theme-2 .profile-info,
  .profile-page.profile-theme-4 .profile-info,
  .profile-page.profile-theme-6 .profile-info,
  .profile-page.profile-theme-9 .profile-info,
  .profile-page.profile-theme-12 .profile-info,
  .profile-page.profile-theme-14 .profile-info {
    order: 2;
    text-align: center;
  }

  .profile-page.profile-theme-2 .profile-info.has-images,
  .profile-page.profile-theme-4 .profile-info.has-images,
  .profile-page.profile-theme-6 .profile-info.has-images,
  .profile-page.profile-theme-9 .profile-info.has-images,
  .profile-page.profile-theme-12 .profile-info.has-images,
  .profile-page.profile-theme-14 .profile-info.has-images {
    text-align: center;
  }

  .profile-page.profile-theme-2 .profile-info .designations,
  .profile-page.profile-theme-4 .profile-info .designations,
  .profile-page.profile-theme-6 .profile-info .designations,
  .profile-page.profile-theme-9 .profile-info .designations,
  .profile-page.profile-theme-12 .profile-info .designations,
  .profile-page.profile-theme-14 .profile-info .designations {
    justify-content: center;
  }

  /* Logo moves to the right (standard split) */
  .profile-page.profile-theme-2 .profile-logo,
  .profile-page.profile-theme-4 .profile-logo,
  .profile-page.profile-theme-9 .profile-logo,
  .profile-page.profile-theme-12 .profile-logo,
  .profile-page.profile-theme-14 .profile-logo {
    order: 3;
    flex-shrink: 0;
    max-width: 13rem;
    padding-left: 1rem;
    margin-bottom: 0;
  }

  /* ---------- Reverse Split (Theme 6): Logo LEFT, Photo RIGHT ---------- */
  .profile-page.profile-theme-6 .profile-logo {
    order: 1;
    flex-shrink: 0;
    max-width: 13rem;
    padding-right: 1rem;
    margin-bottom: 0;
  }

  .profile-page.profile-theme-6 .profile-photo {
    order: 3;
    flex-shrink: 0;
    max-width: 13rem;
    padding-left: 1rem;
    margin-bottom: 0;
  }
}