/* ============================================================
   INMOBILIARIA PV — LUXURY DARK THEME
   Overrides para style.css — se carga al último
   ============================================================ */

/* ----------------------------------------------------------
   1. CSS VARIABLES
   ---------------------------------------------------------- */
:root {
  --gold:        #C9A84C;
  --gold-light:  #E8C96A;
  --gold-dark:   #8B6914;
  --gold-faint:  rgba(201,168,76,0.15);
  --gold-border: rgba(201,168,76,0.25);
  --gold-glow:   rgba(201,168,76,0.12);
  --bg-main:     #0A0A0A;
  --bg-2:        #111111;
  --bg-3:        #1A1A1A;
  --bg-4:        #222222;
  --text-main:   #F5F5F0;
  --text-muted:  #9A9A8A;
  --text-dim:    #6A6A5A;
  --border:      rgba(201,168,76,0.2);
  --white:       #ffffff;
  --radius-card: 8px;
  --radius-btn:  4px;
  --transition:  0.3s ease;
}

/* ----------------------------------------------------------
   2. SCROLLBAR
   ---------------------------------------------------------- */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--bg-2); }
::-webkit-scrollbar-thumb { background: var(--gold-dark); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--gold); }

/* ----------------------------------------------------------
   3. GLOBAL RESET / TYPOGRAPHY
   ---------------------------------------------------------- */
body {
  background-color: var(--bg-main) !important;
  color: var(--text-main) !important;
  font-family: 'Inter', 'Montserrat', sans-serif !important;
  font-size: 16px !important;
}
html { background-color: var(--bg-main); }

::-moz-selection { background: var(--gold); color: #000; }

::selection { background: var(--gold); color: #000; }
::-moz-selection { background: var(--gold); color: #000; }

h1, h2, h3, h4, h5, h6 {
  font-family: 'Playfair Display', Georgia, serif !important;
  color: var(--text-main) !important;
  font-weight: 600;
}
h1, h2 { font-size: 36px; }
h3 { font-size: 26px; }
h4 { font-size: 20px; }
h5 { font-size: 14px; letter-spacing: 1.5px; color: var(--gold) !important; }

p { color: var(--text-muted); }

a, a:hover { color: var(--gold); }
a { transition: color var(--transition); }
a:hover { text-decoration: none; color: var(--gold-light); }

/* Clases de color legacy → mapeadas al nuevo tema */
.blanco  { color: var(--text-main)  !important; }
.blue    { color: var(--gold)        !important; }
.cyan    { color: var(--gold)        !important; }
.beige   { color: var(--text-muted)  !important; }
.aqua    { color: var(--gold-light)  !important; }
.azul-claro { color: var(--text-muted) !important; }

/* ----------------------------------------------------------
   4. LOADER / SPLASH
   ---------------------------------------------------------- */
.loading {
  background-color: var(--bg-main) !important;
  display: flex;
  align-items: center;
  justify-content: center;
}
.loading img {
  filter: brightness(0) invert(1);
  opacity: 0.9;
  animation: luxPulse 1.2s ease-in-out infinite alternate;
}
@keyframes luxPulse {
  from { opacity: 0.5; transform: scale(0.97); }
  to   { opacity: 1;   transform: scale(1.03); }
}

/* ----------------------------------------------------------
   5. NAVBAR
   ---------------------------------------------------------- */
#menu-sitio {
  background: rgba(10,10,10,0.92) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
  box-shadow: none;
  transition: all var(--transition);
  padding: 14px 0;
}
#menu-sitio.scrolled-nav {
  background: rgba(10,10,10,0.98) !important;
  border-bottom-color: var(--gold-border);
  box-shadow: 0 4px 30px rgba(0,0,0,0.6);
  padding: 8px 0;
}

/* Logo */
#menu-sitio .navbar-brand img {
  filter: brightness(0) invert(1);
  max-height: 40px;
  transition: filter var(--transition);
}
#menu-sitio .navbar-brand:hover img {
  filter: brightness(0) saturate(100%) invert(73%) sepia(52%) saturate(400%) hue-rotate(10deg);
}

/* Nav links */
#menu-sitio .navbar-nav .nav-link {
  color: var(--text-main) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: 500;
  letter-spacing: 1.4px;
  padding: 8px 14px !important;
  transition: color var(--transition);
  text-transform: uppercase;
}
#menu-sitio .navbar-nav .nav-link:hover,
#menu-sitio .navbar-nav .item-submenu:hover > a {
  color: var(--gold) !important;
  background: transparent !important;
  box-shadow: none !important;
  text-decoration: none !important;
  border-bottom: 2px solid var(--gold);
  padding-bottom: 6px !important;
}
/* Evita el underline en el botón CTA */
#menu-sitio .navbar-nav .nav-link.btn-contacto:hover {
  border-bottom: none !important;
  padding-bottom: 7px !important;
}

