/* DMC Presupuestos — Tema claro
   Paleta:
   - Fondo principal:    #f7f3ec  (crema cálido)
   - Superficie tarjeta: #ffffff
   - Acento beige DMC:   #c9b89a
   - Acento oscuro:      #1a1a1f  (texto fuerte / botones primarios)
   - Texto principal:    #2b2a28
   - Texto secundario:   #7a766e
   - Borde sutil:        #e6dfd1
*/
:root{
  --bg:#f7f3ec;
  --bg-2:#efe8d9;
  --beige:#c9b89a;
  --beige-2:#b09f7e;
  --beige-soft:#e9dec5;
  --dark:#1a1a1f;
  --text:#2b2a28;
  --muted:#7a766e;
  --surface:#ffffff;
  --surface-2:#fbf7ee;
  --border:#e6dfd1;
  --border-soft:#efe8d9;
  --danger:#c44b4b;
  --danger-bg:#fbe7e7;
  --ok:#5a8f5e;
  --radius:16px;
  --radius-sm:12px;
  --shadow-sm:0 1px 2px rgba(60,40,10,.04), 0 1px 3px rgba(60,40,10,.06);
  --shadow:0 4px 14px rgba(60,40,10,.07), 0 2px 5px rgba(60,40,10,.05);
  --shadow-lg:0 10px 30px rgba(60,40,10,.10), 0 4px 10px rgba(60,40,10,.06);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%;background:var(--bg);color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,sans-serif;
  -webkit-tap-highlight-color:transparent;overscroll-behavior:none;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

#app{min-height:100dvh;display:flex;flex-direction:column}

/* ============ SPLASH ============ */
.splash{position:fixed;inset:0;background:
  radial-gradient(circle at 30% 20%, #fff8ec 0%, var(--bg) 45%, var(--bg-2) 100%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  z-index:1000;transition:opacity .45s ease}
.splash.hide{opacity:0;pointer-events:none}

.splash .stage{perspective:900px;display:flex;align-items:center;justify-content:center}
.splash img{width:60%;max-width:260px;height:auto;
  border-radius:18px;
  box-shadow:
    0 18px 40px rgba(40,28,8,.18),
    0 6px 14px rgba(40,28,8,.10);
  transform-style:preserve-3d;
  animation:logo3d 3.6s ease-in-out infinite;
  will-change:transform}
.splash .ver{margin-top:24px;font-size:11px;color:var(--muted);letter-spacing:.18em;
  text-transform:uppercase;font-weight:600}

@keyframes logo3d{
  0%   { transform: rotateY(  0deg) scale(1.00); }
  25%  { transform: rotateY( 18deg) scale(1.04); }
  50%  { transform: rotateY(  0deg) scale(1.07); }
  75%  { transform: rotateY(-18deg) scale(1.04); }
  100% { transform: rotateY(  0deg) scale(1.00); }
}

/* ============ HEADER ============ */
header.topbar{position:sticky;top:0;z-index:50;background:rgba(247,243,236,.85);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);padding:12px 16px;
  display:flex;align-items:center;gap:10px}
header.topbar .back{background:var(--surface);border:1px solid var(--border);color:var(--dark);
  font-size:18px;width:36px;height:36px;cursor:pointer;border-radius:10px;
  display:flex;align-items:center;justify-content:center;padding:0;font-weight:600;
  box-shadow:var(--shadow-sm);flex-shrink:0;font-family:inherit;line-height:1}
header.topbar .back:active{background:var(--surface-2)}
header.topbar .back.home{font-size:19px;background:var(--beige-soft);border-color:var(--beige);color:var(--dark)}
header.topbar .back.home:active{background:#dfd2b3}
header.topbar h1{flex:1;margin:0;font-size:16px;font-weight:700;letter-spacing:-.01em;color:var(--dark);min-width:0}
header.topbar .sub{font-size:11px;color:var(--muted);font-weight:500;display:block;margin-top:1px}
header.topbar .ver-tag{font-size:10px;color:var(--muted);background:var(--surface);
  padding:5px 10px;border-radius:999px;border:1px solid var(--border);font-weight:600}

/* ============ MAIN ============ */
main{flex:1;padding:18px 16px 110px;max-width:760px;width:100%;margin:0 auto}

/* ============ ADMIN GEAR ============ */
.admin-gear{position:fixed;top:max(14px, env(safe-area-inset-top));right:14px;
  width:42px;height:42px;border-radius:50%;
  background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-sm);
  font-size:18px;cursor:pointer;z-index:40;font-family:inherit;
  display:flex;align-items:center;justify-content:center;padding:0;
  transition:transform .15s ease, background .15s ease}
.admin-gear:active{transform:scale(.92);background:var(--surface-2)}
.admin-gear:hover{border-color:var(--beige)}

/* ============ HOME ============ */
.home-logo{display:flex;flex-direction:column;align-items:center;margin:36px 0 40px;perspective:800px}
.home-logo img{width:200px;max-width:55%;height:auto;border-radius:14px;
  box-shadow:var(--shadow-lg);
  animation:logo3dSoft 6s ease-in-out infinite;
  will-change:transform}
.home-logo .tag{margin-top:14px;color:var(--muted);font-size:11px;letter-spacing:.22em;font-weight:700}

@keyframes logo3dSoft{
  0%,100% { transform: rotateY(  0deg); }
  50%     { transform: rotateY(  8deg); }
}

.home-actions{display:grid;gap:14px}

/* ============ INPUT INVÁLIDO (medida excedida) ============ */
.form-row input.invalid,
input.dim-input.invalid{
  border-color:var(--danger) !important;
  background:var(--danger-bg) !important;
  color:var(--danger);
  box-shadow:0 0 0 3px rgba(196,75,75,.15) !important;
  font-weight:700;
}
.form-row input.invalid:focus{
  box-shadow:0 0 0 3px rgba(196,75,75,.25) !important;
}

/* Botón deshabilitado */
.btn-primary.disabled, .btn-primary:disabled{
  background:#cdc4b5 !important;
  color:#fff8 !important;
  cursor:not-allowed !important;
  box-shadow:none !important;
  transform:none !important;
}

/* ============ BUTTONS ============ */
.btn-primary,.btn-secondary,.btn-ghost,.btn-danger{
  width:100%;padding:18px 18px;border-radius:var(--radius);
  font-size:16px;font-weight:600;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:10px;
  border:none;transition:transform .08s ease,background .15s ease,box-shadow .15s ease;
  font-family:inherit}
.btn-primary{background:var(--dark);color:#f7f3ec;box-shadow:var(--shadow)}
.btn-primary:active{transform:scale(.985);background:#2d2d34}
.btn-secondary{background:var(--surface);color:var(--text);border:1px solid var(--border);box-shadow:var(--shadow-sm)}
.btn-secondary:active{background:var(--surface-2);transform:scale(.985)}
.btn-ghost{background:var(--beige-soft);color:var(--dark);border:1px solid var(--beige);font-weight:600}
.btn-ghost:active{background:#dfd2b3;transform:scale(.985)}
.btn-danger{background:var(--danger-bg);color:var(--danger);border:1px solid #f3c8c8}
.btn-danger:active{background:#f7d6d6}

/* ============ CATEGORY CARDS ============ */
.cat-grid{display:grid;gap:14px;grid-template-columns:1fr 1fr;margin-top:8px}
@media(max-width:420px){.cat-grid{grid-template-columns:1fr 1fr}}
.cat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:20px 16px;display:flex;flex-direction:column;gap:6px;cursor:pointer;
  position:relative;overflow:hidden;min-height:128px;box-shadow:var(--shadow-sm);
  transition:transform .12s ease, box-shadow .15s ease, border-color .15s ease}
.cat-card:active{transform:translateY(1px);box-shadow:var(--shadow-sm)}
.cat-card:hover{border-color:var(--beige);box-shadow:var(--shadow)}
.cat-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--beige);
  border-radius:var(--radius) 0 0 var(--radius)}
.cat-card .icon{font-size:28px;line-height:1}
.cat-card .name{font-size:15px;font-weight:700;color:var(--dark);letter-spacing:-.01em}
.cat-card .meta{font-size:11px;color:var(--muted);font-weight:500}
.cat-card .corner{position:absolute;top:10px;right:12px;font-size:10px;color:var(--muted);
  background:var(--bg-2);padding:3px 9px;border-radius:999px;font-weight:700;letter-spacing:.04em}

/* ============ LIST ROWS ============ */
.list{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.row{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:14px 14px;display:flex;align-items:center;gap:12px;cursor:pointer;box-shadow:var(--shadow-sm);
  transition:border-color .12s ease, transform .08s ease}
.row:active{background:var(--surface-2);transform:scale(.995)}
.row:hover{border-color:var(--beige)}
.row .text{flex:1;min-width:0}
.row .text .t1{font-size:14px;font-weight:600;color:var(--dark);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .text .t2{font-size:12px;color:var(--muted);margin-top:3px}
.row .price{font-weight:700;color:var(--dark);font-size:14px;white-space:nowrap;
  background:var(--beige-soft);padding:5px 10px;border-radius:8px}
.row .arrow{color:var(--muted);font-size:18px;margin-left:2px;font-weight:600}

/* ============ SEARCH ============ */
.search{position:relative;margin-bottom:12px}
.search input{width:100%;padding:14px 14px 14px 42px;border-radius:var(--radius-sm);
  border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:14px;outline:none;
  font-family:inherit;box-shadow:var(--shadow-sm)}
.search input:focus{border-color:var(--beige);box-shadow:0 0 0 3px rgba(201,184,154,.18)}
.search::before{content:"🔍";position:absolute;left:14px;top:50%;transform:translateY(-50%);
  font-size:14px;opacity:.55}

/* ============ FILTROS (medidas) ============ */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px;align-items:flex-end}
.filters .filter{flex:1;min-width:90px;display:flex;flex-direction:column;gap:4px}
.filters .filter label{font-size:10px;color:var(--muted);text-transform:uppercase;
  letter-spacing:.1em;font-weight:700;padding-left:2px}
.filters .filter select{
  width:100%;padding:11px 32px 11px 12px;background:var(--surface);color:var(--dark);
  border:1px solid var(--border);border-radius:10px;font-size:14px;font-weight:600;
  font-family:inherit;outline:none;box-shadow:var(--shadow-sm);
  appearance:none;-webkit-appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%237a766e' d='M6 8L0 0h12z'/></svg>");
  background-repeat:no-repeat;background-position:right 10px center;background-size:10px}
.filters .filter select:focus{border-color:var(--beige);box-shadow:0 0 0 3px rgba(201,184,154,.18)}
.filter-clear{align-self:stretch;background:var(--bg-2);color:var(--dark);
  border:1px solid var(--border);border-radius:10px;padding:0 14px;
  font-size:12px;font-weight:600;cursor:pointer;height:42px;font-family:inherit}
.filter-clear:active{background:var(--beige-soft)}

/* ============ DETAIL / EDIT ============ */
.detail-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:18px;margin-bottom:14px;box-shadow:var(--shadow-sm)}
.detail-card .label{font-size:10px;color:var(--muted);letter-spacing:.12em;text-transform:uppercase;
  font-weight:700;margin-bottom:5px}
.detail-card .value{font-size:16px;color:var(--dark);font-weight:600}
.detail-card .price-big{color:var(--dark);font-size:30px;font-weight:800;margin-top:10px;letter-spacing:-.02em}
.detail-card .price-sub{color:var(--muted);font-size:12px;margin-top:2px}

.form-row{display:grid;gap:6px;margin-bottom:14px}
.form-row label{font-size:12px;color:var(--dark);font-weight:600}
.form-row input,.form-row select,.form-row textarea{
  width:100%;padding:13px 14px;background:var(--surface);color:var(--text);
  border:1px solid var(--border);border-radius:var(--radius-sm);font-size:15px;outline:none;
  font-family:inherit;box-shadow:var(--shadow-sm)}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{
  border-color:var(--beige);box-shadow:0 0 0 3px rgba(201,184,154,.18)}
.form-row .hint{font-size:11px;color:var(--muted);margin-top:2px}
.form-row .hint.err{color:var(--danger);font-weight:600}
.dims-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}

/* ============ LINE ITEMS ============ */
.line-item{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:12px 14px;margin-bottom:8px;display:flex;align-items:center;gap:10px;box-shadow:var(--shadow-sm)}
.line-item .li-text{flex:1;min-width:0}
.line-item .li-text .t1{font-size:14px;font-weight:600;color:var(--dark)}
.line-item .li-text .t2{font-size:11px;color:var(--muted);margin-top:3px}
.line-item .li-text .badge{display:inline-block;background:var(--beige-soft);color:var(--dark);
  padding:2px 7px;border-radius:5px;font-size:10px;margin-right:5px;font-weight:700;letter-spacing:.04em}
.line-item .li-price{text-align:right;white-space:nowrap}
.line-item .li-price .p1{font-weight:700;color:var(--dark);font-size:14px}
.line-item .li-price .p2{font-size:11px;color:var(--muted)}
.line-item .li-rm{background:transparent;border:none;color:var(--danger);
  font-size:18px;cursor:pointer;padding:4px 8px;border-radius:6px;font-weight:600}
.line-item .li-rm:active{background:var(--danger-bg)}
.line-item .li-text{cursor:pointer;padding:2px 0;border-radius:6px;transition:background .12s ease}
.line-item .li-text:active{background:var(--bg-2)}
.edit-hint{display:inline-block;margin-left:6px;color:var(--beige-2);font-size:10px;font-weight:600;opacity:.7}

.qty-pill{display:flex;align-items:center;gap:0;border:1px solid var(--border);
  border-radius:10px;overflow:hidden;background:var(--bg-2)}
.qty-pill button{background:transparent;color:var(--dark);border:none;width:30px;height:30px;
  cursor:pointer;font-size:14px;font-weight:700}
.qty-pill button:active{background:var(--beige-soft)}
.qty-pill .q{min-width:26px;text-align:center;font-size:13px;font-weight:700;padding:0 4px;color:var(--dark)}

/* ============ TOTALS PANEL ============ */
.totals{background:linear-gradient(180deg, var(--surface) 0%, var(--surface-2) 100%);
  border:1px solid var(--border);border-radius:var(--radius);
  padding:16px 18px;margin-top:16px;box-shadow:var(--shadow-sm)}
.totals .ln{display:flex;justify-content:space-between;padding:6px 0;font-size:14px;color:var(--muted);font-weight:500}
.totals .ln.total{border-top:2px solid var(--beige);margin-top:8px;padding-top:12px;
  color:var(--dark);font-size:20px;font-weight:800;letter-spacing:-.01em}
.totals .ln.total .v{color:var(--dark)}

/* ============ EMPTY / INFO ============ */
.empty{text-align:center;color:var(--muted);padding:50px 20px}
.empty .ico{font-size:48px;margin-bottom:14px;opacity:.45}
.empty .t{font-size:15px;margin-bottom:6px;color:var(--dark);font-weight:600}
.empty .d{font-size:13px}

.section-title{font-size:10px;color:var(--muted);text-transform:uppercase;
  letter-spacing:.14em;margin:20px 0 10px;padding-left:4px;font-weight:700}

/* ============ MODAL ============ */
.modal-backdrop{position:fixed;inset:0;background:rgba(30,22,10,.45);z-index:100;
  display:flex;align-items:flex-end;justify-content:center;animation:fadeIn .2s ease;
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.modal{background:var(--surface);width:100%;max-width:540px;border-radius:var(--radius) var(--radius) 0 0;
  padding:20px;max-height:88dvh;overflow-y:auto;animation:slideUp .25s ease;
  padding-bottom:max(20px,env(safe-area-inset-bottom));box-shadow:var(--shadow-lg)}
@media(min-width:540px){.modal-backdrop{align-items:center}
  .modal{border-radius:var(--radius);max-height:80dvh}}
.modal h2{margin:0 0 14px;font-size:18px;font-weight:700;color:var(--dark)}
.modal .actions{display:flex;gap:10px;margin-top:14px}
.modal .actions button{flex:1}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideUp{from{transform:translateY(40px)}to{transform:translateY(0)}}

/* ============ TOAST ============ */
.toast{position:fixed;bottom:90px;left:50%;transform:translateX(-50%);
  background:var(--dark);color:var(--bg);padding:12px 20px;border-radius:999px;
  font-size:13px;font-weight:600;z-index:200;box-shadow:var(--shadow-lg);
  animation:fadeIn .2s ease}

/* ============ HISTORIAL ============ */
.hist-row{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:14px;margin-bottom:10px;cursor:pointer;box-shadow:var(--shadow-sm);
  border-left:4px solid var(--beige);transition:border-color .12s ease}
.hist-row:active{background:var(--surface-2)}
.hist-row:hover{border-left-color:var(--beige-2)}
.hist-row .t1{font-size:14px;font-weight:700;color:var(--dark)}
.hist-row .t2{font-size:12px;color:var(--muted);margin-top:3px}
.hist-row .ft{display:flex;justify-content:space-between;align-items:center;margin-top:10px}
.hist-row .ft .price{font-weight:800;color:var(--dark);font-size:16px}
.hist-row .ft .lines{font-size:11px;color:var(--muted);font-weight:600}

/* ============ FOOTER MINI ============ */
.foot{text-align:center;color:var(--muted);font-size:11px;padding:22px 0 8px;line-height:1.6}
.foot a{color:var(--dark);text-decoration:none;font-weight:600}

/* ============ GESTOR DE CATÁLOGO (ADMIN) ============ */
.cat-mgr{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:14px;margin-bottom:14px;box-shadow:var(--shadow-sm)}
.cat-mgr-head{display:flex;align-items:center;gap:12px;margin-bottom:10px;padding-bottom:10px;
  border-bottom:1px solid var(--border-soft)}
.cat-mgr-icon{font-size:22px;width:38px;height:38px;border-radius:10px;background:var(--beige-soft);
  display:flex;align-items:center;justify-content:center;flex-shrink:0}
.cat-mgr-title .t1{font-size:15px;font-weight:700;color:var(--dark)}
.cat-mgr-title .t2{font-size:11px;color:var(--muted);margin-top:2px;font-weight:500}

.model-row{display:flex;align-items:center;gap:8px;padding:8px 4px;border-bottom:1px solid var(--border-soft)}
.model-row:last-of-type{border-bottom:none}
.model-row .text{flex:1;min-width:0;margin-right:4px}
.model-row .text .t1{font-size:13.5px;font-weight:600;color:var(--dark);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.model-row .text .t2{font-size:10.5px;color:var(--muted);margin-top:1px}

.btn-mini{background:var(--bg-2);color:var(--dark);border:1px solid var(--border);
  border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:600;cursor:pointer;
  font-family:inherit;white-space:nowrap}
.btn-mini:active{background:var(--beige-soft)}
.btn-mini-danger{background:var(--danger-bg);color:var(--danger);border-color:#f3c8c8}
.btn-mini-danger:active{background:#f7d6d6}

.btn-add-model{width:100%;margin-top:10px;background:transparent;color:var(--beige-2);
  border:1.5px dashed var(--beige);border-radius:var(--radius-sm);padding:11px 14px;
  font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
.btn-add-model:active{background:var(--beige-soft);color:var(--dark)}

/* ============ CARRITO FLOTANTE ============ */
.floating-cart{
  position:fixed; left:16px; right:16px;
  bottom:max(16px, env(safe-area-inset-bottom));
  max-width:520px; margin:0 auto;
  background:var(--dark); color:#f7f3ec;
  border:none; border-radius:14px;
  padding:14px 18px;
  display:flex; align-items:center; gap:14px;
  box-shadow:0 10px 30px rgba(40,28,8,.30), 0 4px 12px rgba(40,28,8,.20);
  cursor:pointer; font-family:inherit;
  z-index:30;
  animation:cartIn .25s ease;
  transition:transform .08s ease;
}
.floating-cart:active{transform:scale(.98)}
.floating-cart .fc-icon{
  font-size:22px; line-height:1;
  background:var(--beige); color:var(--dark);
  width:38px; height:38px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.floating-cart .fc-text{flex:1; text-align:left; display:flex; flex-direction:column; gap:1px}
.floating-cart .fc-count{font-size:11px; opacity:.7; letter-spacing:.08em; text-transform:uppercase; font-weight:600}
.floating-cart .fc-total{font-size:16px; font-weight:800; color:var(--beige); letter-spacing:-.01em}
.floating-cart .fc-arrow{font-size:22px; opacity:.6; font-weight:600}
@keyframes cartIn{
  from{transform:translateY(80px); opacity:0}
  to{transform:translateY(0); opacity:1}
}
/* Padding extra abajo cuando el carrito está visible para que no tape contenido */
main:has(~ .floating-cart){padding-bottom:120px}

/* ====================================================================
   v3.0.0 — Login, Roles, Mensajes, Notificaciones, Gestión
   ==================================================================== */

/* Login */
.login-wrap {
  min-height: 100vh; display: flex; flex-direction: column;
  align-items: center; justify-content: center; padding: 24px;
  background: var(--bg);
}
.login-card {
  width: 100%; max-width: 380px; background: #fff;
  border-radius: 18px; padding: 28px 24px;
  box-shadow: 0 6px 30px rgba(0,0,0,.08);
}
.login-card .logo-row { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.login-card .logo-row img { width: 48px; height: 48px; border-radius: 10px; }
.login-card h1 { font-size: 22px; margin: 0; color: var(--dark); }
.login-card .sub { color: var(--muted); font-size: 13px; margin-top: 2px; }
.login-card .form-row + .form-row { margin-top: 12px; }
.login-card input[type="text"], .login-card input[type="password"] {
  width: 100%; padding: 13px 14px; border-radius: 10px;
  border: 1px solid #e6dfd0; background: #fafafa; font-size: 15px;
}
.login-card input[type="text"]:focus, .login-card input[type="password"]:focus {
  outline: none; border-color: var(--dark); background: #fff;
}
.login-card .check-row {
  display: flex; align-items: center; gap: 8px;
  font-size: 13.5px; color: #555; margin-top: 12px;
}
.login-card .login-error {
  background: rgba(220,53,69,.08); border: 1px solid rgba(220,53,69,.25);
  color: #a02323; padding: 9px 12px; border-radius: 10px;
  font-size: 13px; margin-top: 12px;
}
.login-card .actions { margin-top: 18px; }
.login-card .actions .btn-primary { width: 100%; padding: 14px 18px; font-size: 15px; }
.login-card .foot {
  text-align: center; font-size: 11px; color: #999; margin-top: 18px;
}

/* Topbar role + user + bell */
.topbar .user-block {
  margin-left: auto; display: flex; align-items: center; gap: 10px;
}
.topbar .user-tag {
  font-size: 11.5px; color: var(--muted); display: flex; flex-direction: column; align-items: flex-end;
}
.topbar .user-tag b { color: var(--dark); font-size: 13px; }
.topbar .user-tag .role { font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.5px; }
.topbar .role.admin { color: #a86d28; }
.topbar .role.cliente { color: #4a6e9d; }

.bell-btn {
  position: relative; width: 34px; height: 34px; border-radius: 50%;
  background: var(--beige-soft); border: none; display: grid; place-items: center;
  cursor: pointer; font-size: 16px;
}
.bell-btn .bell-badge {
  position: absolute; top: -2px; right: -2px;
  background: #d93838; color: #fff; border-radius: 9px;
  min-width: 16px; height: 16px; padding: 0 4px;
  font-size: 10px; font-weight: 800; display: grid; place-items: center;
}

/* Gestión: tarjetas grandes para acciones admin */
.admin-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px;
}
@media (min-width: 700px) { .admin-grid { grid-template-columns: 1fr 1fr 1fr; } }
.admin-card {
  background: #fff; border-radius: 12px; padding: 16px; cursor: pointer;
  box-shadow: 0 2px 12px rgba(0,0,0,.04); border: 1px solid #ece2ce;
  display: flex; gap: 10px; align-items: flex-start;
}
.admin-card .ico { font-size: 22px; }
.admin-card .t1 { font-weight: 700; color: var(--dark); }
.admin-card .t2 { font-size: 12px; color: var(--muted); margin-top: 2px; }

/* Estado del presupuesto */
.estado-chip {
  display: inline-block; font-size: 11px; padding: 3px 8px; border-radius: 999px;
  font-weight: 700; text-transform: uppercase; letter-spacing: .3px;
}
.estado-chip.borrador  { background: #ecebe6; color: #555; }
.estado-chip.enviado   { background: #e6f0fb; color: #1f5a99; }
.estado-chip.aceptado  { background: #e2f3e6; color: #2c7e3d; }
.estado-chip.rechazado { background: #fbe6e6; color: #a02323; }

/* Notif center / mensajes */
.notif-list, .msg-list { display: grid; gap: 8px; }
.notif-item, .msg-item {
  background: #fff; border-radius: 10px; padding: 12px 14px;
  border: 1px solid #ece2ce; cursor: pointer;
  display: flex; gap: 10px; align-items: center;
}
.notif-item.unread, .msg-item.unread { background: #fffaf0; border-color: #f0d896; }
.notif-item .ico, .msg-item .ico { font-size: 18px; }
.notif-item .t1, .msg-item .t1 { font-weight: 600; color: var(--dark); }
.notif-item .t2, .msg-item .t2 { font-size: 12px; color: var(--muted); margin-top: 2px; }
.notif-item .when, .msg-item .when {
  margin-left: auto; font-size: 11px; color: #999;
}

/* Tabla simple de logs/usuarios */
.t-grid {
  width: 100%; border-collapse: collapse; font-size: 13px;
  background: #fff; border-radius: 10px; overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,.04);
}
.t-grid th, .t-grid td { padding: 9px 12px; text-align: left; border-bottom: 1px solid #f0e9d8; }
.t-grid thead th { background: var(--beige-soft); font-size: 11px; text-transform: uppercase; letter-spacing: .3px; color: #6a553a; }
.t-grid tbody tr:hover { background: #fafaf0; }
.t-grid .right { text-align: right; }
.t-grid .center { text-align: center; }
.t-grid .actions-cell button {
  font-size: 11.5px; padding: 4px 9px; border-radius: 7px;
  background: transparent; border: 1px solid #ddd; cursor: pointer; margin-right: 4px;
}
.t-grid .actions-cell button:hover { background: #f5f1e6; }

/* Composer de mensaje */
.compose textarea {
  width: 100%; min-height: 90px; border-radius: 10px;
  border: 1px solid #e0d9c6; padding: 10px 12px; font-family: inherit; font-size: 14px;
  background: #fafafa;
}
.compose .row-inline { display: flex; gap: 8px; align-items: center; }
.compose select, .compose input[type="text"] {
  flex: 1; padding: 10px 12px; border-radius: 10px; border: 1px solid #e0d9c6;
  font-size: 14px;
}

/* Hint info */
.box-info {
  background: #fffaf0; border: 1px solid #f0d896; color: #6a4a14;
  padding: 12px; border-radius: 10px; font-size: 13px; margin: 12px 0;
}
.box-warn {
  background: #fff0f0; border: 1px solid #f0b6b6; color: #802626;
  padding: 12px; border-radius: 10px; font-size: 13px; margin: 12px 0;
}

/* ============ BARRA NAV RÁPIDA (catálogo) ============ */
.nav-quick{display:flex;gap:10px;padding:10px 16px 0;max-width:760px;margin:0 auto;width:100%;box-sizing:border-box}
.nav-quick-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;
  height:44px;border-radius:12px;cursor:pointer;font-family:inherit;font-size:14px;font-weight:700;
  background:var(--surface);border:1px solid var(--border);color:var(--dark);box-shadow:var(--shadow-sm)}
.nav-quick-btn:active{background:var(--surface-2)}
.nav-quick-btn.fam{background:var(--beige-soft);border-color:var(--beige);color:var(--dark)}
.nav-quick-btn.fam:active{background:#dfd2b3}