/**
 * Site overrides (loaded after Helix compiled template.css).
 *
 * --mls-accent / --mls-accent-hover are set from the active Helix preset
 * in com_osproperty/osproperty.php (link_color, link_hover_color).
 */

:root {
  --mls-accent: #0345bf;
  --mls-accent-hover: #044cd0;
}

/* Helix default: #sp-main-body { padding: 100px 0; } — too much gap below menu */
#sp-main-body {
  padding-top: 1.25rem;
  padding-bottom: 2.5rem;
}

@media (min-width: 992px) {
  #sp-main-body {
    padding-top: 1.5rem;
    padding-bottom: 3rem;
  }
}

/* Page builder pages keep full-bleed layout */
.com-sppagebuilder #sp-main-body {
  padding-top: 0;
  padding-bottom: 0;
}

/* 6-MultiRows: hide top bar on mobile/tablet (logo + menu live in #sp-header) */
@media (max-width: 991.98px) {
  #sp-header-topbar {
    display: none !important;
  }
}

/* Offcanvas: secondary menus (agent, office) */
.offcanvas-menu-section {
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(15, 23, 42, 0.1);
}

.offcanvas-menu-section__title {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #64748b;
  margin: 0 0 0.75rem;
  padding: 0;
}

/* Header style-1: menu left, login/search right */
#sp-menu .header-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
}

#sp-menu .header-menu-left {
  flex: 1 1 auto;
  justify-content: flex-start;
}

#sp-menu .header-modules-right {
  flex: 0 0 auto;
  gap: 0.75rem;
}

#sp-menu .header-modules {
  gap: 0.5rem;
}

/*
 * Megamenu — match production chapalamls.net (advantagemls default.css + template.css).
 * Icons: Helix faicon renders <span class="fas fa-*"> inside the link (not on <a>).
 */
#sp-menu .sp-megamenu-parent > li > a,
#sp-menu .sp-megamenu-parent > li > span {
  display: inline-flex;
  align-items: center;
  padding: 0.35rem 0.75rem;
  font-size: 13px;
  font-weight: normal;
  text-transform: uppercase;
  color: #878788 !important;
  border-top: 2px solid transparent;
  border-bottom: 2px solid transparent;
  border-radius: 3px;
  line-height: 1.2;
}

#sp-menu .sp-megamenu-parent > li > a > .fa,
#sp-menu .sp-megamenu-parent > li > a > .fas,
#sp-menu .sp-megamenu-parent > li > a > .far,
#sp-menu .sp-megamenu-parent > li > a > .fab {
  margin-right: 6px;
  color: #878788;
  font-weight: 900;
  font-size: 0.95em;
}

#sp-menu .sp-megamenu-parent > li.active > a,
#sp-menu .sp-megamenu-parent > li.current-item.active > a,
#sp-menu .sp-megamenu-parent > li:hover > a {
  color: #333 !important;
  border-color: #78635a;
}

#sp-menu .sp-megamenu-parent > li.active > a > .fa,
#sp-menu .sp-megamenu-parent > li.active > a > .fas,
#sp-menu .sp-megamenu-parent > li.active > a > .far,
#sp-menu .sp-megamenu-parent > li.current-item.active > a > .fa,
#sp-menu .sp-megamenu-parent > li.current-item.active > a > .fas,
#sp-menu .sp-megamenu-parent > li:hover > a > .fa,
#sp-menu .sp-megamenu-parent > li:hover > a > .fas {
  color: #333;
}

/*
 * Profile dropdown width — do NOT edit template.css (Helix recompiles it from scss/theme.scss).
 */
.sp-profile-wrapper .sp-profile-dropdown {
  min-width: 240px;
}