/* Botón SEARCH (CTA) — dorado */
#menu-sitio .btn-contacto {
  background: var(--gold) !important;
  border: 1px solid var(--gold) !important;
  border-radius: var(--radius-btn);
  padding: 7px 18px !important;
  color: #000 !important;
  transition: all var(--transition) !important;
}
#menu-sitio .btn-contacto:before { background: var(--gold-light) !important; }
#menu-sitio .btn-contacto:hover {
  background: var(--gold-light) !important;
  border-color: var(--gold-light) !important;
  color: #000 !important;
}
#menu-sitio .btn-contacto span { color: inherit !important; }
#menu-sitio.scrolled-nav .btn-contacto { background: var(--gold) !important; }
#menu-sitio.scrolled-nav .btn-contacto:hover { background: var(--gold-light) !important; }

/* Submenú */
.submenu {
  background: var(--bg-2) !important;
  border: 1px solid var(--border) !important;
  border-top: 2px solid var(--gold) !important;
  border-radius: 0 0 var(--radius-card) var(--radius-card);
  box-shadow: 0 12px 30px rgba(0,0,0,0.5) !important;
  list-style: none;
  margin: 0;
  padding: 8px 0 !important;
}
.submenu li a {
  color: var(--text-muted) !important;
  display: block;
  font-size: 12px !important;
  font-weight: 500;
  letter-spacing: 1px;
  padding: 9px 20px !important;
  text-transform: uppercase;
  transition: all var(--transition);
}
.submenu li a:hover {
  background: var(--gold-faint) !important;
  color: var(--gold) !important;
  padding-left: 26px !important;
}

/* Hamburger */
.navbar-toggler { border: 1px solid var(--border); padding: 6px 10px; }
.toggler-icon {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--gold);
  margin: 4px 0;
  border-radius: 1px;
  transition: all var(--transition);
}
/* Neutralizar las barras pseudo-element de style.css (evita doble hamburguesa) */
.navbar-toggler:before,
.navbar-toggler:after {
  content: none !important;
}

/* Línea dorada inferior navbar en móvil */
#navbarSupportedContent.show {
  background: rgba(10,10,10,0.98);
  border-top: 1px solid var(--border);
  padding: 10px 0;
}

/* ----------------------------------------------------------
   6. BOTONES
   ---------------------------------------------------------- */
.btn-exotic {
  background: transparent !important;
  border: 1px solid var(--gold) !important;
  border-radius: var(--radius-btn) !important;
  color: var(--gold) !important;
  display: inline-block;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: 2px;
  padding: 14px 34px !important;
  text-transform: uppercase;
  transition: all var(--transition) !important;
  position: relative;
  overflow: hidden;
}
.btn-exotic span { position: relative; z-index: 1; }
.btn-exotic::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--transition);
}
.btn-exotic:hover::before { transform: scaleX(1); }
.btn-exotic:hover { color: #000 !important; }

.btn-blue {
  background: var(--gold) !important;
  border: 1px solid var(--gold) !important;
  border-radius: var(--radius-btn) !important;
  color: #000 !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: 700;
  letter-spacing: 2px;
  padding: 14px 34px !important;
  text-transform: uppercase;
  transition: all var(--transition) !important;
}
.btn-blue:hover {
  background: var(--gold-light) !important;
  border-color: var(--gold-light) !important;
  color: #000 !important;
  box-shadow: 0 6px 20px var(--gold-glow);
}

.btn-cyan, .btn-white {
  background: transparent !important;
  border: 1px solid var(--gold-border) !important;
  border-radius: var(--radius-btn) !important;
  color: var(--text-main) !important;
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: 2px;
  padding: 14px 34px !important;
  text-transform: uppercase;
  transition: all var(--transition) !important;
}
.btn-cyan:hover, .btn-white:hover {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
  color: #000 !important;
}

/* Botón de búsqueda */
.btn-search {
  background: var(--gold) !important;
  border: none !important;
  border-radius: 0 var(--radius-btn) var(--radius-btn) 0 !important;
  color: #000 !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  transition: background var(--transition) !important;
}
.btn-search:hover { background: var(--gold-light) !important; }
.btn-search:after { filter: invert(1); }

/* ----------------------------------------------------------
   7. SEPARADOR DORADO DE SECCIÓN
   ---------------------------------------------------------- */
.section-divider {
  display: block;
  width: 60px;
  height: 2px;
  background: var(--gold);
  margin: 0 auto 30px;
}
.section-divider-left {
  display: block;
  width: 60px;
  height: 2px;
  background: var(--gold);
  margin: 0 0 30px;
}

/* ----------------------------------------------------------
   8. HERO / SLIDER
   ---------------------------------------------------------- */
#slider-home .slide-home {
  position: relative;
}
#slider-home .slide-home::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.62);
  z-index: 0;
}
#slider-home .texto-slide {
  position: relative;
  z-index: 1;
}
#slider-home .texto-slide h1 {
  font-family: 'Playfair Display', serif !important;
  font-size: 58px !important;
  font-weight: 700 !important;
  color: var(--text-main) !important;
  text-shadow: 0 2px 20px rgba(0,0,0,0.6);
  line-height: 1.15;
}
#scroll-intro {
  border-color: var(--gold) !important;
}
#scroll-intro::after { border-color: var(--gold) !important; }

