:root {
  --blue:#123456;
  --wine:#560216;
  --gold:#FFC107;
  --bg:#09111f;
  --panel:#101b2f;
  --panel2:#14233d;
  --text:#eef4ff;
  --muted:#9fb0c8;
  --line:rgba(255,255,255,.1);
  --danger:#ff6b6b
}

* {
  box-sizing:border-box
}

body {
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;
  background:#0b1220;
  color:var(--text)
}

a {
  color:inherit
}

input,select,textarea,button {
  font:inherit
}

input,select,textarea {
  width:100%;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#0c1728;
  color:var(--text)
}

textarea {
  min-height:90px
}

.public-body {
  background:radial-gradient(circle at 20% 20%,rgba(255,193,7,.18),transparent 24%),radial-gradient(circle at 80% 10%,rgba(86,2,22,.5),transparent 22%),#08101f
}

.container {
  width:min(1120px,92%);
  margin:0 auto
}

.hero {
  min-height:100vh;
  display:flex;
  align-items:center;
  position:relative;
  overflow:hidden
}

.hero.small {
  min-height:50vh
}

.hero-grid {
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:48px;
  align-items:center
}

.hero h1 {
  font-size:clamp(42px,7vw,82px);
  line-height:.95;
  margin:10px 0 18px;
  letter-spacing:-.05em
}

.lead {
  font-size:20px;
  color:var(--muted);
  line-height:1.55
}

.eyebrow {
  display:inline-flex;
  color:var(--gold);
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:12px
}

.glass-card,.card {
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));
  border:1px solid var(--line);
  border-radius:24px;
  padding:24px;
  box-shadow:0 20px 60px rgba(0,0,0,.25)
}

.actions {
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-top:28px
}

.btn {
  border:0;
  border-radius:14px;
  background:var(--gold);
  color:#1a1200;
  padding:12px 18px;
  font-weight:800;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer
}

.btn.ghost {
  background:transparent;
  color:var(--text);
  border:1px solid var(--line)
}

.btn.full {
  width:100%
}

.auth-body {
  min-height:100vh;
  display:grid;
  place-items:center;
  background:radial-gradient(circle at top,var(--blue),#070c14 50%)
}

.login-card {
  width:min(430px,92%);
  background:#101b2f;
  border:1px solid var(--line);
  border-radius:24px;
  padding:32px
}

.login-card form,.stack {
  display:grid;
  gap:12px
}

.brand {
  font-weight:900;
  font-size:22px;
  color:#fff
}

.brand span {
  color:var(--gold)
}

.brand.big {
  font-size:32px;
  margin-bottom:20px
}

.alert {
  background:rgba(255,107,107,.15);
  border:1px solid rgba(255,107,107,.35);
  padding:12px;
  border-radius:12px;
  color:#ffd8d8
}

.alert.ok {
  background: rgba(34,197,94,.12);
  border-color: rgba(34,197,94,.32);
  color: #d7ffe5;
}

.alert.warn {
  background: rgba(255,193,7,.12);
  border-color: rgba(255,193,7,.36);
  color: #fff4c2;
}

.alert.danger {
  background: rgba(255,107,107,.15);
  border-color: rgba(255,107,107,.38);
  color: #ffd8d8;
}

.app-body {
  display:grid;
  grid-template-columns:280px 1fr;
  min-height:100vh;
  background:#08101d
}

.sidebar {
  background:#0c1728;
  border-right:1px solid var(--line);
  padding:22px;
  position:sticky;
  top:0;
  height:100vh;
  overflow:auto
}

.tenant {
  margin:18px 0;
  padding:14px;
  border-radius:16px;
  background:rgba(255,255,255,.05);
  font-weight:700
}

.tenant small {
  display:block;
  color:var(--muted);
  font-weight:500;
  margin-top:4px
}

.sidebar nav {
  display:grid;
  gap:4px
}

.sidebar a {
  text-decoration:none;
  color:var(--muted);
  padding:10px 12px;
  border-radius:12px
}

.sidebar a:hover {
  background:rgba(255,255,255,.07);
  color:#fff
}

.sidebar hr {
  border:0;
  border-top:1px solid var(--line);
  width:100%;
  margin:12px 0
}

.main {
  padding:28px;
  overflow:auto
}

.topbar {
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
  margin-bottom:22px
}

.topbar h1 {
  margin:0;
  font-size:30px;
  letter-spacing:-.03em
}

.grid {
  display:grid;
  gap:18px;
  margin-bottom:18px;
  margin-top:18px
}

.grid.two {
  grid-template-columns:repeat(2,minmax(0,1fr))
}

.cards4 {
  grid-template-columns:repeat(4,minmax(0,1fr))
}

.card h2 {
  margin:0 0 16px;
  font-size:20px
}

.card span {
  color:var(--muted)
}

.card strong {
  display:block;
  font-size:34px;
  margin-top:6px
}

table {
  width:100%;
  border-collapse:collapse
}

th,td {
  text-align:left;
  border-bottom:1px solid var(--line);
  padding:10px 8px;
  vertical-align:top
}

th {
  color:var(--muted);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em
}

.debug {
  background:#060b13;
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  white-space:pre-wrap;
  overflow:auto
}

.debug.small {
  max-height:260px
}

.section {
  padding:60px 0
}

.note {
  color:var(--muted);
  font-size:14px
}

.inline {
  display:grid;
  grid-template-columns:1fr 90px;
  gap:8px;
  align-items:center
}

.truncate {
  max-width:320px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis
}

@media(max-width:900px) {
  .app-body {
    grid-template-columns:1fr
  }

.sidebar {
    position:relative;
    height:auto
  }

.hero-grid,.grid.two,.cards4 {
    grid-template-columns:1fr
  }

.topbar {
    display:block
  }

.main {
    padding:18px
  }
}

.field {
  display:grid;
  gap:7px
}

.field label {
  font-size:13px;
  font-weight:800;
  color:#dce8ff;
  display:flex;
  gap:7px;
  align-items:center
}

.form-clean input::placeholder,.form-clean textarea::placeholder {
  color:#657998
}

.grid.tight {
  gap:12px;
  margin-bottom:0
}

.check-row {
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  align-items:center
}

.check-row label {
  display:inline-flex;
  gap:8px;
  align-items:center;
  color:var(--muted);
  font-weight:700
}

.check-row input {
  width:auto
}

.help-dot {
  display:inline-grid;
  place-items:center;
  width:18px;
  height:18px;
  border-radius:50%;
  background:rgba(255,193,7,.18);
  border:1px solid rgba(255,193,7,.5);
  color:var(--gold);
  font-size:12px;
  font-weight:900;
  cursor:help;
  position:relative
}

.help-dot:hover::after,.help-dot:focus::after {
  content:attr(data-help);
  position:absolute;
  z-index:10;
  left:22px;
  top:-10px;
  width:min(320px,70vw);
  padding:12px 13px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#07101f;
  color:#eef4ff;
  box-shadow:0 14px 40px rgba(0,0,0,.35);
  font-size:13px;
  font-weight:500;
  line-height:1.4
}

.pill {
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:5px 9px;
  font-size:12px;
  font-weight:800;
  border:1px solid var(--line);
  background:rgba(255,255,255,.06);
  color:var(--muted)
}

.pill.ok {
  background:rgba(29,185,84,.12);
  border-color:rgba(29,185,84,.35);
  color:#9df0ba
}

.pill.warn {
  background:rgba(255,193,7,.13);
  border-color:rgba(255,193,7,.35);
  color:#ffe08a
}

.pill.danger {
  background:rgba(255,107,107,.13);
  border-color:rgba(255,107,107,.35);
  color:#ffb5b5
}

.pill.muted {
  background:rgba(255,255,255,.06);
  color:var(--muted)
}

.muted-text {
  color:var(--muted)
}

.table-title {
  font-size:14px;
  display:block;
  margin-bottom:2px
}

.table-title+small,td small {
  display:block;
  color:var(--muted);
  font-size:12px
}

.json-details summary {
  cursor:pointer;
  color:var(--gold);
  font-weight:800;
  font-size:13px
}

.json-details .debug {
  margin-top:8px
}

.metric-list {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px
}

.metric-list>div {
  padding:14px;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,.04)
}

.metric-list span {
  font-size:12px;
  color:var(--muted);
  display:block;
  margin-bottom:6px
}

.metric-list strong {
  font-size:24px
}

.intro-card {
  margin-bottom:18px
}

code {
  background:rgba(255,255,255,.08);
  padding:2px 6px;
  border-radius:8px;
  color:#fff
}

.is-hidden {
  display:none!important
}

.actions-cell {
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  align-items:center
}

.actions-cell form {
  display:inline
}

.mini-btn {
  border:1px solid var(--line);
  background:rgba(255,255,255,.06);
  color:#eef4ff;
  border-radius:10px;
  padding:7px 9px;
  font-weight:800;
  font-size:12px;
  text-decoration:none;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center
}

.mini-btn.ok {
  background:rgba(29,185,84,.12);
  border-color:rgba(29,185,84,.35);
  color:#9df0ba
}

.mini-btn.warn {
  background:rgba(255,193,7,.13);
  border-color:rgba(255,193,7,.35);
  color:#ffe08a
}

.mini-btn.danger {
  background:rgba(255,107,107,.13);
  border-color:rgba(255,107,107,.35);
  color:#ffb5b5
}

.mini-btn.muted {
  color:var(--muted)
}

.tabs ul {
  list-style:none;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  padding:0;
  margin:0 0 12px
}

.tabs a {
  display:block;
  text-decoration:none;
  padding:9px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  color:var(--muted);
  font-weight:800
}

.tabs li.is-active a {
  background:var(--gold);
  color:#1a1200;
  border-color:var(--gold)
}

.schedule-builder {
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,255,255,.035);
  padding:14px
}

.schedule-head {
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  margin-bottom:12px
}

.schedule-builder input[type=time] {
  padding:8px 10px;
  border-radius:10px
}

.check-line {
  display:flex!important;
  gap:10px;
  align-items:center;
  font-weight:800;
  color:#dce8ff
}

.check-line input {
  width:auto
}

.note.is-danger {
  color:#ffb5b5
}

.note.is-success {
  color:#9df0ba
}

@media(max-width:900px) {
  .actions-cell {
    display:grid
  }

.schedule-head {
    display:grid
  }
}

.fallback-hero {
  padding:54px 0;
  align-items:flex-start
}

.fallback-shell {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:18px;
  align-items:start
}

.fallback-shell .glass-card {
  height:auto
}

.fallback-shell h1 {
  font-size:clamp(34px,5vw,58px);
  line-height:1;
  margin:14px 0 14px
}

.agent-list-public {
  display:grid;
  gap:10px
}

.agent-public-card {
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px;
  background:rgba(255,255,255,.04);
  display:grid;
  gap:8px
}

.agent-public-card small {
  color:var(--muted)
}

@media(max-width:900px) {
  .fallback-shell {
    grid-template-columns:1fr
  }

.fallback-hero {
    padding:24px 0
  }
}

.line-item {
  border:1px solid var(--line);
  border-radius:12px;
  padding:8px 10px;
  margin-bottom:7px;
  background:rgba(255,255,255,.035)
}

.line-item strong {
  font-size:13px;
  margin:0;
  display:block
}

.line-item small {
  color:var(--muted);
  font-size:12px
}

.check-grid {
  display:grid;
  gap:8px;
  max-height:280px;
  overflow:auto;
  border:1px solid var(--line);
  border-radius:14px;
  padding:10px;
  background:rgba(255,255,255,.03)
}

.check-grid label {
  display:flex;
  gap:9px;
  align-items:flex-start;
  color:#dce8ff;
  font-weight:700
}

.check-grid input {
  width:auto;
  margin-top:3px
}

.card hr {
  border:0;
  border-top:1px solid var(--line);
  margin:18px 0
}

.form-clean .grid.two {
  margin-bottom:0
}

.alert + .card,.alert + .grid {
  margin-top:14px
}

.inline-pay-form {
  display:grid!important;
  grid-template-columns:90px 115px minmax(120px,1fr) auto;
  gap:6px;
  align-items:center;
  min-width:360px
}

.inline-pay-form input,.inline-pay-form select {
  padding:7px 8px;
  border-radius:10px;
  font-size:12px
}

@media(max-width:900px) {
  .inline-pay-form {
    grid-template-columns:1fr;
    min-width:0
  }
}

.app-version {
  display:block;
  font-size:10px;
  opacity:.65;
  margin-top:2px;
  letter-spacing:.04em
}

.subsection-title {
  font-weight:800;
  margin:8px 0 2px;
  padding:8px 10px;
  border-radius:12px;
  background:rgba(255,193,7,.10);
  border:1px solid rgba(255,193,7,.22)
}

/* v1.6 Onboarding */
.onboarding-hero-card,.onboarding-alert {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px
}

.onboarding-progress-box {
  display:flex;
  gap:14px;
  align-items:center;
  min-width:210px
}

.progress-ring {
  width:92px;
  height:92px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:radial-gradient(circle at center,#101b2f 52%,transparent 54%),conic-gradient(var(--gold) var(--progress, 0%),rgba(255,255,255,.12) 0);
  border:1px solid var(--line)
}

.progress-ring strong {
  font-size:22px;
  margin:0
}

.progress-ring span {
  font-size:11px;
  color:var(--muted);
  margin-top:-22px
}

.onboarding-steps {
  display:grid;
  gap:10px
}

.onboarding-step {
  display:grid;
  grid-template-columns:34px 1fr auto;
  gap:12px;
  align-items:center;
  padding:12px;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,.035)
}

.onboarding-step.done {
  border-color:rgba(29,185,84,.35);
  background:rgba(29,185,84,.07)
}

.onboarding-step .step-icon {
  width:34px;
  height:34px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.08);
  font-weight:900;
  color:var(--muted)
}

