/* AIMAX Partners 3.13.0 · Reference Glass
 * Fondo abstracto único + vidrio neutro. Esta capa no altera estructura ni lógica.
 */

:root,
html[data-theme="dark"],
html[data-theme="light"] {
  color-scheme: dark;
  --bg: #050313;
  --panel: rgba(9, 8, 28, .27);
  --panel2: rgba(9, 8, 28, .20);
  --line: rgba(255, 255, 255, .15);
  --text: #fbfaff;
  --muted: #b8b4c9;
  --cyan: #68d8ff;
  --blue: #5468ff;
  --purple: #a854ff;
  --pink: #ff39be;
  --danger: #ff8aa8;
  --warning: #ffd082;
  --ok: #73e8c4;
  --aimax-glass: linear-gradient(142deg, rgba(255,255,255,.105), rgba(255,255,255,.034) 52%, rgba(255,255,255,.018));
  --aimax-glass-soft: rgba(8, 7, 25, .18);
  --aimax-glass-strong: linear-gradient(145deg, rgba(18,16,48,.50), rgba(7,6,23,.38));
  --aimax-glass-border: rgba(255,255,255,.17);
  --aimax-glass-highlight: rgba(255,255,255,.20);
  --aimax-shadow: 0 26px 72px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.12), inset 0 -1px 0 rgba(255,255,255,.025);
  --aimax-shadow-soft: 0 14px 38px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.09);
  --aimax-action: linear-gradient(100deg, #ff3eb7 0%, #a748ff 47%, #4e84ff 76%, #62d9ff 100%);
  /* Neutraliza las variables cromáticas heredadas por componentes antiguos. */
  --glass: var(--aimax-glass);
  --glass-soft: rgba(8, 7, 25, .22);
  --glass-line: var(--aimax-glass-border);
  --glass-highlight: var(--aimax-glass-highlight);
  --glass-strong: var(--aimax-glass-strong);
  --hero-gradient: var(--aimax-glass);
}

html,
html[data-theme="dark"],
html[data-theme="light"] {
  min-height: 100%;
  color: var(--text) !important;
  background: #050313 !important;
}

html body,
html[data-theme="dark"] body,
html[data-theme="light"] body {
  min-height: 100vh;
  isolation: isolate;
  color: var(--text) !important;
  background: #050313 !important;
}

html body::before,
html[data-theme="dark"] body::before,
html[data-theme="light"] body::before {
  content: "" !important;
  position: fixed !important;
  inset: -1px !important;
  z-index: 0 !important;
  width: auto !important;
  height: auto !important;
  border-radius: 0 !important;
  transform: none !important;
  opacity: 1 !important;
  pointer-events: none !important;
  background-color: #050313 !important;
  background-image: url("aimax-neon-abstract.webp") !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  filter: none !important;
  box-shadow: none !important;
}

html body::after,
html[data-theme="dark"] body::after,
html[data-theme="light"] body::after {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 0 !important;
  width: auto !important;
  height: auto !important;
  border-radius: 0 !important;
  transform: none !important;
  opacity: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(118deg, rgba(3,2,15,.34), rgba(5,3,20,.08) 43%, rgba(3,2,14,.32)) !important;
  filter: none !important;
  box-shadow: none !important;
}

.app-shell,
.login-shell,
body.login-page > .card,
.app-dialog,
.pwa-install-cta,
.push-permission-cta,
.push-permission-help {
  position: relative;
  z-index: 1;
}

::selection {
  color: #fff;
  background: rgba(183, 66, 255, .62);
}

*:focus-visible {
  outline: 2px solid rgba(119, 220, 255, .95) !important;
  outline-offset: 2px !important;
}