/* ----------------------------------------------------------
   9. SECCIÓN INTRO (estadísticas)
   ---------------------------------------------------------- */
#intro {
  background: var(--bg-2) !important;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 80px 0 !important;
}
#intro h1, #intro h2 {
  color: var(--text-main) !important;
}
#intro h1 strong, #intro h2 strong { color: var(--gold) !important; }

/* ----------------------------------------------------------
   10. HOME BOXES (estadísticas 4 columnas)
   ---------------------------------------------------------- */
#home-boxes { background: var(--bg-3) !important; }
.home-box {
  border-right: 1px solid var(--border);
  transition: background var(--transition);
}
.home-box:last-child { border-right: none; }
.home-box:hover { background: var(--bg-4); }
.home-box h3, .home-box h4 {
  color: var(--text-main) !important;
}
.home-box h3 { font-size: 32px !important; color: var(--gold) !important; }
.line-aqua {
  background: var(--gold) !important;
  height: 2px !important;
  width: 40px !important;
}
.dotted-white { opacity: 0.08; }

/* ----------------------------------------------------------
   11. SECCIÓN ABOUT / SERVICES
   ---------------------------------------------------------- */
#home-about { background: var(--bg-main) !important; padding: 80px 0 0 !important; }
.beige-block { background: var(--bg-3) !important; }

#home-services {
  background: #0d0d0d url('') no-repeat center !important;
  background-size: cover !important;
  position: relative;
}
#home-services::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.55);
}
#home-services h3 {
  background: transparent !important;
  border: 1px solid var(--gold-border) !important;
  color: var(--gold) !important;
  letter-spacing: 4px !important;
}
#home-services h2, #home-services p {
  position: relative;
  z-index: 1;
}
#home-services h3 { position: relative; z-index: 1; }

/* ----------------------------------------------------------
   12. TARJETAS REAL ESTATE
   ---------------------------------------------------------- */
#home-real-estate {
  background: var(--bg-main) !important;
  padding: 100px 0 60px !important;
}
.info-box-re {
  background: var(--bg-2) !important;
  border: 1px solid var(--gold-faint) !important;
  border-top: none !important;
  border-radius: 0 0 var(--radius-card) var(--radius-card);
  transition: border-color var(--transition), box-shadow var(--transition);
  padding: 16px 18px !important;
}
.box-re:hover .info-box-re {
  border-color: var(--gold-border) !important;
  box-shadow: 0 4px 20px var(--gold-glow);
}
.container-img {
  border-radius: var(--radius-card) var(--radius-card) 0 0;
  overflow: hidden;
}
.name-box-re {
  color: var(--text-main) !important;
  font-family: 'Playfair Display', serif !important;
  font-size: 17px !important;
  font-weight: 500;
  width: 100% !important;
  display: block !important;
}
.price-re {
  color: #ffc107 !important;
  font-family: 'Playfair Display', serif !important;
  font-size: 18px !important;
  font-weight: 600;
  display: inline-block !important;
  width: auto !important;
  text-align: left !important;
  padding: 4px 10px !important;
  background: transparent !important;
  border-radius: 4px !important;
}
.description-box-re { color: var(--text-muted) !important; font-size: 13px !important; }
.features-box-re { color: var(--text-dim) !important; font-size: 12px !important; }

.badge {
  background: var(--gold) !important;
  color: #000 !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  font-weight: 700;
  letter-spacing: 2px;
  border-radius: 0 var(--radius-card) 0 var(--radius-btn) !important;
  padding: 7px 16px !important;
}

/* ----------------------------------------------------------
   13. TARJETAS DEVELOPMENTS
   ---------------------------------------------------------- */
#home-developments {
  background: var(--bg-3) !important;
  padding: 100px 0 !important;
}
.info-box-dev {
  background: var(--bg-2) !important;
  border: 1px solid var(--gold-faint) !important;
  border-top: none !important;
  border-radius: 0 0 var(--radius-card) var(--radius-card);
  padding: 16px 18px !important;
  transition: border-color var(--transition), box-shadow var(--transition);
}
.box-dev:hover .info-box-dev {
  border-color: var(--gold-border) !important;
  box-shadow: 0 4px 20px var(--gold-glow);
}
.name-box-dev {
  color: var(--text-main) !important;
  font-family: 'Playfair Display', serif !important;
  font-size: 22px !important;
}
.price-dev {
  background: transparent !important;
  color: var(--gold) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  position: static !important;
  height: auto !important;
  padding: 0 0 6px 0 !important;
  display: block;
}
.description-box-dev { color: var(--text-muted) !important; font-size: 13px !important; }
.features-box-dev { color: var(--text-dim) !important; font-size: 12px !important; }
.info-home-dev { color: var(--text-muted) !important; }