.onboarding-step.done .step-icon {
  background:rgba(29,185,84,.16);
  color:#9df0ba
}

.onboarding-step strong {
  font-size:14px;
  margin:0
}

.onboarding-step small {
  display:block;
  color:var(--muted);
  font-size:12px;
  line-height:1.35
}

.is-success-box {
  background:rgba(29,185,84,.13);
  border-color:rgba(29,185,84,.35);
  color:#c9ffda
}

.onboarding-form h3 {
  margin:4px 0 2px
}

.onboarding-form hr {
  border:0;
  border-top:1px solid var(--line);
  width:100%;
  margin:10px 0
}

@media(max-width:900px) {
  .onboarding-hero-card,.onboarding-alert {
    display:grid
  }

.onboarding-progress-box {
    min-width:0
  }

.onboarding-step {
    grid-template-columns:34px 1fr
  }

.onboarding-step .mini-btn {
    grid-column:1/-1
  }
}

/* v1.7 Registro de clientes */
.login-card.wide-card {
  width:min(780px,94%)
}

.field select[disabled],.field input[disabled] {
  opacity:.65
}

/* v1.8.1 profesionalización permisos/agentes */
.subcard {
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
  border-radius:16px;
  padding:14px;
  margin:10px 0
}

.radio-card {
  display:block;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  padding:10px 12px;
  margin:8px 0;
  background:rgba(255,255,255,.03);
  cursor:pointer
}

.radio-card input {
  margin-right:8px
}

.inline-details {
  display:inline-block
}

.inline-details summary {
  list-style:none;
  cursor:pointer
}

.inline-details summary::-webkit-details-marker {
  display:none
}

.qr-box {
  margin-top:8px;
  padding:12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:rgba(0,0,0,.18);
  display:grid;
  gap:8px;
  max-width:300px
}

.qr-box img {
  width:180px;
  height:180px;
  border-radius:12px;
  background:#fff;
  padding:8px
}

.denied-card {
  text-align:left
}

.denied-icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:72px;
  height:72px;
  border-radius:22px;
  background:rgba(255,193,7,.12);
  color:#FFC107;
  font-weight:900;
  font-size:22px;
  margin-bottom:12px
}

.pause-form select {
  min-width:180px
}

/* v1.9 Operación Pro */
.health-card {
  display:grid;
  gap:12px
}

.health-head {
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start
}

.health-list {
  list-style:none;
  margin:8px 0 0;
  padding:0;
  display:grid;
  gap:6px;
  color:#dce8ff
}

.metric-list.compact {
  grid-template-columns:repeat(auto-fit,minmax(130px,1fr))
}

.metric-list.compact strong {
  font-size:20px
}

.warn-text {
  color:#ffe08a
}

.copy-flash {
  animation:copyFlash 1.4s ease
}

@keyframes copyFlash {
  0% {
    box-shadow:0 0 0 rgba(255,193,7,0)
  }

30% {
    box-shadow:0 0 0 4px rgba(255,193,7,.18)
  }

100% {
    box-shadow:0 0 0 rgba(255,193,7,0)
  }
}

/* v1.9.2 branding / landing */
.landing-hero .hero-panel h3 {
  font-size:26px;
  margin:10px 0 6px
}

.landing-section h2 {
  font-size:clamp(30px,4vw,48px);
  line-height:1.05;
  letter-spacing:-.04em;
  margin:10px 0 22px
}

.landing-section.alt {
  background:rgba(255,255,255,.025)
}

.landing-cards .card h3 {
  margin:0 0 8px
}

.brand .app-version {
  line-height:1.35
}

.hero-panel ul {
  display:grid;
  gap:8px;
  margin:16px 0 0;
  padding-left:20px
}

.hero-panel code,.landing-section code {
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.08)
}

.mini-stack {
  display:grid;
  gap:6px;
  min-width:135px
}

.mini-input {
  padding:7px 8px;
  border-radius:10px;
  font-size:12px
}

.notice {
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,255,255,.05);
  color:#dce8ff;
  margin:10px 0 14px;
  line-height:1.45
}

.notice strong {
  display:block;
  margin-bottom:4px
}

.notice.warn {
  background:rgba(255,193,7,.11);
  border-color:rgba(255,193,7,.32);
  color:#ffe8a8
}

/* v1.9.4 UX final pre-staging */
.flash-stack {
  display:grid;
  gap:10px;
  margin:0 0 16px
}

.flash {
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px 14px;
  background:rgba(255,255,255,.06);
  font-weight:700
}

.flash-success {
  background:rgba(29,185,84,.12);
  border-color:rgba(29,185,84,.35);
  color:#bff7cf
}

.flash-error {
  background:rgba(255,107,107,.13);
  border-color:rgba(255,107,107,.35);
  color:#ffd0d0
}

.flash-warn {
  background:rgba(255,193,7,.12);
  border-color:rgba(255,193,7,.35);
  color:#ffe7a3
}

.flash-info {
  background:rgba(92,157,255,.12);
  border-color:rgba(92,157,255,.32);
  color:#cfe2ff
}

.nav-groups {
  gap:10px!important
}

.nav-group {
  border-top:1px solid rgba(255,255,255,.08);
  padding-top:8px
}

.nav-group:first-child {
  border-top:0
}

.nav-group-title {
  width:100%;
  border:0;
  background:transparent;
  color:#eef4ff;
  text-align:left;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:900;
  padding:8px 10px;
  opacity:.8;
  cursor:pointer
}

.nav-group-links {
  display:grid;
  gap:3px
}

.sidebar a.is-active {
  background:rgba(255,193,7,.15);
  color:#fff;
  border:1px solid rgba(255,193,7,.26)
}

.mobile-menu-toggle {
  display:none;
  position:fixed;
  z-index:60;
  left:14px;
  top:14px;
  width:44px;
  height:44px;
  border-radius:14px;
  border:1px solid var(--line);
  background:#101b2f;
  color:#fff;
  align-items:center;
  justify-content:center;
  gap:4px;
  flex-direction:column;
  box-shadow:0 18px 40px rgba(0,0,0,.28)
}

.mobile-menu-toggle span {
  display:block;
  width:20px;
  height:2px;
  background:#fff;
  border-radius:5px;
  transition:.2s ease
}

.mobile-menu-toggle.is-open span:nth-child(1) {
  transform:translateY(6px) rotate(45deg)
}

.mobile-menu-toggle.is-open span:nth-child(2) {
  opacity:0
}

.mobile-menu-toggle.is-open span:nth-child(3) {
  transform:translateY(-6px) rotate(-45deg)
}

.sidebar-backdrop {
  display:none
}

.filter-card {
  margin-bottom:18px
}

.filter-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  align-items:end
}

.form-actions {
  display:flex;
  gap:8px;
  align-items:end;
  flex-wrap:wrap
}

.pagination-bar {
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  margin:14px 0;
  color:var(--muted);
  font-size:13px
}

.pagination-actions {
  display:flex;
  gap:6px;
  flex-wrap:wrap
}

.table-tools {
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
  margin:0 0 10px;
  flex-wrap:wrap
}

.table-tools input {
  max-width:320px;
  padding:8px 10px;
  border-radius:10px
}

.table-tools select {
  max-width:110px;
  padding:8px 10px;
  border-radius:10px
}

.meta-list {
  display:grid;
  gap:5px
}

.meta-row {
  display:grid;
  grid-template-columns:110px 1fr;
  gap:8px;
  align-items:start;
  padding:5px 0;
  border-bottom:1px dashed rgba(255,255,255,.08)
}

.meta-row span {
  color:var(--muted);
  font-size:12px
}

.meta-row strong {
  font-size:13px;
  margin:0;
  word-break:break-word
}

.schedule-readable {
  display:grid;
  gap:8px
}

.schedule-day {
  display:grid;
  grid-template-columns:120px 1fr;
  gap:8px;
  border-bottom:1px solid rgba(255,255,255,.07);
  padding:7px 0
}

.schedule-day strong {
  font-size:13px;
  margin:0
}

.schedule-day span {
  display:block;
  color:#dce8ff
}

.permission-grid {
  display:flex;
  gap:6px;
  flex-wrap:wrap
}

.permission-chip {
  border:1px solid var(--line);
  background:rgba(255,255,255,.045);
  border-radius:999px;
  padding:5px 8px;
  color:#cfe0ff;
  font-size:12px;
  font-weight:800
}

.radio-card,.check-line {
  transition:.15s ease
}

.radio-card:hover,.check-line:hover {
  border-color:rgba(255,193,7,.35);
  background:rgba(255,193,7,.06)
}

input[type=checkbox],input[type=radio] {
  accent-color:var(--gold);
  width:auto;
  transform:scale(1.08)
}

.switch-line {
  display:flex;
  align-items:center;
  gap:10px
}

.switch-line input {
  appearance:none;
  width:42px;
  height:24px;
  border-radius:999px;
  background:#344258;
  border:1px solid var(--line);
  position:relative;
  transition:.2s
}

.switch-line input:checked {
  background:var(--gold)
}

.switch-line input::after {
  content:'';
  position:absolute;
  top:3px;
  left:3px;
  width:16px;
  height:16px;
  border-radius:50%;
  background:#fff;
  transition:.2s
}

.switch-line input:checked::after {
  left:21px;
  background:#1a1200
}

.empty-state {
  border:1px dashed rgba(255,255,255,.16);
  border-radius:18px;
  padding:18px;
  color:var(--muted);
  background:rgba(255,255,255,.025)
}

.readonly-banner {
  background:rgba(92,157,255,.12);
  border-color:rgba(92,157,255,.32);
  color:#cfe2ff
}

.mobile-only {
  display:none
}

@media(max-width:900px) {
  .app-body {
    display:block
  }

.mobile-menu-toggle {
    display:flex
  }

.sidebar {
    position:fixed;
    z-index:55;
    left:0;
    top:0;
    bottom:0;
    width:min(86vw,320px);
    height:100vh;
    transform:translateX(-105%);
    transition:transform .22s ease;
    box-shadow:25px 0 70px rgba(0,0,0,.45)
  }

.sidebar.is-open {
    transform:translateX(0)
  }

.sidebar-backdrop {
    display:block;
    position:fixed;
    inset:0;
    z-index:50;
    background:rgba(0,0,0,.48);
    opacity:0;
    pointer-events:none;
    transition:.2s
  }

.sidebar-backdrop.is-open {
    opacity:1;
    pointer-events:auto
  }

.main {
    padding:72px 14px 18px
  }

.topbar {
    display:grid;
    gap:6px
  }

.topbar h1 {
    font-size:25px
  }

.grid.two,.cards4 {
    grid-template-columns:1fr
  }

.card {
    padding:17px;
    border-radius:20px
  }

.pagination-bar {
    display:grid
  }

.table-responsive {
    overflow:auto
  }

table {
    min-width:720px
  }

.mobile-only {
    display:block
  }

.schedule-day {
    grid-template-columns:1fr
  }

.filter-grid {
    grid-template-columns:1fr
  }

.form-actions {
    display:grid
  }

.form-actions .btn {
    width:100%
  }
}

/* v1.9.4-pre1a: header sticky + metadata técnica colapsada */
.topbar {
  position:sticky;
  top:0;
  z-index:35;
  padding:14px 0;
  margin:-14px 0 22px;
  background:linear-gradient(180deg,rgba(8,16,29,.98) 0%,rgba(8,16,29,.94) 72%,rgba(8,16,29,0) 100%);
  backdrop-filter:blur(10px);
}

.metadata-details {
  display:inline-block;
  width:100%;
  max-width:100%
}

.metadata-details>summary, .json-details>summary {
  cursor:pointer;
  color:var(--gold);
  font-weight:900;
  list-style:none
}

.metadata-details>summary::-webkit-details-marker, .json-details>summary::-webkit-details-marker {
  display:none
}

.metadata-details>summary::before, .json-details>summary::before {
  content:'▸ ';
  font-size:.9em
}

.metadata-details[open]>summary::before, .json-details[open]>summary::before {
  content:'▾ '
}

.metadata-details .json-details {
  margin-top:10px
}

.meta-list {
  margin-top:10px;
  min-width:260px;
  max-width:min(680px,100%)
}

.meta-row {
  grid-template-columns:minmax(90px,150px) minmax(0,1fr)
}

.meta-row strong {
  font-family:inherit;
  line-height:1.35
}

.meta-value {
  word-break:break-word
}

.meta-sublist {
  display:grid;
  gap:6px;
  width:100%
}

.meta-subrow {
  display:grid;
  grid-template-columns:minmax(80px,140px) minmax(0,1fr);
  gap:8px;
  padding:4px 0;
  border-bottom:1px dashed rgba(255,255,255,.07)
}

.meta-subrow:last-child {
  border-bottom:0
}

.meta-subrow span {
  color:var(--muted);
  font-size:12px
}

.meta-subrow strong {
  font-size:13px;
  margin:0;
  word-break:break-word
}

@media(max-width:900px) {
  .topbar {
    top:0;
    margin:-4px 0 18px;
    padding:10px 0 12px
  }
}

/* v1.9.4-pre1b: URLs técnicas legibles */
.url-details {
  margin-top:6px
}

.url-card {
  margin-top:10px;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(2,8,18,.72);
  padding:12px;
  display:grid;
  gap:10px;
  max-width:min(760px,100%)
}

.url-head {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px
}

.url-host {
  display:block;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:3px
}

.url-path {
  display:block;
  color:#eef4ff;
  font-size:14px;
  line-height:1.35;
  word-break:break-word
}

.url-actions {
  display:flex;
  gap:7px;
  align-items:center;
  flex-wrap:wrap;
  justify-content:flex-end
}

.url-preview {
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:12px;
  line-height:1.45;
  color:#cfe0ff;
  background:rgba(255,255,255,.045);
  border:1px dashed rgba(255,255,255,.12);
  border-radius:12px;
  padding:9px 10px;
  max-width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis
}