/* Superficies: un solo vidrio neutro, sin colores por tarjeta. */
html body .card,
html body .metric-grid > .metric,
html body .hero,
html body .premium-hero,
html body .catalog-hero,
html body .activity-hero,
html body .brand-hero,
html body .notify-hero,
html body .notifications-hero,
html body .renewals-hero,
html body .settings-hero,
html body .push-admin-hero,
html body .storage-hero,
html body .renewal-center-hero,
html body .manual-settings-hero,
html body .mini-item,
html body .note,
html body .user-mini,
html body .template-card,
html body .brand-card,
html body .brand-note,
html body .brand-preview,
html body .activity-kpi,
html body .activity-live-card,
html body .activity-trend-card,
html body .activity-directory,
html body .activity-privacy-note,
html body .mobile-template-shortcut,
html body .notify-status,
html body .notify-kpi,
html body .notify-guide,
html body .push-admin-health,
html body .push-admin-metric,
html body .push-admin-panel,
html body .notify-checks > div,
html body .push-admin-checks > div,
html body .notify-cron,
html body .renewal-smart-strip,
html body .renewal-client-card,
html body .renewal-alert,
html body .renewal-history,
html body .renewal-message-preview,
html body .renewal-empty-state,
html body .manual-notify-toggle,
html body .manual-schedule-block,
html body .manual-readiness-item,
html body .manual-settings-card,
html body .manual-flow-card,
html body .manual-settings-preview,
html body .manual-security-strip,
html body .manual-scheduler-notice,
html body .storage-metric,
html body .storage-migration-card,
html body .storage-activity-card,
html body .storage-budget-card,
html body .storage-users-card,
html body .storage-inventory,
html body .storage-settings,
html body .storage-activity-grid > div,
html body .storage-inventory-grid > div,
html body .storage-cost-breakdown > span,
html body .storage-checklist li,
html body .catalog-kpis article,
html body .catalog-engine,
html body .catalog-controller,
html body .catalog-source-access,
html body .catalog-config-card,
html body .catalog-telegram-setup,
html body .catalog-draft,
html body .catalog-controller-steps article,
html body .catalog-source-card,
html body .catalog-source-migration,
html body .catalog-telegram-runtime,
html body .flyer-channel,
html body .pwa-install-cta,
html body .pwa-install-help-card,
html body .push-permission-cta,
html body .push-permission-help-card,
html body .app-dialog,
html body .release-modal-card,
html body .empty {
  color: var(--text) !important;
  border: 1px solid var(--aimax-glass-border) !important;
  background: var(--aimax-glass) !important;
  box-shadow: var(--aimax-shadow) !important;
  -webkit-backdrop-filter: blur(24px) saturate(128%) !important;
  backdrop-filter: blur(24px) saturate(128%) !important;
}

html body .card,
html body .hero,
html body .push-admin-panel,
html body .catalog-source-card {
  border-radius: 22px !important;
}

/* Subsuperficies: siguen siendo cristal, sin verde o azul por estado. */
html body .catalog-engine.is-ready,
html body .catalog-toggle.is-main,
html body .catalog-saved-value,
html body .catalog-current-destination,
html body .catalog-telegram-health,
html body .catalog-telegram-runtime,
html body .catalog-engine-timing > span,
html body .catalog-caption,
html body .catalog-advanced,
html body .catalog-toggle,
html body .catalog-candidate,
html body .catalog-metadata,
html body .catalog-episode-label,
html body .catalog-steps b,
html body .catalog-telegram-copy code,
html body .catalog-source-foot code,
html body .catalog-config-card header > span,
html body .catalog-telegram-copy > span,
html body .catalog-source-access > header > span,
html body .catalog-controller-steps article > span,
html body .push-admin-checks > div,
html body .manual-days-control,
html body .renewal-center-metrics > div,
html body .renewal-time-chips > *,
html body .storage-alert,
html body .storage-switch {
  border-color: rgba(255,255,255,.14) !important;
  background: rgba(255,255,255,.055) !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255,255,255,.065) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  backdrop-filter: blur(14px) !important;
}

html body .card:hover,
html body .mini-item:hover,
html body .metric:hover,
html body .template-card:hover {
  border-color: rgba(255,255,255,.26) !important;
  box-shadow: 0 30px 78px rgba(0,0,0,.33), inset 0 1px rgba(255,255,255,.16) !important;
}