/* ----------------------------------------------------------
   14. VACATION RENTALS
   ---------------------------------------------------------- */
#home-vacation { background: var(--bg-main) !important; }
#home-vacation .info-box-re {
  background: var(--bg-2) !important;
}
.slide-vr .name-box-re { color: var(--text-main) !important; }

/* ----------------------------------------------------------
   15. PROPERTY MANAGEMENT
   ---------------------------------------------------------- */
#home-property { background: var(--bg-3) !important; }
.block-hpm { background: var(--bg-2) !important; }
#home-property h2 { color: var(--gold) !important; }
#home-property .pbig { color: var(--text-main) !important; }
#home-property p { color: var(--text-muted) !important; }

/* ----------------------------------------------------------
   16. TESTIMONIALES
   ---------------------------------------------------------- */
#home-testimonials { background: var(--bg-2) !important; }
.slide-testimonios {
  background: var(--bg-3) !important;
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
}
.slide-testimonios .pbig { color: var(--text-muted) !important; }
.block-ht { background: var(--gold) !important; opacity: 0.06 !important; }

/* ----------------------------------------------------------
   17. PUBLICIDAD / BANNERS
   ---------------------------------------------------------- */
#publicidad { background: var(--bg-main) !important; }
.slide-publicidad { position: relative; }
.slide-publicidad::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.5);
}
.slide-publicidad .btn-exotic { position: relative; z-index: 1; }

/* ----------------------------------------------------------
   18. PAGES: HEADERS DE SECCIÓN
   ---------------------------------------------------------- */
#beige-header {
  background: linear-gradient(135deg, var(--bg-2) 0%, var(--bg-3) 100%) !important;
  border-bottom: 1px solid var(--border);
}
#beige-header h1 { color: var(--text-main) !important; }

#blue-header {
  background: linear-gradient(135deg, var(--bg-2) 0%, var(--bg-3) 100%) !important;
  border-bottom: 1px solid var(--border);
}
#blue-header h1, #blue-header p { color: var(--text-main) !important; }
#blue-header p { color: var(--text-muted) !important; }

#simple-header {
  background: var(--bg-main) !important;
  border-bottom: 1px solid var(--border);
}
#simple-header h1 { color: var(--text-main) !important; }
#simple-header p { color: var(--text-muted) !important; }

/* ----------------------------------------------------------
   19. MLS / FILTROS
   ---------------------------------------------------------- */
#title-mls {
  background: var(--bg-2) !important;
  border-bottom: 1px solid var(--border);
}
#title-mls h1 { color: var(--text-main) !important; }

.cont-filter-mls {
  background: var(--bg-3) !important;
  border-bottom: 1px solid var(--border);
}
.btn-switch {
  border-color: var(--gold-border) !important;
  color: var(--text-muted) !important;
}
.btn-switch:hover {
  background: var(--gold) !important;
  color: #000 !important;
}

.filter-mls {
  background: var(--bg-2) !important;
  border-right: 1px solid var(--border);
}
.filter-mls h4 { color: var(--text-main) !important; }
.filter-mls .box-form { background: var(--bg-3) !important; border: 1px solid var(--border); border-radius: var(--radius-btn); margin-bottom: 10px; }
.filter-mls .bootstrap-select { border-color: var(--border) !important; }
.filter-mls .box-form input { background: transparent !important; color: var(--text-main) !important; }

.content-mls { border-left-color: var(--border) !important; background: var(--bg-main) !important; }

#list-view-mls .price-re {
  background: transparent !important;
  color: #ffffff !important;
  font-weight: 600;
  width: 100% !important;
  padding: 8px 20px !important;
  text-shadow: none;
}
#list-view-mls .info-box-re {
  border-color: var(--border) !important;
}

.info-results {
  background: var(--bg-3) !important;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  color: var(--text-muted) !important;
}
.info-results span { border-right-color: var(--border) !important; }

.pager .page-number { color: var(--gold) !important; }
.pager .page-number:before { background: var(--gold) !important; }

.title-mls { color: var(--text-main) !important; }
.data-mls { color: var(--gold) !important; }
.mls-line { border-bottom-color: var(--border) !important; }

/* ----------------------------------------------------------
   20. FORMULARIOS
   ---------------------------------------------------------- */