.url-preview:hover {
  white-space:normal;
  overflow-wrap:anywhere
}

@media(max-width:900px) {
  .url-head {
    display:grid
  }

.url-actions {
    justify-content:flex-start
  }

.url-preview {
    white-space:normal;
    overflow-wrap:anywhere
  }
}

/* v1.9.4-pre2: dashboard profesional con eCharts */
.eyebrow-soft {
  display:inline-flex;
  color:var(--gold);
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin-bottom:8px
}

.split-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px
}

.dashboard-hero-card {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border-color:rgba(255,193,7,.26);
  background:linear-gradient(135deg,rgba(255,193,7,.11),rgba(255,255,255,.04))
}

.dashboard-filter-card {
  position:relative;
  overflow:hidden
}

.dashboard-filter-card:before {
  content:"";
  position:absolute;
  inset:-40% auto auto -10%;
  width:380px;
  height:380px;
  background:radial-gradient(circle,rgba(255,193,7,.13),transparent 62%);
  pointer-events:none
}

.dashboard-filter-card>* {
  position:relative;
  z-index:1
}

.dashboard-filter-grid {
  grid-template-columns:repeat(5,minmax(0,1fr));
  align-items:end
}

.dashboard-filter-actions {
  display:flex;
  gap:10px;
  align-items:end
}

.dashboard-kpi-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  margin-bottom:18px
}

.kpi-card {
  position:relative;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:22px;
  padding:18px 18px 16px;
  background:linear-gradient(180deg,rgba(255,255,255,.078),rgba(255,255,255,.032));
  box-shadow:0 16px 44px rgba(0,0,0,.18)
}

.kpi-card:after {
  content:"";
  position:absolute;
  right:-45px;
  top:-55px;
  width:120px;
  height:120px;
  border-radius:999px;
  background:rgba(255,255,255,.055)
}

.kpi-card.primary {
  border-color:rgba(255,193,7,.34);
  background:linear-gradient(135deg,rgba(255,193,7,.18),rgba(255,255,255,.045))
}

.kpi-card.ok {
  border-color:rgba(34,197,94,.26)
}

.kpi-card.warn {
  border-color:rgba(255,193,7,.25)
}

.kpi-card.danger {
  border-color:rgba(255,107,107,.3)
}

.kpi-card span,.insight-card span {
  display:block;
  color:var(--muted);
  font-size:13px;
  font-weight:700;
  letter-spacing:.02em
}

.kpi-card strong {
  display:block;
  color:#fff;
  font-size:34px;
  line-height:1.05;
  margin-top:8px;
  letter-spacing:-.04em
}

.kpi-card small,.insight-card small {
  display:block;
  color:var(--muted);
  font-size:12px;
  margin-top:7px;
  line-height:1.35
}

.dashboard-insights-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-bottom:18px
}

.insight-card {
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  padding:14px 16px;
  background:rgba(255,255,255,.035)
}

.insight-card strong {
  display:block;
  font-size:18px;
  margin-top:6px;
  line-height:1.2;
  color:#fff;
  word-break:break-word
}

.chart-card {
  min-height:420px;
  overflow:hidden
}

.chart-card-wide {
  min-height:430px
}

.chart-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:10px
}

.chart-head h2 {
  margin-bottom:4px
}

.chart-badge {
  display:inline-flex;
  align-items:center;
  padding:7px 10px;
  border:1px solid rgba(255,193,7,.22);
  border-radius:999px;
  background:rgba(255,193,7,.09);
  color:#ffe29a;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
  white-space:nowrap
}

.echart-box {
  height:320px;
  width:100%;
  min-width:0
}

.echart-box.large {
  height:340px
}

.echart-box.heatmap {
  height:390px
}

.chart-empty {
  height:100%;
  min-height:240px;
  display:grid;
  place-items:center;
  text-align:center;
  color:var(--muted);
  border:1px dashed rgba(255,255,255,.14);
  border-radius:18px;
  background:rgba(0,0,0,.12);
  padding:24px
}

.heatmap-card {
  min-height:500px
}

.dashboard-charts-main {
  grid-template-columns:1.35fr .65fr
}

@media(max-width:1180px) {
  .dashboard-filter-grid {
    grid-template-columns:repeat(3,minmax(0,1fr))
  }

.dashboard-kpi-grid,.dashboard-insights-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

.dashboard-charts-main {
    grid-template-columns:1fr
  }
}

@media(max-width:760px) {
  .split-head,.dashboard-hero-card,.chart-head {
    display:grid
  }

.dashboard-filter-grid {
    grid-template-columns:1fr
  }

.dashboard-filter-actions {
    display:grid
  }

.dashboard-kpi-grid,.dashboard-insights-grid {
    grid-template-columns:1fr
  }

.chart-card {
    min-height:360px
  }

.echart-box,.echart-box.large {
    height:300px
  }

.echart-box.heatmap {
    height:460px
  }

.kpi-card strong {
    font-size:30px
  }
}

/* v1.9.4-pre2b: panel general ejecutivo */
.btn.warn {
  background:rgba(255,193,7,.16);
  color:#ffe29a;
  border:1px solid rgba(255,193,7,.35)
}

.dashboard-home-hero {
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:22px;
  align-items:center;
  margin-bottom:18px;
  border-color:rgba(255,193,7,.26);
  background:radial-gradient(circle at 12% 12%,rgba(255,193,7,.12),transparent 34%),linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035))
}

.dashboard-home-hero h2 {
  font-size:clamp(28px,4vw,46px);
  margin:0 0 8px;
  letter-spacing:-.04em;
  line-height:1
}

.hero-status-row {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px
}

.hero-action-panel {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px
}

.hero-action-panel .btn {
  width:100%;
  text-align:center
}

.dashboard-home-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  margin-bottom:18px
}

.dashboard-action-layout {
  align-items:start
}

.next-action-card,.product-command-card {
  min-height:100%
}

.action-list,.alert-list,.timeline-list,.checklist-command {
  display:grid;
  gap:10px
}

.action-item,.alert-item {
  display:grid;
  grid-template-columns:1fr auto;
  gap:12px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:18px;
  padding:14px;
  background:rgba(255,255,255,.035)
}

.action-item strong,.alert-item strong {
  display:block;
  font-size:15px;
  margin:0 0 4px
}

.action-item p,.alert-item small {
  display:block;
  margin:0;
  color:var(--muted);
  line-height:1.35
}

.action-item.ok,.alert-item.ok {
  border-color:rgba(34,197,94,.25);
  background:rgba(34,197,94,.06)
}

.action-item.warn,.alert-item.warn {
  border-color:rgba(255,193,7,.28);
  background:rgba(255,193,7,.07)
}

.action-item.danger,.alert-item.danger {
  border-color:rgba(255,107,107,.32);
  background:rgba(255,107,107,.07)
}

.product-command-kpis {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-bottom:14px
}

.product-command-kpis>div,.leader-strip>div {
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px;
  background:rgba(255,255,255,.035)
}

.product-command-kpis span,.leader-strip span {
  display:block;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  margin-bottom:5px
}

.product-command-kpis strong {
  font-size:23px;
  margin:0;
  line-height:1.05
}

.quick-mini-actions {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:14px
}

.leader-strip {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:14px
}

.leader-strip strong {
  font-size:16px;
  margin:0;
  line-height:1.2;
  word-break:break-word
}

.leader-strip small {
  display:block;
  color:var(--muted);
  margin-top:4px
}

.limit-bars {
  display:grid;
  gap:16px
}

.limit-bar-row {
  display:grid;
  gap:7px
}

.limit-bar-row>div:first-child {
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center
}

.limit-bar-row strong {
  font-size:14px;
  margin:0
}

.limit-bar-row span {
  font-size:13px;
  color:var(--muted)
}

.progress {
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08)
}

.progress i {
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,var(--gold),#ffdf6d);
  min-width:2px
}

.timeline-item {
  position:relative;
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px 12px 12px 16px;
  background:rgba(255,255,255,.032)
}

.timeline-item:before {
  content:"";
  position:absolute;
  left:-1px;
  top:14px;
  bottom:14px;
  width:3px;
  border-radius:999px;
  background:var(--gold)
}

.timeline-item span {
  display:block;
  color:var(--gold);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:900
}

.timeline-item strong {
  font-size:15px;
  margin:3px 0 2px
}

.timeline-item p {
  margin:0 0 6px;
  color:#dce8ff;
  line-height:1.35
}

.timeline-item div {
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center
}

.timeline-item small {
  color:var(--muted)
}

.timeline-item a {
  color:var(--gold);
  font-weight:800;
  text-decoration:none;
  font-size:12px
}

.checklist-command>div {
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:10px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:14px;
  padding:11px 12px;
  background:rgba(255,255,255,.032)
}

.checklist-command>div>span {
  width:18px;
  height:18px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.04)
}

.checklist-command>div.done>span {
  border-color:rgba(34,197,94,.6);
  background:rgba(34,197,94,.22);
  position:relative
}

.checklist-command>div.done>span:after {
  content:"";
  position:absolute;
  left:4px;
  top:1px;
  width:6px;
  height:10px;
  border:solid #9df0ba;
  border-width:0 2px 2px 0;
  transform:rotate(45deg)
}

.checklist-command strong {
  font-size:14px;
  margin:0
}

.checklist-command small {
  color:var(--muted);
  font-size:12px
}

.admin-command-card {
  margin-top:18px;
  border-color:rgba(92,157,255,.22)
}

.admin-actions {
  border-top:1px solid var(--line);
  padding-top:14px;
  margin-top:6px
}

@media(max-width:1180px) {
  .dashboard-home-hero {
    grid-template-columns:1fr
  }

.dashboard-home-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

.product-command-kpis {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}

@media(max-width:760px) {
  .dashboard-home-grid {
    grid-template-columns:1fr
  }

.hero-action-panel,.leader-strip {
    grid-template-columns:1fr
  }

.action-item,.alert-item {
    grid-template-columns:1fr
  }

.timeline-item div {
    display:grid
  }

.limit-bar-row>div:first-child {
    display:grid
  }

.product-command-kpis {
    grid-template-columns:1fr
  }
}

/* v1.9.4-pre2c: navegación mobile desde la derecha para uso con una mano */
@media (max-width:900px) {
  .mobile-menu-toggle {
    left:auto!important;
    right:14px!important;
  }

.sidebar {
    left:auto!important;
    right:0!important;
    border-right:0!important;
    border-left:1px solid var(--line)!important;
    transform:translateX(105%)!important;
    box-shadow:-25px 0 70px rgba(0,0,0,.45)!important;
  }

.sidebar.is-open {
    transform:translateX(0)!important;
  }
}

.request-flow-card {
  border:1px solid rgba(255,193,7,.22);
  background:linear-gradient(135deg,rgba(255,193,7,.07),rgba(255,255,255,.03));
}

/* v1.9.4-pre2d — catálogo de límites/capacidades */
.brand {
  font-weight:900;
  font-size:22px;
  color:#fff;
  text-align:left;
}

.catalog-intro {
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);
  gap:20px;
  align-items:center;
}

.catalog-flow {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}

.catalog-flow div {
  background:rgba(255,255,255,.055);
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px;
  min-height:96px;
}

.catalog-flow strong {
  display:inline-grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:999px;
  background:var(--gold);
  color:#241800;
  font-size:14px;
  margin:0 0 10px;
}

.catalog-flow span {
  display:block;
  color:#fff;
  font-weight:800;
}

.catalog-flow small {
  display:block;
  color:var(--muted);
  margin-top:4px;
  line-height:1.35;
}

.catalog-summary .metric-card strong {
  font-size:38px;
}

.limit-value {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:46px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,193,7,.12);
  border:1px solid rgba(255,193,7,.25);
  color:#ffe29a;
  font-weight:900;
}

.feature-formula {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

.feature-formula span {
  padding:10px 12px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.045);
  border-radius:14px;
  color:#fff;
  font-weight:800;
}

.feature-formula strong {
  color:var(--gold);
  font-size:24px;
  display:inline-block;
  margin:0;
}

.soft-card {
  background:linear-gradient(180deg,rgba(255,193,7,.07),rgba(255,255,255,.035));
}