html body .hero::before,
html body .hero::after,
html body .settings-hero::before,
html body .settings-hero::after,
html body .storage-hero::before,
html body .storage-hero::after,
html body .push-admin-hero::before,
html body .push-admin-hero::after,
html body .catalog-engine::before,
html body .catalog-engine::after {
  display: none !important;
  content: none !important;
}

html body .notify-hero::before,
html body .notify-hero::after,
html body .notifications-hero::before,
html body .notifications-hero::after,
html body .renewals-hero::before,
html body .renewals-hero::after,
html body .renewal-center-hero::before,
html body .renewal-center-hero::after,
html body .manual-settings-hero::before,
html body .manual-settings-hero::after,
html body .activity-hero::before,
html body .activity-hero::after,
html body .brand-hero::before,
html body .brand-hero::after {
  display: none !important;
  content: none !important;
}

html body .muted,
html body .sub,
html body .hint,
html body .section-head p,
html body .card p,
html body .metric span,
html body small {
  color: var(--muted) !important;
}

html body h1,
html body h2,
html body h3,
html body h4,
html body strong,
html body b {
  color: #fff !important;
}

html body .metric strong,
html body .catalog-kpi-word,
html body .push-admin-metric strong,
html body .storage-metric strong,
html body .activity-kpi strong {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: none !important;
  background-image: none !important;
}

/* Navegación flotante de cristal. */
html body .app-shell {
  background: transparent !important;
}

html body .sidebar,
html[data-theme="light"] body .sidebar,
html[data-theme="dark"] body .sidebar {
  color: var(--text) !important;
  border: 0 !important;
  border-right: 1px solid rgba(255,255,255,.14) !important;
  background: linear-gradient(155deg, rgba(9,7,28,.40), rgba(5,4,19,.22)) !important;
  box-shadow: 18px 0 55px rgba(0,0,0,.22), inset -1px 0 rgba(255,255,255,.035) !important;
  -webkit-backdrop-filter: blur(30px) saturate(125%) !important;
  backdrop-filter: blur(30px) saturate(125%) !important;
}

html body .sidebar::before {
  display: none !important;
}

html body .brand {
  border-color: rgba(255,255,255,.10) !important;
  background: transparent !important;
}

html body .brand img,
html body .logo-large {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: drop-shadow(0 8px 22px rgba(0,0,0,.30)) !important;
}

html body .nav .label {
  color: rgba(224,220,239,.48) !important;
}

html body .nav a,
html[data-theme="light"] body .nav a,
html[data-theme="dark"] body .nav a {
  color: rgba(240,237,250,.70) !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .nav a:hover,
html body .nav a.active,
html[data-theme="light"] body .nav a:hover,
html[data-theme="light"] body .nav a.active,
html[data-theme="dark"] body .nav a:hover,
html[data-theme="dark"] body .nav a.active {
  color: #fff !important;
  border-color: rgba(255,255,255,.16) !important;
  background: rgba(255,255,255,.075) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.10), 0 11px 28px rgba(0,0,0,.16) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  backdrop-filter: blur(16px) !important;
}

html body .nav a.active::before {
  width: 2px !important;
  background: rgba(255,255,255,.78) !important;
  box-shadow: 0 0 12px rgba(255,255,255,.34) !important;
}

html body .nav .ico {
  color: rgba(255,255,255,.82) !important;
  filter: none !important;
}

html body .nav-count {
  color: #fff !important;
  border-color: rgba(255,255,255,.22) !important;
  background: rgba(255,255,255,.13) !important;
  box-shadow: none !important;
}

html body .topbar,
html[data-theme="light"] body .topbar,
html[data-theme="dark"] body .topbar {
  color: var(--text) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(7,5,22,.22) !important;
  box-shadow: 0 12px 38px rgba(0,0,0,.12), inset 0 -1px rgba(255,255,255,.02) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
}

html body .content {
  background: transparent !important;
}

