/* ======================================================
   ESTILOS EXCLUSIVOS DEL PANEL DEL VENDEDOR (admin.html)
   ====================================================== */
:root{
  --bg:#FFFFFF;
  --c-reposteria:#F4DEE3; --c-reposteria-deep:#C98CA0;
  --c-spa:#DCEEE4; --c-spa-deep:#6FA98B;
  --c-sublimacion:#E4DEF6; --c-sublimacion-deep:#8F79C4;
  --c-velas:#F3E9D3; --c-velas-deep:#C29A4C;
}
/* ======================================================
   PALETAS DEL PANEL — acabados mate, tono "wealth management".
   Se activan con [data-theme] en <html>; "rosa" (Rosa Palo) es
   el valor por defecto y vive en :root de styles.css.
   ====================================================== */
[data-theme="azul"]{ --accent:#5C7A9E; --accent-deep:#3D5975; --accent-tint:#E9EEF3; --accent-rgb:92,122,158; }       /* Azul Ejecutivo */
[data-theme="morado"]{ --accent:#7C6A96; --accent-deep:#584A6E; --accent-tint:#EDE9F1; --accent-rgb:124,106,150; }    /* Morado Real */
[data-theme="verde"]{ --accent:#4F7A68; --accent-deep:#375A4B; --accent-tint:#E7EFEC; --accent-rgb:79,122,104; }      /* Verde Esmeralda */
[data-theme="luxury-beige"]{ --accent:#A9895C; --accent-deep:#7C6238; --accent-tint:#F3EDE1; --accent-rgb:169,137,92; --bg:#FBF7F0; --ink:#28241E; } /* Lino / Beige Dorado */
[data-theme="carbon"]{ --accent:#5B5754; --accent-deep:#38352F; --accent-tint:#ECEAE7; --accent-rgb:91,87,84; }       /* Carbón Minimalista */
[data-theme="terracota"]{ --accent:#B9714E; --accent-deep:#8A5138; --accent-tint:#F3E5DC; --accent-rgb:185,113,78; }  /* Naranja Terracota */
[data-theme="coral"]{ --accent:#BC5F52; --accent-deep:#8A423A; --accent-tint:#F4E2DE; --accent-rgb:188,95,82; }       /* Rojo Coral */
html{ transition: background-color .3s var(--ease); }
body{
  background:var(--bg);
  background-image:
    radial-gradient(circle at 8% 4%, rgba(var(--accent-rgb),0.06), transparent 42%),
    radial-gradient(circle at 92% 96%, rgba(143,121,196,0.06), transparent 42%);
  padding:40px 18px 70px;
}
.wrap{max-width:780px; margin:0 auto;}

header.top{display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:8px; flex-wrap:nowrap; gap:10px;}
.suscripcion-estado-pill{
  font-size:11.5px; font-weight:700; padding:6px 12px; border-radius:999px; white-space:nowrap; flex:none;
}
.suscripcion-estado-pill.prueba{ background:var(--accent-tint); color:var(--accent-deep); }
.suscripcion-estado-pill.activa{ background:#E6F5EC; color:#3B8A5C; }
.brand{display:flex; align-items:center; gap:14px; flex-wrap:wrap; row-gap:8px; min-width:0; flex:1 1 auto;}
.brand .badge{
  width:48px;height:48px;border-radius:50%; background:#FFFFFF; border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center; font-size:22px; box-shadow:var(--shadow-rest);
  background-size:cover; background-position:center; flex:none;
}
.brand h1{
  font-size:21px; font-weight:700; min-width:0;
  background:linear-gradient(120deg, #FFF6D0 0%, #D4AF37 50%, #F5B400 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
}
.btn-logout-visible{
  background:#fff; color:var(--danger); border:1px solid var(--danger); border-radius:var(--radius-sm);
  padding:9px 16px; font-family:'Inter'; font-weight:700; font-size:12.5px; cursor:pointer;
  transition:all .25s var(--ease); white-space:nowrap;
}
.btn-logout-visible:hover{ background:var(--danger); color:#fff; transform:translateY(-1px); }
.today{font-size:13px; color:var(--ink-soft); font-weight:600;}

/* ===================== MENÚ DE LA CUENTA (dropdown en la cabecera) ===================== */
.menu-cuenta-wrap{ position:relative; flex:none; }
.btn-menu-cuenta{
  width:38px; height:38px; border-radius:50%; border:1px solid var(--border); background:#fff;
  font-size:19px; font-weight:700; color:var(--ink-soft); cursor:pointer; display:flex;
  align-items:center; justify-content:center; transition:all .25s var(--ease); line-height:1; padding:0;
}
.btn-menu-cuenta:hover, .btn-menu-cuenta.abierto{ background:var(--accent-tint); border-color:var(--accent); color:var(--accent-deep); }

.menu-cuenta-dropdown{
  position:absolute; top:calc(100% + 10px); left:0; right:auto; z-index:200;
  width:270px; max-width:min(280px, calc(100vw - 32px));
  background:#fff; border-radius:var(--radius-lg); box-shadow:var(--shadow-hover); border:1px solid var(--border);
  padding:8px; display:none; flex-direction:column; gap:2px; animation:panelIn .2s var(--ease);
}
.menu-cuenta-dropdown.show{ display:flex; }

.menu-cuenta-fecha{ font-size:12px; color:var(--ink-soft); font-weight:600; padding:8px 12px 6px; border-bottom:1px solid var(--border); margin-bottom:4px; }

.menu-cuenta-heading{
  font-size:10.5px; font-weight:800; color:var(--ink-soft); text-transform:uppercase;
  letter-spacing:.06em; padding:10px 12px 4px;
}
.menu-cuenta-divider{ height:1px; background:var(--border); margin:6px 8px; }

.menu-cuenta-item{
  display:flex; flex-direction:column; align-items:flex-start; gap:2px; width:100%; text-align:left;
  background:none; border:none; border-radius:var(--radius-sm); padding:10px 12px;
  font-family:'Inter'; font-weight:700; font-size:13.5px; color:var(--ink); cursor:pointer;
  transition:background .2s var(--ease);
}
.menu-cuenta-item:hover{ background:var(--accent-tint); color:var(--accent-deep); }
.menu-cuenta-sub{ font-size:11px; font-weight:500; color:var(--ink-soft); word-break:break-all; }
.menu-cuenta-item:hover .menu-cuenta-sub{ color:var(--accent-deep); }

.menu-copiable-fila{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:10px 12px; border-radius:var(--radius-sm); margin-bottom:2px;
}
.menu-copiable-label{ font-size:13.5px; font-weight:700; color:var(--ink); }
.menu-copiable-btn{
  flex:none; background:#fff; color:var(--accent-deep); border:1px solid var(--accent); border-radius:999px;
  padding:6px 14px; font-family:'Inter'; font-size:12px; font-weight:700; cursor:pointer; transition:all .2s var(--ease);
}
.menu-copiable-btn:hover{ background:var(--accent); color:#fff; }
.menu-copiable-btn.copied{ background:var(--ok); border-color:var(--ok); color:#fff; }

.menu-cuenta-danger{ color:var(--danger); }
.menu-cuenta-danger:hover{ background:#FBEAE6; color:var(--danger); }
.menu-cuenta-item-fila{ display:flex; align-items:center; }
.notificacion-item{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; padding:10px 4px; border-bottom:1px solid var(--border); font-size:13px; cursor:pointer; border-radius:var(--radius-sm); transition:background .2s var(--ease); color:var(--ink-soft); }
.notificacion-item:last-child{ border-bottom:none; }
.notificacion-item:hover{ background:var(--accent-tint); }
.notificacion-item.sin-leer{ font-weight:700; color:var(--ink); }
.notificacion-hora{ font-size:11px; color:var(--ink-soft); white-space:nowrap; flex:none; font-weight:500; }

/* ===================== BANNER DE BIENVENIDA ===================== */
.banner-bienvenida{
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  background:var(--accent-tint); border:1px solid var(--accent); color:var(--accent-deep);
  border-radius:var(--radius-md); padding:14px 18px; font-size:13px; font-weight:600;
  margin-top:18px;
}
.banner-bienvenida button{
  background:none; border:none; color:var(--accent-deep); font-size:14px; cursor:pointer; padding:0 4px;
}
.banner-bienvenida-instalar{
  background:var(--accent) !important; color:#fff !important; border-radius:999px !important;
  padding:8px 16px !important; font-size:12.5px !important; font-weight:700 !important; white-space:nowrap;
  transition:transform .2s var(--ease);
}
.banner-bienvenida-instalar:hover{ transform:translateY(-1px); }

.tabs-wrap{
  position:relative; margin-bottom:28px; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-md); padding:8px; box-shadow:var(--shadow-rest);
}
.tabs{
  display:flex; gap:6px;
}
@media (min-width:640px){
  .tabs{ flex-wrap:wrap; }
  .tab-btn{ flex:none; padding:11px 16px; font-size:13.5px; }
}
.tab-btn{
  flex:1 1 0; min-width:0; border:1px solid transparent; background:transparent; color:var(--ink-soft);
  font-family:'Inter'; font-weight:700; font-size:clamp(10.5px, 3.1vw, 13.5px); padding:10px 4px; border-radius:var(--radius-sm); cursor:pointer;
  white-space:normal; word-break:break-word; line-height:1.25; text-align:center; transition: all .25s var(--ease);
}
.tab-btn:hover{ background:var(--accent-tint); color:var(--accent-deep); }
.tab-btn.active{background:var(--accent); border-color:var(--accent); color:#fff; box-shadow:0 6px 14px rgba(var(--accent-rgb),0.3);}
.tab-badge{
  display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 5px;
  margin-left:6px; border-radius:999px; background:var(--danger); color:#fff; font-size:10.5px; font-weight:800;
  vertical-align:middle; animation:tabBadgePulse 1.4s ease-in-out infinite;
}
@keyframes tabBadgePulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.15); } }

.panel{display:none; animation:panelIn .4s var(--ease);}
.panel.active{display:block;}

.section-title{font-size:23px; margin-bottom:6px; font-weight:700;}
.section-sub{color:var(--ink-soft); font-size:14.5px; margin:0 0 22px; line-height:1.5;}

.kpi-row{display:grid; grid-template-columns:1fr 1fr 1fr; gap:14px; margin-bottom:22px;}
.kpi{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); padding:18px 12px; text-align:center; box-shadow:var(--shadow-rest); transition:transform .3s var(--ease), box-shadow .3s var(--ease);}
.kpi:hover{ transform:translateY(-4px); box-shadow:var(--shadow-hover); }
.kpi .num{font-family:'Plus Jakarta Sans'; font-size:20px; font-weight:700;}
.kpi .lbl{font-size:11.5px; color:var(--ink-soft); font-weight:600; margin-top:2px;}
/* Colores intuitivos y consistentes en toda la app: naranja = requiere tu
   acción, azul = en trámite, verde = ya resuelto/completado. */
.kpi-accion{ background:#FDECD8; border-color:#F0D2A8; }
.kpi-accion .num{ color:#B7883A; }
.kpi-proceso{ background:#E9EEFA; border-color:#CDD8F2; }
.kpi-proceso .num{ color:#4C63A3; }
.kpi-completado{ background:#E6F5EC; border-color:#C3E6D2; }
.kpi-completado .num{ color:#3B8A5C; }

.primeros-pasos-card{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:20px 20px 6px; margin-bottom:22px; box-shadow:var(--shadow-rest);
}
.primeros-pasos-header{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.primeros-pasos-titulo-wrap{ display:flex; align-items:center; gap:9px; min-width:0; }
.primeros-pasos-titulo{
  font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; font-size:14.5px; color:var(--ink);
  white-space:nowrap; letter-spacing:-0.005em;
}
.primeros-pasos-contador{
  flex:none; font-family:'Plus Jakarta Sans',sans-serif; font-size:11px; font-weight:700; color:var(--accent-deep);
  background:var(--accent-tint); padding:3px 9px; border-radius:999px; font-variant-numeric:tabular-nums;
}
.primeros-pasos-cerrar{
  flex:none; background:none; border:none; color:var(--ink-soft); font-size:13px; cursor:pointer;
  width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  transition:all .2s var(--ease);
}
.primeros-pasos-cerrar:hover{ color:var(--ink); background:var(--bg); }

.primeros-pasos-barra{ height:4px; border-radius:999px; background:var(--border); overflow:hidden; margin-bottom:6px; }
.primeros-pasos-barra-fill{ height:100%; background:var(--accent); border-radius:999px; transition:width .5s var(--ease); }

.primeros-paso{
  display:flex; align-items:center; gap:12px; padding:12px 8px; margin:0 -8px; border-radius:var(--radius-sm);
  border-bottom:1px solid var(--border); cursor:pointer; transition:background .2s var(--ease), transform .1s var(--ease);
}
.primeros-paso:last-child{ border-bottom:none; }
.primeros-paso:hover{ background:var(--accent-tint); }
.primeros-paso:active{ transform:scale(0.99); }

.primeros-paso-check{
  flex:none; width:24px; height:24px; border-radius:50%; border:2px solid var(--border); display:flex;
  align-items:center; justify-content:center; font-size:13px; font-weight:800; color:transparent;
  transition:background .25s var(--ease), border-color .25s var(--ease);
}
.primeros-paso.done .primeros-paso-check{
  background:var(--ok); border-color:var(--ok); color:#fff; animation:primerosPasoPop .3s var(--ease);
}
@keyframes primerosPasoPop{ 0%{ transform:scale(0.7); } 60%{ transform:scale(1.15); } 100%{ transform:scale(1); } }

.primeros-paso-texto{ flex:1; min-width:0; }
.primeros-paso-titulo{ font-size:13.5px; font-weight:700; color:var(--ink); line-height:1.35; }
.primeros-paso.done .primeros-paso-titulo{ color:var(--ink-soft); text-decoration:line-through; text-decoration-color:var(--border); }
.primeros-paso-sub{ font-size:11.5px; color:var(--ink-soft); margin-top:2px; line-height:1.4; }
.primeros-paso.done .primeros-paso-sub{ display:none; }
.primeros-paso-flecha{ flex:none; color:var(--accent-deep); font-size:16px; font-weight:700; transition:transform .2s var(--ease); }
.primeros-paso:hover .primeros-paso-flecha{ transform:translateX(2px); }
.primeros-paso.done .primeros-paso-flecha{ visibility:hidden; }

@media (max-width:420px){
  .primeros-pasos-card{ padding:16px 16px 4px; }
  .primeros-paso{ padding:11px 6px; margin:0 -6px; gap:10px; }
  .primeros-paso-titulo{ font-size:13px; }
  .primeros-paso-sub{ font-size:11px; }
}

.banner-accion-urgente{
  display:flex; align-items:center; gap:14px; background:linear-gradient(135deg,#FFF3E0,#FDE8D0);
  border:1.5px solid #F0C48A; border-radius:var(--radius-lg); padding:18px 20px; margin-bottom:22px;
  box-shadow:var(--shadow-rest); cursor:pointer; transition:transform .25s var(--ease), box-shadow .25s var(--ease);
}
.banner-accion-urgente:hover{ transform:translateY(-2px); box-shadow:var(--shadow-hover); }
.banner-accion-icono{ font-size:30px; flex:none; line-height:1; }
.banner-accion-titulo{ font-family:'Plus Jakarta Sans'; font-size:17px; font-weight:800; color:#8A5A1F; letter-spacing:-0.01em; }
.banner-accion-sub{ font-size:12.5px; color:#9A7440; margin-top:2px; font-weight:600; }

.card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:22px; margin-bottom:16px; box-shadow:var(--shadow-rest); transition:transform .3s var(--ease), box-shadow .3s var(--ease);}
.card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-hover); }

.pedido-head{display:flex; justify-content:space-between; align-items:flex-start; gap:10px; margin-bottom:10px;}
.presu-toggle-icono{font-size:12px; color:var(--ink-soft); flex:none; align-self:center;}
.pedido-cliente{font-weight:700; font-size:16px;}
.pedido-detalle{font-size:13.5px; color:var(--ink-soft); margin:5px 0 12px; line-height:1.5;}
.pedido-contacto{ display:flex; gap:8px; flex-wrap:wrap; margin:-6px 0 12px; }
.pedido-contacto-item{ display:inline-flex; align-items:center; gap:5px; font-size:12.5px; font-weight:600; color:var(--ink-soft); }
.pedido-contacto-whatsapp{ color:#1F9C4C; text-decoration:none; background:#E6F5EC; padding:5px 10px; border-radius:999px; transition:all .2s var(--ease); }
.pedido-contacto-whatsapp:hover{ background:#25D366; color:#fff; }
.pedido-meta{font-size:13px; color:var(--ink-soft); display:flex; gap:16px; flex-wrap:wrap; margin-bottom:14px;}
.pedido-notas{font-size:12.5px; color:var(--ink-soft); background:var(--accent-tint); border-radius:var(--radius-sm); padding:10px 12px; margin:-2px 0 12px; line-height:1.5;}
.pedido-imagen-link{display:inline-block; font-size:12.5px; font-weight:700; color:var(--accent-deep); text-decoration:underline; margin-bottom:12px;}
.pedido-ganancia{font-size:12.5px; font-weight:700; margin:-6px 0 12px;}
.sector-tag{font-size:12px; font-weight:700; padding:6px 12px; border-radius:999px;}
.estado-badge{ font-size:12px; font-weight:700; padding:7px 12px; border-radius:999px; border:none; cursor:pointer; font-family:'Inter'; white-space:nowrap; }
.estado-Pendiente{background:#FBF3E5; color:#8A6A2B;}
.estado-Aceptado{background:#E9EEFA; color:#4C63A3;}
.estado-Enproceso{background:var(--accent-tint); color:var(--accent-deep);}
.estado-Entregado{background:#E6F5EC; color:#3B8A5C;}
.pedido-actions{display:flex; gap:10px; flex-wrap:wrap; align-items:center;}
.mini-btn{
  font-family:'Inter'; font-weight:700; font-size:12.5px; border-radius:var(--radius-sm); border:1px solid var(--border);
  background:#fff; padding:9px 14px; cursor:pointer; color:var(--ink); transition:all .25s var(--ease);
}
.mini-btn:hover{ transform:translateY(-2px); box-shadow:var(--shadow-rest); }
.mini-btn.paid{border-color:var(--ok); color:var(--ok);}
.precio{font-weight:700; font-size:14.5px;}

/* ===================== PRESUPUESTO ===================== */
.presupuesto-panel{margin-top:16px; padding-top:16px; border-top:1.5px dashed var(--border);}
.presupuesto-title{font-size:11.5px; font-weight:800; color:var(--ink-soft); margin-bottom:10px; text-transform:uppercase; letter-spacing:.04em;}
.presupuesto-line{display:flex; justify-content:space-between; font-size:12.5px; padding:5px 0; color:var(--ink-soft); gap:10px;}
.presupuesto-line span:last-child{color:var(--ink); font-weight:700; white-space:nowrap;}
.quitar-extra{background:none; border:none; color:var(--ink-soft); cursor:pointer; font-size:12px; margin-left:6px; padding:0;}
.quitar-extra:hover{ color:var(--danger); }
.presupuesto-form{display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; margin:14px 0 4px;}
.presupuesto-form div label{display:block; font-size:10.5px; font-weight:700; color:var(--ink-soft); margin-bottom:5px; text-transform:uppercase; letter-spacing:.02em;}
.presupuesto-form input{padding:10px; font-size:13px;}
.sugerido-box{
  background:var(--accent-tint); border-radius:var(--radius-sm); padding:12px 16px;
  display:flex; justify-content:space-between; align-items:center; font-size:13.5px; font-weight:700;
  color:var(--accent-deep); margin:12px 0;
}
.precio-final-row{margin-top:6px;}
.precio-final-row input{font-weight:700;}
.btn-aplicar{
  background:var(--accent-deep); color:#fff; border:none; border-radius:var(--radius-sm); padding:12px 16px;
  font-family:'Inter'; font-weight:700; font-size:12.5px; cursor:pointer; white-space:nowrap; transition:transform .2s var(--ease);
}
.btn-aplicar:hover{ transform:translateY(-2px); }
.btn-wa-pres{
  background:#3FBE73; color:#fff; border:none; border-radius:var(--radius-sm); padding:12px 16px;
  font-family:'Inter'; font-weight:700; font-size:12.5px; cursor:pointer; white-space:nowrap; transition:transform .2s var(--ease);
}
.btn-wa-pres:hover{ transform:translateY(-2px); }
.btn-cotizacion{
  background:#fff; color:var(--accent-deep); border:1px solid var(--accent); border-radius:var(--radius-sm); padding:11px 15px;
  font-family:'Inter'; font-weight:700; font-size:12.5px; cursor:pointer; white-space:nowrap; transition:all .2s var(--ease);
}
.btn-cotizacion:hover{ background:var(--accent-tint); transform:translateY(-2px); }
.btn-cotizacion:disabled{ opacity:.6; cursor:wait; transform:none; }
.reset-link{font-size:11px; color:var(--accent-deep); cursor:pointer; font-weight:700; margin-top:8px; display:inline-block; text-decoration:underline;}
.envio-badge{font-size:11.5px; font-weight:700; padding:6px 12px; border-radius:999px; margin-top:10px; display:inline-block;}
.envio-badge.enviado{background:#E9EEFA; color:#4C63A3;}
.envio-badge.aceptado{background:#E6F5EC; color:#3B8A5C;}
.envio-badge.rechazado{background:#FBEAE6; color:#B3492F;}
.envio-badge.ajustes{background:#FBF3E5; color:#8A6A2B;}
.nota-cliente-cotizacion{
  background:var(--accent-tint); color:var(--accent-deep); border-radius:var(--radius-sm);
  padding:10px 12px; margin-top:8px; font-size:12.5px; font-style:italic; line-height:1.5;
}
.abono-cliente-box{
  background:#fff; border:1px solid var(--border); border-radius:var(--radius-sm);
  padding:12px 14px; margin-top:10px; display:flex; flex-direction:column; gap:8px; font-size:12.5px;
}
.abono-cliente-linea{ color:var(--ink); }
.abono-cliente-box a{ color:var(--accent-deep); font-weight:600; }
.abono-sin-comprobante{ color:var(--ink-soft); }
.abono-validado-tag{ color:var(--ok); font-weight:700; }
.btn-aceptar{background:var(--ok); color:#fff; border:none; border-radius:var(--radius-sm); padding:12px 16px; font-family:'Inter'; font-weight:700; font-size:12.5px; cursor:pointer; transition:transform .2s var(--ease);}
.btn-aceptar:hover{ transform:translateY(-2px); }
.btn-rechazar{background:#fff; color:var(--danger); border:1px solid var(--danger); border-radius:var(--radius-sm); padding:11px 15px; font-family:'Inter'; font-weight:700; font-size:12.5px; cursor:pointer; transition:transform .2s var(--ease);}
.btn-rechazar:hover{ transform:translateY(-2px); background:#FBEAE6; }
.btn-eliminar{background:none; color:var(--ink-soft); border:1px solid var(--border); border-radius:var(--radius-sm); padding:9px 14px; font-family:'Inter'; font-weight:700; font-size:12.5px; cursor:pointer; transition:all .25s var(--ease);}
.btn-eliminar:hover{ border-color:var(--danger); color:var(--danger); }

/* ===================== CALENDARIO MENSUAL ===================== */
.calendar-widget{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:20px; box-shadow:var(--shadow-rest); margin-bottom:24px;
}
.calendar-header{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px;}
.calendar-header h3{font-size:16.5px; font-weight:700; text-transform:capitalize;}
.cal-nav-btn{
  width:34px; height:34px; border-radius:50%; border:1px solid var(--border); background:#fff;
  color:var(--ink-soft); font-size:14px; font-weight:700; cursor:pointer; padding:0;
  display:flex; align-items:center; justify-content:center; transition: all .25s var(--ease);
}
.cal-nav-btn:hover{ background:var(--accent-tint); border-color:var(--accent); color:var(--accent-deep); transform:translateY(-1px); }

.calendar-grid{display:grid; grid-template-columns:repeat(7, 1fr); gap:5px;}
.day-name{text-align:center; font-size:11px; font-weight:700; color:var(--ink-soft); padding-bottom:8px;}
.day{
  aspect-ratio:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  border-radius:var(--radius-sm); font-size:12.5px; font-weight:600; color:var(--ink);
  cursor:pointer; position:relative; transition: all .25s var(--ease); gap:3px;
}
.day.empty{ cursor:default; }
.day.number:hover{ background:var(--accent-tint); transform:translateY(-2px); }
.day.today{ border:1px solid var(--accent); font-weight:800; }
.day.selected{ background:var(--accent); color:#fff; box-shadow:0 8px 18px rgba(var(--accent-rgb),0.4); }
.dots{display:flex; gap:3px; min-height:6px;}
.dot{width:5.5px; height:5.5px; border-radius:50%;}
.dot-reposteria{background:var(--c-reposteria-deep);}
.dot-spa{background:var(--c-spa-deep);}
.dot-sublimacion{background:var(--c-sublimacion-deep);}
.dot-velas{background:var(--c-velas-deep);}
.day.selected .dot{ background:#fff; opacity:.85; }

.events-title{font-size:16px; font-weight:700; margin-bottom:14px;}
.date-group{margin-bottom:20px;}
.date-badge{
  display:inline-block; font-size:12px; font-weight:700; color:var(--accent-deep);
  background:var(--accent-tint); padding:6px 12px; border-radius:999px; margin-bottom:10px;
  text-transform:capitalize;
}
.event-card{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md);
  padding:14px 16px; margin-bottom:10px; display:flex; align-items:center; gap:14px;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease);
}
.event-card:hover{ transform:translateY(-2px); box-shadow:var(--shadow-hover); }
.event-time{font-weight:700; color:var(--accent-deep); font-size:13px; min-width:44px;}
.event-info{flex:1; min-width:0;}
.event-info strong{display:block; font-size:13.5px; font-weight:700;}
.event-info p{margin:3px 0 0; font-size:12.5px; color:var(--ink-soft); line-height:1.4;}

/* ===================== INVENTARIO ===================== */
.inversion-box{
  background:var(--accent-tint); border-radius:var(--radius-md); padding:16px 20px;
  display:flex; justify-content:space-between; align-items:center; margin-bottom:18px;
}
.inversion-box .lbl{font-size:12.5px; font-weight:700; color:var(--accent-deep);}
.inversion-box .num{font-size:21px; font-weight:700; color:var(--accent-deep); font-family:'Plus Jakarta Sans';}
.insumo-row{display:flex; align-items:center; justify-content:space-between; padding:13px 0; border-bottom:1px solid var(--border);}
.insumo-row:last-child{border-bottom:none;}
.insumo-nombre{font-weight:700; font-size:14px;}
.insumo-stock{font-size:13px; color:var(--ink-soft); margin-top:2px;}
.stock-bar{width:96px; height:8px; border-radius:5px; background:var(--border); overflow:hidden; margin-top:6px;}
.stock-fill{height:100%; background:var(--ok); transition:width .4s var(--ease);}
.stock-fill.low{background:var(--danger);}
.low-tag{font-size:11px; font-weight:700; color:var(--danger);}

/* ===================== FINANZAS ===================== */
.fin-mes-selector{display:flex; align-items:center; gap:10px; margin-bottom:16px; flex-wrap:wrap;}
.fin-mes-selector label{font-weight:700; font-size:12.5px; color:var(--ink-soft);}
.fin-mes-selector input[type=month]{width:auto; flex:none;}
.historial-mes-row{
  display:flex; justify-content:space-between; align-items:center; padding:12px 10px;
  border-bottom:1px solid var(--border); font-size:13.5px; cursor:pointer;
  border-radius:var(--radius-sm); transition:background .2s var(--ease);
}
.historial-mes-row:last-child{border-bottom:none;}
.historial-mes-row:hover{background:var(--accent-tint);}
.historial-mes-row.activo{background:var(--accent-tint); font-weight:700;}
.historial-mes-nombre{text-transform:capitalize;}
.historial-mes-neto{font-weight:700;}
.historial-vista-badge{font-size:11px; font-weight:700; color:var(--accent-deep); text-transform:none;}

.toggle-vista{display:flex; gap:10px; margin-bottom:14px;}
.toggle-vista button{
  flex:1; border:1px solid var(--border); background:#fff; border-radius:var(--radius-sm); padding:12px;
  font-weight:700; font-size:12.5px; cursor:pointer; color:var(--ink-soft);
  font-family:'Inter'; transition:all .25s var(--ease);
}
.toggle-vista button.activo{background:var(--accent); border-color:var(--accent); color:#fff;}
.ganancia-card{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:22px; box-shadow:var(--shadow-rest); margin-bottom:22px; text-align:center;
}
.ganancia-num{font-family:'Plus Jakarta Sans'; font-size:30px; font-weight:800;}
.ganancia-nota{font-size:12.5px; color:var(--ink-soft); margin-top:8px; line-height:1.5;}
.ganancia-bruta-box{
  background:var(--accent-tint); border-radius:var(--radius-md); padding:16px 20px;
  display:flex; justify-content:space-between; align-items:center; gap:14px; margin-bottom:18px; flex-wrap:wrap;
}
.ganancia-bruta-box .lbl{font-size:12.5px; font-weight:700; color:var(--accent-deep); line-height:1.5;}
.ganancia-bruta-box .lbl small{font-weight:600; opacity:.8;}
.ganancia-bruta-cifras{display:flex; flex-direction:column; align-items:flex-end; gap:2px;}
.ganancia-bruta-box .num{font-size:19px; font-weight:700; font-family:'Plus Jakarta Sans'; white-space:nowrap;}
.ganancia-bruta-box small{font-size:11px; font-weight:700; color:var(--accent-deep); opacity:.8; white-space:nowrap;}
.fin-form{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:18px;}
.fin-form .full{grid-column:1 / -1;}
input, select, textarea{
  width:100%; padding:13px 14px; font-size:14px;
}
.toggle-tipo{display:flex; gap:10px;}
.toggle-tipo button{flex:1; border:1px solid var(--border); background:#fff; border-radius:var(--radius-sm); padding:12px; font-weight:700; font-size:13.5px; cursor:pointer; color:var(--ink-soft); transition:all .25s var(--ease);}
.toggle-tipo button.on-ingreso{background:#E6F5EC; border-color:var(--ok); color:#3B8A5C;}
.toggle-tipo button.on-gasto{background:#FBEBE4; border-color:var(--danger); color:#B3492F;}
.tx-row{display:flex; justify-content:space-between; padding:11px 0; border-bottom:1px solid var(--border); font-size:13.5px;}
.tx-row:last-child{border-bottom:none;}
.tx-amt.ingreso{color:var(--ok); font-weight:700;}
.tx-amt.gasto{color:var(--danger); font-weight:700;}

/* ===================== CLIENTES ===================== */
.cliente-row{display:flex; justify-content:space-between; align-items:center; padding:13px 0; border-bottom:1px solid var(--border);}
.cliente-row:last-child{border-bottom:none;}
.cliente-nombre{font-weight:700; font-size:14px;}
.cliente-meta{font-size:12.5px; color:var(--ink-soft); margin-top:2px;}
.bday-input{width:130px; padding:8px 10px; font-size:12.5px;}

.btn-add{background:var(--accent); color:#fff; border:none; border-radius:var(--radius-sm); padding:14px 18px; font-family:'Inter'; font-weight:700; font-size:14.5px; cursor:pointer; width:100%; margin-top:6px; box-shadow:0 10px 22px rgba(var(--accent-rgb),0.3); transition:transform .2s var(--ease);}
.btn-add:hover{ transform:translateY(-2px); }

/* ===================== NOTAS + VOZ ===================== */
.input-mic-row{display:flex; gap:10px; align-items:flex-start;}
.input-mic-row textarea, .input-mic-row input{flex:1;}
.mic-btn{
  width:46px; height:46px; border-radius:50%; border:1px solid var(--border); background:#fff;
  font-size:17px; cursor:pointer; flex:none; transition:all .25s var(--ease);
}
.mic-btn:hover{ border-color:var(--accent); background:var(--accent-tint); }
.mic-btn.listening{ background:#FBEBE4; border-color:var(--danger); animation:pulse 1.1s infinite; }
@keyframes pulse{ 0%{box-shadow:0 0 0 0 rgba(208,115,88,0.4);} 70%{box-shadow:0 0 0 10px rgba(208,115,88,0);} 100%{box-shadow:0 0 0 0 rgba(208,115,88,0);} }
.nota-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); padding:16px; margin-bottom:12px; position:relative;}
.nota-fecha{font-size:11px; color:var(--ink-soft); font-weight:700; margin-bottom:6px;}
.nota-texto{font-size:13.5px; line-height:1.55; white-space:pre-wrap; padding-right:26px;}
.nota-del{position:absolute; top:14px; right:14px; background:none; border:none; color:var(--ink-soft); cursor:pointer; font-size:14px;}
.nota-del:hover{ color:var(--danger); }

/* Modal genérico (.modal-overlay/.modal-card/.modal-close) vive en styles.css,
   compartido con index.html (modal de instalación en iOS). */
.logo-picker{
  width:80px; height:80px; border-radius:50%; border:2px dashed var(--border); display:flex; align-items:center;
  justify-content:center; cursor:pointer; margin:0 auto 22px; overflow:hidden; background:var(--accent-tint);
  font-size:24px; color:var(--accent-deep); transition:all .25s var(--ease);
}
.logo-picker:hover{ border-color:var(--accent); }
.logo-picker img{width:100%; height:100%; object-fit:cover;}
.field{margin-bottom:16px;}
.field label{display:block; font-weight:700; font-size:12.5px; margin-bottom:7px; color:var(--ink);}
.field .hint{font-weight:400; color:var(--ink-soft); font-size:12px; display:block; margin-top:6px; line-height:1.5;}
.sector-check-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:22px;}
.sector-check{
  border:1px solid var(--border); border-radius:var(--radius-sm); padding:12px; display:flex; align-items:center;
  gap:8px; cursor:pointer; font-size:13px; font-weight:700; color:var(--ink-soft); transition:all .2s var(--ease);
}
.sector-check.on{ border-color:var(--accent); background:var(--accent-tint); color:var(--accent-deep); }
.sector-check-otro{ grid-column:1 / -1; border-style:dashed; }
.sector-check-otro.on{ border-style:solid; }

/* ===================== LOGIN / REGISTRO ===================== */
.auth-screen{
  position:fixed; inset:0; background:#FFFFFF; z-index:2000; display:flex; align-items:center; justify-content:center;
  padding:20px; padding-bottom:150px; overflow-y:auto;
  --accent:#5C7A9E; --accent-deep:#3D5975; --accent-tint:#E9EEF3; --accent-rgb:92,122,158;
}
.auth-card{background:#fff; border-radius:var(--radius-lg); padding:36px 30px; max-width:380px; width:100%; box-shadow:var(--shadow-hover); text-align:center;}
.auth-card .logo-badge{width:52px; height:52px; margin:0 auto 18px; border-radius:50%; background:#FFFFFF; border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:24px; box-shadow:var(--shadow-rest);}
.auth-card h2{font-size:20px; margin-bottom:6px;}
.auth-card .sub{color:var(--ink-soft); font-size:13px; margin-bottom:22px; line-height:1.5;}
/* Barra fija al fondo de la pantalla de login, con los mismos botones
   "Descargar para Android/iOS" del pie de página (misma clase .btn-download,
   mismos íconos) — position:fixed la saca por completo del flex de
   .auth-screen (que centra la tarjeta), así nunca compite con ella ni
   aparece flotando al lado como pasaba antes. */
.auth-instalar-bar{
  position:fixed; left:50%; bottom:calc(16px + env(safe-area-inset-bottom)); transform:translateX(-50%);
  z-index:2001; display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:center;
  max-width:calc(100vw - 32px);
}
.paywall-card{ max-width:420px; }
.paywall-precio{ display:flex; align-items:baseline; justify-content:center; gap:6px; margin-bottom:18px; }
.paywall-precio-num{ font-size:36px; font-weight:800; font-family:'Plus Jakarta Sans',sans-serif; color:var(--accent-deep); }
.paywall-precio-periodo{ font-size:14px; color:var(--ink-soft); font-weight:600; }
.paywall-features{ list-style:none; margin:0 0 26px; padding:0; text-align:left; }
.paywall-features li{ font-size:13.5px; color:var(--ink); padding:8px 0; border-bottom:1px solid var(--border); }
.paywall-features li:last-child{ border-bottom:none; }

/* ===================== GUÍA RÁPIDA DE USO ===================== */
.modal-card-guia{ max-width:460px; text-align:left; padding:32px 28px 28px; }
.guia-header{ text-align:center; margin-bottom:10px; }
.guia-header-icono{ font-size:38px; line-height:1; margin-bottom:8px; }
.guia-header h2{ margin-bottom:4px; }
.guia-header .sub{ margin-bottom:0; }
.guia-pasos{ margin-top:10px; }
.guia-paso{ display:flex; gap:14px; align-items:flex-start; padding:14px 0; border-bottom:1px solid var(--border); }
.guia-paso:last-child{ border-bottom:none; }
.guia-paso-num{
  flex:none; width:26px; height:26px; border-radius:50%; background:var(--accent); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:12.5px; font-family:'Plus Jakarta Sans',sans-serif;
}
.guia-paso-icono{ flex:none; font-size:22px; line-height:1.3; }
.guia-paso-texto{ flex:1; min-width:0; }
.guia-paso-titulo{ font-weight:800; font-size:14px; margin-bottom:4px; font-family:'Plus Jakarta Sans',sans-serif; color:var(--ink); }
.guia-paso-texto p{ font-size:12.5px; color:var(--ink-soft); line-height:1.55; margin:0; }
.guia-paso-texto p strong{ color:var(--accent-deep); font-weight:700; }
.guia-manual .opciones-avanzadas{ margin-top:10px; }
.guia-lista{ list-style:none; margin:4px 0 2px; padding:0; display:flex; flex-direction:column; gap:10px; }
.guia-lista li{ font-size:12.5px; color:var(--ink-soft); line-height:1.55; padding-left:18px; position:relative; }
.guia-lista li::before{ content:"•"; position:absolute; left:2px; color:var(--accent); font-weight:800; }
.guia-lista li strong{ color:var(--ink); font-weight:700; }
.auth-card .field{text-align:left;}
.auth-error{color:var(--danger); font-size:12.5px; margin:-6px 0 14px; text-align:left;}
.auth-msg{color:var(--ok); font-size:12.5px; margin-top:14px; line-height:1.5;}
.auth-toggle{font-size:13px; color:var(--ink-soft); margin-top:18px;}
.auth-toggle span{color:var(--accent-deep); font-weight:700; cursor:pointer; text-decoration:underline;}
.btn-auth-secondary{
  background:#fff; color:var(--accent-deep); border:1px solid var(--accent);
  border-radius:var(--radius-sm); padding:16px 22px; font-family:'Inter'; font-weight:700; font-size:15px;
  cursor:pointer; transition: all .25s var(--ease);
}
.btn-auth-secondary:hover{
  background:var(--accent); color:#fff; transform:translateY(-2px);
  box-shadow:0 10px 22px rgba(var(--accent-rgb),0.3);
}
.color-picker-grid{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.theme-btn{
  display:flex; align-items:center; gap:9px;
  border:1px solid var(--border); background:#fff; border-radius:var(--radius-sm); padding:10px 14px;
  font-size:12.5px; font-weight:600; cursor:pointer; color:var(--ink-soft); font-family:'Inter';
  transition:all .2s var(--ease);
}
.theme-btn .swatch{ width:11px; height:11px; border-radius:50%; flex:none; box-shadow:0 0 0 2px rgba(255,255,255,0.6) inset; }
.theme-btn:hover{ border-color:var(--accent); transform:translateY(-1px); }
.theme-btn.active{ border-color:var(--accent); background:var(--accent-tint); color:var(--accent-deep); font-weight:700; }

/* ===================== MI TIENDA / CATÁLOGO ===================== */
.producto-card{
  display:flex; gap:14px; align-items:center; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:16px; margin-bottom:12px; box-shadow:var(--shadow-rest);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.producto-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-hover); }
.producto-foto{
  width:56px; height:56px; border-radius:14px; background:var(--accent-tint); flex:none;
  display:flex; align-items:center; justify-content:center; font-size:22px; background-size:cover; background-position:center;
}
.producto-info{flex:1; min-width:0;}
.producto-nombre{font-weight:700; font-size:14.5px;}
.producto-meta{font-size:12px; color:var(--ink-soft); margin-top:3px;}
.producto-acciones{display:flex; gap:8px; flex:none;}
.campo-chip{
  display:flex; justify-content:space-between; align-items:center; background:var(--accent-tint); color:var(--accent-deep);
  border-radius:var(--radius-sm); padding:9px 14px; margin-bottom:8px; font-size:12.5px; font-weight:700;
}
.campo-chip button{background:none; border:none; color:var(--accent-deep); cursor:pointer; font-size:14px; padding:0;}
.campo-chip-editar{cursor:pointer; border-radius:4px; padding:2px 4px; margin:-2px -4px; transition:background .2s var(--ease);}
.campo-chip-editar:hover{background:rgba(var(--accent-rgb),0.18);}
.btn-add-item-tienda{
  background:#fff; color:var(--accent-deep); border:1.5px dashed var(--accent); border-radius:var(--radius-sm);
  padding:12px; width:100%; font-weight:700; font-size:13px; cursor:pointer; font-family:'Inter'; transition:all .25s var(--ease);
}
.btn-add-item-tienda:hover{ background:var(--accent-tint); }
.entrega-opcion-row{
  display:flex; align-items:center; gap:12px; justify-content:space-between;
  border:1px solid var(--border); border-radius:var(--radius-sm); padding:10px 14px; margin-bottom:8px;
}
.entrega-opcion-row .field-checkbox{ flex:1; }
.entrega-opcion-row .field-checkbox span{ font-size:13px; font-weight:700; color:var(--ink); }
.entrega-opcion-row input[type="number"]{ width:130px; flex:none; }
/* ===================== OPCIONES AVANZADAS (acordeón) ===================== */
.opciones-avanzadas{ margin-top:18px; border:1px solid var(--border); border-radius:var(--radius-md); padding:0 14px; background:var(--surface); }
.opciones-avanzadas[open]{ padding-bottom:18px; }
.opciones-avanzadas summary{
  cursor:pointer; padding:14px 0; font-family:'Inter'; font-weight:700; font-size:13.5px; color:var(--ink);
  list-style:none; display:flex; align-items:center; gap:8px; flex-wrap:wrap;
}
.opciones-avanzadas summary::-webkit-details-marker{ display:none; }
.opciones-avanzadas summary::before{ content:"▸"; color:var(--accent-deep); font-size:11px; transition:transform .2s var(--ease); flex:none; }
.opciones-avanzadas[open] summary::before{ transform:rotate(90deg); }
.opciones-avanzadas-hint{ font-weight:500; font-size:11.5px; color:var(--ink-soft); }

.categoria-row{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md);
  padding:12px 16px; margin-bottom:10px;
}
.categoria-nombre{font-weight:700; font-size:13.5px;}
.categoria-acciones{display:flex; gap:8px;}

/* Fila de dos columnas usada en los formularios rápidos de Mi Tienda / Calendario */
.row-2-tienda{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