@media(max-width:900px) {
  .catalog-intro {
    grid-template-columns:1fr
  }

.catalog-flow {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

.brand {
    text-align:left
  }
}

@media(max-width:540px) {
  .catalog-flow {
    grid-template-columns:1fr
  }

.feature-formula {
    display:grid
  }

.feature-formula strong {
    text-align:center
  }
}

.grid.three {
  grid-template-columns:repeat(3,minmax(0,1fr));
}

@media(max-width:900px) {
  .grid.three {
    grid-template-columns:1fr
  }
}

/* v1.9.4-pre2e — hardening UX transversal */
html,body {
  max-width:100%;
  overflow-x:hidden;
}

.main,.topbar,.grid,.card,.table-responsive {
  min-width:0;
}

.table-responsive {
  width:100%;
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:16px;
}

.table-responsive table {
  min-width:760px;
}

.card>.table-responsive {
  margin-top:4px;
}

.flash-success {
  font-weight:800;
}

.flash-success::before {
  content:'✓ ';
}

.flash-error::before {
  content:'⚠ ';
}

.flash-warn::before {
  content:'• ';
}

.insight-card.warn {
  border-color:rgba(255,193,7,.25);
  background:rgba(255,193,7,.06);
}

.health-actions-list {
  display:grid;
  gap:10px;
  margin-top:10px;
}

.health-action {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px;
  background:rgba(255,255,255,.035);
}

.health-action p {
  margin:4px 0 0;
  color:var(--muted);
  line-height:1.35;
}

.health-action.warn {
  border-color:rgba(255,193,7,.28);
  background:rgba(255,193,7,.07);
}

.health-action.danger {
  border-color:rgba(255,107,107,.32);
  background:rgba(255,107,107,.07);
}

.echart-box canvas {
  max-width:100%;
}

.brand {
  font-weight:900;
  font-size:22px;
  color:#fff;
  text-align:left;
}

@media(max-width:900px) {
  .table-responsive table {
    min-width:720px;
  }

.health-action {
    grid-template-columns:1fr;
  }

.health-action .mini-btn {
    width:100%;
    justify-content:center;
  }

.brand {
    text-align:left;
  }
}

/* v1.9.4-pre2f — consolidación nav/mobile + pantallas accionables */
@media (min-width: 901px)  {
  .app-body  {
    display: block;
  }

.sidebar  {
    position: fixed !important;
    top: 0;
    left: 0;
    right: auto;
    bottom: 0;
    width: 280px;
    height: 100vh;
    overflow-y: auto;
    z-index: 45;
    text-align: left;
  }

.main  {
    margin-left: 280px;
    margin-right: 0;
    overflow: visible;
  }

.topbar  {
    position: sticky;
    top: 0;
    z-index: 40;
  }

.brand {
    font-weight:900;
    font-size:22px;
    color:#fff;
    text-align:left;
  }
}

@media (max-width: 900px)  {
  .mobile-menu-toggle  {
    position: fixed !important;
    top: 14px !important;
    right: 14px !important;
    left: auto !important;
    z-index: 120 !important;
  }

.sidebar  {
    position: fixed !important;
    top: 0;
    right: 0 !important;
    left: auto !important;
    bottom: 0;
    width: min(86vw, 340px);
    height: 100vh;
    transform: translateX(105%) !important;
    text-align: right;
    z-index: 100 !important;
    padding-top: 76px;
    border-right: 0 !important;
    border-left: 1px solid var(--line) !important;
    box-shadow: -25px 0 70px rgba(0,0,0,.45) !important;
  }

.sidebar.is-open  {
    transform: translateX(0) !important;
  }

.sidebar-backdrop  {
    z-index: 90 !important;
  }

.main  {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

.brand {
    font-weight:900;
    font-size:22px;
    color:#fff;
    text-align:left;
  }

.sidebar .nav-link,.sidebar a,.sidebar button {
    justify-content:flex-end;
    text-align:right;
  }

.sidebar .nav-section-title,.sidebar .sidebar-user,.sidebar .tenant {
    text-align:right;
  }

.topbar {
    position:sticky;
    top:0;
    z-index:70;
  }
}

.empty-state {
  border:1px dashed rgba(255,255,255,.18);
  border-radius:20px;
  padding:22px;
  background:rgba(255,255,255,.035);
  display:grid;
  gap:8px;
  color:var(--muted)
}

.empty-state.small {
  padding:16px;
  border-radius:16px
}

.empty-state strong {
  color:#fff;
  font-size:16px
}

.empty-state p {
  margin:0;
  line-height:1.45
}

.compact-filter-bar {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  margin:12px 0 18px
}

.compact-filter-bar input,.compact-filter-bar select {
  max-width:260px
}

.check-line.compact {
  padding:9px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,255,255,.035)
}

.compact-actions {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px
}

.campaign-hero {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,430px);
  gap:18px;
  align-items:center
}

.campaign-list {
  display:grid;
  gap:12px
}

.campaign-card {
  border:1px solid var(--line);
  border-radius:20px;
  padding:16px;
  background:rgba(255,255,255,.035);
  display:grid;
  grid-template-columns:minmax(220px,.9fr) minmax(220px,.8fr) minmax(300px,1fr);
  gap:14px;
  align-items:start
}

.campaign-card strong {
  font-size:22px;
  line-height:1.05
}

.campaign-card small {
  display:block;
  color:var(--muted);
  margin-top:5px
}

.campaign-stats {
  display:grid;
  gap:6px
}

.campaign-actions {
  align-content:start
}

.warn-text {
  color:#ffe29a!important
}

.mini-meta-row {
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  margin-top:8px
}

.mini-meta-row>span:not(.pill) {
  font-size:12px;
  color:var(--muted);
  border:1px solid var(--line);
  border-radius:999px;
  padding:5px 8px;
  background:rgba(255,255,255,.035)
}

.availability-grid .card {
  align-content:start
}

.agent-availability-card {
  border:1px solid var(--line);
  border-radius:18px;
  padding:14px;
  margin:10px 0;
  background:rgba(255,255,255,.035);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:start
}

.agent-availability-card strong {
  display:block;
  font-size:16px
}

.agent-availability-card small {
  display:block;
  color:var(--muted);
  line-height:1.35;
  margin-top:4px
}

.agent-availability-card.disponible {
  border-color:rgba(34,197,94,.28);
  background:rgba(34,197,94,.055)
}

.agent-availability-card.pausado {
  border-color:rgba(255,193,7,.28);
  background:rgba(255,193,7,.055)
}

.agent-actions {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  justify-content:flex-end
}

.agent-actions form {
  display:inline-flex
}

.impersonation-banner {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  margin:0 0 16px;
  padding:13px 16px;
  border:1px solid rgba(255,193,7,.35);
  background:rgba(255,193,7,.10);
  border-radius:18px;
  color:#ffe9a8
}

.impersonation-banner form {
  margin:0
}

.request-flow-card,.admin-account-card {
  border-color:rgba(255,193,7,.22)
}

@media(max-width:1180px) {
  .campaign-card {
    grid-template-columns:1fr
  }

.campaign-hero {
    grid-template-columns:1fr
  }

.compact-actions {
    grid-template-columns:1fr
  }

.agent-availability-card {
    grid-template-columns:1fr
  }

.agent-actions {
    justify-content:flex-start
  }
}

@media(max-width:760px) {
  .compact-filter-bar {
    display:grid
  }

.compact-filter-bar input,.compact-filter-bar select {
    max-width:none;
    width:100%
  }

.campaign-card strong {
    font-size:19px
  }

.impersonation-banner {
    display:grid
  }

.agent-actions .mini-btn,.agent-actions form,.agent-actions button {
    width:100%;
    justify-content:center
  }

.table-responsive table {
    min-width:720px
  }
}

/* v1.9.4-pre2g — tarjetas, heatmap separado y navegación consolidada */
.metric-card {
  position:relative;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:22px;
  padding:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.078),rgba(255,255,255,.032));
  box-shadow:0 16px 44px rgba(0,0,0,.18);
  min-height:110px;
  display:grid;
  align-content:center;
  gap:8px
}

.metric-card:after {
  content:"";
  position:absolute;
  right:-45px;
  top:-55px;
  width:120px;
  height:120px;
  border-radius:999px;
  background:rgba(255,255,255,.055)
}

.metric-card span {
  display:block;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
  letter-spacing:.02em
}

.metric-card strong {
  display:block;
  color:#fff;
  font-size:34px;
  line-height:1.05;
  letter-spacing:-.04em
}

.metric-card small {
  display:block;
  color:var(--muted);
  font-size:12px;
  line-height:1.35
}

.heatmap-explain-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin:8px 0 18px
}

.heatmap-explain-grid>div {
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px;
  background:rgba(255,255,255,.035)
}

.heatmap-explain-grid strong {
  display:block;
  color:#fff;
  font-size:14px;
  margin-bottom:4px
}

.heatmap-explain-grid small {
  display:block;
  color:var(--muted);
  line-height:1.35
}

.heatmap-split {
  align-items:start
}

.mini-chart-title {
  font-size:15px;
  margin:0 0 8px;
  color:#fff
}

.echart-box.heatmap.compact {
  height:330px
}

.pro-heatmap-card {
  min-height:auto
}

.breach-list {
  border-top:1px solid var(--line);
  padding-top:14px;
  margin-top:10px
}

.breach-pills {
  display:flex;
  gap:8px;
  flex-wrap:wrap
}

.breach-pills>span {
  border:1px solid rgba(255,193,7,.28);
  border-radius:999px;
  padding:8px 11px;
  background:rgba(255,193,7,.07);
  display:inline-flex;
  gap:8px;
  align-items:center
}

.breach-pills strong {
  font-size:13px
}

.breach-pills small {
  color:var(--muted);
  font-size:12px
}

@media(max-width:900px) {
  .heatmap-explain-grid {
    grid-template-columns:1fr
  }

.echart-box.heatmap.compact {
    height:390px
  }
}

/* v1.9.4-pre2h — responsive hardening final: no overflow lateral + cards accionables contenidas */
html, body, .app-body, .main  {
  max-width: 100%;
  overflow-x: hidden;
}

.main > *, .card, .grid, .grid > *, form, .field, .subcard, .metric-card, .campaign-card, .agent-availability-card, .table-responsive, .actions-cell, .campaign-actions, .agent-actions, .compact-filter-bar, .filters, .hero-action-panel  {
  min-width: 0;
  max-width: 100%;
}

.card, .subcard, .line-item, .metric-card, .campaign-card, .agent-availability-card  {
  overflow-wrap: anywhere;
  word-break: normal;
}

.btn, .mini-btn, .actions-cell button, .actions-cell a, .campaign-actions button, .campaign-actions a, .agent-actions button, .agent-actions a  {
  white-space: normal;
  max-width: 100%;
}

.actions-cell, .campaign-actions, .agent-actions, .quick-mini-actions  {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
}

.actions-cell form, .campaign-actions form, .agent-actions form  {
  display: inline-flex;
  min-width: 0;
  max-width: 100%;
}

/* Las cards de campañas viven dentro de una columna: no pueden reservar 3 columnas rígidas. */
.campaign-card  {
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: start;
}

.campaign-card strong, .card h2, .table-title, td, th  {
  overflow-wrap: anywhere;
}

.campaign-actions  {
  justify-content: flex-start;
  align-content: start;
}

.campaign-actions .mini-btn, .campaign-actions button  {
  min-width: 0;
}

/* Cualquier tabla sin wrapper debe scrollear internamente en mobile, no estirar la página. */
@media (max-width: 900px)  {
  .main  {
    width: 100vw;
    max-width: 100vw;
    padding-left: 14px;
    padding-right: 14px;
    overflow-x: hidden !important;
  }

.topbar,   .card,   .grid,   .grid > *,   .dashboard-home-grid,   .dashboard-action-layout,   .campaign-hero,   .catalog-intro,   .fallback-shell  {
    width: 100%;
    max-width: 100%;
  }

.card:has(table),   .table-responsive  {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

.card table,   .table-responsive table  {
    min-width: 720px;
    width: max-content;
    max-width: none;
  }

.card table th,   .card table td  {
    white-space: nowrap;
  }

.card table td small,   .card table .muted-text,   .card table .note  {
    white-space: normal;
  }

.actions-cell,   .campaign-actions,   .agent-actions,   .quick-mini-actions,   .hero-action-panel,   .compact-filter-bar,   .filters  {
    display: grid !important;
    grid-template-columns: 1fr;
    width: 100%;
  }

.actions-cell form,   .campaign-actions form,   .agent-actions form,   .actions-cell .mini-btn,   .campaign-actions .mini-btn,   .agent-actions .mini-btn,   .actions-cell button,   .campaign-actions button,   .agent-actions button,   .btn  {
    width: 100%;
    justify-content: center;
  }

input,   select,   textarea  {
    min-width: 0;
    max-width: 100%;
  }
}

/* Mantener intacto lo acordado para navegación. */
@media (min-width: 901px)  {
  .app-body  {
    display: block;
  }

.sidebar  {
    position: fixed !important;
    top: 0;
    left: 0;
    right: auto;
    bottom: 0;
    width: 280px;
    height: 100vh;
    overflow-y: auto;
    z-index: 45;
    text-align: left;
  }

.main  {
    margin-left: 280px;
    margin-right: 0;
    max-width: calc(100vw - 280px);
    overflow-x: hidden;
  }

.topbar  {
    position: sticky;
    top: 0;
    z-index: 40;
  }

.brand  {
    font-weight: 900;
    font-size: 22px;
    color: #fff;
    text-align: left;
  }
}

@media (max-width: 900px)  {
  .mobile-menu-toggle  {
    position: fixed !important;
    top: 14px !important;
    right: 14px !important;
    left: auto !important;
    z-index: 120 !important;
  }

.sidebar  {
    position: fixed !important;
    top: 0;
    right: 0 !important;
    left: auto !important;
    bottom: 0;
    width: min(86vw, 340px);
    height: 100vh;
    transform: translateX(105%) !important;
    text-align: right;
    z-index: 100 !important;
    padding-top: 76px;
    border-right: 0 !important;
    border-left: 1px solid var(--line) !important;
    box-shadow: -25px 0 70px rgba(0,0,0,.45) !important;
  }

.sidebar.is-open,   body.nav-open .sidebar,   .app-shell.nav-open .sidebar  {
    transform: translateX(0) !important;
  }

.sidebar-backdrop  {
    z-index: 90 !important;
  }

.brand  {
    font-weight: 900;
    font-size: 22px;
    color: #fff;
    text-align: left;
  }

.sidebar .nav-link,   .sidebar a,   .sidebar button  {
    justify-content: flex-end;
    text-align: right;
  }

.sidebar .nav-section-title,   .sidebar .sidebar-user,   .sidebar .tenant  {
    text-align: right;
  }

.topbar  {
    position: sticky;
    top: 0;
    z-index: 70;
  }
}

/* v1.9.4-pre2i — ajustes finales: heatmap superpuesto + acciones en tablas alineadas */
.card strong  {
  font-size: 1rem;
}

.echart-box.heatmap.superposed  {
  height: 460px;
  min-height: 420px;
}

.pro-heatmap-card .heatmap-explain-grid  {
  margin-bottom: 14px;
}

/* El bug de alineación venía de aplicar display:flex directamente al <td>.
   Un <td> debe seguir siendo table-cell; el wrap se controla en sus hijos. */
td.actions-cell  {
  display: table-cell !important;
  vertical-align: middle !important;
  white-space: normal !important;
  min-width: 280px;
}

td.actions-cell > a, td.actions-cell > button, td.actions-cell > form, td.actions-cell > .mini-btn  {
  display: inline-flex !important;
  vertical-align: middle;
  margin: 3px 4px 3px 0;
}

td.actions-cell form  {
  width: auto !important;
}

td.actions-cell .mini-btn, td.actions-cell button, td.actions-cell a  {
  width: auto !important;
  white-space: nowrap !important;
  justify-content: center;
}

@media (max-width: 900px)  {
  .echart-box.heatmap.superposed  {
    height: 520px;
  }

td.actions-cell  {
    display: table-cell !important;
    min-width: 300px;
    white-space: normal !important;
  }

td.actions-cell > a,   td.actions-cell > button,   td.actions-cell > form,   td.actions-cell > .mini-btn  {
    width: auto !important;
    max-width: 100%;
  }
}

/* v1.9.4-pre2j — panel de agente profesional */
.card strong  {
  font-size: 1rem;
}

.agent-hero {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,.42fr);
  gap:18px;
  align-items:center;
  border-color:rgba(255,193,7,.18);
}