/* Acciones: vidrio en controles; un solo degradado para la acción principal. */
html body .btn,
html body button:not(.theme-toggle),
html body a.btn {
  color: rgba(255,255,255,.91) !important;
  border-color: rgba(255,255,255,.17) !important;
  background: rgba(255,255,255,.075) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.10), 0 9px 24px rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(15px) saturate(120%) !important;
  backdrop-filter: blur(15px) saturate(120%) !important;
}

html body .btn:hover,
html body button:not(.theme-toggle):hover,
html body a.btn:hover {
  color: #fff !important;
  border-color: rgba(255,255,255,.30) !important;
  background: rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.16), 0 13px 28px rgba(0,0,0,.21) !important;
}

html body .btn.primary,
html body .btn.green,
html body button.primary,
html body button.green,
html body .push-admin-send,
html body .pwa-install-now,
html body .push-enable {
  color: #fff !important;
  border-color: rgba(255,255,255,.24) !important;
  background: var(--aimax-action) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.32), 0 13px 34px rgba(93,44,224,.28) !important;
}

html body .btn.primary:hover,
html body .btn.green:hover,
html body button.primary:hover,
html body button.green:hover,
html body .push-admin-send:hover,
html body .pwa-install-now:hover,
html body .push-enable:hover {
  filter: brightness(1.08) saturate(1.05) !important;
  background: var(--aimax-action) !important;
}

html body .btn.danger,
html body button.danger {
  color: #ffafc1 !important;
  border-color: rgba(255,255,255,.17) !important;
  background: rgba(255,255,255,.065) !important;
}

html body .btn.warning,
html body button.warning {
  color: #ffe0a6 !important;
  border-color: rgba(255,255,255,.17) !important;
  background: rgba(255,255,255,.065) !important;
}

html body button:disabled,
html body .btn:disabled {
  opacity: .45 !important;
  filter: saturate(.45) !important;
}

/* Formularios transparentes. */
html body .input,
html body .select,
html body .textarea,
html body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
html body select,
html body textarea {
  color: #fff !important;
  border-color: rgba(255,255,255,.15) !important;
  background: rgba(4,3,17,.26) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
  -webkit-backdrop-filter: blur(13px) !important;
  backdrop-filter: blur(13px) !important;
}

html body .input:focus,
html body .select:focus,
html body .textarea:focus,
html body input:focus,
html body select:focus,
html body textarea:focus {
  border-color: rgba(255,255,255,.37) !important;
  background: rgba(9,7,29,.35) !important;
  box-shadow: 0 0 0 3px rgba(151,91,255,.12), inset 0 1px rgba(255,255,255,.08) !important;
}

html body input::placeholder,
html body textarea::placeholder {
  color: rgba(216,211,230,.48) !important;
}

html body select option {
  color: #fff;
  background: #100c2a;
}

/* Tablas y listas dejan pasar el mismo fondo. */
html body .table-wrap,
html body .table,
html body .table thead,
html body .table tbody,
html body .table tr,
html body .table th,
html body .table td {
  background: transparent !important;
}

html body .table-wrap {
  border-color: rgba(255,255,255,.13) !important;
}

html body .table th,
html body .table td {
  color: rgba(248,246,255,.88) !important;
  border-color: rgba(255,255,255,.085) !important;
}

html body .table th {
  color: rgba(225,220,240,.58) !important;
}

html body .table tr:hover td {
  background: rgba(255,255,255,.045) !important;
}

html body .code,
html body code {
  color: #f0ebff !important;
  border-color: rgba(255,255,255,.13) !important;
  background: rgba(4,3,16,.24) !important;
}

/* Estados: el color se limita al texto/punto, nunca al panel completo. */
html body .pill,
html body .tag,
html body .badge,
html body .storage-state,
html body .storage-alert,
html body .push-admin-state,
html body .push-admin-type,
html body .catalog-source-badge,
html body .catalog-count,
html body .manual-mode-badge,
html body .renewal-days-badge,
html body .renewal-manual-pill,
html body .activity-eyebrow,
html body .notify-kicker,
html body .push-admin-eyebrow,
html body .storage-eyebrow,
html body .renewal-center-eyebrow,
html body .manual-settings-eyebrow {
  color: rgba(255,255,255,.86) !important;
  border-color: rgba(255,255,255,.17) !important;
  background: rgba(255,255,255,.075) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.08) !important;
}