.box-form {
  background: var(--bg-3) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-btn);
}
.box-form label { color: var(--text-muted) !important; font-size: 11px !important; letter-spacing: 1.2px; text-transform: uppercase; }
.box-form input, .box-form select, .box-form textarea {
  background: transparent !important;
  color: var(--text-main) !important;
  border: none !important;
}
.box-form input::-moz-placeholder, .box-form textarea::-moz-placeholder { color: var(--text-dim) !important; }
.box-form input::placeholder, .box-form textarea::placeholder { color: var(--text-dim) !important; }
.box-form select { color: var(--text-muted) !important; }

.form-exotic-horizontal {
  background: rgba(10,10,10,0.75) !important;
  border: 1px solid var(--border);
  backdrop-filter: blur(10px);
}
.form-exotic-horizontal .box-form {
  border-right: 1px solid var(--border) !important;
  background: transparent !important;
  border-radius: 0 !important;
  border-top: none !important;
  border-bottom: none !important;
  border-left: none !important;
}

.bootstrap-select .dropdown-toggle { color: var(--text-muted) !important; }
.bootstrap-select .dropdown-menu {
  background: var(--bg-3) !important;
  border-color: var(--border) !important;
}
.bootstrap-select .dropdown-item { color: var(--text-muted) !important; }
.bootstrap-select .dropdown-item:hover,
.bootstrap-select .dropdown-item.active,
.bootstrap-select .dropdown-item:active {
  background: var(--gold-faint) !important;
  color: var(--gold) !important;
}

/* Formulario de contacto */
#cont-form-contact {
  background: var(--bg-2) !important;
  border-left: 1px solid var(--border);
}
#cont-form-contact h3 { color: var(--text-main) !important; }
.form-exotic.form-contact .box-form {
  background: var(--bg-3) !important;
  border-color: var(--border) !important;
}
.form-exotic.form-contact .box-form label { color: var(--text-muted) !important; }

.txt-contact h1, .txt-contact h2 { color: var(--text-main) !important; }
.txt-contact p { color: var(--text-muted) !important; }
.txt-contact a { color: var(--gold) !important; }

/* Checkboxes */
input[type=checkbox] { background: var(--bg-3) !important; border-color: var(--border) !important; }
input[type=checkbox]:checked { background: var(--gold) !important; }
.checkcustom .label-check { color: var(--text-muted) !important; }
.checkcustom .borde-check { border-color: var(--border) !important; }
.radio-checkmark { background-color: var(--bg-3) !important; border-color: var(--border) !important; }
.radio-container input:checked ~ .radio-checkmark { background-color: var(--gold) !important; border-color: var(--gold) !important; }

/* ----------------------------------------------------------
   21. PROPIEDADES / DETALLE
   ---------------------------------------------------------- */
.header-property {
  background: var(--bg-2) !important;
  border-bottom: 1px solid var(--border);
}
.header-property h1, .header-property h4 { color: var(--text-main) !important; }
.info-development .pbig { color: var(--gold) !important; font-size: 28px !important; }

.nav-tabs a {
  background: var(--bg-3) !important;
  border-color: var(--border) !important;
  color: var(--text-muted) !important;
}
.nav-tabs a:hover, .nav-tabs li a.active {
  background: var(--bg-2) !important;
  color: var(--gold) !important;
  border-bottom-color: var(--gold) !important;
}

.buttons-view {
  background: var(--bg-2) !important;
  border-color: var(--border) !important;
  box-shadow: 0 8px 30px rgba(0,0,0,0.4) !important;
}
.buttons-view a, .buttons-view span.spanbtn { color: var(--text-main) !important; }

.form-view {
  background: var(--bg-2) !important;
  border-color: var(--border) !important;
  box-shadow: 0 8px 30px rgba(0,0,0,0.4) !important;
}
.form-view::-webkit-scrollbar-thumb { background: var(--gold) !important; }

.show-images {
  background: var(--bg-2) !important;
  border-color: var(--gold-border) !important;
  color: var(--text-main) !important;
}
.show-images:hover { background: var(--gold) !important; color: #000 !important; }

.box-info-re {
  border-bottom-color: var(--border) !important;
  background: var(--bg-2) !important;
}
.box-info-re h3 { color: var(--text-main) !important; }
.boxes-info-re .cyan b { color: var(--gold) !important; }

.row-dv { border-bottom-color: var(--border) !important; }
.row-dv p { color: var(--text-muted) !important; }
.row-dv b { color: var(--text-main) !important; }

#related { background: var(--bg-3) !important; }
#related h2 { color: var(--text-main) !important; }

/* ----------------------------------------------------------
   22. PROPERTY MANAGEMENT
   ---------------------------------------------------------- */
#pm-description {
  background: var(--bg-3) !important;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
#pm-description h3, #pm-description p { color: var(--text-muted) !important; }
#pm-description h3 { color: var(--text-main) !important; }

#pm-services { background: var(--bg-main) !important; }
.pm-info-service h3 { color: var(--text-main) !important; }
.pm-info-service p { color: var(--text-muted) !important; }

#register-property {
  background: var(--bg-2) !important;
  border-top: 1px solid var(--border);
}
#register-property h3 { color: var(--text-main) !important; }
#register-property form h3 { color: var(--gold) !important; }