.agent-hero.card {
  margin-bottom: 18px;
}

.agent-hero h2 {
  font-size:clamp(28px,4vw,44px);
  margin:6px 0 8px;
  letter-spacing:-.04em;
  line-height:1;
}

.agent-hero-status {
  border:1px solid var(--line);
  border-radius:20px;
  padding:16px;
  background:rgba(255,255,255,.045);
  display:grid;
  gap:8px;
}

.agent-hero-status strong {
  font-size:22px!important;
  line-height:1.15;
  margin:0;
}

.agent-hero-status small {
  color:var(--muted);
  line-height:1.35;
}

.agent-command-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  margin-bottom:18px;
}

.agent-kpi {
  padding:18px;
  border:1px solid var(--line);
  border-radius:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
}

.agent-kpi span {
  display:block;
  color:var(--muted);
  font-size:13px;
  margin-bottom:8px;
}

.agent-kpi strong {
  font-size:34px!important;
  line-height:1;
  margin:0;
}

.agent-top-grid {
  align-items:start;
}

.agent-status-card {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,390px);
  gap:20px;
  align-items:start;
}

.agent-status-main h2 {
  font-size:26px;
  margin:8px 0 10px;
}

.agent-status-badge-row {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
  margin-bottom:14px;
}

.agent-info-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:12px;
}

.agent-info-list>div {
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px;
  background:rgba(255,255,255,.035);
  min-width:0;
}

.agent-info-list span {
  display:block;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  margin-bottom:5px;
}

.agent-info-list strong {
  font-size:15px!important;
  margin:0;
  overflow-wrap:anywhere;
}

.agent-pause-live {
  border:1px solid rgba(255,193,7,.3);
  background:rgba(255,193,7,.08);
  border-radius:14px;
  padding:11px 12px;
  color:#ffe8a3;
}

.agent-pause-live strong {
  display:inline;
  font-size:1rem!important;
  margin:0;
}

.agent-action-panel {
  border:1px solid rgba(255,193,7,.24);
  border-radius:20px;
  padding:16px;
  background:linear-gradient(180deg,rgba(255,193,7,.08),rgba(255,255,255,.035));
  display:grid;
  gap:10px;
}

.agent-action-panel h3 {
  margin:0;
  font-size:18px;
}

.agent-action-form {
  display:grid;
  gap:10px;
  min-width:0;
}

.agent-action-form label {
  font-size:13px;
  font-weight:900;
  color:#dce8ff;
}

.quick-reasons {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.quick-reasons label {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  border:1px solid var(--line);
  border-radius:13px;
  background:rgba(255,255,255,.045);
  cursor:pointer;
  color:#eef4ff;
  font-size:12px;
  font-weight:900;
  text-align:center;
  padding:8px;
}

.quick-reasons input {
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.quick-reasons label:has(input:checked) {
  border-color:rgba(255,193,7,.72);
  background:rgba(255,193,7,.18);
  color:#ffe29a;
  box-shadow:0 0 0 1px rgba(255,193,7,.2) inset;
}

.agent-alerts-card .alert-item {
  grid-template-columns:1fr;
}

.agent-pause-list {
  display:grid;
  gap:10px;
}

.agent-pause-item {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px;
  background:rgba(255,255,255,.035);
}

.agent-pause-item strong {
  font-size:18px!important;
  margin:0;
}

.agent-pause-item small {
  display:block;
  color:var(--muted);
  font-size:12px;
  margin-top:3px;
}

.agent-pause-item>span {
  color:#dce8ff;
  font-weight:800;
  text-align:right;
  overflow-wrap:anywhere;
}

.agent-campaign-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:12px;
}

.agent-campaign-card {
  border:1px solid var(--line);
  border-radius:18px;
  padding:14px;
  background:rgba(255,255,255,.035);
  display:grid;
  gap:12px;
}

.agent-campaign-card strong {
  font-size:18px!important;
  margin:0;
  line-height:1.15;
}

.agent-campaign-card small {
  color:var(--muted);
}

.agent-campaign-meta {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}

.agent-campaign-stats {
  display:grid;
  gap:6px;
  border-top:1px solid var(--line);
  padding-top:10px;
}

.agent-campaign-stats span {
  color:var(--muted);
  font-size:13px;
}

.agent-campaign-stats strong {
  display:inline;
  font-size:13px!important;
  color:#eef4ff;
}

.agent-guide-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}

.agent-guide-grid>div {
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,.035);
  padding:14px;
  display:grid;
  gap:8px;
}

.agent-guide-grid strong {
  display:inline-grid!important;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:999px;
  background:var(--gold);
  color:#241800;
  font-size:14px!important;
  margin:0;
}

.agent-guide-grid span {
  color:#dce8ff;
  line-height:1.35;
}

.empty-state.compact {
  border:1px dashed rgba(255,255,255,.18);
  border-radius:18px;
  padding:18px;
  background:rgba(255,255,255,.025);
}

.empty-state.compact strong {
  font-size:18px!important;
  margin:0 0 6px;
}

.empty-state.compact p {
  margin:0;
  color:var(--muted);
}

.agent-nav .nav-group-links a[href*="#"] {
  font-size:13px;
}

@media(max-width:1180px) {
  .agent-command-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

.agent-status-card {
    grid-template-columns:1fr;
  }

.agent-info-list {
    grid-template-columns:1fr;
  }
}

@media(max-width:900px) {
  .agent-hero {
    grid-template-columns:1fr;
  }

.agent-command-grid {
    grid-template-columns:1fr;
  }

.agent-guide-grid {
    grid-template-columns:1fr;
  }

.quick-reasons {
    grid-template-columns:1fr;
  }

.agent-pause-item {
    grid-template-columns:1fr;
  }

.agent-pause-item>span {
    text-align:left;
  }
}

/* v1.9.4-pre2k — consolidado final de navegación, scroll y responsive crítico */
html  {
  scroll-behavior: smooth;
}

[id]  {
  scroll-margin-top: 92px;
}

*  {
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 193, 7, 0.55) rgba(18, 52, 86, 0.10);
}

