/*
 * MLS Argentina — sistema visual del panel admin.
 * Paleta celeste/azul/turquesa (identidad argentina y bonaerense),
 * variables semánticas centralizadas + mapeo a las variables de
 * Bootstrap 5.3 para que todos los componentes stock (botones, badges,
 * alerts, inputs, paginación) hereden el theme sin duplicar reglas.
 */

:root {
  /* Paleta base */
  --mls-primario: #232D4F;
  --mls-primario-rgb: 35, 45, 79;
  --mls-secundario: #3E5A7E;
  --mls-celeste: #75AADB;
  --mls-celeste-rgb: 117, 170, 219;
  --mls-turquesa: #008C95;
  --mls-turquesa-rgb: 0, 140, 149;
  --mls-fondo: #F4F8FB;
  --mls-superficie: #FFFFFF;
  --mls-texto: #232D4F;
  --mls-texto-secundario: #526477;
  --mls-borde: #DCE6EF;
  --mls-exito: #2E7D33;
  --mls-advertencia: #E7BA61;
  --mls-error: #C62828;

  /* Tintes derivados (fondos suaves para estados / hover / franjas) */
  --mls-celeste-tint: #EAF3FB;
  --mls-turquesa-tint: #E3F3F4;
  --mls-exito-tint: #E9F5EA;
  --mls-advertencia-tint: #FBF1DE;
  --mls-error-tint: #FBE9E9;

  /* Tipografía */
  --mls-font: "Inter", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Espaciado */
  --mls-space-1: .25rem;
  --mls-space-2: .5rem;
  --mls-space-3: .75rem;
  --mls-space-4: 1rem;
  --mls-space-5: 1.5rem;
  --mls-space-6: 2rem;

  /* Radios */
  --mls-radius-sm: .375rem;
  --mls-radius-md: .625rem;
  --mls-radius-lg: 1rem;

  /* Sombras suaves */
  --mls-shadow-sm: 0 1px 2px rgba(35, 45, 79, .06), 0 1px 1px rgba(35, 45, 79, .04);
  --mls-shadow-md: 0 4px 10px rgba(35, 45, 79, .08), 0 2px 4px rgba(35, 45, 79, .04);

  /* Medidas de layout */
  --mls-sidebar-w: 264px;
  --mls-sidebar-w-colapsado: 76px;
  --mls-topbar-h: 60px;

  /* ---- Mapeo a variables de Bootstrap 5.3 ---- */
  --bs-body-font-family: var(--mls-font);
  --bs-body-bg: var(--mls-fondo);
  --bs-body-color: var(--mls-texto);
  --bs-border-color: var(--mls-borde);
  --bs-border-radius: var(--mls-radius-sm);
  --bs-border-radius-sm: .3rem;
  --bs-border-radius-lg: var(--mls-radius-md);
  --bs-border-radius-xl: var(--mls-radius-lg);
  --bs-box-shadow: var(--mls-shadow-md);
  --bs-box-shadow-sm: var(--mls-shadow-sm);
  --bs-link-color: var(--mls-secundario);
  --bs-link-hover-color: var(--mls-primario);
  --bs-link-color-rgb: var(--mls-primario-rgb);

  --bs-primary: var(--mls-primario);
  --bs-primary-rgb: var(--mls-primario-rgb);
  --bs-secondary: var(--mls-secundario);
  --bs-secondary-rgb: 62, 90, 126;
  --bs-info: var(--mls-turquesa);
  --bs-info-rgb: var(--mls-turquesa-rgb);
  --bs-success: var(--mls-exito);
  --bs-success-rgb: 46, 125, 51;
  --bs-warning: var(--mls-advertencia);
  --bs-warning-rgb: 231, 186, 97;
  --bs-danger: var(--mls-error);
  --bs-danger-rgb: 198, 40, 40;
  --bs-light: #EFF4F9;
  --bs-light-rgb: 239, 244, 249;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* ---------------------------------------------------------------
 * Base
 * --------------------------------------------------------------- */
html, body { min-height: 100%; }
body {
  font-family: var(--mls-font);
  color: var(--mls-texto);
  background: var(--mls-fondo);
  -webkit-font-smoothing: antialiased;
}

a { text-decoration: none; }
a.mls-link-subrayado { text-decoration: underline; }

:focus-visible {
  outline: 2px solid var(--mls-secundario);
  outline-offset: 2px;
  border-radius: .2rem;
}

.mls-skip-link {
  position: absolute;
  left: -999px;
  top: 0;
  z-index: 2000;
  padding: .5rem 1rem;
  background: var(--mls-primario);
  color: #fff;
  border-radius: 0 0 .5rem 0;
}
.mls-skip-link:focus {
  left: 0;
}

h1, h2, h3, h4, h5, h6 { color: var(--mls-primario); font-weight: 600; }

/* ---------------------------------------------------------------
 * Estructura general: sidebar + topbar + contenido
 * --------------------------------------------------------------- */
.mls-shell {
  display: flex;
  min-height: 100vh;
}

.mls-sidebar {
  width: var(--mls-sidebar-w);
  flex: 0 0 var(--mls-sidebar-w);
  background: linear-gradient(180deg, var(--mls-primario) 0%, #1b2440 100%);
  color: #E7EEF7;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  transition: flex-basis .18s ease, width .18s ease;
  scrollbar-width: thin;
}

.mls-shell.is-colapsado .mls-sidebar {
  width: var(--mls-sidebar-w-colapsado);
  flex-basis: var(--mls-sidebar-w-colapsado);
}

.mls-sidebar__brand {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: 1.1rem 1.15rem;
  color: #fff;
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: .01em;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
}
.mls-sidebar__brand-texto {
  font-size: .82rem;
  line-height: 1.18;
  font-weight: 700;
  min-width: 0;
}
.mls-sidebar__brand-mark {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  border-radius: var(--mls-radius-sm);
  background: linear-gradient(135deg, var(--mls-celeste), var(--mls-turquesa));
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  color: #0C2033;
  font-size: .95rem;
}
.mls-sidebar__brand-texto small {
  display: block;
  font-weight: 400;
  font-size: .68rem;
  color: #AFC3DC;
  letter-spacing: .04em;
}
.mls-shell.is-colapsado .mls-sidebar__brand-texto { display: none; }

.mls-nav { flex: 1 1 auto; padding: .5rem .6rem 1.5rem; }

.mls-nav-grupo { margin-bottom: .15rem; }

.mls-nav-grupo__titulo {
  display: flex;
  align-items: center;
  gap: .6rem;
  width: 100%;
  padding: .55rem .6rem;
  background: transparent;
  border: 0;
  color: #C7D6E8;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  border-radius: var(--mls-radius-sm);
}
.mls-nav-grupo__titulo:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.mls-nav-grupo__titulo .bi-chevron-down { margin-left: auto; transition: transform .15s ease; font-size: .8rem; }
.mls-nav-grupo__titulo[aria-expanded="true"] .bi-chevron-down { transform: rotate(180deg); }
.mls-nav-grupo__icono { flex: 0 0 auto; font-size: 1rem; width: 1.1rem; text-align: center; }
.mls-shell.is-colapsado .mls-nav-grupo__titulo span:not(.mls-nav-grupo__icono) { display: none; }

.mls-nav-link {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .5rem .6rem .5rem 2.1rem;
  margin: .05rem 0;
  border-radius: var(--mls-radius-sm);
  color: #D7E3F2;
  font-size: .875rem;
  line-height: 1.3;
}
.mls-nav-link:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.mls-nav-link.is-active {
  background: rgba(117, 170, 219, .18);
  color: #fff;
  font-weight: 600;
  box-shadow: inset 3px 0 0 var(--mls-celeste);
}
.mls-shell.is-colapsado .mls-nav-link span.mls-nav-link__texto { display: none; }
.mls-shell.is-colapsado .mls-nav-link { padding-left: .6rem; justify-content: center; }
.mls-shell.is-colapsado .mls-nav-grupo__titulo { justify-content: center; }

.mls-sidebar__pie {
  padding: .75rem;
  border-top: 1px solid rgba(255, 255, 255, .12);
}
.mls-sidebar__colapsar {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  background: rgba(255, 255, 255, .06);
  border: 0;
  color: #D7E3F2;
  padding: .5rem;
  border-radius: var(--mls-radius-sm);
  font-size: .8rem;
}
.mls-sidebar__colapsar:hover { background: rgba(255, 255, 255, .14); color: #fff; }

/* ---------------------------------------------------------------
 * Columna principal: topbar + contenido
 * --------------------------------------------------------------- */
.mls-principal { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }

.mls-topbar {
  height: var(--mls-topbar-h);
  flex: 0 0 auto;
  background: var(--mls-superficie);
  border-bottom: 1px solid var(--mls-borde);
  display: flex;
  align-items: center;
  gap: .85rem;
  padding: 0 1.25rem;
  position: sticky;
  top: 0;
  z-index: 20;
}

.mls-topbar__movil-toggle,
.mls-topbar__colapsar-toggle {
  border: 1px solid var(--mls-borde);
  background: var(--mls-superficie);
  color: var(--mls-primario);
  width: 36px;
  height: 36px;
  border-radius: var(--mls-radius-sm);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.mls-topbar__movil-toggle:hover, .mls-topbar__colapsar-toggle:hover { background: var(--mls-celeste-tint); }
.mls-topbar__colapsar-toggle { display: none; }
@media (min-width: 992px) { .mls-topbar__colapsar-toggle { display: inline-flex; } }

.mls-topbar__titulos { min-width: 0; flex: 1 1 auto; }
.mls-topbar__titulo {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--mls-primario);
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mls-migas {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin: 0;
  padding: 0;
  font-size: .74rem;
  color: var(--mls-texto-secundario);
}
.mls-migas li { display: flex; align-items: center; gap: .3rem; }
.mls-migas li + li::before { content: "/"; color: var(--mls-borde); }
.mls-migas a { color: var(--mls-texto-secundario); }
.mls-migas a:hover { color: var(--mls-secundario); text-decoration: underline; }

.mls-usuario-menu .btn {
  display: flex;
  align-items: center;
  gap: .55rem;
  border: 1px solid var(--mls-borde);
  background: var(--mls-superficie);
  color: var(--mls-texto);
  border-radius: var(--mls-radius-md);
  padding: .35rem .75rem;
}
.mls-usuario-menu .btn:hover { background: var(--mls-celeste-tint); }
.mls-usuario-avatar {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--mls-secundario);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: .75rem; font-weight: 700;
  flex: 0 0 auto;
}
.mls-usuario-menu .mls-usuario-nombre { font-size: .82rem; font-weight: 600; line-height: 1.1; }
.mls-usuario-menu .mls-usuario-rol { font-size: .68rem; color: var(--mls-texto-secundario); display:block; }

.mls-contenido {
  flex: 1 1 auto;
  padding: 1.5rem 1.5rem 3rem;
  max-width: 1600px;
  width: 100%;
}

/* ---------------------------------------------------------------
 * Encabezado de página / tarjetas contenedoras
 * --------------------------------------------------------------- */
.mls-page-header {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 1.25rem;
}
.mls-page-header__titulo {
  display: flex;
  align-items: center;
  gap: .65rem;
  flex-wrap: wrap;
}
.mls-page-header h1, .mls-page-header h3 {
  font-size: 1.4rem;
  margin: 0;
}
.mls-page-header__conteo {
  font-size: .78rem;
  font-weight: 600;
  color: var(--mls-secundario);
  background: var(--mls-celeste-tint);
  border: 1px solid var(--mls-celeste);
  border-radius: 999px;
  padding: .2rem .65rem;
}
.mls-page-header__descripcion { color: var(--mls-texto-secundario); font-size: .875rem; margin: .2rem 0 0; }
.mls-page-header__acciones { display: flex; gap: .5rem; flex-wrap: wrap; }

.card {
  border-color: var(--mls-borde);
  border-radius: var(--mls-radius-md);
}

.mls-card {
  background: var(--mls-superficie);
  border: 1px solid var(--mls-borde);
  border-radius: var(--mls-radius-md);
  box-shadow: var(--mls-shadow-sm);
  padding: 1.25rem;
  margin-bottom: 1.25rem;
}
.mls-card__titulo {
  font-size: .95rem;
  font-weight: 700;
  color: var(--mls-primario);
  margin: 0 0 1rem;
  display: flex;
  align-items: center;
  gap: .5rem;
}

/* Encabezado de detalle: identificación + estado + acciones */
.mls-detalle-header {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: space-between;
  align-items: flex-start;
  background: var(--mls-superficie);
  border: 1px solid var(--mls-borde);
  border-radius: var(--mls-radius-md);
  box-shadow: var(--mls-shadow-sm);
  padding: 1.1rem 1.25rem;
  margin-bottom: 1.25rem;
}
.mls-detalle-header__id {
  font-size: .74rem;
  color: var(--mls-texto-secundario);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.mls-detalle-header__titulo {
  font-size: 1.3rem;
  margin: .15rem 0 .4rem;
  display: flex;
  align-items: center;
  gap: .6rem;
  flex-wrap: wrap;
}
.mls-detalle-header__meta { color: var(--mls-texto-secundario); font-size: .85rem; }
.mls-detalle-header__acciones { display: flex; gap: .5rem; flex-wrap: wrap; }

/* Precio destacado (inmuebles / publicaciones) */
.mls-precio {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--mls-primario);
}
.mls-precio small { font-size: .75rem; font-weight: 600; color: var(--mls-texto-secundario); margin-left: .25rem; }
.mls-chip-lista {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .6rem;
  margin: .5rem 0 0;
  padding: 0;
  list-style: none;
}
.mls-chip-lista li {
  display: flex;
  align-items: center;
  gap: .3rem;
  font-size: .8rem;
  color: var(--mls-texto-secundario);
  background: var(--mls-fondo);
  border: 1px solid var(--mls-borde);
  border-radius: 999px;
  padding: .25rem .65rem;
}
.mls-chip-lista li i { color: var(--mls-secundario); }

.mls-sin-imagen {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  background: var(--mls-fondo);
  border: 1px dashed var(--mls-borde);
  border-radius: var(--mls-radius-md);
  color: var(--mls-texto-secundario);
  font-size: .78rem;
  padding: 1.5rem 1rem;
  text-align: center;
}
.mls-sin-imagen i { font-size: 1.6rem; color: var(--mls-celeste); }

/* ---------------------------------------------------------------
 * Formularios
 * --------------------------------------------------------------- */
.form-label { font-weight: 600; color: var(--mls-texto); font-size: .84rem; margin-bottom: .3rem; }
.form-control, .form-select {
  border-color: var(--mls-borde);
  border-radius: var(--mls-radius-sm);
  padding: .5rem .75rem;
  font-size: .9rem;
}
.form-control:focus, .form-select:focus {
  border-color: var(--mls-secundario);
  box-shadow: 0 0 0 .2rem rgba(var(--mls-celeste-rgb), .35);
}
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--mls-error); }
.invalid-feedback { display: flex; align-items: center; gap: .35rem; font-weight: 600; }
.form-text, .mls-ayuda { color: var(--mls-texto-secundario); font-size: .78rem; }
.form-check-input:checked { background-color: var(--mls-secundario); border-color: var(--mls-secundario); }

.mls-form-seccion {
  border: 1px solid var(--mls-borde);
  border-radius: var(--mls-radius-md);
  background: var(--mls-superficie);
  padding: 1.1rem 1.25rem 1.3rem;
  margin-bottom: 1.25rem;
}
.mls-form-seccion__titulo {
  font-size: .85rem;
  font-weight: 700;
  color: var(--mls-primario);
  text-transform: uppercase;
  letter-spacing: .03em;
  margin: 0 0 1rem;
  padding-bottom: .6rem;
  border-bottom: 1px solid var(--mls-borde);
  display: flex;
  align-items: center;
  gap: .5rem;
}
.mls-form-seccion__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0 1.25rem;
}