/* ----------------------------------------------------------
   23. DEVELOPMENTS PAGE
   ---------------------------------------------------------- */
#developments { background: var(--bg-main) !important; }

/* ----------------------------------------------------------
   24. NEIGHBORHOODS
   ---------------------------------------------------------- */
.cat-neig li a { border-bottom-color: transparent !important; color: var(--text-muted) !important; }
.cat-neig li a:hover, .cat-neig li a.cat-neig-active {
  border-bottom-color: var(--gold) !important;
  color: var(--gold) !important;
}
#cont-neig { background: var(--bg-main) !important; }
#cont-neig h3 { color: var(--text-main) !important; }
.info-neig h3 { color: var(--text-main) !important; }
.info-neig p { color: var(--text-muted) !important; }

/* ----------------------------------------------------------
   25. FAQS
   ---------------------------------------------------------- */
#faqs { background: var(--bg-main) !important; }
#faqs h3, #faqs h4 { color: var(--text-main) !important; }
#faqs p { color: var(--text-muted) !important; }
.question h4 { color: var(--gold) !important; }

/* ----------------------------------------------------------
   26. POLÍTICAS / LEGAL
   ---------------------------------------------------------- */
#content-policies { background: var(--bg-main) !important; }
#content-policies h2, #content-policies h3 { color: var(--text-main) !important; }
#content-policies p, #content-policies li { color: var(--text-muted) !important; }
#content-policies ul li a {
  border-bottom-color: var(--gold-dark) !important;
  color: var(--gold) !important;
}
#content-policies ul li a:hover, #content-policies ul li a.section-active {
  border-bottom-color: var(--gold) !important;
  color: var(--gold-light) !important;
}

/* ----------------------------------------------------------
   27. OUR COMPANY
   ---------------------------------------------------------- */
#about-us { background: var(--bg-3) !important; }
.info-about-us h3, .info-about-us p { color: var(--text-muted) !important; }
.info-about-us h3 { color: var(--text-main) !important; }
#personalized h2 { color: var(--text-main) !important; }
#personalized p { color: var(--text-muted) !important; }
h2.let-us { color: var(--text-main) !important; }

/* ----------------------------------------------------------
   28. VACATION RENTALS DETAIL
   ---------------------------------------------------------- */
.buttons-vacation a {
  border-bottom-color: var(--gold-dark) !important;
  color: var(--gold) !important;
}
.buttons-vacation a:hover { color: var(--gold-light) !important; }
#sidebar-vacation .btn-blue, #sidebar-vacation .btn-cyan {
  width: 100% !important;
  display: block !important;
  text-align: center !important;
}

/* ----------------------------------------------------------
   29. HEADER HERO REAL ESTATE / VACATION
   ---------------------------------------------------------- */
#header-re {
  background: var(--bg-main) !important;
  position: relative;
}
#header-re h1 { color: var(--text-main) !important; }
#header-re h4 { color: var(--text-muted) !important; }
#header-re p { color: var(--text-muted) !important; }

/* ----------------------------------------------------------
   30. FOOTER
   ---------------------------------------------------------- */
#site-footer {
  background: #050505 !important;
  border-top: 1px solid var(--border);
}
.footer-top {
  padding: 70px 0 50px;
}
.footer-bottom {
  border-top: 1px solid var(--border);
  padding: 20px 0;
}

.footer-logo {
  filter: brightness(0) invert(1);
  max-width: 160px;
  margin-bottom: 30px;
  opacity: 0.85;
  display: block;
}

.footer-nav-title {
  color: var(--gold) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  margin-bottom: 20px !important;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
}

.datos-footer h5 {
  color: var(--gold) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 2px !important;
  margin-top: 24px;
}
.datos-footer h5:first-child { margin-top: 0; }

.link-footer {
  display: block;
  color: var(--text-muted) !important;
  font-size: 12px !important;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 6px 0;
  transition: all var(--transition);
}
.link-footer:hover {
  color: var(--gold) !important;
  padding-left: 6px;
}

.address, .datos-footer p { color: var(--text-dim) !important; font-size: 13px !important; }
.phones a {
  color: var(--text-muted) !important;
  font-size: 13px !important;
  transition: color var(--transition);
}
.phones a:hover { color: var(--gold) !important; }
.phones span { color: var(--border) !important; margin: 0 6px; }

.mailfooter {
  display: inline-block;
  color: var(--gold) !important;
  font-size: 13px !important;
  font-weight: 500;
  letter-spacing: 0.5px;
  margin-top: 16px;
  border-bottom: 1px solid var(--gold-dark);
  padding-bottom: 2px;
  transition: all var(--transition);
}
.mailfooter:hover {
  color: var(--gold-light) !important;
  border-bottom-color: var(--gold);
}

