/* Burever Design System v2 | Mantener idéntico en todas las aplicaciones. */
:root {
  --bv-brand: #fbbf24;
  --bv-brand-ink: #172033;
  --bv-ink: #192233;
  --bv-muted: #67758a;
  --bv-line: #e3e8ee;
  --bv-soft: #f5f7fa;
  --bv-white: #fff;
  --bv-danger: #c73541;
  --bv-radius: 12px;
  --bv-primary: #2563eb;
  --bv-primary-hover: #1d4ed8;
  --bv-success: #15803d;
  --bv-warning-ink: #533b05;
  --bv-control-height: 42px;
  --bv-control-radius: 10px;
  --bv-control-ring: rgba(37, 99, 235, .16);
  --bv-navbar-height: 64px;
  --bv-shadow: 0 14px 42px rgba(19, 32, 52, .12);
}
.bv-shell { width:100%; min-height: 100%; }
.bv-topbar {
  position: sticky; top:0; z-index:1000; width:100%; height:var(--bv-navbar-height);
  background:var(--bv-white); border-bottom:1px solid var(--bv-line);
  box-shadow:0 2px 12px rgba(19,32,52,.04);
}
.bv-topbar.bv-topbar-fixed {position:fixed;left:0;right:0;}
.bv-topbar-inner {
  width:100%; height:100%; display:flex; align-items:center; justify-content:space-between;
  padding:0 20px; gap:12px;
}
.bv-brand {
  display:inline-flex; align-items:center; gap:11px; min-width:0; padding:0;
  border:0; background:transparent; color:var(--bv-ink); text-decoration:none;
  text-align:left; cursor:pointer;
}
.bv-brand:hover { color:var(--bv-ink); }
.bv-brand-mark {
  display:grid; place-items:center; height:38px; width:38px; flex:0 0 38px;
  border-radius:11px; background:var(--bv-brand); color:var(--bv-brand-ink);
  font-size:19px;
}
.bv-brand-copy {min-width:0; display:flex; flex-direction:column;gap:1px;line-height:1.18;}
.bv-brand-copy strong { font-size:15px;font-weight:750;letter-spacing:-.025em; }
.bv-brand-copy small { color:var(--bv-muted);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.bv-icon-button {
  height:42px; width:42px; flex:0 0 42px; display:grid;place-items:center;
  border:1px solid transparent; border-radius:11px; background:transparent;
  color:var(--bv-ink);cursor:pointer;font-size:22px;
  transition:background .16s ease,border-color .16s ease;
}
.bv-icon-button:hover {background:var(--bv-soft);border-color:var(--bv-line);}
.bv-icon-button:focus-visible, .bv-menu-item:focus-visible, .bv-action:focus-visible,
.bv-brand:focus-visible, .bv-logout:focus-visible {
  outline:2px solid #2b72d6 !important;outline-offset:3px !important;
}
.bv-drawer-overlay, .bv-confirm-overlay {
  position:fixed;inset:0;background:rgba(19,32,52,.46);z-index:1900;
}
.bv-drawer-overlay[hidden], .bv-confirm-overlay[hidden] {display:none !important;}
.bv-drawer {
  position:fixed;top:0;right:0;bottom:0;width:min(340px,90vw);
  z-index:1910; background:var(--bv-white); box-shadow:-12px 0 40px rgba(19,32,52,.17);
  display:flex;flex-direction:column;padding:calc(18px + env(safe-area-inset-top)) 18px calc(18px + env(safe-area-inset-bottom));
  transform:translateX(105%);visibility:hidden;transition:transform .24s ease,visibility .24s ease;
  overflow-y:auto;
}
.bv-drawer.is-open {transform:translateX(0);visibility:visible;}
.bv-drawer-header {display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:19px;}
.bv-drawer-title {color:var(--bv-ink);font-size:16px;font-weight:750;}
.bv-account {display:flex;gap:12px;align-items:center;padding:14px;background:var(--bv-soft);border:1px solid var(--bv-line);border-radius:var(--bv-radius);margin-bottom:21px;}
.bv-account-icon {width:40px;height:40px;border-radius:12px;background:var(--bv-white);color:var(--bv-ink);display:grid;place-items:center;font-size:23px;flex-shrink:0;}
.bv-account-copy {min-width:0;flex:1;display:flex;flex-direction:column;gap:2px;}
.bv-account-copy small {font-size:11px;color:var(--bv-muted);}
.bv-account-copy strong {font-size:13px;color:var(--bv-ink);overflow-wrap:anywhere;font-weight:650;}
.bv-menu-label {color:var(--bv-muted);font-size:10px;letter-spacing:.08em;font-weight:750;text-transform:uppercase;margin:0 10px 7px;}
.bv-menu-items {display:flex;flex-direction:column;gap:5px;}
.bv-menu-item {
  display:flex;align-items:center;gap:12px;border:1px solid transparent; border-radius:10px;
  background:transparent;color:var(--bv-ink);text-decoration:none;text-align:left;
  font-size:14px;font-weight:550;width:100%;padding:12px 11px;cursor:pointer;
}
.bv-menu-item i {font-size:17px;color:var(--bv-muted);width:20px;text-align:center;}
.bv-menu-item:hover {background:var(--bv-soft);color:var(--bv-ink);}
.bv-menu-item[aria-current="page"] {background:#fff8e4;border-color:#fde4a4;color:#8c5b00;}
.bv-menu-item[aria-current="page"] i {color:#a66d08;}
.bv-drawer-footer {margin-top:auto;padding-top:16px;border-top:1px solid var(--bv-line);}
.bv-logout {
  width:100%; display:flex;align-items:center;justify-content:center;gap:9px;
  background:var(--bv-white);border:1px solid #f1c9cc;color:var(--bv-danger);
  border-radius:10px;padding:12px 15px;font-weight:650;font-size:14px;cursor:pointer;
}
.bv-logout:hover {background:#fff4f4;}
.bv-confirm-overlay {z-index:2100;display:grid;place-items:center;padding:18px;}
.bv-confirm {
  width:min(100%,390px);background:var(--bv-white);border-radius:18px;box-shadow:var(--bv-shadow);
  padding:26px 24px 22px;text-align:center;color:var(--bv-ink);
}
.bv-confirm-symbol {display:grid;place-items:center;margin:0 auto 13px;width:48px;height:48px;border-radius:15px;background:#fff4f4;color:var(--bv-danger);font-size:22px;}
.bv-confirm h2 {font-size:18px;font-weight:750;margin:0 0 10px;}
.bv-confirm p {font-size:13px;line-height:1.6;color:var(--bv-muted);margin:0 0 20px;}
.bv-confirm-actions {display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.bv-action {border:1px solid var(--bv-line);border-radius:10px;min-height:42px;padding:9px 12px;background:var(--bv-soft);color:var(--bv-ink);font-weight:650;font-size:13px;cursor:pointer;}
.bv-action:hover {filter:brightness(.98);}
.bv-action-danger {background:var(--bv-danger);color:white;border-color:var(--bv-danger);}
.bv-action:disabled {opacity:.65;cursor:wait;}
body.bv-overlay-open {overflow:hidden !important;}
@media (max-width:500px) {
  :root { --bv-navbar-height:58px; }
  .bv-topbar-inner {padding:0 14px;}
  .bv-brand-mark {height:36px;width:36px;flex-basis:36px;}
  .bv-brand-copy strong {font-size:14px;}
  .bv-drawer {width:min(330px,90vw);padding-left:16px;padding-right:16px;}
}
@media (prefers-reduced-motion:reduce) {
  .bv-drawer,.bv-icon-button {transition:none;}
}


/* ==================== COMPONENTES COMPARTIDOS · ETAPA 2 ==================== */
/* bv-ui limita estos cambios a las apps del ecosistema. Nunca a consent.html. */
.bv-ui { color: var(--bv-ink); }
.bv-ui :is(.btn, .form-control, .form-select, .card, .table) {
  font-family: inherit;
}

/* Botones: conservar variantes, tamaños, eventos y distribución de Bootstrap. */
.bv-ui .btn {
  --bs-btn-border-radius: var(--bv-control-radius);
  border-radius: var(--bv-control-radius);
  font-weight: 650;
  letter-spacing: -.01em;
  transition: background-color .16s ease, color .16s ease,
              border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.bv-ui .btn:not(.btn-sm):not(.btn-lg):not(.btn-sirpi) { min-height: var(--bv-control-height); }
.bv-ui .btn-primary {
  --bs-btn-bg: var(--bv-primary);
  --bs-btn-border-color: var(--bv-primary);
  --bs-btn-hover-bg: var(--bv-primary-hover);
  --bs-btn-hover-border-color: var(--bv-primary-hover);
  --bs-btn-active-bg: var(--bv-primary-hover);
  --bs-btn-active-border-color: var(--bv-primary-hover);
  --bs-btn-disabled-bg: var(--bv-primary);
  --bs-btn-disabled-border-color: var(--bv-primary);
}
.bv-ui .btn-warning {
  --bs-btn-color: var(--bv-brand-ink);
  --bs-btn-bg: var(--bv-brand);
  --bs-btn-border-color: var(--bv-brand);
  --bs-btn-hover-color: var(--bv-brand-ink);
  --bs-btn-hover-bg: #f4b515;
  --bs-btn-hover-border-color: #f4b515;
  --bs-btn-active-color: var(--bv-brand-ink);
  --bs-btn-active-bg: #e8a91a;
  --bs-btn-active-border-color: #e8a91a;
}
.bv-ui .btn-success {
  --bs-btn-bg: var(--bv-success);
  --bs-btn-border-color: var(--bv-success);
  --bs-btn-hover-bg: #116b35;
  --bs-btn-hover-border-color: #116b35;
}
.bv-ui .btn-secondary {
  --bs-btn-bg: #64748b;
  --bs-btn-border-color: #64748b;
  --bs-btn-hover-bg: #475569;
  --bs-btn-hover-border-color: #475569;
}
.bv-ui .btn-danger {
  --bs-btn-bg: var(--bv-danger);
  --bs-btn-border-color: var(--bv-danger);
  --bs-btn-hover-bg: #aa2935;
  --bs-btn-hover-border-color: #aa2935;
}
.bv-ui .btn-light {
  --bs-btn-bg: #f5f7fa;
  --bs-btn-color: var(--bv-ink);
  --bs-btn-border-color: var(--bv-line);
  --bs-btn-hover-bg: #ebeff4;
  --bs-btn-hover-color: var(--bv-ink);
  --bs-btn-hover-border-color: #d1dae6;
}
.bv-ui :is(.btn-outline-secondary, .btn-outline-danger) { border-color: #cbd5e1; }
.bv-ui .btn-outline-secondary { color: #475569; }
.bv-ui .btn-outline-danger { color: var(--bv-danger); border-color: #ecc2c7; }
.bv-ui .btn:disabled { opacity: .56; box-shadow:none !important; cursor:not-allowed; }
.bv-ui .btn:focus-visible, .bv-ui :is(button, a, input, select, textarea):focus-visible {
  outline: 2px solid var(--bv-primary) !important;
  outline-offset: 2px !important;
}
.bv-ui .btn:focus:not(:focus-visible) { outline: none !important; }

/* Formularios: respetar los tamaños sm/lg, autocorrección y estados disabled. */
.bv-ui .form-label { color: #334155; font-weight: 650; margin-bottom: 6px; }
.bv-ui :is(.form-control, .form-select) {
  --bs-border-color: #d5dde8;
  border: 1px solid var(--bs-border-color);
  border-radius: var(--bv-control-radius);
  background-color: #fff;
  color: var(--bv-ink);
  min-height: var(--bv-control-height);
  box-shadow: 0 1px 2px rgba(15, 23, 42, .025);
  transition: border-color .16s ease, box-shadow .16s ease;
}
.bv-ui :is(.form-control, .form-select)::placeholder { color: #94a3b8; opacity:1; }
.bv-ui :is(.form-control, .form-select):focus {
  border-color: #6b9cf4;
  box-shadow: 0 0 0 3px var(--bv-control-ring) !important;
  outline: none !important;
}
.bv-ui .form-control-sm, .bv-ui .form-select-sm { min-height: 34px; font-size: .84rem; }
.bv-ui .form-control-lg, .bv-ui .form-select-lg { min-height: 48px; }
.bv-ui :is(.form-control, .form-select):disabled,
.bv-ui :is(.form-control, .form-select)[readonly] { background: #f1f4f8; color: #64748b; }
.bv-ui .form-control.is-invalid { border-color: var(--bv-danger); }
.bv-ui .form-control.is-invalid:focus { box-shadow: 0 0 0 3px rgba(199, 53, 65, .12) !important; }
.bv-ui .invalid-feedback { color: var(--bv-danger); }
.bv-ui .form-check-input:checked { background-color: var(--bv-primary); border-color: var(--bv-primary); }
.bv-ui .form-check-input:focus-visible { box-shadow: 0 0 0 3px var(--bv-control-ring) !important; }

/* Tarjetas, paneles y confirmaciones. Mantener sus alturas y anchuras originales. */
.bv-ui .card {
  border-radius: var(--bv-radius) !important;
  border: 1px solid var(--bv-line) !important;
  box-shadow: 0 5px 20px rgba(19, 32, 52, .045) !important;
  color: var(--bv-ink);
}
.bv-ui .bv-login-card { border-radius: 18px !important; box-shadow: var(--bv-shadow) !important; }
.bv-ui .modal-backdrop-custom { background: rgba(19, 32, 52, .52); }
.bv-ui .modal-card-custom {
  border-radius: 16px !important;
  border: 1px solid var(--bv-line) !important;
  box-shadow: 0 20px 52px rgba(19,32,52,.2) !important;
}
.bv-ui .modal-card-custom h2, .bv-ui .modal-card-custom h3 { letter-spacing:-.02em; }
.bv-ui .bv-confirm-dialog { border-top: 3px solid var(--bv-brand) !important; }
.bv-ui .bv-confirm { border:1px solid var(--bv-line); border-top:3px solid var(--bv-brand); }

/* Tablas: solo presentación, no alterar filas, valores ni controles. */
.bv-ui .table-responsive { border-radius: var(--bv-control-radius); }
.bv-ui .table { --bs-table-border-color: var(--bv-line); color:var(--bv-ink); font-size:.83rem; }
.bv-ui .table thead th, .bv-ui .table thead td {
  background: #edf2f8 !important;
  color: #334155;
  font-size: .78rem;
  font-weight: 750;
  vertical-align: middle;
  border-bottom: 1px solid #cbd5e1;
}
.bv-ui .table tbody tr:hover > * { background: #f7faff; }
.bv-ui .table :is(td, th) { padding: .55rem .65rem; }

/* Notificaciones compartidas en portal HTML y aplicación React. */
.bv-toast {
  position: fixed;
  z-index: 20000;
  bottom: calc(22px + env(safe-area-inset-bottom));
  left:50%;
  width: max-content;
  max-width: min(410px,calc(100vw - 32px));
  min-height: 52px;
  transform: translate(-50%, 12px);
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 12px 15px;
  background: #fff;
  border: 1px solid var(--bv-line);
  border-left: 4px solid var(--bv-primary);
  border-radius: 12px;
  box-shadow: 0 12px 36px rgba(19,32,52,.17);
  color: var(--bv-ink);
  opacity:0;
  pointer-events:none;
  transition: opacity .18s ease, transform .18s ease;
}
.bv-toast.is-visible, .bv-toast.bv-toast--react {
  opacity:1;
  transform: translate(-50%, 0);
}
.bv-toast .bv-toast-icon { color: var(--bv-primary); font-size: 19px; flex: 0 0 auto; }
.bv-toast .bv-toast-text { line-height: 1.4; font-size: .86rem; font-weight:600; overflow-wrap:anywhere; }
.bv-toast--success { border-left-color: var(--bv-success); }
.bv-toast--success .bv-toast-icon { color: var(--bv-success); }
.bv-toast--warning { border-left-color: #e3a51e; }
.bv-toast--warning .bv-toast-icon { color: #9c680b; }
.bv-toast--danger { border-left-color: var(--bv-danger); }
.bv-toast--danger .bv-toast-icon { color: var(--bv-danger); }
@media (max-width:500px) {
  .bv-toast { width:calc(100vw - 28px); max-width: none; }
}
@media (prefers-reduced-motion:reduce) {
  .bv-toast, .bv-ui .btn, .bv-ui :is(.form-control, .form-select) {transition:none;}
}
