:root{
  --bg-primary:#FAF6EE;--bg-card:#FFFFFF;--bg-alt:#F3EDDD;
  --text-primary:#1A1A1A;--text-muted:#6B6455;
  --gold:#C6A664;--gold-dark:#9C7A3C;
  --border:#E7DCC0;--black-accent:#1A1A1A;
  --error:#B3432B;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg-primary);color:var(--text-primary);font-family:'Inter',sans-serif;line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:'Playfair Display',serif;font-weight:700}
a{color:inherit}

.portal-nav{background:var(--black-accent);padding:16px 6%;display:flex;align-items:center;justify-content:space-between}
.portal-nav .marca{font-family:'Playfair Display',serif;color:var(--gold);font-size:16px;letter-spacing:.03em;text-decoration:none}
.portal-nav .acciones{display:flex;gap:10px;align-items:center}
.portal-nav button, .portal-nav .btn-link{background:none;border:1px solid rgba(198,166,100,.4);color:rgba(250,246,238,.85);padding:8px 16px;border-radius:6px;font-size:13px;cursor:pointer;font-family:inherit;text-decoration:none}
.portal-nav button:hover, .portal-nav .btn-link:hover{border-color:var(--gold);color:var(--gold)}

.portal-centro{min-height:calc(100vh - 66px);display:flex;align-items:center;justify-content:center;padding:40px 6%}
.portal-card{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:40px 36px;max-width:400px;width:100%;box-shadow:0 20px 50px rgba(26,26,26,.08)}
.portal-card .label{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:10px;display:block}
.portal-card h1{font-size:24px;margin-bottom:24px}
.portal-card h1.centro{text-align:center}

.campo{margin-bottom:18px}
.campo label{display:block;font-size:13px;color:var(--text-muted);margin-bottom:6px}
.campo input{width:100%;padding:11px 14px;border:1px solid var(--border);border-radius:8px;font-size:14px;font-family:inherit;background:var(--bg-primary);color:var(--text-primary)}
.campo input:focus{outline:none;border-color:var(--gold)}

.campo-password{position:relative}
.campo-password input{padding-right:44px}
.btn-ver-password{position:absolute;right:4px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;font-size:16px;padding:8px;line-height:1;opacity:.5;filter:grayscale(1)}
.btn-ver-password:hover{opacity:.8}
.btn-ver-password.activo{opacity:1;filter:none}

.link-olvide{display:block;text-align:center;margin-top:16px;font-size:13px;color:var(--text-muted);text-decoration:none}
.link-olvide:hover{color:var(--gold-dark)}

.btn-dorado{width:100%;background:var(--gold);color:var(--black-accent);border:none;padding:13px 20px;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;font-family:inherit;transition:background .2s}
.btn-dorado:hover{background:var(--gold-dark)}
.btn-dorado:disabled{opacity:.6;cursor:default}

.mensaje-error{background:rgba(179,67,43,.08);border:1px solid rgba(179,67,43,.25);color:var(--error);font-size:13px;padding:10px 14px;border-radius:8px;margin-bottom:16px;display:none}
.mensaje-error.activo{display:block}

.selector-grid{display:grid;grid-template-columns:1fr;gap:14px;max-width:420px;width:100%}
.selector-card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:22px 24px;text-align:left;cursor:pointer;font-family:inherit;box-shadow:0 2px 12px rgba(26,26,26,.05);transition:transform .15s,box-shadow .15s}
.selector-card:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(26,26,26,.1)}
.selector-card .nombre{font-family:'Playfair Display',serif;font-size:18px;color:var(--text-primary);font-weight:700;margin-bottom:4px}
.selector-card .meta{font-size:12px;color:var(--text-muted)}
.selector-card.activa{border-color:var(--gold-dark);box-shadow:0 0 0 1px var(--gold-dark) inset}
.selector-card.activa .meta{color:var(--gold-dark);font-weight:600}