::-webkit-scrollbar  {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track  {
  background: rgba(18, 52, 86, 0.08);
  border-radius: 999px;
}

::-webkit-scrollbar-thumb  {
  background: linear-gradient(180deg, rgba(18, 52, 86, 0.86), rgba(86, 2, 22, 0.82));
  border-radius: 999px;
  border: 2px solid rgba(11, 18, 32, 0.85);
}

::-webkit-scrollbar-thumb:hover  {
  background: linear-gradient(180deg, rgba(255, 193, 7, 0.82), rgba(86, 2, 22, 0.92));
}

.sidebar, .card, .table-scroll, .table-responsive  {
  scrollbar-gutter: stable;
}

.card strong  {
  font-size: 1rem;
}

@media (min-width: 901px)  {
  .app-body  {
    display: block;
  }

.sidebar  {
    position: fixed !important;
    top: 0;
    left: 0;
    right: auto;
    bottom: 0;
    width: 280px;
    height: 100vh;
    overflow-y: auto;
    z-index: 45;
    text-align: left;
  }

.main  {
    margin-left: 280px;
    margin-right: 0;
    max-width: calc(100vw - 280px);
    overflow-x: hidden;
  }

.topbar  {
    position: sticky;
    top: 0;
    z-index: 40;
  }

.brand  {
    font-weight: 900;
    font-size: 22px;
    color: #fff;
    text-align: left;
  }
}

@media (max-width: 900px)  {
  .main  {
    padding-top: 35px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100vw;
    overflow-x: hidden;
  }

.mobile-menu-toggle  {
    position: fixed !important;
    top: 14px !important;
    right: 14px !important;
    left: auto !important;
    z-index: 120 !important;
  }

.sidebar  {
    position: fixed !important;
    top: 0;
    right: 0 !important;
    left: auto !important;
    bottom: 0;
    width: min(86vw, 340px);
    height: 100vh;
    transform: translateX(105%) !important;
    text-align: right;
    z-index: 100 !important;
    padding-top: 35px !important;
    border-right: 0 !important;
    border-left: 1px solid var(--line) !important;
    box-shadow: -25px 0 70px rgba(0, 0, 0, .45) !important;
    overflow-y: auto;
  }

.sidebar.is-open,   body.nav-open .sidebar,   .app-shell.nav-open .sidebar  {
    transform: translateX(0) !important;
  }

.sidebar-backdrop  {
    z-index: 90 !important;
  }

.brand  {
    font-weight: 900;
    font-size: 22px;
    color: #fff;
    text-align: left;
  }

.sidebar .nav-link,   .sidebar a,   .sidebar button  {
    justify-content: flex-end;
    text-align: right;
  }

.sidebar .nav-section-title,   .sidebar .nav-group-title,   .sidebar .sidebar-user,   .sidebar .tenant  {
    text-align: right;
  }

.topbar  {
    position: sticky;
    top: 0;
    z-index: 70;
  }

.card:has(table),   .table-responsive,   .table-scroll  {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

.card table,   .table-responsive table,   .table-scroll table  {
    min-width: 760px;
    width: max-content;
    max-width: none;
  }
}

/* v1.9.4-pre2L — consolidación visual, grids seguros y tablas accionables */
html {
  scroll-behavior:smooth
}

[id] {
  scroll-margin-top:92px
}

* {
  scrollbar-width:thin;
  scrollbar-color:rgba(255,193,7,.58) rgba(255,255,255,.06)
}

::-webkit-scrollbar {
  width:10px;
  height:10px
}

::-webkit-scrollbar-track {
  background:rgba(255,255,255,.055);
  border-radius:999px
}

::-webkit-scrollbar-thumb {
  background:linear-gradient(180deg,rgba(255,193,7,.85),rgba(86,2,22,.7));
  border-radius:999px;
  border:2px solid rgba(6,15,28,.9)
}

::-webkit-scrollbar-thumb:hover {
  background:linear-gradient(180deg,rgba(255,193,7,1),rgba(86,2,22,.95))
}

.card strong {
  font-size:1rem
}

.kpi-card strong,.kpi-lite>strong,.dashboard-home-grid .card>strong {
  font-size:clamp(1.7rem,3vw,2.2rem);
  line-height:1.05
}

.table-title {
  font-size:1rem!important;
  line-height:1.2
}

.card .line-item strong {
  font-size:1rem!important
}

.card {
  min-width:0
}

.grid,.grid.two,.grid.three,.grid.cards4,.admin-grid-safe {
  min-width:0;
  align-items:start;
  gap:clamp(16px,2vw,24px)
}

.grid.two>* {
  min-width:0
}

.admin-grid-safe>.card,.dashboard-card-safe {
  margin-bottom:0
}

.main {
  min-width:0
}

.table-responsive {
  width:100%;
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch
}

.table-responsive table {
  min-width:760px
}

.table-responsive th,.table-responsive td {
  vertical-align:middle
}

td.actions-cell {
  display:table-cell!important;
  vertical-align:middle;
  min-width:220px
}

.actions-cell form,.actions-cell .action-row,.actions-cell .inline-pay-form {
  display:inline-flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin:2px 0
}

.actions-cell .mini-stack {
  display:grid;
  gap:6px;
  margin:4px 0
}

.actions-cell .mini-input,.actions-cell .mini-select,.mini-input,.mini-select {
  max-width:180px;
  min-width:120px
}

.inline-pay-form input,.inline-pay-form select {
  max-width:170px
}

.refund-details {
  margin-top:8px
}

.refund-details summary {
  cursor:pointer;
  color:var(--gold);
  font-weight:900
}

.refund-form {
  border:1px solid rgba(255,193,7,.22);
  background:rgba(255,193,7,.06);
  border-radius:14px;
  padding:10px;
  margin-top:8px
}

.refund-form label {
  display:grid;
  gap:4px;
  font-size:12px;
  color:var(--muted)
}

.action-grid-admin {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px
}

.action-tile {
  display:block;
  text-decoration:none;
  color:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px;
  background:rgba(255,255,255,.035);
  transition:.16s ease
}

.action-tile:hover {
  border-color:rgba(255,193,7,.45);
  transform:translateY(-1px)
}

.action-tile strong {
  display:block;
  font-size:1rem
}

.action-tile span {
  display:block;
  color:var(--muted);
  font-size:.86rem;
  line-height:1.35;
  margin-top:4px
}

.admin-command-hero {
  border-color:rgba(255,193,7,.25)
}

.kpi-lite span {
  display:block;
  color:var(--muted);
  font-weight:800
}

.kpi-lite small {
  display:block;
  color:var(--muted);
  margin-top:6px
}

.check-card {
  display:flex;
  gap:10px;
  align-items:center;
  border:1px solid rgba(255,255,255,.11);
  border-radius:14px;
  padding:10px 12px;
  background:rgba(255,255,255,.035)
}

.check-card.warn {
  border-color:rgba(255,193,7,.24);
  background:rgba(255,193,7,.06)
}

.mini-check {
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:12px;
  color:var(--muted);
  white-space:nowrap
}

.form-clean .field label {
  font-weight:900
}

.alert-item,.action-item {
  min-width:0
}

.sidebar,.card,.table-scroll,.table-responsive {
  scrollbar-gutter:stable
}

@media(min-width:901px) {
  .app-body {
    display:block
  }

.sidebar {
    position:fixed!important;
    top:0;
    left:0;
    right:auto;
    bottom:0;
    width:280px;
    height:100vh;
    overflow-y:auto;
    z-index:45;
    text-align:left
  }

.main {
    margin-left:280px;
    margin-right:0;
    overflow:visible
  }

.topbar {
    position:sticky;
    top:0;
    z-index:40
  }

.brand {
    font-weight:900;
    font-size:22px;
    color:#fff;
    text-align:left
  }
}

@media(max-width:900px) {
  html,body {
    max-width:100%;
    overflow-x:hidden
  }

.main {
    margin-left:0!important;
    margin-right:0!important;
    padding-top:35px!important;
    overflow:visible
  }

.sidebar {
    position:fixed!important;
    top:0!important;
    right:0!important;
    left:auto!important;
    bottom:0;
    width:min(86vw,340px);
    height:100vh;
    transform:translateX(105%)!important;
    text-align:right;
    z-index:100!important;
    padding-top:35px!important;
    overflow-y:auto;
    border-left:1px solid var(--line)!important;
    border-right:0!important;
    box-shadow:-25px 0 70px rgba(0,0,0,.45)!important
  }

.sidebar.is-open {
    transform:translateX(0)!important
  }

.sidebar-backdrop {
    z-index:90!important
  }

.sidebar-backdrop.is-open {
    display:block
  }

.mobile-menu-toggle {
    position:fixed!important;
    top:14px!important;
    right:14px!important;
    left:auto!important;
    z-index:120!important
  }

.brand {
    font-weight:900;
    font-size:22px;
    color:#fff;
    text-align:left
  }

.sidebar .nav-link,.sidebar a,.sidebar button {
    justify-content:flex-end;
    text-align:right
  }

.sidebar .nav-section-title,.sidebar .sidebar-user,.sidebar .tenant {
    text-align:right
  }

.topbar {
    position:sticky;
    top:0;
    z-index:70
  }

.table-responsive table {
    min-width:720px
  }

.grid.two,.grid.three,.grid.cards4,.dashboard-kpi-grid,.dashboard-insights-grid {
    grid-template-columns:1fr!important
  }

.action-grid-admin {
    grid-template-columns:1fr
  }

.actions-cell form,.actions-cell .action-row,.actions-cell .inline-pay-form {
    display:flex;
    justify-content:flex-start
  }

.actions-cell .mini-input,.actions-cell .mini-select,.mini-input,.mini-select {
    max-width:100%;
    min-width:0
  }

.card {
    overflow:hidden
  }

.table-responsive {
    overflow-x:auto
  }

.form-actions,.quick-mini-actions {
    display:flex;
    flex-wrap:wrap;
    gap:8px
  }
}

/* v1.9.4-final — ajustes consolidados de auditoría visual */
.card  {
  min-width: 0;
  max-width: 100%;
}

.card strong  {
  font-size: 1rem;
}

.brand  {
  font-weight: 900;
  font-size: 22px;
  color: #fff;
  text-align: left;
}

th  {
  overflow-wrap: normal;
  white-space: nowrap;
}

.pill  {
  font-size: .7rem;
  overflow-wrap: normal;
}

/* Tablas contenidas dentro de cards sin comprimir columnas globalmente */
.card:has(table), .table-responsive, .table-scroll  {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

.card table, .table-responsive table, .table-scroll table  {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
}

.card table th, .card table td, .table-responsive th, .table-responsive td, .table-scroll th, .table-scroll td  {
  max-width: none;
  vertical-align: middle;
}

.card table td, .table-responsive td, .table-scroll td  {
  overflow-wrap: anywhere;
}

td.actions-cell, td.table-actions, .card table td:last-child  {
  max-width: 280px;
  min-width: 180px;
  white-space: normal;
}

td.actions-cell, td.table-actions  {
  display: table-cell !important;
  vertical-align: middle;
}

td.actions-cell > *, td.table-actions > *, .card table td:last-child > form, .card table td:last-child > a, .card table td:last-child > button  {
  margin-bottom: 6px;
}

td.actions-cell .btn, td.actions-cell .mini-btn, td.actions-cell button, td.actions-cell a, td.table-actions .btn, td.table-actions .mini-btn, td.table-actions button, td.table-actions a, .card table td:last-child .btn, .card table td:last-child .mini-btn, .card table td:last-child button, .card table td:last-child a  {
  white-space: nowrap;
  margin-right: 6px;
}

@media (min-width: 901px)  {
  .app-body  {
    display: block;
  }

.sidebar  {
    position: fixed !important;
    top: 0;
    left: 0;
    right: auto;
    bottom: 0;
    width: 280px;
    height: 100vh;
    overflow-y: auto;
    z-index: 45;
    text-align: left;
  }

.main  {
    margin-left: 280px;
    margin-right: 0;
    overflow: visible;
  }

.topbar  {
    position: sticky;
    top: 0;
    z-index: 40;
  }
}

@media (max-width: 900px)  {
  html,   body  {
    max-width: 100%;
    overflow-x: hidden;
  }

.main  {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-top: 35px !important;
    overflow: visible;
  }

.sidebar  {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: auto !important;
    bottom: 0;
    width: min(86vw, 340px);
    height: 100vh;
    transform: translateX(105%) !important;
    text-align: right;
    z-index: 100 !important;
    padding-top: 35px !important;
    overflow-y: auto;
    border-left: 1px solid var(--line) !important;
    border-right: 0 !important;
    box-shadow: -25px 0 70px rgba(0,0,0,.45) !important;
  }

.sidebar.is-open,   body.nav-open .sidebar,   .app-shell.nav-open .sidebar  {
    transform: translateX(0) !important;
  }

.sidebar-backdrop  {
    z-index: 90 !important;
  }

.sidebar-backdrop.is-open  {
    display: block;
  }

.mobile-menu-toggle  {
    position: fixed !important;
    top: 14px !important;
    right: 14px !important;
    left: auto !important;
    z-index: 120 !important;
  }

.sidebar .nav-link,   .sidebar a,   .sidebar button  {
    justify-content: flex-end;
    text-align: right;
  }

.sidebar .nav-section-title,   .sidebar .nav-group-title,   .sidebar .sidebar-user,   .sidebar .tenant  {
    text-align: right;
  }

.topbar  {
    position: sticky;
    top: 0;
    z-index: 70;
  }

.grid.two,   .grid.three,   .grid.cards4,   .dashboard-kpi-grid,   .dashboard-insights-grid  {
    grid-template-columns: 1fr !important;
  }

.card:has(table),   .table-responsive,   .table-scroll  {
    overflow-x: auto;
  }

.card table,   .table-responsive table,   .table-scroll table  {
    min-width: 760px;
  }

td.actions-cell,   td.table-actions,   .card table td:last-child  {
    min-width: 220px;
  }
}

/* v1.9.4 final-auditoria-fix — overrides manuales preservados */
.card strong  {
  font-size: 1rem;
}

.brand  {
  font-weight: 900;
  font-size: 22px;
  color: #fff;
  text-align: left;
}

@media (min-width: 901px)  {
  .agent-actions  {
    max-width: 15vw;
  }

.agent-status-card  {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: start;
  }
}

@media (max-width: 900px)  {
  .main,   .sidebar  {
    padding-top: 35px !important;
  }
}

/* v1.9.4 final-auditoria-fix — tablas/filtros y acciones contenidas */
.filters-card.compact-filter-bar  {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: end;
}

.filters-card.compact-filter-bar > *  {
  min-width: 150px;
  flex: 1 1 150px;
}

.filters-card.compact-filter-bar button, .filters-card.compact-filter-bar a  {
  flex: 0 0 auto;
}

.card:has(table), .table-responsive, .table-scroll  {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

.card table, .table-responsive table, .table-scroll table  {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
}

.card table th, .card table td, .table-responsive th, .table-responsive td, .table-scroll th, .table-scroll td  {
  max-width: none;
  vertical-align: middle;
}

.card table td, .table-responsive td, .table-scroll td  {
  overflow-wrap: anywhere;
}

.card table th, .table-responsive th, .table-scroll th  {
  overflow-wrap: normal;
  white-space: nowrap;
}

td.actions-cell, td.table-actions, .card table td:last-child  {
  max-width: 280px;
  min-width: 180px;
  white-space: normal;
}

td.actions-cell, td.table-actions  {
  display: table-cell !important;
  vertical-align: middle;
}

td.actions-cell > *, td.table-actions > *, .card table td:last-child > form, .card table td:last-child > a, .card table td:last-child > button  {
  margin-bottom: 6px;
}

@media (max-width: 900px)  {
  .filters-card.compact-filter-bar  {
    display: grid;
    grid-template-columns: 1fr;
  }

.filters-card.compact-filter-bar > *  {
    min-width: 0;
    width: 100%;
  }

.card table,   .table-responsive table,   .table-scroll table  {
    min-width: 760px;
  }
}

/* =========================================================
   v1.9.4-cierre — scrollbar estable desktop/mobile
   Mantener este bloque al final para que no lo pisen versiones previas.
   ========================================================= */
:root  {
  --lg-scrollbar-track: rgba(255, 255, 255, 0.055);
  --lg-scrollbar-thumb: rgba(255, 193, 7, 0.88);
  --lg-scrollbar-thumb-hover: rgba(255, 193, 7, 1);
  --lg-scrollbar-border: rgba(8, 16, 30, 0.96);
}

*  {
  scrollbar-width: thin !important;
  scrollbar-color: var(--lg-scrollbar-thumb) var(--lg-scrollbar-track) !important;
}

::-webkit-scrollbar  {
  width: 10px !important;
  height: 10px !important;
}

::-webkit-scrollbar-track  {
  background: var(--lg-scrollbar-track) !important;
  border-radius: 999px !important;
}

::-webkit-scrollbar-thumb  {
  background-color: var(--lg-scrollbar-thumb) !important;
  background-image: none !important;
  border: 2px solid var(--lg-scrollbar-border) !important;
  border-radius: 999px !important;
}

::-webkit-scrollbar-thumb:hover  {
  background-color: var(--lg-scrollbar-thumb-hover) !important;
  background-image: none !important;
}

::-webkit-scrollbar-corner  {
  background: transparent !important;
}

html, body, .main, .sidebar, .card, .table-scroll, .table-responsive, .debug, .check-grid  {
  scrollbar-width: thin !important;
  scrollbar-color: var(--lg-scrollbar-thumb) var(--lg-scrollbar-track) !important;
}

.sidebar::-webkit-scrollbar  {
  width: 8px !important;
}

.sidebar::-webkit-scrollbar-track  {
  background: rgba(255, 255, 255, 0.045) !important;
  border-radius: 999px !important;
}

.sidebar::-webkit-scrollbar-thumb  {
  background-color: var(--lg-scrollbar-thumb) !important;
  background-image: none !important;
  border: 1px solid var(--lg-scrollbar-border) !important;
  border-radius: 999px !important;
}

.card::-webkit-scrollbar, .table-scroll::-webkit-scrollbar, .table-responsive::-webkit-scrollbar  {
  height: 9px !important;
}

.card::-webkit-scrollbar-thumb, .table-scroll::-webkit-scrollbar-thumb, .table-responsive::-webkit-scrollbar-thumb  {
  background-color: var(--lg-scrollbar-thumb) !important;
  background-image: none !important;
  border-radius: 999px !important;
}

/* v1.9.4-final-audit-fix-2 — selector de filas por página en paginaciones */
.pagination-actions {
  align-items: center;
}

.pagination-limit-form {
  display: inline-flex;
  align-items: center;
  margin: 0;
}

.pagination-limit-form label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.pagination-limit-form select {
  width: auto;
  min-width: 74px;
  padding: 7px 9px;
  border-radius: 10px;
}

@media (max-width: 900px) {
  .pagination-actions {
    display: flex;
    flex-wrap: wrap;
  }

  .pagination-limit-form,
  .pagination-limit-form label,
  .pagination-limit-form select {
    width: 100%;
  }
}

/* v1.9.5-pre1 — seguridad/auth: flashes en layout de autenticación */
.auth-flash-wrap {
  position: fixed;
  top: 18px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 200;
  width: min(520px, calc(100vw - 28px));
  display: grid;
  gap: 8px;
}

.auth-flash-wrap .flash {
  box-shadow: 0 18px 50px rgba(0, 0, 0, .32);
}

/* v1.9.6-final — configuración editable de sistema */
.inline-config-form {
  display:grid;
  gap:8px;
  min-width:min(100%, 360px);
}
.inline-config-form input,
.inline-config-form select,
.inline-config-form textarea {
  width:100%;
}
.subcard.soft {
  background:rgba(255,255,255,.045);
}

/* v1.9.7-pre2 — límites comerciales aplicados en backend */
.limit-warning-card {
  margin-bottom: 18px;
  border-color: rgba(255, 193, 7, .38);
  background: linear-gradient(135deg, rgba(255,193,7,.08), rgba(255,255,255,.035));
}
.limit-warning-card .eyebrow-soft {
  color: #ffd35a;
}
.limit-warning-card .note {
  max-width: 780px;
}

/* v1.9.7-pre5 — navegación por rol y menús retráctiles */
.nav-group-title {
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.nav-group-title::after {
  content:'›';
  font-size:16px;
  line-height:1;
  transform:rotate(0deg);
  transition:transform .16s ease;
  opacity:.75;
}
.nav-group.is-open .nav-group-title::after {
  transform:rotate(90deg);
}
.nav-group .nav-group-links {
  display:none;
}
.nav-group.is-open .nav-group-links,
.nav-group.nav-group-plain .nav-group-links {
  display:grid;
}
.nav-group-links:empty {
  display:none!important;
}
.permission-detail {
  display:grid;
  gap:6px;
}
.permission-detail summary {
  cursor:pointer;
  color:#dbe8ff;
  font-weight:800;
}
.permission-list-small {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:6px;
}
.anchor-offset {
  scroll-margin-top:24px;
  margin-bottom: 18px;
}
.cta-row {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.limit-bar-row .pill.danger,
.health-action.danger .mini-btn {
  border-color:rgba(255,107,107,.45);
}

/* v1.9.7-final — espacio para guías estáticas por rol */
.guide-grid {
  align-items: stretch;
}
.guide-card {
  display: grid;
  gap: 12px;
  align-content: start;
}
.guide-file code,
.code-block code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}
.code-block {
  overflow-x: auto;
  padding: 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.08);
}

/* v1.9.8-pre2 — registro público comercial */
.mini-plan-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:12px;
  margin:18px 0;
}
.plan-option-card {
  display:grid;
  gap:6px;
  padding:14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.045);
  cursor:pointer;
}
.plan-option-card:has(input:checked) {
  border-color:rgba(255,193,7,.75);
  box-shadow:0 0 0 3px rgba(255,193,7,.12);
}
.plan-option-card input {
  width:auto;
  justify-self:start;
}
.plan-option-card strong {
  font-size:1rem;
}
.plan-option-card span,
.plan-option-card em {
  color:rgba(255,255,255,.72);
  font-style:normal;
  font-size:.92rem;
}
.soft-panel {
  padding:14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);
}
.soft-panel p:last-child {
  margin-bottom:0;
}

/* v1.9.8-pre3 — registro con trial $1 y límites visibles */
.registro-plan-grid {
  grid-template-columns: repeat(auto-fit, minmax(245px, 1fr));
}
.registro-plan-card .badge.subtle {
  justify-self: start;
  width: fit-content;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(255,193,7,.12);
  border: 1px solid rgba(255,193,7,.24);
  color: rgba(255,255,255,.9);
  font-size: .75rem;
}
.registro-plan-card.is-trial-card {
  border-style: dashed;
}
.plan-limit-list {
  margin: 8px 0 0;
  padding-left: 18px;
  color: rgba(255,255,255,.72);
  font-size: .86rem;
  line-height: 1.5;
}
.plan-limit-list strong {
  font-size: .9rem;
  color: rgba(255,255,255,.92);
}
.chips-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}
.chips-row .chip {
  border-radius: 999px;
  padding: 5px 9px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.09);
  color: rgba(255,255,255,.78);
  font-size: .82rem;
}