html body .pill.active,
html body .pill.sent,
html body .is-ok,
html body .done,
html body .kpi-accent {
  color: var(--ok) !important;
  -webkit-text-fill-color: currentColor !important;
}

html body .pill.pending,
html body .due,
html body .is-warn {
  color: var(--warning) !important;
  -webkit-text-fill-color: currentColor !important;
}

html body .pill.expired,
html body .late,
html body .is-bad {
  color: var(--danger) !important;
  -webkit-text-fill-color: currentColor !important;
}

html body .flash,
html body .catalog-alert,
html body .catalog-inline-error,
html body .push-admin-alert {
  color: #fff !important;
  border-color: rgba(255,255,255,.16) !important;
  background: var(--aimax-glass-strong) !important;
  box-shadow: var(--aimax-shadow-soft) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  backdrop-filter: blur(20px) !important;
}

html body .flash.error,
html body .catalog-inline-error,
html body .push-admin-alert:not(.is-recovered) {
  color: #ffc2cf !important;
}

html body .flash.success,
html body .push-admin-alert.is-recovered {
  color: #a6f4dc !important;
}

html body .storage-alert.healthy,
html body .storage-alert.critical,
html body .storage-alert.warning,
html body .catalog-alert.is-error,
html body .catalog-alert.is-info,
html body .catalog-telegram-health.is-ready,
html body .catalog-telegram-runtime.is-ready {
  border-color: rgba(255,255,255,.16) !important;
  background: var(--aimax-glass-strong) !important;
  background-image: none !important;
}

/* Barras y elementos gráficos conservan significado con un único acento. */
html body .storage-progress,
html body .progress,
html body .notify-progress {
  background: rgba(255,255,255,.09) !important;
}

html body .storage-progress > i,
html body .progress > i,
html body .notify-progress > i {
  background: var(--aimax-action) !important;
  box-shadow: 0 0 18px rgba(126,78,255,.28) !important;
}

html body .storage-orbit,
html body .help-icon,
html body .pwa-install-icon,
html body .push-admin-metric-icon,
html body .push-admin-panel-icon,
html body .notify-kpi-icon,
html body .manual-settings-number,
html body .renewal-client-avatar {
  color: #fff !important;
  border-color: rgba(255,255,255,.16) !important;
  background: rgba(255,255,255,.075) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09) !important;
}

html body .project-thumb,
html body .template-card img {
  background-color: rgba(5,4,20,.28) !important;
}

/* Acceso: una pieza grande de vidrio como la referencia. */
html body.login-page {
  background: #050313 !important;
}

html body .login-shell {
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.21) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.028) 56%, rgba(255,255,255,.012)) !important;
  box-shadow: 0 42px 120px rgba(0,0,0,.38), inset 0 1px rgba(255,255,255,.18), inset 0 -1px rgba(255,255,255,.035) !important;
  -webkit-backdrop-filter: blur(25px) saturate(130%) !important;
  backdrop-filter: blur(25px) saturate(130%) !important;
}

html body .login-shell::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 1px !important;
  z-index: -1 !important;
  border: 1px solid rgba(255,255,255,.035) !important;
  border-radius: inherit !important;
  background: linear-gradient(120deg, rgba(255,255,255,.045), transparent 42%) !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

html body .login-shell::after,
html body .login-card::before,
html body .login-card::after {
  display: none !important;
  content: none !important;
}

html body .login-card {
  color: #fff !important;
  border-color: rgba(255,255,255,.17) !important;
  background: rgba(5,4,20,.19) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 22px 58px rgba(0,0,0,.20) !important;
  transform: none !important;
  -webkit-backdrop-filter: blur(19px) saturate(120%) !important;
  backdrop-filter: blur(19px) saturate(120%) !important;
}