.portal-wrap{max-width:1080px;margin:0 auto;padding:40px 6%}
.bienvenida{margin-bottom:32px}
.bienvenida .label{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:8px;display:block}
.bienvenida h1{font-size:28px}

.proximamente-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.proximamente-card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:22px;opacity:.7;text-decoration:none;display:block;color:inherit;transition:transform .15s,box-shadow .15s,opacity .15s}
.proximamente-card.activa{opacity:1;cursor:pointer;box-shadow:0 2px 12px rgba(26,26,26,.05)}
.proximamente-card.activa:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(26,26,26,.1)}
.proximamente-card h3{font-size:15px;margin-bottom:6px;color:var(--text-primary)}
.proximamente-card p{font-size:13px;color:var(--text-muted)}
.proximamente-card .tag{display:inline-block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-dark);border:1px solid var(--border);border-radius:20px;padding:3px 10px;margin-bottom:10px}
.proximamente-card .tag.lista{color:#4A7A5E;border-color:rgba(74,122,94,.3)}

.aviso-caja{background:rgba(198,166,100,.1);border:1px solid rgba(198,166,100,.3);color:var(--text-primary);font-size:12px;padding:10px 14px;border-radius:8px;margin-bottom:16px}

/* SUB-NAV de secciones dentro del portal */
.subnav{display:flex;gap:8px;margin-bottom:28px;flex-wrap:wrap}
.subnav a{font-size:13px;padding:8px 16px;border-radius:20px;border:1px solid var(--border);text-decoration:none;color:var(--text-muted)}
.subnav a:hover{border-color:var(--gold-dark);color:var(--gold-dark)}
.subnav a.activo{background:var(--black-accent);border-color:var(--black-accent);color:var(--gold)}

/* ENCABEZADO DE SECCION + boton de accion */
.seccion-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:12px;flex-wrap:wrap}
.seccion-header h1{font-size:24px}
.btn-dorado.ancho-auto{width:auto;padding:11px 22px}

/* TABLA */
.tabla-wrap{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;overflow-x:auto;-webkit-overflow-scrolling:touch;box-shadow:0 2px 12px rgba(26,26,26,.04)}
table.tabla{width:100%;border-collapse:collapse;font-size:14px}
table.tabla th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);padding:12px 18px;border-bottom:1px solid var(--border);background:var(--bg-alt);white-space:nowrap}
table.tabla td{padding:14px 18px;border-bottom:1px solid var(--border);vertical-align:middle}
table.tabla tr:last-child td{border-bottom:none}
table.tabla .nombre-celda{font-weight:600;color:var(--text-primary)}
table.tabla .meta-celda{font-size:12px;color:var(--text-muted)}
.tabla-vacio{padding:40px 18px;text-align:center;color:var(--text-muted);font-size:14px}

/* Filas clicables: toda la fila abre el formulario de edición (antes solo un
   botón al final de la tabla, invisible en celular sin hacer scroll horizontal). */
table.tabla tr.fila-clicable{cursor:pointer}
table.tabla tr.fila-clicable:hover{background:var(--bg-alt)}
table.tabla tr.fila-clicable:active{background:var(--border)}
.icono-editar{margin-left:6px;opacity:.5;font-size:12px}