.redes-footer { margin-top: 24px; }
.redes-footer a {
  display: inline-block;
  width: 32px;
  height: 32px;
  border: 1px solid var(--border);
  border-radius: 50%;
  margin-right: 8px;
  transition: all var(--transition);
  opacity: 0.6;
}
.redes-footer a:hover {
  border-color: var(--gold);
  opacity: 1;
  transform: translateY(-2px);
}
.facebook { background: url('../img/share/facebook.svg') no-repeat center / 10px; }
.instagram { background: url('../img/share/instagram.svg') no-repeat center / 14px; }
.twitter  { background: url('../img/share/twitter.svg') no-repeat center / 14px; }

.copy p {
  color: var(--text-dim) !important;
  font-size: 12px !important;
  margin: 0;
  letter-spacing: 0.5px;
}
.copy p a {
  color: var(--text-dim) !important;
  transition: color var(--transition);
}
.copy p a:hover { color: var(--gold) !important; }

/* ----------------------------------------------------------
   31. BACKTOP
   ---------------------------------------------------------- */
#backtop {
  background: var(--gold) !important;
  border-radius: 50% !important;
  width: 42px !important;
  height: 42px !important;
  box-shadow: 0 4px 16px var(--gold-glow) !important;
  transition: all var(--transition) !important;
}
#backtop:hover {
  background: var(--gold-light) !important;
  transform: translateY(-3px) !important;
}

/* ----------------------------------------------------------
   32. SLICK ARROWS Y DOTS
   ---------------------------------------------------------- */
.slick-prev, .slick-next {
  background: var(--bg-3) !important;
  border: 1px solid var(--border) !important;
  border-radius: 50% !important;
  width: 40px !important;
  height: 40px !important;
  z-index: 2 !important;
  transition: all var(--transition) !important;
}
.slick-prev:before, .slick-next:before {
  color: #fff !important;
  opacity: 1 !important;
}
.slick-prev:hover, .slick-next:hover {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
}
.slick-prev:hover:before, .slick-next:hover:before {
  color: #000 !important;
}
.slick-dots li button:before {
  color: var(--text-dim) !important;
}
.slick-dots li.slick-active button:before {
  color: var(--gold) !important;
}

/* ----------------------------------------------------------
   33. AOS OVERRIDES
   ---------------------------------------------------------- */
[data-aos] { pointer-events: auto !important; }

/* ----------------------------------------------------------
   34. SECCIONES GENÉRICAS CON FONDO CLARO → OSCURO
   ---------------------------------------------------------- */
section { background-color: var(--bg-main); }

/* Bordes de info en detalle de propiedad */
.box-info-re { background: var(--bg-main) !important; }
.location-box { border-bottom-color: var(--border) !important; }

/* ----------------------------------------------------------
   35. RESPONSIVE
   ---------------------------------------------------------- */
@media (max-width: 991px) {
  #slider-home .texto-slide h1 { font-size: 36px !important; }
  .home-box { border-right: none; border-bottom: 1px solid var(--border); }
  .filter-mls, .content-mls { width: 100% !important; float: none !important; margin-left: 0 !important; }
}
@media (max-width: 768px) {
  #home-services { padding: 80px 20px !important; }
  .slide-testimonios .pbig { padding: 0 20px !important; }
  h1, h2 { font-size: 26px !important; }
  #slider-home .texto-slide h1 { font-size: 28px !important; }
}

/* ----------------------------------------------------------
   36. MARCAS DE AGUA / OVERRIDES FINALES
   ---------------------------------------------------------- */
/* Asegurar que ningún fondo blanco quede expuesto */
.row-dv, .mls-line, .item { background: transparent !important; }
.results .box-re { background: transparent !important; }

/* Inputs de búsqueda: fondo oscuro */
input, select, textarea {
  background: var(--bg-3) !important;
  color: var(--text-main) !important;
  border: 1px solid var(--border) !important;
}
input::-moz-placeholder, textarea::-moz-placeholder { color: var(--text-dim) !important; }
input::placeholder, textarea::placeholder { color: var(--text-dim) !important; }

/* Datepicker */
.datepicker-dropdown {
  background: var(--bg-2) !important;
  border-color: var(--border) !important;
}
.datepicker-dropdown .datepicker-days td, .datepicker-dropdown .datepicker-days th {
  color: var(--text-muted) !important;
}
.datepicker-dropdown .day.active, .datepicker-dropdown .day:hover {
  background: var(--gold) !important;
  color: #000 !important;
}

/* Toastr */
.toast { background: var(--bg-3) !important; border: 1px solid var(--border) !important; }

