/* Adaptador de las vistas PHP existentes. Solo presentación en pantalla:
   no cambia los colores de las unidades del mapa ni los documentos impresos. */
@media screen {
  .hsp-panel {
    --bg: var(--hsp-canvas); --bg-app: var(--hsp-canvas); --bg2: var(--hsp-surface-subtle);
    --card: var(--hsp-surface); --card-bg: var(--hsp-surface); --surface-card: var(--hsp-surface);
    --surface-1: var(--hsp-surface); --surface-2: var(--hsp-surface-subtle);
    --fg: var(--hsp-text); --ink: var(--hsp-text); --text-main: var(--hsp-text); --text-primary: var(--hsp-text);
    --mut: var(--hsp-text-secondary); --muted: var(--hsp-text-secondary); --text-sub: var(--hsp-text-secondary);
    --text-secondary: var(--hsp-text-secondary); --text-muted: var(--hsp-text-secondary);
    --brand: var(--hsp-brand); --brandH: var(--hsp-brand-hover); --brand-dark: var(--hsp-brand-hover);
    --brand-hover: var(--hsp-brand-hover); --primary: var(--hsp-brand); --primary-dark: var(--hsp-brand-hover);
    --pri: var(--hsp-brand); --pri-dark: var(--hsp-brand-hover);
    --brand-blue: var(--hsp-brand); --brand-blue-hover: var(--hsp-brand-hover);
    --brand-glow: rgba(40,91,64,.12);
    --border: var(--hsp-border); --border-subtle: var(--hsp-border); --border-medium: var(--hsp-control-border);
    --status-success: var(--hsp-success); --status-success-bg: var(--hsp-success-bg);
    --status-warning: var(--hsp-warning); --status-warning-bg: var(--hsp-warning-bg);
    --status-error: var(--hsp-danger); --status-error-bg: var(--hsp-danger-bg);
    --status-info: var(--hsp-info); --status-info-bg: var(--hsp-info-bg);
    --radius-sm: 8px; --radius-md: 8px; --radius-lg: 12px;
    --shadow: var(--hsp-shadow); --shadow-sm: var(--hsp-shadow); --shadow-md: var(--hsp-shadow);
    --nav-bg: var(--hsp-surface); --nav-ink: var(--hsp-text); --nav-link: var(--hsp-text-secondary);
    --nav-link-active-bg: var(--hsp-brand-subtle); --nav-link-active-ink: var(--hsp-brand); --nav-border: var(--hsp-border);
    background: var(--hsp-canvas) !important; color: var(--hsp-text); font-family: var(--hsp-font); line-height: 1.5;
  }
  .hsp-panel :is(h1,h2,h3) { color: var(--hsp-text); line-height: 1.3; }
  .hsp-panel :is(.card,.panel,.box,.stat,.kpi-card,.table-card,.card-section) { border-color: var(--hsp-border); border-radius: var(--hsp-radius-card); box-shadow: var(--hsp-shadow); }
  .hsp-panel :is(.muted,.section-desc,.help,.hint) { color: var(--hsp-text-secondary); }
  .hsp-panel :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),select,textarea) { border-color: var(--hsp-control-border); border-radius: 8px; font-family: var(--hsp-font); font-size: 16px; color: var(--hsp-text); background-color: var(--hsp-surface); }
  .hsp-panel :is(input,select,textarea):focus-visible { outline: 3px solid var(--hsp-focus); outline-offset: 2px; box-shadow: none; }
  .hsp-panel :is(input[type="checkbox"],input[type="radio"]) { accent-color: var(--hsp-brand); }
  .hsp-panel :is(.btn,.mini-btn,.button,.tab-btn) { min-height: 44px; border-radius: 8px; font-family: var(--hsp-font); }
  .hsp-panel :is(.btn-primary,.btn.primary,.btn.pri,.button-primary) { background: var(--hsp-brand); color: #fff; }
  .hsp-panel :is(.btn-primary,.btn.primary,.btn.pri,.button-primary):hover { background: var(--hsp-brand-hover); }
  .hsp-panel .btn-secondary { background: var(--hsp-surface); border-color: var(--hsp-control-border); color: var(--hsp-text) !important; }
  .hsp-panel .btn-secondary:hover { background: var(--hsp-surface-subtle); }
  .hsp-panel .code-snippet { background: var(--hsp-surface-subtle); color: var(--hsp-text); border-color: var(--hsp-border); }
  .hsp-panel .switch-toggle:focus-within { outline: 3px solid var(--hsp-focus); outline-offset: 3px; border-radius: 999px; }
  .hsp-panel :is(.table-wrap,.table-responsive) { overflow-x: auto; }
  .hsp-panel table { font-variant-numeric: tabular-nums; }
  .hsp-panel thead th { text-transform: none; letter-spacing: normal; font-size: 14px; }
  .hsp-panel .main-nav { gap: 16px; padding: 12px 24px; margin-bottom: 24px; font-family: var(--hsp-font); box-shadow: none; }
  .hsp-panel .main-nav .nav-left { min-width: 0; }
  .hsp-panel .main-nav .brand { font-size: 16px; min-width: 0; overflow-wrap: anywhere; }
  .hsp-panel .main-nav .brand-ic { color: var(--hsp-brand); }
  .hsp-panel .main-nav :is(.nav-burger,.logout-btn) { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
  .hsp-panel .main-nav .logout-btn { color: var(--hsp-text-secondary); background: var(--hsp-surface-subtle); }
  .hsp-panel .main-nav .quick-link { width: auto; min-width: 44px; min-height: 44px; height: auto; padding: 8px 10px; gap: 6px; border-radius: 8px; }
  .hsp-panel .main-nav .quick-label { font-size: 12px; font-weight: 600; }
  .hsp-panel .pms-drawer { width: 300px; font-family: var(--hsp-font); }
  .hsp-panel .pms-drawer .drawer-close { min-height: 44px; min-width: 44px; }
  .hsp-panel .pms-drawer .drawer-link { min-height: 44px; border-radius: 8px; }
  .hsp-panel .pms-feedback-fab { background: var(--hsp-brand); box-shadow: var(--hsp-shadow); }
  .hsp-panel .pms-feedback-fab:hover { background: var(--hsp-brand-hover); }
  .hsp-panel .pms-feedback-card { font-family: var(--hsp-font); box-shadow: var(--hsp-shadow-modal); }
  .hsp-panel .pms-feedback-btn.primary { background: var(--hsp-brand); }
  .hsp-panel .pms-feedback-btn { min-height: 44px; }
  .hsp-panel .hsp-page-title { font-size: clamp(24px,3vw,32px); margin: 0 0 8px; }
  .hsp-panel.hsp-inicio .container { max-width: 1200px; padding: 16px 24px 48px; }
  .hsp-panel.hsp-inicio .stats { gap: 16px; }
  .hsp-panel.hsp-inicio .stat { padding: 20px; }
  .hsp-panel.hsp-inicio .grid { gap: 16px; }
  .hsp-panel.hsp-inicio a.card { padding: 20px; min-height: 88px; font-size: 16px; font-weight: 600; }
  .hsp-panel.hsp-inicio a.card .ic { background: var(--hsp-brand-subtle) !important; color: var(--hsp-brand) !important; }
  .hsp-panel.hsp-inicio .search-container { border-radius: 12px; }
  @media (max-width: 1200px) { .hsp-panel .main-nav .nav-quick { display: none; } }
  @media (max-width: 640px) {
    .hsp-panel .main-nav { padding: 8px 12px; gap: 8px; flex-wrap: wrap; }
    .hsp-panel .main-nav .user-name { display: none; }
    .hsp-panel .main-nav .user-info { margin-left: auto; flex-wrap: wrap; }
    .hsp-panel.hsp-inicio .container { padding: 8px 16px 32px; }
    .hsp-panel.hsp-inicio .stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .hsp-panel.hsp-inicio .stat { padding: 12px; min-width: 0; }
  }
}
@media screen {
  .hsp-panel { min-height: 100vh; min-height: 100dvh; }
  .hsp-panel.hsp-page-panel > .wrap { min-width: 0; }
  .hsp-panel.hsp-page-panel .filters .chip { background: var(--hsp-surface); color: var(--hsp-brand); border: 1px solid var(--hsp-control-border); }
  .hsp-panel .btn-blue { background: var(--hsp-brand); color: #fff; }
}
@media screen {
  .hsp-panel.hsp-tenant_not_found { --surface: var(--hsp-surface); }
  .hsp-panel.hsp-tenant_not_found .btn-primary { color: #fff; background: var(--hsp-brand); }
  .hsp-panel.hsp-tenant_not_found .btn-secondary { color: var(--hsp-text); background: var(--hsp-surface-subtle); }
  .hsp-panel.hsp-tenant_not_found .slug-pill { color: var(--hsp-text); background: var(--hsp-surface-subtle); border-color: var(--hsp-border); }
  .hsp-panel.hsp-google_auth .card { background: var(--hsp-surface); color: var(--hsp-text); }
  .hsp-panel.hsp-google_auth .card pre { color: #a7f3d0; }
  .hsp-panel.hsp-ver_errores :is(.b-tenant,.b-origin) { background: var(--hsp-info-bg); color: var(--hsp-info); }
  .hsp-panel.hsp-limpiar_demos .badge { background: var(--hsp-surface-subtle); color: var(--hsp-text); }
  .hsp-panel.hsp-limpiar_demos .alert-ok { background: var(--hsp-success-bg); color: var(--hsp-success); }
  .hsp-panel.hsp-descargar_backup { height: auto; padding: 24px 16px; }
  .hsp-panel.hsp-descargar_backup .box { background: var(--hsp-surface); }
  .hsp-panel :is(.hsp-scroll-table) { overflow-x: auto; }
}
@media screen {
  .hsp-panel.hsp-tenant_not_found .btn-primary { box-shadow: none; }
  .hsp-panel.hsp-editar button { color: #fff; }
  .hsp-panel.hsp-editar .alert { color: var(--hsp-success); background: var(--hsp-success-bg); border-color: var(--hsp-success); }
  .hsp-panel.hsp-admin_tenants { --text: var(--hsp-text); }
  .hsp-panel.hsp-admin_tenants th { background: var(--hsp-surface-subtle); }
  .hsp-panel.hsp-admin_tenants .btn-ghost:hover { background: var(--hsp-surface-subtle); }
  @media (max-width: 640px) { .hsp-panel.hsp-limpiar_demos .header { flex-direction: column; align-items: flex-start; gap: 16px; } }
}

@media screen {
  .hsp-ocupacion .hsp-occupancy-controls { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; margin-bottom: 20px; }
  .hsp-ocupacion .hsp-occupancy-controls > .card { min-width: 0; }
  .hsp-ocupacion .hsp-occupancy-day { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; }
  .hsp-ocupacion .hsp-occupancy-controls input { box-sizing: border-box; max-width: 100%; }
  .hsp-encuesta_ine .hsp-scroll-table { width: 100%; clear: both; }
  @media (max-width: 760px) {
    .hsp-ocupacion .hsp-occupancy-controls { grid-template-columns: minmax(0, 1fr); }
    .hsp-ocupacion .hsp-occupancy-controls .flex > label { flex-basis: 120px !important; }
  }
}

@media screen {
  .hsp-ficha_cliente .grid-main { grid-template-columns: minmax(0, 350px) minmax(0, 1fr); }
  .hsp-ficha_cliente .grid-main > * { min-width: 0; }
  .hsp-ficha_cliente form input[name="dni"] { min-width: 0; }
  @media (max-width: 900px) { .hsp-ficha_cliente .grid-main { grid-template-columns: minmax(0, 1fr); } }
}
@media screen {
  .hsp-ficha_cliente .stay-card { flex-wrap: wrap; gap: 12px; }
  .hsp-ficha_cliente .stay-info { min-width: 130px; overflow-wrap: anywhere; }
  .hsp-ficha_cliente .stay-card .actions { flex-wrap: wrap; gap: 8px; }
  @media (max-width: 600px) {
    .hsp-ficha_cliente .stay-card .actions { flex-basis: 100%; }
    .hsp-ficha_cliente .stay-card .actions > * { min-height: 44px; }
    .hsp-ficha_cliente .stay-icon { margin-right: 0; }
  }
}
@media screen {
  .hsp-panel .main-nav .nav-burger { width: 44px !important; flex: 0 0 44px; margin-bottom: 0; }
  .hsp-panel .main-nav .nav-left { min-width: 0; }
}