.badge{display:inline-block;font-size:11px;padding:3px 10px;border-radius:20px;font-weight:600}
.badge.activo{background:rgba(74,122,94,.12);color:#3D6650}
.badge.inactivo{background:rgba(107,100,85,.12);color:var(--text-muted)}
.badge.con-foto{background:rgba(74,122,94,.12);color:#3D6650}
.badge.sin-foto{background:rgba(154,122,60,.14);color:var(--gold-dark)}

.btn-secundario{background:none;border:1px solid var(--border);color:var(--text-primary);padding:7px 14px;border-radius:6px;font-size:12px;cursor:pointer;font-family:inherit}
.btn-secundario:hover{border-color:var(--gold-dark);color:var(--gold-dark)}

/* MODAL de formulario (crear/editar) */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(26,26,26,.55);z-index:200;align-items:flex-start;justify-content:center;padding:40px 20px;overflow-y:auto}
.modal-overlay.activo{display:flex}
.modal-box{background:var(--bg-card);border-radius:14px;max-width:520px;width:100%;padding:32px 32px 28px;box-shadow:0 20px 60px rgba(26,26,26,.3)}
.modal-box h2{font-size:20px;margin-bottom:22px}
.modal-cerrar{float:right;background:none;border:none;font-size:22px;color:var(--text-muted);cursor:pointer}

.campo textarea{width:100%;padding:11px 14px;border:1px solid var(--border);border-radius:8px;font-size:14px;font-family:inherit;background:var(--bg-primary);color:var(--text-primary);resize:vertical;min-height:70px}
.campo textarea:focus, .campo select:focus{outline:none;border-color:var(--gold)}
.campo select{width:100%;padding:11px 14px;border:1px solid var(--border);border-radius:8px;font-size:14px;font-family:inherit;background:var(--bg-primary);color:var(--text-primary)}
.campo-fila{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.campo-check{display:flex;align-items:center;gap:8px;margin-bottom:18px}
.campo-check input{width:auto}
.campo-check label{margin:0;font-size:14px;color:var(--text-primary)}
.campo small{display:block;color:var(--text-muted);font-size:12px;margin-top:4px}
.campo small.error{color:var(--error)}
.campo-foto-fila{display:flex;align-items:center;gap:12px;margin-top:8px}
.campo input[type="file"]{width:100%;padding:9px 10px;border:1px solid var(--border);border-radius:8px;font-size:13px;font-family:inherit;background:var(--bg-primary);color:var(--text-primary)}

.acciones-form{display:flex;gap:10px;margin-top:24px}
.acciones-form .btn-dorado{flex:1}
.acciones-form .btn-secundario{padding:13px 20px}

.foto-preview{width:64px;height:64px;object-fit:cover;border-radius:8px;border:1px solid var(--border);background:var(--bg-alt)}
.sin-foto{width:64px;height:64px;border-radius:8px;background:var(--bg-alt);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--text-muted);text-align:center}

/* Par de fotos antes/después (servicios) */
.campo-fotos-par{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.campo-fotos-par .campo-foto-fila{flex-direction:column;align-items:flex-start;gap:8px}
.campo-fotos-par .foto-preview{width:100%;height:110px}
@media(max-width:520px){.campo-fotos-par{grid-template-columns:1fr}}

.galeria-panel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px;margin:10px 0}
.galeria-panel-item{position:relative;width:100%;aspect-ratio:1;border-radius:8px;overflow:hidden;border:1px solid var(--border);background:var(--bg-alt)}
.galeria-panel-item img,.galeria-panel-item video{width:100%;height:100%;object-fit:cover;display:block}
.galeria-panel-borrar{position:absolute;top:2px;right:2px;width:20px;height:20px;border-radius:50%;border:none;background:rgba(26,26,26,.65);color:#fff;font-size:14px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.galeria-panel-borrar:hover{background:var(--error)}
.galeria-panel-vacio{font-size:13px;color:var(--text-muted);margin:8px 0}

/* VENTAS (mini punto de venta) */
.modal-box.ancho{max-width:640px}
.venta-categoria-titulo{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-dark);margin:20px 0 8px}
.venta-categoria-titulo:first-child{margin-top:0}
.venta-lista{max-height:230px;overflow-y:auto;border:1px solid var(--border);border-radius:10px}
.venta-lista-vacio{padding:14px;font-size:13px;color:var(--text-muted)}
.venta-item-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px solid var(--border)}
.venta-item-row:last-child{border-bottom:none}
.venta-item-row input[type="checkbox"]{width:auto;flex-shrink:0}
.venta-item-nombre{flex:1;font-size:13px;min-width:0}
.venta-item-precio{width:88px;padding:6px 8px;border:1px solid var(--border);border-radius:6px;font-size:13px;font-family:inherit}
.venta-item-precio:disabled,.venta-item-cantidad:disabled{background:var(--bg-alt);color:var(--text-muted)}
.venta-item-cantidad{width:52px;padding:6px 8px;border:1px solid var(--border);border-radius:6px;font-size:13px;font-family:inherit}
.venta-total-caja{display:flex;justify-content:space-between;align-items:center;background:var(--bg-alt);border-radius:10px;padding:14px 18px;margin-top:20px}
.venta-total-caja .etiqueta{font-size:13px;color:var(--text-muted)}
.venta-total-caja .monto{font-size:20px;font-family:'Playfair Display',serif;font-weight:700;color:var(--gold-dark)}
.venta-detalle-lista{font-size:12px;color:var(--text-muted)}
.btn-mini-borrar{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:16px;padding:4px 8px;line-height:1}
.btn-mini-borrar:hover{color:var(--error)}