.mls-acciones-formulario {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding-top: .5rem;
}

/* ---------------------------------------------------------------
 * Botones
 * --------------------------------------------------------------- */
.btn { border-radius: var(--mls-radius-sm); font-weight: 600; font-size: .875rem; }
.btn-primary { --bs-btn-bg: var(--mls-primario); --bs-btn-border-color: var(--mls-primario); --bs-btn-hover-bg: #1b2440; --bs-btn-hover-border-color: #1b2440; }
.btn-outline-primary { --bs-btn-color: var(--mls-primario); --bs-btn-border-color: var(--mls-secundario); --bs-btn-hover-bg: var(--mls-secundario); --bs-btn-hover-border-color: var(--mls-secundario); }
.btn-outline-secondary { --bs-btn-color: var(--mls-secundario); --bs-btn-border-color: var(--mls-borde); --bs-btn-hover-bg: var(--mls-celeste-tint); --bs-btn-hover-color: var(--mls-primario); --bs-btn-hover-border-color: var(--mls-celeste); }
.btn-outline-primary.mls-btn-accento, .btn-mls-turquesa { --bs-btn-color: var(--mls-turquesa); --bs-btn-border-color: var(--mls-turquesa); --bs-btn-hover-bg: var(--mls-turquesa); --bs-btn-hover-color: #fff; }
.btn i.bi, .btn .bi { font-size: .95em; }
.table-actions { display: flex; gap: .35rem; flex-wrap: wrap; }
.table-actions a, .table-actions form { display: inline-flex; margin: 0; }

/* ---------------------------------------------------------------
 * Tablas
 * --------------------------------------------------------------- */
.mls-tabla-wrap {
  background: var(--mls-superficie);
  border: 1px solid var(--mls-borde);
  border-radius: var(--mls-radius-md);
  box-shadow: var(--mls-shadow-sm);
  overflow: hidden;
}
.mls-tabla-wrap .table-responsive { margin: 0; }
.table {
  margin: 0;
  font-size: .875rem;
}
.table > thead > tr > th {
  background: var(--mls-fondo);
  color: var(--mls-texto-secundario);
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 700;
  border-bottom: 1px solid var(--mls-borde);
  position: sticky;
  top: 0;
  z-index: 1;
  white-space: nowrap;
}
.table > tbody > tr > td { border-color: var(--mls-borde); vertical-align: middle; }
.table-striped > tbody > tr:nth-of-type(odd) > * { background-color: var(--mls-fondo); }
.table-hover > tbody > tr:hover > * { background-color: var(--mls-celeste-tint); }

.mls-conteo-resultados {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  flex-wrap: wrap;
  font-size: .8rem;
  color: var(--mls-texto-secundario);
  padding: .75rem 0 0;
}

/* ---------------------------------------------------------------
 * Badges de estado — siempre con texto, nunca solo color
 * --------------------------------------------------------------- */
.badge { font-weight: 600; font-size: .72rem; padding: .4em .65em; border-radius: 999px; letter-spacing: .01em; }

/* ---------------------------------------------------------------
 * Alertas / flash
 * --------------------------------------------------------------- */
.alert { border-radius: var(--mls-radius-md); border: 1px solid transparent; font-size: .88rem; display: flex; align-items: flex-start; gap: .6rem; }
.alert i.bi { font-size: 1.1rem; margin-top: .1rem; }
.alert-success { background: var(--mls-exito-tint); border-color: #BFE0C2; color: #1E5C22; }
.alert-danger { background: var(--mls-error-tint); border-color: #EFBFBF; color: #8E1F1F; }
.alert-warning { background: var(--mls-advertencia-tint); border-color: #F0DDB0; color: #7A5B12; }
.alert-light { background: var(--mls-fondo); border-color: var(--mls-borde); color: var(--mls-texto-secundario); }

/* ---------------------------------------------------------------
 * Paginación
 * --------------------------------------------------------------- */
.pagination { gap: .25rem; }
.page-link { border-color: var(--mls-borde); color: var(--mls-secundario); border-radius: var(--mls-radius-sm) !important; }
.page-item.active .page-link { background: var(--mls-primario); border-color: var(--mls-primario); }
.page-item.disabled .page-link { color: var(--mls-texto-secundario); background: var(--mls-fondo); }

/* ---------------------------------------------------------------
 * Login
 * --------------------------------------------------------------- */
.mls-login-shell {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--mls-primario) 0%, var(--mls-secundario) 55%, var(--mls-turquesa) 100%);
  padding: 1.5rem;
}
.mls-login-card {
  width: 100%;
  max-width: 900px;
  background: var(--mls-superficie);
  border-radius: var(--mls-radius-lg);
  box-shadow: var(--mls-shadow-md);
  overflow: hidden;
  display: grid;
  grid-template-columns: 1.05fr 1fr;
}
@media (max-width: 767px) { .mls-login-card { grid-template-columns: 1fr; max-width: 420px; } }

.mls-login-hero {
  background: radial-gradient(circle at 20% 20%, rgba(117,170,219,.35), transparent 55%), var(--mls-primario);
  color: #fff;
  padding: 2.5rem 2.25rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1rem;
}
@media (max-width: 767px) { .mls-login-hero { display: none; } }
.mls-login-hero__marca { display: flex; align-items: center; gap: .75rem; font-weight: 800; font-size: 1.3rem; }
.mls-login-hero__franja { display: flex; height: 6px; width: 64px; border-radius: 999px; overflow: hidden; }
.mls-login-hero__franja span { flex: 1; }
.mls-login-hero p { color: #CBDCF0; font-size: .9rem; margin: 0; }

.mls-login-form { padding: 2.5rem 2.25rem; display: flex; flex-direction: column; justify-content: center; }
.mls-login-form h1 { font-size: 1.35rem; margin-bottom: .25rem; }
.mls-login-form .mls-subtitulo { color: var(--mls-texto-secundario); font-size: .85rem; margin-bottom: 1.5rem; }

/* ---------------------------------------------------------------
 * Panel de inicio: tarjetas de indicadores
 * --------------------------------------------------------------- */
.mls-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 1rem;
}
.mls-stat-card {
  display: flex;
  align-items: center;
  gap: .9rem;
  background: var(--mls-superficie);
  border: 1px solid var(--mls-borde);
  border-radius: var(--mls-radius-md);
  box-shadow: var(--mls-shadow-sm);
  padding: 1.1rem;
  color: var(--mls-texto);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.mls-stat-card:hover { transform: translateY(-2px); box-shadow: var(--mls-shadow-md); border-color: var(--mls-celeste); color: var(--mls-texto); }
.mls-stat-card__icono {
  flex: 0 0 auto;
  width: 44px; height: 44px;
  border-radius: var(--mls-radius-sm);
  display: flex; align-items: center; justify-content: center;
  background: var(--mls-celeste-tint);
  color: var(--mls-secundario);
  font-size: 1.2rem;
}
.mls-stat-card__valor { font-size: 1.5rem; font-weight: 800; color: var(--mls-primario); line-height: 1; }
.mls-stat-card__etiqueta { font-size: .78rem; color: var(--mls-texto-secundario); margin-top: .15rem; }

/* ---------------------------------------------------------------
 * Responsive: sidebar en cajón (offcanvas) para pantallas chicas
 * --------------------------------------------------------------- */
@media (max-width: 991.98px) {
  .mls-sidebar { display: none; }
  .mls-shell.is-colapsado .mls-sidebar { width: var(--mls-sidebar-w); flex-basis: var(--mls-sidebar-w); }
}

.mls-offcanvas-sidebar { width: var(--mls-sidebar-w); }
.mls-offcanvas-sidebar .mls-sidebar { display: flex; width: 100%; position: static; height: 100%; }

@media (min-width: 992px) {
  .mls-topbar__movil-toggle { display: none; }
}

/* Evitar cualquier desborde horizontal de página */
body { overflow-x: hidden; }
.table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }

@media (max-width: 575.98px) {
  .mls-contenido { padding: 1rem .85rem 2.5rem; }
  .mls-page-header { flex-direction: column; }
  .mls-page-header__acciones { width: 100%; }
}

/* ---------------------------------------------------------------
 * Galería de fotos (publicación / inmueble)
 * --------------------------------------------------------------- */
.mls-galeria { border-radius: var(--mls-radius-md); overflow: hidden; }
.mls-galeria .carousel-item img {
  width: 100%;
  height: 420px;
  object-fit: cover;
  background: var(--mls-fondo);
}
.mls-galeria .carousel-caption {
  background: linear-gradient(180deg, transparent, rgba(15, 23, 42, .65));
  border-radius: 0 0 var(--mls-radius-md) var(--mls-radius-md);
}
.mls-galeria .carousel-control-prev, .mls-galeria .carousel-control-next { width: 8%; opacity: .85; }
.mls-galeria .carousel-indicators [data-bs-target] { background-color: rgba(255, 255, 255, .6); }
.mls-galeria .carousel-indicators .active { background-color: #fff; }
@media (max-width: 575.98px) {
  .mls-galeria .carousel-item img { height: 240px; }
}

/* Precio + operación destacados */
.mls-precio-operacion { display: flex; flex-wrap: wrap; align-items: baseline; gap: .6rem; }
.mls-precio-operacion .badge { font-size: .75rem; }

/* Fila de características principales (superficie, ambientes, baños...) */
.mls-caract-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: .75rem;
  text-align: center;
}
.mls-caract-grid__item {
  background: var(--mls-fondo);
  border: 1px solid var(--mls-borde);
  border-radius: var(--mls-radius-sm);
  padding: .75rem .5rem;
}
.mls-caract-grid__item i { font-size: 1.15rem; color: var(--mls-secundario); display: block; margin-bottom: .3rem; }
.mls-caract-grid__item strong { display: block; font-size: .95rem; color: var(--mls-primario); }
.mls-caract-grid__item span { font-size: .72rem; color: var(--mls-texto-secundario); }

/* Tabs de características por categoría */
.mls-tabs .nav-link {
  color: var(--mls-texto-secundario);
  font-weight: 600;
  font-size: .82rem;
  border: 0;
  border-bottom: 2px solid transparent;
  padding: .55rem .25rem;
  margin-right: 1.25rem;
}
.mls-tabs .nav-link.active { color: var(--mls-primario); border-bottom-color: var(--mls-turquesa); background: transparent; }
.mls-tabs .nav-link:hover { color: var(--mls-secundario); }

/* Mapa de ubicación (embed sin API key, a partir de la dirección real) */
.mls-mapa-embed { border-radius: var(--mls-radius-md); overflow: hidden; border: 1px solid var(--mls-borde); }
.mls-mapa-embed iframe { width: 100%; height: 280px; border: 0; display: block; }

/* Comparables cercanos */
.mls-comparables-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1rem;
}
.mls-comparable-card {
  display: block;
  background: var(--mls-superficie);
  border: 1px solid var(--mls-borde);
  border-radius: var(--mls-radius-md);
  padding: 1rem;
  color: var(--mls-texto);
  transition: border-color .12s ease, box-shadow .12s ease;
}
.mls-comparable-card:hover { border-color: var(--mls-celeste); box-shadow: var(--mls-shadow-sm); color: var(--mls-texto); }
.mls-comparable-card__precio { font-weight: 800; color: var(--mls-primario); font-size: 1.05rem; }
.mls-comparable-card__titulo { font-size: .85rem; margin: .3rem 0; color: var(--mls-texto); }
.mls-comparable-card__meta { font-size: .75rem; color: var(--mls-texto-secundario); }

/* ---------------------------------------------------------------
 * Vista calendario mensual (tareas, y reutilizable a futuro)
 * --------------------------------------------------------------- */
.mls-calendario {
  background: var(--mls-superficie);
  border: 1px solid var(--mls-borde);
  border-radius: var(--mls-radius-md);
  box-shadow: var(--mls-shadow-sm);
  padding: 1rem;
  overflow-x: auto;
}
.mls-calendario__nav { display: flex; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.mls-calendario__titulo { font-weight: 700; color: var(--mls-primario); font-size: 1.05rem; min-width: 160px; text-align: center; }
.mls-calendario__cabecera {
  display: grid;
  grid-template-columns: repeat(7, minmax(120px, 1fr));
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--mls-texto-secundario);
  padding: 0 0 .5rem;
}
.mls-calendario__grilla {
  display: grid;
  grid-template-columns: repeat(7, minmax(120px, 1fr));
  grid-auto-rows: minmax(96px, auto);
  gap: 1px;
  background: var(--mls-borde);
  border: 1px solid var(--mls-borde);
  border-radius: var(--mls-radius-sm);
  overflow: hidden;
}
.mls-calendario__celda { background: var(--mls-superficie); padding: .4rem; display: flex; flex-direction: column; gap: .2rem; }
.mls-calendario__celda.is-vacia { background: var(--mls-fondo); }
.mls-calendario__celda.is-hoy { background: var(--mls-celeste-tint); }
.mls-calendario__num { font-size: .78rem; font-weight: 700; color: var(--mls-texto-secundario); }
.mls-calendario__celda.is-hoy .mls-calendario__num { color: var(--mls-secundario); }
.mls-calendario__evento {
  display: block;
  font-size: .7rem;
  line-height: 1.3;
  padding: .15rem .4rem;
  border-radius: .25rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border-left: 3px solid transparent;
}
.mls-calendario__hora { font-weight: 700; }
.mls-calendario__evento--success { background: var(--mls-exito-tint); border-color: var(--mls-exito); color: #1E5C22; }
.mls-calendario__evento--warning { background: var(--mls-advertencia-tint); border-color: var(--mls-advertencia); color: #7A5B12; }
.mls-calendario__evento--danger { background: var(--mls-error-tint); border-color: var(--mls-error); color: #8E1F1F; }
.mls-calendario__evento--secondary { background: var(--mls-fondo); border-color: var(--mls-borde); color: var(--mls-texto-secundario); }
.mls-calendario__evento--primary { background: var(--mls-celeste-tint); border-color: var(--mls-secundario); color: var(--mls-primario); }
.mls-calendario__mas { font-size: .68rem; color: var(--mls-texto-secundario); padding-left: .4rem; }
@media (max-width: 767.98px) {
  .mls-calendario__cabecera, .mls-calendario__grilla { grid-template-columns: repeat(7, minmax(100px, 1fr)); }
}

/* ---------------------------------------------------------------
 * Filtro de rango de fechas (reutilizable: Operaciones y a futuro
 * cualquier otro listado con filtro de fecha)
 * --------------------------------------------------------------- */
.mls-filtro-rango {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: .75rem;
  background: var(--mls-superficie);
  border: 1px solid var(--mls-borde);
  border-radius: var(--mls-radius-md);
  padding: 1rem;
  margin-bottom: 1.25rem;
}
.mls-filtro-rango .mb-3 { margin-bottom: 0 !important; }
.mls-filtro-rango .form-label { margin-bottom: .25rem; }

/* ---------------------------------------------------------------
 * Mapa geográfico real (Leaflet + OpenStreetMap) de Operaciones
 * --------------------------------------------------------------- */
.mls-mapa-geo {
  height: 480px;
  border-radius: var(--mls-radius-md);
  overflow: hidden;
  border: 1px solid var(--mls-borde);
}
.mls-mapa-geo .leaflet-popup-content-wrapper { border-radius: var(--mls-radius-sm); }
.mls-mapa-etiqueta {
  background: var(--mls-superficie);
  border: 1px solid var(--mls-borde);
  border-radius: 999px;
  box-shadow: var(--mls-shadow-sm);
  padding: .15rem .55rem;
  font-size: .72rem;
  font-weight: 700;
  color: var(--mls-primario);
}
.mls-mapa-etiqueta--venta { border-color: var(--mls-exito); color: var(--mls-exito); }
.mls-mapa-etiqueta--alquiler { border-color: var(--mls-error); color: var(--mls-error); }
.mls-mapa-etiqueta--alquiler_temporario { border-color: var(--mls-primario); color: var(--mls-primario); }
.mls-mapa-etiqueta::before { border-top-color: var(--mls-borde) !important; }
.mls-mapa-geo-leyenda { display: flex; gap: 1.25rem; flex-wrap: wrap; margin: .75rem 0 0; font-size: .8rem; color: var(--mls-texto-secundario); }
.mls-mapa-geo-leyenda span { display: inline-flex; align-items: center; gap: .4rem; }
.mls-mapa-geo-leyenda i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }

/* ---------------------------------------------------------------
 * Mapa de calor por zona (barrio/localidad)
 * --------------------------------------------------------------- */
.mls-mapacalor { display: flex; flex-direction: column; gap: .6rem; }
.mls-mapacalor__zona {
  background: var(--mls-superficie);
  border: 1px solid var(--mls-borde);
  border-radius: var(--mls-radius-md);
  box-shadow: var(--mls-shadow-sm);
  padding: .1rem .25rem;
}
.mls-mapacalor__zona summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: .75rem 1rem;
}
.mls-mapacalor__zona summary::-webkit-details-marker { display: none; }
.mls-mapacalor__zona summary::before {
  content: "\f285";
  font-family: "bootstrap-icons";
  color: var(--mls-texto-secundario);
  transition: transform .15s ease;
  flex: 0 0 auto;
}
.mls-mapacalor__zona[open] summary::before { transform: rotate(90deg); }
.mls-mapacalor__nombre { font-weight: 700; color: var(--mls-primario); flex: 0 0 auto; min-width: 160px; }
.mls-mapacalor__barra-wrap { flex: 1 1 auto; height: 10px; background: var(--mls-fondo); border-radius: 999px; overflow: hidden; min-width: 80px; }
.mls-mapacalor__barra { display: block; height: 100%; background: linear-gradient(90deg, var(--mls-celeste), var(--mls-turquesa)); border-radius: 999px; }
.mls-mapacalor__resumen { flex: 0 0 auto; font-size: .82rem; color: var(--mls-texto-secundario); white-space: nowrap; }
.mls-mapacalor__detalle { margin: 0 1rem 1rem; padding-top: .5rem; border-top: 1px solid var(--mls-borde); }
.mls-mapacalor__detalle li { background: var(--mls-fondo); }
.mls-mapacalor__detalle a { color: var(--mls-texto); }
.mls-mapacalor__detalle a:hover { color: var(--mls-secundario); }
@media (max-width: 575.98px) {
  .mls-mapacalor__zona summary { flex-wrap: wrap; }
  .mls-mapacalor__barra-wrap { order: 3; width: 100%; }
}

/* ------------------------------------------------------------------
   Zona dibujada en el mapa del buscador de publicaciones
   ------------------------------------------------------------------ */
.mls-zona__barra { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-bottom: .6rem; }
.mls-zona__barra .btn { min-height: 2.25rem; }
.mls-zona__estado { font-size: .85rem; color: var(--mls-texto-secundario); flex: 1 1 16rem; }
.mls-zona__vertice { background: #fff; border: 3px solid #2a78d6; border-radius: 50%; box-shadow: 0 0 0 2px #fff; cursor: grab; }
.mls-zona__vertice--primero { background: #2a78d6; }
.mls-zona--dibujando { cursor: crosshair; }
.mls-zona--dibujando .leaflet-marker-pane,
.mls-zona--dibujando .leaflet-overlay-pane .leaflet-interactive { pointer-events: none; }
.mls-zona-activa { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; background: #eef5fd; border: 1px solid #b7d3f6; border-radius: var(--mls-radius-sm); padding: .5rem .8rem; margin-bottom: .75rem; font-size: .9rem; }
@media (max-width: 576px) {
  .mls-zona__barra .btn { flex: 1 1 calc(50% - .5rem); }
  .mls-zona__vertice { transform: scale(1.25); }
}