html body .login-copy h1,
html body .login-card h2 {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: none !important;
}

html body .login-copy h1 em {
  color: #ff5ac6 !important;
  -webkit-text-fill-color: #ff5ac6 !important;
  background: none !important;
}

html body .login-copy .note {
  border-color: rgba(255,255,255,.14) !important;
  background: rgba(255,255,255,.045) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.075) !important;
}

html body .login-status,
html body .login-copy .pill {
  color: rgba(255,255,255,.86) !important;
  border-color: rgba(255,255,255,.17) !important;
  background: rgba(255,255,255,.065) !important;
}

html body .login-status i {
  background: #ff54c5 !important;
  box-shadow: 0 0 12px rgba(255,84,197,.65) !important;
}

html body .login-kicker {
  color: rgba(220,215,235,.62) !important;
}

/* Diálogos y avisos flotantes. */
html body .modal,
html body .app-dialog-backdrop,
html body .release-modal {
  background: rgba(2,1,10,.58) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  backdrop-filter: blur(8px) !important;
}

html body .dialog,
html body .app-dialog,
html body .release-modal-card,
html body .pwa-install-cta,
html body .push-permission-cta,
html body .push-permission-help-card,
html body .pwa-install-help-card {
  color: #fff !important;
  border-color: rgba(255,255,255,.19) !important;
  background: var(--aimax-glass-strong) !important;
  box-shadow: 0 35px 100px rgba(0,0,0,.52), inset 0 1px rgba(255,255,255,.14) !important;
  -webkit-backdrop-filter: blur(30px) saturate(130%) !important;
  backdrop-filter: blur(30px) saturate(130%) !important;
}

@media (max-width: 980px) {
  html body .sidebar {
    background: rgba(6,5,20,.62) !important;
    box-shadow: 25px 0 68px rgba(0,0,0,.43) !important;
  }
}

@media (max-width: 760px) {
  html body::before,
  html[data-theme="dark"] body::before,
  html[data-theme="light"] body::before {
    background-image: url("aimax-neon-abstract-mobile.webp") !important;
    background-position: center center !important;
  }

  html body::after,
  html[data-theme="dark"] body::after,
  html[data-theme="light"] body::after {
    background: rgba(3,2,15,.16) !important;
  }

  html body .card,
  html body .hero,
  html body .mini-item,
  html body .note,
  html body .user-mini,
  html body .push-admin-panel,
  html body .catalog-source-card {
    -webkit-backdrop-filter: blur(18px) saturate(120%) !important;
    backdrop-filter: blur(18px) saturate(120%) !important;
  }

  html body .topbar {
    background: rgba(7,5,22,.34) !important;
  }

  html body .login-shell {
    background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.025)) !important;
    -webkit-backdrop-filter: blur(20px) saturate(120%) !important;
    backdrop-filter: blur(20px) saturate(120%) !important;
  }
}

@media (max-width: 540px) {
  html body .content {
    padding: 11px !important;
  }

  html body.login-page {
    padding: 11px !important;
  }

  html body .card,
  html body .hero,
  html body .push-admin-panel,
  html body .catalog-source-card {
    border-radius: 18px !important;
  }
}

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

@media (prefers-contrast: more) {
  html body .card,
  html body .sidebar,
  html body .topbar,
  html body .login-shell,
  html body .login-card,
  html body .dialog {
    border-color: rgba(255,255,255,.38) !important;
    background-color: rgba(7,6,23,.68) !important;
  }

  html body .muted,
  html body .sub,
  html body .hint {
    color: #ded9e9 !important;
  }
}

@media print {
  html body {
    color: #111 !important;
    background: #fff !important;
  }

  html body::before,
  html body::after,
  html body .sidebar,
  html body .topbar,
  html body .pwa-install-cta,
  html body .push-permission-cta,
  html body .push-permission-help {
    display: none !important;
  }

  html body .app-shell {
    display: block !important;
  }

  html body .card {
    color: #111 !important;
    border: 1px solid #bbb !important;
    background: #fff !important;
    box-shadow: none !important;
  }
}