/* Office Menu module (user dropdown / logged-in-usermenu) */
.sp-profile-dropdown .office-menu-module {
  padding: 0.35rem 0;
  margin: 0;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.sp-profile-dropdown .office-menu-module .mod-menu__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sp-profile-dropdown .office-menu-module .nav-link {
  display: block;
  padding: 0.45rem 1rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: #334155;
  border-radius: 0;
}

.sp-profile-dropdown .office-menu-module .nav-link:hover,
.sp-profile-dropdown .office-menu-module .nav-link:focus {
  color: var(--mls-accent, #0345bf);
  background: #f8fafc;
}

.sp-profile-dropdown .office-menu-module .nav-link.active {
  color: var(--mls-accent, #0345bf);
  font-weight: 600;
  background: #f1f5f9;
}

/* Offices megamenu (main nav > Offices) */
.sp-megamenu-parent .offices-megamenu-list {
  padding: 0.75rem 1rem;
  min-width: 280px;
}

.sp-megamenu-parent .offices-megamenu-link {
  color: #334155 !important;
  font-size: 0.875rem;
  font-weight: 500;
  padding: 0.2rem 0;
}

.sp-megamenu-parent .offices-megamenu-link:hover,
.sp-megamenu-parent .offices-megamenu-link:focus {
  color: var(--mls-accent, #0345bf) !important;
}

.sp-megamenu-parent .sp-dropdown-mega.offices-megamenu .sp-dropdown-inner {
  max-height: 70vh;
  overflow-y: auto;
}

/* OS Property offices list (profile dropdown — only if module is in logged-in-usermenu) */
.sp-profile-dropdown .office-list-menu-module {
  max-height: 280px;
  overflow-y: auto;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  padding: 0.25rem 0;
}

.sp-profile-dropdown .office-list-menu-module .list-companies {
  columns: 1 !important;
}

.sp-profile-dropdown .office-list-menu-module .list-group-item {
  background: transparent;
}

.sp-profile-dropdown .office-list-menu-module a {
  color: #334155 !important;
  font-weight: 500;
}

.sp-profile-dropdown .office-list-menu-module a:hover,
.sp-profile-dropdown .office-list-menu-module a:focus {
  color: var(--mls-accent, #0345bf) !important;
  background: #f8fafc;
}

.mls-youtube-embed {
  position: relative;
  width: 100%;
  max-width: 990px;
  margin: 0 auto 1.5rem;
  aspect-ratio: 16 / 9;
  margin: 0 auto;
  height: 332px;
}
.mls-youtube-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* ═══════════════════════════════════════════════════════
   Advanced Search — Modern Look
   ═══════════════════════════════════════════════════════ */

/* ── Variables locales ── */
.osp-adv-search {
  --osp-accent:      var(--mls-accent, #0345bf);
  --osp-accent-light: rgba(3,69,191,.08);
  --osp-border:      #e2e6ea;
  --osp-radius:      10px;
  --osp-label-color: #4b5563;
  --osp-input-bg:    #f9fafb;
  --osp-shadow:      0 1px 4px rgba(3, 69, 191, .07);
}

/* ── Igual height en las 4 columnas ── */
.osp-adv-search .content_search {
  align-items: stretch !important;
}
.osp-adv-search .content_search > [class*="col-"] {
  display: flex !important;
  flex-direction: column !important;
}
.osp-adv-search .osp-adv-search-panel {
  flex: 1 !important;
}
.osp-adv-search .osp-adv-search-panel-inner {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
}

/* ── Panel cards ── */
.osp-adv-search .osp-adv-search-panel {
  border-color: var(--osp-border) !important;
  border-radius: var(--osp-radius) !important;
  box-shadow: var(--osp-shadow) !important;
  transition: box-shadow .2s;
}
.osp-adv-search .osp-adv-search-panel:hover {
  box-shadow: 0 3px 12px rgba(3, 69, 191, .11) !important;
}

/* Borde accent izquierdo en cada panel */
.osp-adv-search .osp-adv-search-panel {
  border-left: 3px solid var(--osp-accent) !important;
}

/* ── Panel title ── */
.osp-adv-search .osp-adv-search-panel-title {
  color: var(--osp-accent) !important;
  font-size: .8rem !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
  padding-bottom: .6rem !important;
  margin-bottom: .75rem !important;
}
.osp-adv-search .osp-adv-search-panel-title .osicon {
  color: var(--osp-accent) !important;
  opacity: .7;
}

/* ── Labels (strong tags usados como labels) ── */
.osp-adv-search strong {
  color: var(--osp-label-color) !important;
  font-size: .72rem !important;
  font-weight: 600 !important;
  letter-spacing: .05em !important;
  text-transform: uppercase !important;
  margin-bottom: .3rem !important;
}

/* ── Inputs y Selects ── */
.osp-adv-search select,
.osp-adv-search input[type="text"],
.osp-adv-search input[type="number"] {
  background-color: var(--osp-input-bg) !important;
  border: 1.5px solid var(--osp-border) !important;
  border-radius: 7px !important;
  color: #1a1d21 !important;
  font-size: .875rem !important;
  min-height: 38px !important;
  padding: .35rem .65rem !important;
  transition: border-color .15s, box-shadow .15s !important;
  width: 100% !important;
  max-width: 100% !important;
}
.osp-adv-search select:focus,
.osp-adv-search input[type="text"]:focus,
.osp-adv-search input[type="number"]:focus {
  border-color: var(--osp-accent) !important;
  box-shadow: 0 0 0 3px rgba(3,69,191,.15) !important;
  background-color: #fff !important;
  outline: none !important;
}

/* Select — flecha custom */
.osp-adv-search select:not([multiple]) {
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%234b5563' d='M6 8L0 0h12z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right .75rem center !important;
  padding-right: 2.2rem !important;
}

/* Select múltiple */
.osp-adv-search select[multiple] {
  min-height: 80px !important;
  border-radius: 7px !important;
}

/* ── Range rows (precio, m²) ── */
.osp-adv-search .osp-adv-price-row,
.osp-adv-search .osp-adv-range-row {
  gap: 0 !important;
  border: 1.5px solid var(--osp-border) !important;
  border-radius: 7px !important;
  overflow: hidden !important;
  background: var(--osp-input-bg) !important;
}
.osp-adv-search .osp-adv-price-row input,
.osp-adv-search .osp-adv-range-row input {
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.osp-adv-search .osp-adv-price-row input:first-child,
.osp-adv-search .osp-adv-range-row input:first-child {
  border-right: 1.5px solid var(--osp-border) !important;
}
.osp-adv-search .osp-adv-price-row:focus-within,
.osp-adv-search .osp-adv-range-row:focus-within {
  border-color: var(--osp-accent) !important;
  box-shadow: 0 0 0 3px rgba(3,69,191,.15) !important;
}

/* ── Checkboxes (Extra Info / amenities) ── */
.osp-adv-search input[type="checkbox"] {
  width: 15px !important;
  height: 15px !important;
  accent-color: var(--osp-accent) !important;
  cursor: pointer !important;
  vertical-align: middle !important;
  margin-right: .3rem !important;
}

/* ── More Options toggle ── */
.osp-adv-search .more_option {
  background: var(--osp-accent-light) !important;
  border: 1.5px solid rgba(3,69,191,.25) !important;
  border-radius: 7px !important;
  color: var(--osp-accent) !important;
  font-size: .8rem !important;
  font-weight: 600 !important;
  padding: .4rem 1rem !important;
  transition: background .2s, border-color .2s !important;
}
.osp-adv-search .more_option:hover {
  background: #d6e4f7 !important;
  border-color: var(--osp-accent) !important;
}

/* More options expanded area */
#more_option_div {
  background: var(--osp-accent-light) !important;
  border: 1.5px dashed rgba(3,69,191,.20) !important;
  border-radius: var(--osp-radius) !important;
  padding: 1rem !important;
  margin-top: .5rem !important;
}

/* ── Actions bar (botones Search / Reset) ── */
.osp-adv-search-actions {
  background: #fff !important;
  border-color: var(--osp-border) !important;
  border-radius: var(--osp-radius) !important;
  box-shadow: var(--osp-shadow) !important;
  border-left: 3px solid var(--osp-accent) !important;
  padding: .85rem 1.25rem !important;
  margin-top: 1rem !important;
}

.osp-adv-search-actions .submit-advsearch {
  background: var(--osp-accent) !important;
  border: none !important;
  border-radius: 8px !important;
  color: #fff !important;
  font-size: .9rem !important;
  font-weight: 600 !important;
  letter-spacing: .03em !important;
  min-width: 160px !important;
  padding: .55rem 1.5rem !important;
  transition: background .2s, transform .1s !important;
}
.osp-adv-search-actions .submit-advsearch:hover {
  background: var(--mls-accent-hover, #044cd0) !important;
  transform: translateY(-1px) !important;
}
.osp-adv-search-actions .submit-advsearch:active {
  transform: translateY(0) !important;
}

.osp-adv-search-actions .btn-outline-secondary {
  border-radius: 8px !important;
  border-color: var(--osp-border) !important;
  color: var(--osp-label-color) !important;
  font-size: .875rem !important;
  padding: .5rem 1.25rem !important;
}
.osp-adv-search-actions .btn-outline-secondary:hover {
  border-color: #9ca3af !important;
  background: #f3f4f6 !important;
  color: #1a1d21 !important;
}

/* ── small_text helper ── */
.osp-adv-search .small_text {
  font-size: .7rem !important;
  color: #9ca3af !important;
  margin-bottom: .4rem !important;
}

/* ── Spacing limpieza ── */
.osp-adv-search .col-md-12 {
  margin-bottom: .6rem !important;
}
.osp-adv-search .col-md-12:last-child {
  margin-bottom: 0 !important;
}

/* ══════════════════════════════════════════════
   Listing / Portfolio — property cards
   ══════════════════════════════════════════════ */

/* Card wrapper */
li.featured,
li.property-item {
  list-style: none;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 1.25rem;
  box-shadow: 0 1px 6px rgba(0,0,0,.06);
  transition: box-shadow .2s ease, transform .2s ease;
}
li.featured:hover,
li.property-item:hover {
  box-shadow: 0 6px 20px rgba(0,0,0,.1);
  transform: translateY(-1px);
}

.latestproperties ul.display,
ul.property-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* Title bar */
.list-title {
  background: #f8fafc;
  border-bottom: 1px solid #e9ecef;
  padding: .5rem .75rem !important;
}
.list-title h3 {
  font-size: 1rem;
  font-weight: 700;
  margin: 0;
  line-height: 1.4;
}
.list-title h3 a {
  color: #1e3a5f;
  text-decoration: none;
}
.list-title h3 a:hover {
  color: var(--mls-accent);
}

/* Upload date & address */
p.uploadedon {
  font-size: .72rem;
  color: #9ca3af;
  margin-bottom: .1rem;
}
p.address {
  font-size: .8rem;
  color: #6b7280;
  margin-bottom: .3rem;
}
p.address .fa {
  color: var(--mls-accent);
  margin-right: .25rem;
}

/* Price */
.price_original,
span.price {
  font-size: 1.15rem;
  font-weight: 700;
  color: #1e3a5f;
}
span.price_reduction strike {
  color: #9ca3af;
  font-size: .9rem;
  font-weight: 400;
}

/* Specs grid */
.pro-basic-info {
  background: #f8fafc;
  border: 1px solid #e9ecef;
  border-radius: 8px;
  padding: .4rem .6rem;
  margin-top: .5rem;
  columns: 2;
  column-gap: 1rem;
}
@media (max-width: 600px) { .pro-basic-info { columns: 1; } }

.row-list {
  display: flex;
  align-items: baseline;
  padding: 2px 0;
  break-inside: avoid;
  border-bottom: 1px solid #f0f4f8;
  font-size: .8rem;
}
.row-list:last-child { border-bottom: none; }

.type-name {
  color: #6b7280;
  font-weight: 600;
  font-size: .75rem;
  flex: 0 0 110px;
  min-width: 110px;
}
.type-value {
  color: #1a1d21;
  font-size: .8rem;
  flex: 1;
  min-width: 0;
}

/* Action buttons strip */
.property-list-actions {
  background: #f1f5f9;
  border-top: 1px solid #e2e8f0;
  padding: .35rem .25rem;
}
ul.listingActions-list-actions {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
  justify-content: center;
  gap: .15rem;
}
li.propertyinfoaction {
  padding: 3px 6px !important;
}
li.propertyinfoaction a {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: .65rem;
  color: #64748b;
  text-decoration: none;
  gap: 2px;
  transition: color .15s;
}
li.propertyinfoaction a:hover { color: var(--mls-accent); }
li.propertyinfoaction .fa { font-size: .95rem; }
span.text-icon { display: block; }

/* Agent thumbnail row (inside photo column) */
.img-agent-responsive {
  background: #f8fafc;
  border-top: 1px solid #e9ecef;
  padding: .4rem .5rem;
  font-size: .78rem;
  color: #374151;
}
.img-agent-responsive img {
  border-radius: 6px;
  border: 1px solid #e2e8f0;
  padding: 2px;
}

/* Agent side panel */
.img-agent {
  border-left: 1px solid #e9ecef;
  padding: .6rem .5rem;
  text-align: center;
  background: #fafbfc;
}
.img-agent img { border-radius: 6px; margin-bottom: .25rem; }
.img-agent a { font-size: .8rem; color: #374151; text-decoration: none; }
.img-agent a:hover { color: var(--mls-accent); }

/* Photo count badge */
.property_details_photo_count {
  background: rgba(0,0,0,.55);
  color: #fff;
  font-size: .7rem;
  border-radius: 4px;
  padding: 1px 6px;
  display: inline-block;
}

/* Toolbar row (sTable) */
.sTable {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  margin-bottom: 1rem;
  font-size: .82rem;
}
.sTable td { vertical-align: middle !important; }

/* Share action buttons (email / whatsapp / clients) */
.btn-share {
  color: #374151;
  border-radius: 8px;
  padding: .3rem .5rem;
  transition: background .15s, color .15s;
}
.btn-share:hover {
  background: #f1f5f9;
  color: var(--mls-accent);
}
.btn-share .fa { display: block; margin: 0 auto .1rem; }

/* Featured strip badge */
.featured_strip {
  background: var(--mls-accent);
  color: #fff;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .04em;
  padding: 2px 10px;
  text-align: center;
}

/* Photo nav arrows */
.property_details_photo_prev,
.property_details_photo_next {
  cursor: pointer;
  opacity: .75;
  transition: opacity .15s;
}
.property_details_photo_prev:hover,
.property_details_photo_next:hover { opacity: 1; }
}
