/* BACKSTAGE · Identidad visual 1.5.0 */
@media screen {
  html[data-bs-app] {
    --primary:var(--bs-primary-color);--title:var(--bs-primary-color);--ink:var(--bs-text-color);
    --text:var(--bs-text-color);--muted:var(--bs-muted);--canvas:var(--bs-background-color);
    --surface:var(--bs-card-color);--surface-soft:var(--bs-subtle);--line:var(--bs-line);
    --bg:var(--bs-background-color);--card:var(--bs-card-color);--navy:var(--bs-primary-color);
    --nav:var(--bs-menu-color);--accent:var(--bs-primary-color);--accent-dark:var(--bs-primary-hover);
    --secondary:var(--bs-menu-color);--menu:var(--bs-menu-text-color);--header-text:var(--bs-header-text-color);
    --primary-color:var(--bs-header-color);--secondary-color:var(--bs-menu-color);
    --background-color:var(--bs-background-color);--card-color:var(--bs-card-color);
    --menu-text-color:var(--bs-menu-text-color);--accent-color:var(--bs-primary-color);
    --primary-text-color:var(--bs-text-color);--header-text-color:var(--bs-header-text-color);
  }
  html[data-bs-app] body {background-color:var(--bs-background-color)!important;color:var(--bs-text-color)!important;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
  html[data-bs-app] body .card,html[data-bs-app] body .settings-panel,html[data-bs-app] body .settings-section,html[data-bs-app] body .metric,html[data-bs-app] body .project-card {background-color:var(--bs-card-color)!important;color:var(--bs-text-color)}
  html[data-bs-app] body h1,html[data-bs-app] body h2,html[data-bs-app] body h3,html[data-bs-app] body .page-title,html[data-bs-app] body .section-title {color:var(--bs-primary-color)!important}
  html[data-bs-app] body input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),html[data-bs-app] body select,html[data-bs-app] body textarea {background-color:var(--bs-card-color);color:var(--bs-text-color);border-color:var(--bs-line);font-family:inherit}
  html[data-bs-app] body input:focus,html[data-bs-app] body select:focus,html[data-bs-app] body textarea:focus {outline-color:color-mix(in srgb,var(--bs-primary-color) 18%,transparent);border-color:var(--bs-primary-color)}
  html[data-bs-app] body input[type=checkbox],html[data-bs-app] body input[type=radio],html[data-bs-app] body progress {accent-color:var(--bs-accent-color)}
  html[data-bs-app] body .button:not(.button-secondary):not(.button-danger):not(.button-ghost):not(.button-purple),
  html[data-bs-app] body .btn:not(.secondary):not(.danger):not(.btn-danger):not(.btn-secondary):not(.btn-light):not(.btn-outline),
  html[data-bs-app] body .login-card button,html[data-bs-app] body button:not([class]) {background:var(--bs-primary-color)!important;color:var(--bs-on-primary)!important;border-color:var(--bs-primary-color)!important}
  html[data-bs-app] body .button:not(.button-secondary):not(.button-danger):not(.button-ghost):not(.button-purple):hover,
  html[data-bs-app] body .btn:not(.secondary):not(.danger):not(.btn-danger):not(.btn-secondary):not(.btn-light):not(.btn-outline):hover,
  html[data-bs-app] body .login-card button:hover {background:var(--bs-primary-hover)!important}
  html[data-bs-app] body .button-secondary,html[data-bs-app] body .btn.secondary,html[data-bs-app] body .btn-secondary {background:var(--bs-card-color)!important;color:var(--bs-primary-color)!important;border:1px solid var(--bs-line)!important}
  html[data-bs-app] body .progress-bar,html[data-bs-app] body .progress-fill {background-color:var(--bs-accent-color)!important}
  html[data-bs-app] body .main-nav,html[data-bs-app] body nav.mobile-nav,html[data-bs-app] body .site-nav,html[data-bs-app] body .nav-toggle,html[data-bs-app] body .mobile-nav-toggle {background:var(--bs-menu-color)!important;color:var(--bs-menu-text-color)!important;border-color:var(--bs-line)}
  html[data-bs-app] body .main-nav a,html[data-bs-app] body nav.mobile-nav a,html[data-bs-app] body .site-nav a {color:var(--bs-menu-text-color)!important}
  html[data-bs-app] body .main-nav a.active,html[data-bs-app] body nav.mobile-nav a.active,html[data-bs-app] body .site-nav a.active {background:var(--bs-subtle)!important;color:var(--bs-primary-color)!important;box-shadow:inset 0 -3px var(--bs-accent-color)}
  html[data-bs-app] body .main-nav a:hover,html[data-bs-app] body nav.mobile-nav a:hover,html[data-bs-app] body .site-nav a:hover {background:var(--bs-subtle)!important;color:var(--bs-primary-color)!important}
  html[data-bs-app] header.zz-bs-header {background:var(--bs-header-color)!important;color:var(--bs-header-text-color)!important}
  html[data-bs-app] .zz-bs-header .zz-bs-brand,html[data-bs-app] .zz-bs-header .zz-bs-name,html[data-bs-app] .zz-bs-header .zz-bs-caption {color:var(--bs-header-text-color)!important}
  html[data-bs-app] .zz-bs-header .zz-bs-caption {opacity:.85}
  html[data-bs-app] .zz-bs-header .zz-bs-slash {color:var(--bs-accent-color)!important}
  html[data-bs-app] .zz-bs-header .zz-bs-brand {flex-shrink:1;min-width:0}
  html[data-bs-app] .zz-bs-header .zz-bs-name {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none;letter-spacing:1px}
  html[data-bs-app] .zz-bs-header .zz-bs-logo {width:auto;max-width:130px;flex:0 1 auto;min-width:30px}
  html[data-bs-app] .zz-bs-header .zz-bs-brand:focus-visible {outline-color:var(--bs-accent-color)}
  html[data-bs-app] .bs-preview .bs-preview-card h3 {color:var(--bs-primary-color)!important}
  html[data-bs-app="WIP"] .settings-stack {grid-template-columns:minmax(0,1fr);min-width:0}
  html[data-bs-app="WIP"] .settings-stack>* {min-width:0}
  /* Pastillas de navegación e indicadores; cada app guarda su propia pareja. */
  html[data-bs-app="BILLY"] body :is(.kpi,.billing-report-kpi),
  html[data-bs-app="CRM"] body .dashboard-stats .card,
  html[data-bs-app="CRM"] body .report-kpis .report-kpi,
  html[data-bs-app="WIP"] body .report-summary>div,
  html[data-bs-app="CATALOGO"] body .launchpad-grid .launch-card {background:var(--bs-tile-color)!important;color:var(--bs-tile-text-color)!important}
  html[data-bs-app="BILLY"] body :is(.kpi,.billing-report-kpi) *,
  html[data-bs-app="CRM"] body .dashboard-stats .card *,
  html[data-bs-app="CRM"] body .report-kpis .report-kpi *,
  html[data-bs-app="WIP"] body .report-summary>div *,
  html[data-bs-app="CATALOGO"] body .launchpad-grid .launch-card * {color:var(--bs-tile-text-color)!important}
  html[data-bs-app="CATALOGO"] body .launchpad-grid .launch-card:hover {background:var(--launchpad-button-hover-color,var(--bs-tile-color))!important}
  html[data-bs-app="CATALOGO"] body .launchpad-grid .disabled-launch-card:hover {background:var(--bs-tile-color)!important}
  html[data-bs-app="CRM"] body .report-kpis .report-kpi {box-sizing:border-box;min-width:0;border:1px solid var(--bs-line)}
  html[data-bs-app="CRM"] body .report-kpis .report-kpi.accent {border-left:3px solid var(--bs-accent-color)}
  html[data-bs-app="CRM"] body .report-kpis .report-kpi small {opacity:1}
  html[data-bs-app="CRM"] body .report-kpis .report-kpi :is(small,strong) {overflow-wrap:anywhere}
}