/* Share buttons — mantener colores de marca */
.share-button { opacity: 0.9; }
.share-button:hover { opacity: 1; }

/* ----------------------------------------------------------
   37. DETAIL PAGE — SPECS GRID
   ---------------------------------------------------------- */
/* Grid de 2 columnas limpio para specs de propiedad */
.boxes-info-re { padding: 40px 0 !important; }

.box-info-re .rooms {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0 30px !important;
  max-height: none !important;
  overflow: visible !important;
}
.box-info-re .rooms-1,
.box-info-re .rooms-2 {
  float: none !important;
  width: 100% !important;
  padding: 0 !important;
}

/* Cada spec item */
.item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid var(--border) !important;
  margin: 0 !important;
  min-height: auto !important;
}
.item:last-child { border-bottom: none !important; }

.item-img {
  flex-shrink: 0 !important;
  width: 32px !important;
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.item-img img {
  width: 28px !important;
  height: 28px !important;
  -o-object-fit: contain !important;
     object-fit: contain !important;
  /* Hacer los SVGs dorados en el tema oscuro */
  filter: brightness(0) saturate(100%) invert(68%) sepia(40%) saturate(500%) hue-rotate(5deg) brightness(95%) !important;
}

.item-text {
  color: var(--text-muted) !important;
  font-size: 14px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 400;
  line-height: 1.3 !important;
  width: auto !important;
}

/* Header de sección de specs */
.box-info-re > h3 {
  color: var(--text-main) !important;
  font-size: 22px !important;
  margin-bottom: 20px !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid var(--gold-border) !important;
}

/* Amenities — property y shared */
.property-amenities .rooms,
.common-amenities .rooms {
  max-height: 200px !important;
  overflow: hidden !important;
  transition: max-height 0.4s ease !important;
}
.property-amenities.open-ac .rooms,
.common-amenities.open-ac .rooms {
  max-height: 2000px !important;
}

/* See more button */
#see-more-amenities, .see-more-amenities {
  color: var(--gold) !important;
  font-size: 13px !important;
  font-weight: 600;
  cursor: pointer;
  letter-spacing: 1px;
  text-transform: uppercase;
}
#see-more-amenities:before, .see-more-amenities:before {
  filter: invert(1) sepia(1) saturate(5) hue-rotate(5deg) !important;
}

/* Mapa */
.cont-map { background: var(--bg-main) !important; padding: 0 !important; }
#map { height: 400px; border-radius: var(--radius-card); border: 1px solid var(--border); }

/* Tab location */
#location p { color: var(--text-muted) !important; font-size: 14px !important; }

/* Lateral view / botones de acción */
.buttons-view .btn-blue { display: block !important; margin-bottom: 16px !important; text-align: center !important; }
.buttons-view .btn-cyan { display: block !important; text-align: center !important; }

/* Slider de fotos de propiedad */
#slider-card { background: var(--bg-2) !important; }
.slide-card { background-color: var(--bg-3) !important; }

/* Arrows del slider de propiedad */
#slider-card .slick-prev,
#slider-card .slick-next {
  z-index: 10 !important;
  width: 44px !important;
  height: 44px !important;
  background: rgba(0,0,0,0.55) !important;
  border: 1px solid var(--gold-border) !important;
  border-radius: 50% !important;
  color: var(--gold) !important;
  font-size: 18px !important;
  line-height: 44px !important;
  text-align: center !important;
  transition: background var(--transition), border-color var(--transition) !important;
}
#slider-card .slick-prev { left: 16px !important; }
#slider-card .slick-next { right: 16px !important; }
#slider-card .slick-prev:hover,
#slider-card .slick-next:hover {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
  color: #000 !important;
}
/* Placeholder cuando no hay imagen */
.slide-card[style*="url('')"],
.slide-card[style*='url("")'] {
  background: var(--bg-3) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ctext y='.9em' font-size='90'%3E🏠%3C/text%3E%3C/svg%3E") no-repeat center !important;
  background-size: 80px !important;
}

/* Gallery button */
#gallery-view-re { z-index: 3 !important; }

@media (max-width: 768px) {
  .box-info-re .rooms {
    grid-template-columns: 1fr !important;
  }
  #lateral-view {
    position: static !important;
    width: 100% !important;
    margin-bottom: 30px !important;
  }
}

/* ----------------------------------------------------------
   38. PROPERTY FOOTER — LOGO MLS
   ---------------------------------------------------------- */
.author-picture {
  width: auto;
  height: auto;
  max-width: 100%;
}

/* ----------------------------------------------------------
   39. PRICE BLOCK — USD / MXN GAP
   ---------------------------------------------------------- */
.price-block {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.price-block h4 {
  margin-bottom: 0;
}
.price-block p {
  margin-top: 0;
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .price-block {
    gap: 8px;
    margin-top: 12px;
  }
}

/*# sourceMappingURL=custom.css.map*/