/* v1.9.8-pre4 onboarding comercial */
.usage-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(135px,1fr));
  gap:10px;
  margin:12px 0
}
.usage-item {
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px;
  background:rgba(255,255,255,.035)
}
.usage-item small {
  display:block;
  color:var(--muted);
  font-size:12px;
  min-height:30px
}
.usage-item strong {
  display:block;
  font-size:20px;
  margin:4px 0 0
}
.usage-item.cerca_limite,
.usage-item.warn {
  border-color:rgba(255,193,7,.35);
  background:rgba(255,193,7,.08)
}
.usage-item.bloqueado,
.usage-item.sobreuso,
.alert-card.warn {
  border-color:rgba(255,107,107,.38);
  background:rgba(255,107,107,.08)
}
.onboarding-steps.compact .onboarding-step {
  padding:10px
}
@media(max-width:900px) {
  .onboarding-hero-card {
    flex-direction:column;
    align-items:flex-start
  }
  .onboarding-progress-box {
    min-width:0
  }
  .onboarding-step {
    grid-template-columns:34px 1fr;
  }
  .onboarding-step .mini-btn {
    grid-column:1 / -1;
    width:100%;
    text-align:center
  }
}

/* v1.9.8-pre6-checkout-ux-hotfix — registro/checkout compacto */
body.auth-body:has(.registro-checkout-card){place-items:start center;padding:34px 0}.login-card.wide-card.registro-checkout-card{width:min(1180px,96%);padding:34px}.registro-checkout-card h1{margin-bottom:8px}.registro-selected-banner{display:grid;gap:4px;margin:18px 0 20px;padding:18px 20px;border-radius:20px;background:linear-gradient(135deg,rgba(255,193,7,.14),rgba(255,255,255,.045));border:1px solid rgba(255,193,7,.24)}.registro-selected-banner span{color:#ffd35a;font-size:12px;text-transform:uppercase;letter-spacing:.09em;font-weight:900}.registro-selected-banner strong{font-size:1.35rem}.registro-selected-banner p{margin:0;color:var(--muted)}.registro-checkout-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr);gap:20px;align-items:start}.registro-form-panel,.registro-summary-panel{border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.035);padding:20px}.registro-form-panel h2,.registro-summary-panel h2{margin:0 0 16px;font-size:1.2rem}.registro-summary-panel{position:sticky;top:20px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));box-shadow:0 18px 48px rgba(0,0,0,.18)}.summary-eyebrow{display:inline-flex;margin-bottom:10px;padding:5px 9px;border-radius:999px;background:rgba(255,193,7,.14);border:1px solid rgba(255,193,7,.25);color:#ffd35a;font-size:.74rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.summary-price-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0 14px}.summary-price-row>div{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.045);border-radius:16px;padding:12px}.summary-price-row small{display:block;color:var(--muted);font-weight:800}.summary-price-row strong{display:block;margin-top:4px;color:#fff;font-size:1rem;line-height:1.25}.registro-change-plan{border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:0;margin:0 0 14px;background:rgba(255,255,255,.035);overflow:hidden}.registro-change-plan summary{cursor:pointer;padding:12px 14px;color:#fff;font-weight:900}.registro-change-plan .field{padding:0 14px 14px}.summary-limits-box{border:1px solid rgba(255,255,255,.1);border-radius:16px;background:rgba(255,255,255,.035);padding:14px;margin-bottom:14px}.summary-limits-box>strong{display:block;margin-bottom:8px}.summary-limits-box ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}.summary-limits-box li{display:flex;justify-content:space-between;gap:12px;border-top:1px solid rgba(255,255,255,.08);padding-top:8px;color:var(--muted);font-size:.9rem}.summary-limits-box li:first-child{border-top:0;padding-top:0}.summary-limits-box b{color:#fff}.summary-soft-panel{margin-bottom:14px}.registro-back-link{display:block;text-align:center;margin-top:12px;color:var(--muted);font-weight:800;text-decoration:none}.registro-back-link:hover{color:#fff}.registro-checkout-form .grid.tight{margin-bottom:12px;gap:12px}
@media(max-width:880px){.login-card.wide-card.registro-checkout-card{padding:24px;width:min(96%,720px)}.registro-checkout-layout{grid-template-columns:1fr}.registro-summary-panel{position:static;order:-1}.summary-price-row{grid-template-columns:1fr}.grid.two.tight{grid-template-columns:1fr}}

/* v1.9.8-pre6-security-checkout-hotfix2 — password policy + métodos de pago */
.password-policy-box,
.field-help{
  color:var(--muted);
  font-size:.86rem;
  line-height:1.45;
}
.password-policy-box{
  margin:-2px 0 14px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:rgba(255,255,255,.035);
}
.password-policy-box strong{display:block;color:#fff;margin-bottom:3px;font-size:.9rem}.password-policy-box.is-valid{border-color:rgba(42,214,143,.38);background:rgba(42,214,143,.08)}.password-policy-box.is-valid strong{color:#8df2c5}.password-policy-box.is-invalid{border-color:rgba(255,193,7,.34);background:rgba(255,193,7,.08)}.password-policy-box.is-invalid strong{color:#ffd35a}.payment-methods-box{margin:0 0 14px;border:1px solid rgba(255,255,255,.10);border-radius:16px;background:rgba(255,255,255,.035);overflow:hidden}.payment-methods-box summary{display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer;padding:12px 14px;list-style:none;font-weight:900;color:#fff}.payment-methods-box summary::-webkit-details-marker{display:none}.payment-methods-box summary b{font-size:.78rem;color:#ffd35a;text-transform:uppercase;letter-spacing:.08em}.payment-methods-box[open] summary b{font-size:0}.payment-methods-box[open] summary b::after{content:'Ocultar';font-size:.78rem}.payment-methods-list{display:flex;flex-wrap:wrap;gap:8px;padding:0 14px 12px}.payment-methods-list span{display:inline-flex;align-items:center;border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:7px 10px;background:rgba(255,255,255,.055);color:#eaf1ff;font-size:.84rem;font-weight:850}.payment-methods-box p{margin:0;padding:0 14px 14px;color:var(--muted);font-size:.84rem;line-height:1.45}

/* v1.9.8-pre6-onboarding-flow-hotfix5 — activación post-registro */
.onboarding-command-card {
  margin-bottom: 18px;
  border-color: rgba(255,193,7,.38);
  background:
    radial-gradient(circle at 12% 12%, rgba(255,193,7,.10), transparent 34%),
    linear-gradient(135deg, rgba(255,193,7,.08), rgba(18,52,86,.08)),
    var(--card, #111827);
}
.onboarding-command-card .split-head {
  gap: 18px;
  align-items: center;
}
.onboarding-command-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  min-width: 240px;
}
.onboarding-command-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}
.onboarding-command-step {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.035);
}
.onboarding-command-step span {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: rgba(255,193,7,.16);
  color: #ffc107;
  font-weight: 950;
}
.onboarding-command-step.done span {
  background: rgba(34,197,94,.16);
  color: #22c55e;
}
.onboarding-command-step strong {
  font-size: .95rem;
}
.onboarding-command-step small,
.onboarding-next-note {
  color: var(--muted, #9ca3af);
}
.onboarding-entry-alert {
  margin-bottom: 16px;
}
@media (max-width: 980px) {
  .onboarding-command-card .split-head {
    align-items: stretch;
  }
  .onboarding-command-actions {
    min-width: 0;
    width: 100%;
  }
  .onboarding-command-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 620px) {
  .onboarding-command-grid {
    grid-template-columns: 1fr;
  }
}

/* v1.9.8-pre6-founder-reservation-hotfix10 — separación visual resumen inicial */
.card.is-success-box {
  margin-bottom: 18px;
}

/* v1.9.8-pre6-ux-polish-hotfix12 — debug de links amigable y acceso setup rápido */
.router-debug-page .router-debug-card{max-width:980px;margin:0 auto 28px}
.router-debug-card h1{margin:6px 0 10px}
.router-debug-grid{margin:20px 0}
.router-debug-summary{border:1px solid var(--line, rgba(255,255,255,.08));border-radius:18px;padding:16px;background:rgba(255,255,255,.035)}
.router-debug-summary strong{display:block;margin-bottom:8px}
.router-debug-summary .pill{margin-bottom:8px}
.router-debug-details{margin-top:18px}
.router-debug-details summary{cursor:pointer;font-weight:800}
#setup-rapido{scroll-margin-top:96px}

/* v1.9.8-pre6-payment-methods-panel-hotfix14a — mostrar solo datos del método seleccionado */
.payment-selected-box{
  margin:0 0 16px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:18px;
  background:linear-gradient(135deg, rgba(18,52,86,.18), rgba(255,255,255,.035));
  overflow:hidden;
}
.payment-selected-box__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.payment-selected-box__head strong{display:block;color:#fff;font-size:1rem;margin:0 0 3px}
.payment-selected-box__head p{margin:0;padding:0}
.payment-selected-box__head > span{
  display:inline-flex;
  align-items:center;
  border:1px solid rgba(255,193,7,.25);
  border-radius:999px;
  padding:6px 10px;
  color:#ffd35a;
  background:rgba(255,193,7,.08);
  font-size:.78rem;
  font-weight:900;
  white-space:nowrap;
}
.payment-selected-box__empty{
  padding:16px;
  color:var(--muted);
  font-weight:800;
}
.payment-selected-detail{padding:16px}
.payment-selected-detail__title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.payment-selected-detail__title strong{display:block;color:#fff;font-size:1.06rem}
.payment-selected-detail__title span{
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  padding:5px 9px;
  color:#c9d5e7;
  background:rgba(255,255,255,.05);
  font-size:.76rem;
  font-weight:850;
  text-transform:capitalize;
}
.payment-data-line{
  display:grid;
  gap:6px;
  margin:0 0 12px;
  padding:12px;
  border:1px solid rgba(42,214,143,.22);
  border-radius:14px;
  background:rgba(42,214,143,.075);
}
.payment-data-line span{
  color:#8df2c5;
  font-size:.78rem;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.payment-data-line code{
  display:block;
  white-space:pre-wrap;
  word-break:break-word;
  color:#fff;
  font-family:inherit;
  font-weight:900;
  background:transparent;
}
.payment-instructions{
  margin-top:10px;
  color:#eef4ff;
  font-size:.92rem;
  line-height:1.55;
  font-weight:750;
}
@media (max-width:700px){
  .payment-selected-box__head{display:block}
  .payment-selected-box__head > span{margin-top:10px}
  .payment-selected-detail__title{align-items:flex-start;flex-direction:column}
}

/* v1.9.8-pre6-email-system-hotfix15 — previsualización de emails */
.email-preview-frame {
  background:#f8fafc;
  border:1px solid rgba(148,163,184,.35);
  border-radius:18px;
  padding:18px;
  overflow:auto;
  max-height:720px;
}
.email-preview-frame table { max-width:100%; }
.danger-text { color:#f87171; display:block; margin-top:6px; }

/* v1.9.8-pre6-email-system-hotfix15a — editor real de plantillas y acciones de cola */
.email-template-editor-card textarea {
  width: 100%;
  min-height: 150px;
  resize: vertical;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  line-height: 1.45;
}
.email-template-editor-form .field small {
  display: block;
  margin-top: 6px;
  color: var(--muted);
}
.email-template-editor-form code {
  color: #ffd35a;
  background: rgba(255,193,7,.08);
  border: 1px solid rgba(255,193,7,.16);
  border-radius: 8px;
  padding: 1px 5px;
}
.alert.danger {
  border-color: rgba(248,113,113,.38);
  background: rgba(248,113,113,.12);
  color: #fecaca;
}

/* v1.9.8-pre6-custom-domain-hotfix17 — dominios personalizados */
.custom-domain-hero {
  display:flex;
  justify-content:space-between;
  gap:22px;
  align-items:flex-start;
  border:1px solid rgba(255,193,7,.22);
  background:
    radial-gradient(circle at 12% 10%, rgba(255,193,7,.12), transparent 30%),
    linear-gradient(135deg, rgba(18,52,86,.14), rgba(86,2,22,.08)),
    var(--card, #111827);
}
.custom-domain-hero h2 { margin-bottom:8px; }
.domain-steps-mini { display:grid; gap:8px; min-width:220px; }
.domain-steps-mini span {
  display:block;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  font-weight:700;
  font-size:.88rem;
}
.domain-grid-main { align-items:stretch; }
.domain-wizard-card, .dns-instruction-card { min-height:100%; }
.dns-copy-box {
  display:grid;
  gap:10px;
  margin:12px 0;
}
.dns-copy-box > div {
  display:flex;
  justify-content:space-between;
  gap:14px;
  padding:12px 14px;
  border:1px solid rgba(148,163,184,.18);
  border-radius:16px;
  background:rgba(15,23,42,.42);
}
.dns-copy-box.compact { grid-template-columns:1fr 1fr; }
.dns-copy-box span { color:var(--muted,#94a3b8); font-size:.86rem; }
.dns-copy-box code, .dns-copy-box strong { font-size:.95rem; word-break:break-all; }
.domain-card-list { display:grid; gap:18px; }
.domain-card {
  padding:18px;
  border:1px solid rgba(148,163,184,.2);
  border-radius:22px;
  background:rgba(15,23,42,.34);
}
.domain-card-head {
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:flex-start;
  margin-bottom:14px;
}
.domain-card-head strong { display:block; font-size:1.08rem; }
.domain-status-stack { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
.domain-progress {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  margin:12px 0 14px;
}
.domain-progress span {
  text-align:center;
  padding:8px 6px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.22);
  color:var(--muted,#94a3b8);
  font-size:.82rem;
  font-weight:700;
}
.domain-progress span.is-done {
  background:rgba(34,197,94,.12);
  border-color:rgba(34,197,94,.38);
  color:#86efac;
}
.domain-actions { margin-top:14px; }
.small-alert { padding:10px 12px; margin:10px 0; font-size:.9rem; }
.soft-card { box-shadow:none; }
@media (max-width: 760px) {
  .custom-domain-hero, .domain-card-head { flex-direction:column; }
  .domain-steps-mini { min-width:0; width:100%; }
  .domain-progress { grid-template-columns:1fr 1fr; }
  .dns-copy-box.compact { grid-template-columns:1fr; }
}

/* v1.9.8-pre6-legal-pages-hotfix19 — páginas legales y aceptación en registro */
.legal-public-body{margin:0;background:#07101d;color:#e5eefb;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}.legal-container{width:min(1120px,calc(100% - 32px));margin-inline:auto}.legal-header{position:sticky;top:0;z-index:20;background:rgba(7,16,29,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.08)}.legal-nav{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 0}.legal-brand{font-weight:950;color:#fff;text-decoration:none;font-size:1.1rem;letter-spacing:-.02em}.legal-brand span{color:#ffc107}.legal-nav nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.legal-nav nav a,.legal-toc a{color:#b9c7dc;text-decoration:none;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);border-radius:999px;padding:8px 11px;font-size:.86rem;font-weight:800}.legal-nav nav a.is-active,.legal-toc a.is-active{color:#123456;background:#ffc107;border-color:#ffc107}.legal-hero{padding:70px 0 34px;background:radial-gradient(circle at 20% 0%,rgba(255,193,7,.18),transparent 36%),linear-gradient(135deg,#07101d,#123456 62%,#560216)}.legal-kicker{display:inline-flex;color:#ffc107;font-weight:950;text-transform:uppercase;letter-spacing:.12em;font-size:.76rem}.legal-hero h1{margin:12px 0 14px;color:#fff;font-size:clamp(2.2rem,5vw,4.6rem);line-height:.98;letter-spacing:-.05em}.legal-hero p{max-width:790px;color:#d4e1f3;font-size:1.08rem;line-height:1.7}.legal-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.legal-meta span{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);border-radius:999px;padding:7px 11px;color:#c9d6ea;font-size:.82rem}.legal-content{padding:34px 0 70px}.legal-grid{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;align-items:start}.legal-toc{position:sticky;top:88px;display:grid;gap:9px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.045);border-radius:24px;padding:18px}.legal-toc strong{color:#fff}.legal-toc small{color:#8ea0ba;line-height:1.5;margin-top:8px}.legal-card{border:1px solid rgba(255,255,255,.10);background:#fff;color:#1f2937;border-radius:28px;padding:34px;box-shadow:0 28px 90px rgba(0,0,0,.24)}.legal-card section{border-top:1px solid #e5e7eb;padding-top:22px;margin-top:22px}.legal-card section:first-child{border-top:0;margin-top:0;padding-top:0}.legal-card h2{margin:0 0 8px;color:#123456;font-size:1.25rem}.legal-card p{margin:0;color:#374151;line-height:1.75}.legal-note{margin-top:28px;border-radius:18px;background:#f8fafc;border:1px solid #e5e7eb;padding:18px}.legal-note strong{display:block;color:#123456;margin-bottom:6px}.legal-footer{border-top:1px solid rgba(255,255,255,.08);padding:24px 0;color:#9db0c8}.legal-footer .legal-container{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}.legal-footer a{color:#ffc107;text-decoration:none;font-weight:900}.auth-legal-footer{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin:20px auto 0;color:var(--muted);font-size:.86rem}.auth-legal-footer a,.legal-inline-note a,.legal-acceptance-box a{color:#ffc107;font-weight:900}.legal-acceptance-box{display:flex;align-items:flex-start;gap:10px;border:1px solid rgba(255,193,7,.22);background:rgba(255,193,7,.08);border-radius:16px;padding:12px 14px;margin:8px 0 14px;color:var(--muted);font-size:.9rem;line-height:1.45}.legal-acceptance-box input{width:auto;margin-top:3px}.legal-inline-note{font-size:.9rem;color:var(--muted);line-height:1.5;margin:6px 0 12px}@media(max-width:820px){.legal-nav{align-items:flex-start;flex-direction:column}.legal-nav nav{justify-content:flex-start}.legal-grid{grid-template-columns:1fr}.legal-toc{position:static}.legal-card{padding:24px}.legal-hero{padding-top:48px}}
/* v1.9.8-pre6-legal-pages-polish-hotfix19a — mejoras de lectura legal */
.legal-list{margin:14px 0 0;padding-left:20px;color:#374151;line-height:1.65}.legal-list li{margin:6px 0}.legal-note--highlight{margin:0 0 22px;background:#fff8df;border-color:#facc15}.legal-cta-wrap{margin-top:24px}.legal-cta-wrap .btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}


/* v1.9.8-pre6-retention-policy-hotfix19f — aire visual entre cards principales sin tocar grids internos */
.main > .card{margin-bottom:18px}
.main > .card:last-child{margin-bottom:0}
.main > .alert + .card,.main > .notice + .card{margin-top:18px}

/* v1.9.8-pre6-qa-polish-cta-support-logo-hotfix20 */
.brand{display:flex;align-items:center;gap:10px;min-width:0}.brand-logo-img{display:block;max-width:156px;max-height:42px;width:auto;height:auto;object-fit:contain;flex:0 0 auto}.brand-wordmark{display:inline-flex;gap:3px;align-items:baseline;min-width:0}.brand .brand-wordmark span{color:var(--gold)}.topbar{gap:12px}.topbar-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}.topbar-email{color:var(--muted);font-size:.9rem}.support-cta-card{border-color:rgba(255,193,7,.26)!important;background:linear-gradient(135deg,rgba(255,193,7,.10),rgba(255,255,255,.035))!important}.support-cta-card .split-head{align-items:center}.support-inline-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.support-context-card{margin:12px 0 18px;border:1px solid rgba(255,193,7,.22);background:rgba(255,193,7,.065);border-radius:18px;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:14px}.support-context-card strong{display:block;color:#fff;margin-bottom:4px}.support-context-card p{margin:0;color:var(--muted);line-height:1.45}.support-context-card .mini-btn{flex:0 0 auto}.guide-admin-route{display:block}.guide-card .guide-file.is-admin-only{display:block}.guide-empty-note{border:1px dashed rgba(255,255,255,.16);border-radius:16px;padding:14px;color:var(--muted);background:rgba(255,255,255,.035)}.email-variable-hints{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.email-variable-hints code{background:rgba(255,193,7,.10);border-color:rgba(255,193,7,.22);color:#ffe18a}
@media(max-width:900px){.topbar{align-items:flex-start}.topbar-actions{justify-content:flex-start}.support-context-card{align-items:flex-start;flex-direction:column}.brand-logo-img{max-width:136px;max-height:38px}}
.brand.big .brand-logo-img{max-width:220px;max-height:68px;margin-inline:auto}.login-card .brand{justify-content:center}


/* v1.9.8-pre6-qa-polish-cta-support-logo-hotfix20A — login proporcional, soporte discreto */
.auth-body{padding:34px 16px 54px;align-content:center;overflow-y:auto}.login-card--refined{position:relative;margin:0 auto}.auth-back-link{display:inline-flex;margin-bottom:16px;color:#ffc107;font-weight:900;text-decoration:none}.auth-back-link:hover,.auth-secondary-link:hover{color:#ffe18a}.auth-secondary-link{display:block;text-align:center;color:var(--muted);font-weight:850;text-decoration:none;margin-top:2px}.auth-legal-footer{margin:26px auto 0;padding:0 0 26px;line-height:1.7}.auth-legal-footer a{text-decoration:none}.auth-legal-footer a:hover{text-decoration:underline;text-underline-offset:3px}.support-action{border-color:rgba(147,197,253,.25)!important;background:rgba(147,197,253,.10)!important;color:#bfdbfe!important}.support-action:hover{border-color:rgba(147,197,253,.48)!important;background:rgba(147,197,253,.16)!important;color:#dbeafe!important}.support-context-card .mini-btn{border-color:rgba(147,197,253,.24);background:rgba(147,197,253,.10);color:#bfdbfe}.support-context-card .mini-btn:hover{background:rgba(147,197,253,.16);color:#dbeafe}.guide-admin-route{display:block}.guide-card .guide-file.is-admin-only{display:block}
@media(max-width:640px){.auth-body{place-items:start center;padding-top:22px}.login-card{width:min(430px,94%);padding:24px}.auth-legal-footer{padding-bottom:34px}}

/* v1.9.8-pre6-qa-polish-mobile-email-urls-hotfix22 — registro mobile: acciones después del formulario */
.registro-action-panel{margin-top:20px;border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.035);padding:18px;display:grid;gap:12px}
.registro-action-panel .legal-acceptance-box{margin:0}
@media(max-width:880px){
  .registro-checkout-layout{display:flex;flex-direction:column}
  .registro-summary-panel{order:-1;position:static}
  .registro-form-panel{order:0}
  .registro-action-panel{order:1;margin-top:16px}
}

/* v1.9.8-pre6-mobile-legal-checkbox-hotfix22C
   Ensure legal acceptance checkbox remains tappable/visible on mobile registration forms. */
.legal-acceptance-box input[type="checkbox"] {
  width: 16px;
  height: 16px;
  min-width: 16px;
  flex: 0 0 16px;
  margin-top: 3px;
  accent-color: #FFC107;
}

@media (max-width: 700px) {
  .legal-acceptance-box input[type="checkbox"] {
    width: 18px;
    height: 18px;
    min-width: 18px;
    flex-basis: 18px;
  }
}


/* v1.9.8-pre6-panel-copy-verification-polish-hotfix24
   Mobile filters and customer-facing advanced tracking copy polish. */
.campaign-archive-toggle {
  display:flex !important;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  line-height:1.2;
  white-space:nowrap;
}

.campaign-archive-toggle input[type="checkbox"] {
  width:18px;
  height:18px;
  min-width:18px;
  flex:0 0 18px;
  margin:0;
  accent-color:#FFC107;
}

.campaign-archive-toggle span {
  display:inline-block;
}

.advanced-tracking-details {
  margin-top:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
  border-radius:14px;
  padding:10px 12px;
}

.advanced-tracking-details summary {
  cursor:pointer;
  font-weight:900;
  color:#dce8ff;
  list-style:none;
}

.advanced-tracking-details summary::-webkit-details-marker {
  display:none;
}

.advanced-tracking-details summary::after {
  content:'+';
  float:right;
  color:#FFC107;
  font-weight:950;
}

.advanced-tracking-details[open] summary::after {
  content:'–';
}

.advanced-tracking-body {
  margin-top:10px;
}

@media (max-width:700px) {
  .compact-filter-bar .campaign-archive-toggle {
    width:100%;
    min-height:48px;
    padding:12px 14px;
    justify-content:flex-start;
    white-space:normal;
  }

  .compact-filter-bar .campaign-archive-toggle input[type="checkbox"] {
    width:20px;
    height:20px;
    min-width:20px;
    flex-basis:20px;
  }
}