/* El editor tiene su propio espacio de nombres para conservar los formularios existentes. */
html[data-bs-app] body .bs-appearance-panel {display:block;box-sizing:border-box;margin:0 0 26px;padding:24px;border:1px solid var(--bs-line);border-radius:14px;background:var(--bs-card-color);color:var(--bs-text-color);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-width:0;max-width:100%;box-shadow:none}
.bs-appearance-panel * {box-sizing:border-box;min-width:0}
html[data-bs-app] .bs-appearance-panel h2 {font-size:21px;line-height:1.3;margin:0 0 18px;font-weight:750;letter-spacing:-.4px;text-align:left}
.bs-appearance-panel .bs-description {margin:0 0 22px;font-size:16px;line-height:1.55;color:var(--bs-muted)}
.bs-appearance-panel form {display:block;margin:0;padding:0;max-width:none}
.bs-identity-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-bottom:22px;align-items:start}
.bs-appearance-panel label {display:block;color:var(--bs-text-color);font-size:14px;font-weight:650;line-height:1.4;margin:0;padding:0}
html[data-bs-app] .bs-identity-grid input {display:block;width:100%;height:42px;min-height:42px;margin:7px 0 0;padding:8px 11px;border:1px solid var(--bs-line);border-radius:6px;font:inherit;font-weight:400;background:var(--bs-card-color);color:var(--bs-text-color)}
.bs-identity-grid small {display:block;margin:3px 0 0;font-size:12px;font-weight:600;line-height:1.4;color:var(--bs-muted)}
.bs-appearance-layout {display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);gap:32px;align-items:start;margin-bottom:28px}
.bs-color-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 20px;align-items:stretch}
.bs-color-grid>label {display:flex;flex-direction:column}
.bs-color-grid .bs-tiles-help {grid-column:1/-1;margin:-12px 0 0;font-size:12px;line-height:1.5;color:var(--bs-muted)}
.bs-color-control {display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:8px}
html[data-bs-app] .bs-color-control input[type=color] {appearance:auto;display:block;flex:0 0 52px;width:52px;max-width:52px;height:42px;min-height:42px;padding:4px;margin:0;border:1px solid var(--bs-line);border-radius:6px;cursor:pointer;background:var(--bs-card-color)}
.bs-color-control output {font:500 13px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--bs-muted);letter-spacing:0}
.bs-eyebrow {display:block;margin:1px 0 12px;font-size:12px;font-weight:750;line-height:1.4;letter-spacing:1.2px;color:var(--bs-muted)}
.bs-preview {display:block;overflow:hidden;border:1px solid var(--bs-line);border-radius:10px;max-width:100%}
.bs-preview-header {display:flex;align-items:center;gap:16px;min-height:76px;padding:18px 24px;background:var(--bs-header-color);color:var(--bs-header-text-color)}
.bs-preview-logo {width:auto;max-width:100px;height:36px;object-fit:contain;flex:0 1 auto}
.bs-preview-name {font-size:21px;font-weight:750;line-height:1.3;overflow-wrap:anywhere}
.bs-preview-menu {padding:12px 18px;background:var(--bs-menu-color);color:var(--bs-menu-text-color);font-size:12px;line-height:1.5}
.bs-preview-body {padding:18px;background:var(--bs-background-color)}
.bs-preview-tile {display:flex;flex-direction:column;gap:6px;padding:16px 18px;margin-bottom:14px;border:1px solid var(--bs-line);border-radius:12px;background:var(--bs-tile-color);color:var(--bs-tile-text-color);font-size:14px;font-weight:650}
.bs-preview-tile strong {font-size:25px;line-height:1.2;color:inherit}
html[data-bs-app="CATALOGO"] .bs-preview-tile {min-height:76px;align-items:center;justify-content:center;text-align:center}
.bs-preview-card {padding:18px;border:1px solid var(--bs-line);border-radius:8px;background:var(--bs-card-color);color:var(--bs-text-color)}
html[data-bs-app] .bs-preview-card h3 {margin:0 0 18px;font-size:18px;font-weight:750;line-height:1.4;text-align:left}
.bs-preview-card p {margin:0 0 17px;font-size:13px;line-height:1.6}
.bs-preview-button {display:inline-block;border-radius:6px;padding:11px 13px;font-size:13px;font-weight:700;line-height:1.3;background:var(--bs-primary-color);color:var(--bs-on-primary)}
.bs-preview-progress {width:65%;height:5px;margin-top:20px;border-radius:5px;background:var(--bs-accent-color)}
.bs-logo-status {min-height:18px;margin:8px 0 0;font-size:12px;line-height:1.5;color:var(--bs-muted)}
.bs-appearance-actions {display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:0}
html[data-bs-app] .bs-appearance-actions button {display:inline-flex;align-items:center;justify-content:center;width:auto;min-height:42px;padding:11px 16px;border:1px solid var(--bs-line);border-radius:7px;font:700 14px/1.35 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;cursor:pointer;white-space:normal;box-shadow:none;text-decoration:none;transition:background .15s}
html[data-bs-app] .bs-appearance-actions .bs-save {color:var(--bs-on-primary);background:var(--bs-primary-color);border-color:var(--bs-primary-color)}
html[data-bs-app] .bs-appearance-actions .bs-save:hover {background:var(--bs-primary-hover)}
html[data-bs-app] .bs-appearance-actions .bs-reset {color:var(--bs-primary-color);background:var(--bs-card-color)}
html[data-bs-app] .bs-appearance-actions .bs-reset:hover {background:var(--bs-subtle)}
.bs-appearance-panel button:focus-visible,.bs-appearance-panel input:focus-visible {outline:3px solid color-mix(in srgb,var(--bs-primary-color) 24%,transparent);outline-offset:2px}
.bs-message {font-size:14px;line-height:1.5;padding:12px 14px;margin:0 0 18px;border-radius:8px}
.bs-error {background:#fdecec;color:#992222;border:1px solid #eec4c4}
.bs-success {background:#e9f8f0;color:#1a6e43;border:1px solid #c2e8d5}
@media(max-width:1100px) {
  .bs-appearance-layout {grid-template-columns:1fr;gap:26px}
  .bs-preview-column {max-width:540px;width:100%}
}
@media(max-width:720px) {
  html[data-bs-app] body .bs-appearance-panel {padding:18px 14px}
  .bs-identity-grid {grid-template-columns:1fr;gap:16px}
  .bs-color-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px}
  .bs-color-control {gap:8px}
  .bs-color-control output {font-size:12px}
  html[data-bs-app] .bs-identity-grid input {font-size:16px}
  .bs-appearance-actions {flex-direction:column;align-items:stretch}
  html[data-bs-app] .bs-appearance-actions button {width:100%}
  .bs-preview-header {padding:18px}
  .bs-preview-body,.bs-preview-card {padding:16px}
  html[data-bs-app] .zz-bs-header .zz-bs-logo {max-width:90px}
}
@media(max-width:360px) {
  html[data-bs-app] .bs-color-control input[type=color] {width:42px;max-width:42px;flex-basis:42px}
  .bs-color-control {gap:6px}
}

/* La nueva familia conserva un tamaño óptico uniforme en las cabeceras. */
html[data-bs-app] .zz-bs-header .zz-bs-logo.bs-family-logo{width:60px;height:60px;max-width:60px;max-height:60px;min-width:60px;flex:0 0 60px;margin-right:-6px}
.bs-auth-brand{display:block;width:84px;height:84px;object-fit:contain;margin:0 auto 20px}
@media(max-width:720px){html[data-bs-app] .zz-bs-header .zz-bs-logo.bs-family-logo{width:48px;height:48px;max-width:48px;max-height:48px;min-width:48px;flex-basis:48px}}
@media print{.bs-family-logo{filter:brightness(0)}}

/* Pie al fondo en páginas cortas y después del contenido en páginas largas. */
@media screen {
  html[data-bs-app] body {display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}
  html[data-bs-app] body>header,html[data-bs-app] body>nav {flex-shrink:0}
  html[data-bs-app] body>main {flex:1 0 auto;min-height:0}
  html[data-bs-app] body>.bs-site-footer {box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px 28px;flex-shrink:0;width:100%;margin:0;padding:22px 32px;border-top:1px solid var(--bs-line);color:var(--bs-text-color);background:var(--bs-background-color);font-size:12px;line-height:1.5;overflow-wrap:anywhere}
  html[data-bs-app] body>.bs-site-footer>span {min-width:0;max-width:100%}
  html[data-bs-app] body.bs-auth-page {margin:0;padding:0;align-items:stretch;justify-content:flex-start}
  html[data-bs-app] body.bs-auth-page>main {box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;width:100%;max-width:none;min-height:0;margin:0;padding:48px 20px}
  html[data-bs-app] body.bs-auth-page>main>.card {box-sizing:border-box;flex-shrink:0;width:100%;max-width:486px;margin:0}
  html[data-bs-app] body.bs-auth-page .zz-bs-brand {width:auto}
  @media(max-width:560px) {
    html[data-bs-app] body.bs-auth-page>main {padding:28px 16px}
    html[data-bs-app] body>.bs-site-footer {padding:18px 16px;gap:8px;flex-direction:column;align-items:flex-start}
  }
}
@media print {.bs-site-footer{display:none!important}}