/* AIMAX · guías rápidas contextuales para vendedores */
html body .vendor-guide-dialog {
  width: min(780px, 100%) !important;
  padding: 26px !important;
  border-radius: 24px !important;
}
html body .vendor-guide-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 22px;
}
html body .vendor-guide-head h2 {
  margin: 5px 0 8px !important;
  font-size: clamp(24px, 3vw, 31px) !important;
  line-height: 1.08 !important;
}
html body .vendor-guide-intro {
  max-width: 640px;
  font-size: 12px !important;
  line-height: 1.65 !important;
}
html body .vendor-guide-time {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 58px;
  min-height: 31px;
  padding: 0 10px;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 999px;
  background: rgba(255,255,255,.07);
  color: rgba(255,255,255,.72);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .11em;
}
html body .vendor-guide-steps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 11px;
  margin-top: 20px;
}
html body .vendor-guide-step {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr);
  gap: 11px;
  align-items: start;
  min-height: 104px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 16px;
  background: rgba(255,255,255,.045);
  box-shadow: inset 0 1px rgba(255,255,255,.045);
}
html body .vendor-guide-step-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(111,226,182,.22);
  border-radius: 12px;
  background: linear-gradient(145deg,rgba(22,129,92,.22),rgba(79,65,170,.16));
  color: #8be8c4;
  font-size: 16px;
  font-weight: 900;
}
html body .vendor-guide-step b {
  display: block;
  margin: 1px 0 5px;
  color: #f4fbf8;
  font-size: 11px;
}
html body .vendor-guide-step p {
  margin: 0 !important;
  color: #9bb7ac !important;
  font-size: 10px !important;
  line-height: 1.55 !important;
}
html body .vendor-guide-tip {
  display: grid;
  grid-template-columns: 28px minmax(0,1fr);
  gap: 9px;
  align-items: center;
  margin-top: 12px;
  padding: 11px 13px;
  border: 1px solid rgba(111,226,182,.17);
  border-radius: 13px;
  background: rgba(39,143,105,.08);
}
html body .vendor-guide-tip > span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 9px;
  color: #86e3bf;
  background: rgba(85,196,153,.10);
}
html body .vendor-guide-tip p {
  margin: 0 !important;
  color: #b1c9bf !important;
  font-size: 10px !important;
  line-height: 1.5 !important;
}
html body .vendor-guide-actions {
  margin-top: 16px !important;
}
html body .vendor-guide-actions .btn {
  min-width: 180px;
}
html body .vendor-guide-trigger > span {
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  margin-right: 4px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.18);
  font-size: 10px;
  font-weight: 900;
}
@media (max-width: 680px) {
  html body .vendor-guide-dialog {
    padding: 20px 17px !important;
    border-radius: 21px !important;
  }
  html body .vendor-guide-head {
    gap: 10px;
  }
  html body .vendor-guide-head h2 {
    font-size: 24px !important;
  }
  html body .vendor-guide-time {
    min-width: 52px;
  }
  html body .vendor-guide-steps {
    grid-template-columns: 1fr;
  }
  html body .vendor-guide-step {
    min-height: 0;
  }
  html body .vendor-guide-actions .btn {
    width: 100%;
  }
}

/* AIMAX · FIX navegación móvil
 * reference-glass.css estaba creando un stacking context en .app-shell
 * (z-index:1). El backdrop móvil vive fuera de .app-shell con z-index:210,
 * por lo que terminaba cubriendo también al sidebar aunque éste tuviera z-index:220.
 * En móvil liberamos .app-shell de ese stacking context para que:
 * backdrop (210) < sidebar (220).
 */
@media (max-width: 900px) {
  html body .app-shell {
    position: relative !important;
    z-index: auto !important;
  }

  html body .mobile-backdrop {
    z-index: 210 !important;
  }

  html body .sidebar,
  html body .sidebar.open {
    z-index: 220 !important;
  }
}