/* ESTADISTICAS */
.mes-selector{display:flex;align-items:center;gap:10px;margin-bottom:24px}
.mes-selector input[type="month"]{padding:9px 12px;border:1px solid var(--border);border-radius:8px;font-size:14px;font-family:inherit;background:var(--bg-card);color:var(--text-primary)}
.stat-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-bottom:28px}
.stat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:20px 22px;box-shadow:0 2px 12px rgba(26,26,26,.04)}
.stat-card .etiqueta{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.stat-card .valor{font-size:26px;font-family:'Playfair Display',serif;font-weight:700;color:var(--text-primary);margin-top:8px}
.stat-card.total{background:var(--black-accent);border-color:var(--black-accent)}
.stat-card.total .etiqueta{color:rgba(250,246,238,.65)}
.stat-card.total .valor{color:var(--gold)}
.stat-sucursales{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:28px}
.stat-sucursal-chip{background:var(--bg-card);border:1px solid var(--border);border-radius:20px;padding:8px 16px;font-size:13px;display:flex;gap:8px;align-items:center}
.stat-sucursal-chip strong{color:var(--gold-dark)}

/* ASISTENTE CONVERSACIONAL (brief de Atlas, Fase 1) */
.chat-wrap{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;box-shadow:0 2px 12px rgba(26,26,26,.04);display:flex;flex-direction:column;height:calc(100vh - 230px);min-height:420px;overflow:hidden}
.chat-mensajes{flex:1;overflow-y:auto;padding:22px 24px;display:flex;flex-direction:column;gap:14px}
.chat-vacio{color:var(--text-muted);font-size:14px;text-align:center;margin:auto}

.msg{max-width:78%;padding:12px 16px;border-radius:14px;font-size:14px;line-height:1.5;white-space:pre-wrap;word-break:break-word}
.msg.usuario{align-self:flex-end;background:var(--black-accent);color:#FAF6EE;border-bottom-right-radius:4px}
.msg.bot{align-self:flex-start;background:var(--bg-alt);color:var(--text-primary);border-bottom-left-radius:4px}
.msg.sistema{align-self:center;background:none;color:var(--text-muted);font-size:12px;font-style:italic}
.msg-fotos{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.msg-fotos img{width:56px;height:56px;object-fit:cover;border-radius:8px;border:1px solid rgba(255,255,255,.2)}

.caja-confirmacion{align-self:flex-start;max-width:78%;background:#FFF;border:1px solid var(--gold);border-radius:14px;padding:14px 16px;font-size:14px}
.caja-confirmacion p{margin-bottom:12px;color:var(--text-primary)}
.caja-confirmacion .botones{display:flex;gap:10px}
.caja-confirmacion .btn-confirmar{background:var(--gold);color:var(--black-accent);border:none;padding:9px 18px;border-radius:8px;font-weight:600;font-size:13px;cursor:pointer;font-family:inherit}
.caja-confirmacion .btn-confirmar:hover{background:var(--gold-dark)}
.caja-confirmacion .btn-cancelar{background:none;border:1px solid var(--border);color:var(--text-muted);padding:9px 18px;border-radius:8px;font-size:13px;cursor:pointer;font-family:inherit}
.caja-confirmacion .btn-cancelar:hover{border-color:var(--error);color:var(--error)}
.caja-confirmacion.resuelta{opacity:.55;pointer-events:none}

.chat-escribiendo{align-self:flex-start;color:var(--text-muted);font-size:13px;font-style:italic}

.bandeja-fotos{display:flex;gap:8px;flex-wrap:wrap;padding:10px 24px 0}
.bandeja-item{position:relative;width:52px;height:52px}
.bandeja-item img{width:100%;height:100%;object-fit:cover;border-radius:8px;border:1px solid var(--border)}
.bandeja-item .quitar{position:absolute;top:-6px;right:-6px;width:18px;height:18px;border-radius:50%;border:none;background:var(--black-accent);color:#fff;font-size:11px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.bandeja-item .subiendo{position:absolute;inset:0;background:rgba(255,255,255,.7);display:flex;align-items:center;justify-content:center;font-size:9px;border-radius:8px}

.chat-input-bar{display:flex;align-items:flex-end;gap:8px;padding:14px 24px;border-top:1px solid var(--border);background:var(--bg-card)}
.chat-input-bar textarea{flex:1;resize:none;max-height:120px;padding:11px 14px;border:1px solid var(--border);border-radius:10px;font-size:14px;font-family:inherit;background:var(--bg-primary);color:var(--text-primary)}
.chat-input-bar textarea:focus{outline:none;border-color:var(--gold)}
.btn-icono{width:42px;height:42px;flex-shrink:0;border-radius:50%;border:1px solid var(--border);background:var(--bg-card);cursor:pointer;font-size:17px;display:flex;align-items:center;justify-content:center;font-family:inherit}
.btn-icono:hover{border-color:var(--gold-dark)}
.btn-icono.grabando{background:var(--error);border-color:var(--error);color:#fff;animation:pulso 1.2s infinite}
.btn-icono.enviar{background:var(--gold);border-color:var(--gold);color:var(--black-accent)}
.btn-icono.enviar:hover{background:var(--gold-dark)}
.btn-icono:disabled{opacity:.45;cursor:default}
@keyframes pulso{0%{box-shadow:0 0 0 0 rgba(179,67,43,.4)}70%{box-shadow:0 0 0 10px rgba(179,67,43,0)}100%{box-shadow:0 0 0 0 rgba(179,67,43,0)}}

.aviso-transcripcion{font-size:11px;color:var(--text-muted);padding:0 24px;margin-top:-6px}

/* Subtítulos en vivo mientras se graba (apoyo visual, Web Speech API del
   navegador — el texto final que de verdad se usa sale de Whisper al soltar) */
.captions-vivo{display:flex;align-items:flex-start;gap:8px;padding:10px 24px;font-size:13px;color:var(--text-primary);background:var(--bg-alt);border-top:1px solid var(--border)}
.captions-vivo .punto-grabando{width:8px;height:8px;border-radius:50%;background:var(--error);flex-shrink:0;margin-top:5px;animation:pulso 1.2s infinite}
.captions-vivo #texto-vivo{flex:1;font-style:italic;color:var(--text-muted)}

/* Alta masiva por Excel */
.alta-masiva-caja{background:var(--bg-alt);border:1px dashed var(--border);border-radius:10px;padding:14px 16px;margin-bottom:20px;font-size:13px}
.alta-masiva-caja .fila-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.tabla-preview-excel{margin-top:12px;max-height:220px;overflow-y:auto;border:1px solid var(--border);border-radius:8px}
.tabla-preview-excel table{width:100%;border-collapse:collapse;font-size:12px}
.tabla-preview-excel th,.tabla-preview-excel td{padding:7px 10px;border-bottom:1px solid var(--border);text-align:left}
.tabla-preview-excel th{background:var(--bg-card);text-transform:uppercase;font-size:10px;color:var(--text-muted)}
