/* Estilos de las funciones añadidas sobre el sistema original (login,
   usuario, carga al servidor, edición, historial, usuarios). Usan las
   variables de tema de app.css. Las reglas de tablas se limitan a
   .vista-nueva y al modal para no alterar las pantallas originales. */

.acceso-overlay[hidden], [data-min-role][hidden]{display:none !important;}

.login-form{display:flex; flex-direction:column; gap:8px; margin:6px 0 4px; text-align:left;}
.login-form label{font-size:.8rem; color:var(--text-dim); font-weight:600;}
.login-form input{
  padding:11px 13px; border-radius:var(--radius-sm); border:1px solid var(--border-strong);
  background:var(--panel); color:var(--text); font-size:.95rem; font-family:inherit;
}
.login-form input:focus{outline:2px solid var(--purple); outline-offset:1px;}
.login-form .acceso-btn{margin-top:10px;}
.login-form .acceso-btn[disabled]{opacity:.6; cursor:wait;}
.login-error{color:var(--danger); font-size:.85rem; margin:2px 0 0;}

.user-chip{display:flex; align-items:center; gap:8px; font-size:.8rem; color:var(--text-dim); white-space:nowrap;}
.user-chip .btn{padding:6px 10px; font-size:.78rem;}
@media (max-width: 900px){ .user-chip #userLabel{display:none;} }

.vista-nueva .num, .app-modal .num{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap;}
.vista-nueva .table-wrap td:not(.num), .app-modal .table-wrap td:not(.num){white-space:normal;}
.row-click{cursor:pointer;}
.row-click:hover td{background:var(--panel-hover);}

.app-modal{position:fixed; inset:0; z-index:200; background:rgba(0,0,0,.55); display:flex; align-items:center; justify-content:center; padding:16px;}
.app-modal[hidden]{display:none;}
.app-modal-card{width:min(1000px, 100%); max-height:88vh; overflow:auto; background:var(--modal-bg);}
.app-modal-head{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px;}
.app-modal-head h3{margin:0;}
.detalle-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:10px 18px; margin-bottom:16px;}
.detalle-grid div{font-size:.85rem;}
.detalle-grid span{display:block; font-size:.72rem; color:var(--text-faint); text-transform:uppercase; letter-spacing:.04em;}

.flujo-board{display:grid; grid-template-columns:repeat(5, minmax(220px, 1fr)); gap:14px; overflow-x:auto; padding-bottom:6px;}
.flujo-col{background:var(--panel); border:1px solid var(--border); border-radius:var(--radius-md); padding:12px; min-height:200px;}
.flujo-col-head{display:flex; justify-content:space-between; align-items:center; font-weight:700; font-size:.88rem; margin-bottom:10px; padding-bottom:8px; border-bottom:2px solid var(--accent, var(--border));}
.flujo-card{background:var(--bg); border:1px solid var(--border); border-radius:var(--radius-sm); padding:10px; margin-bottom:8px; cursor:pointer; font-size:.8rem;}
.flujo-card:hover{border-color:var(--border-strong);}
.flujo-card strong{display:block; font-size:.84rem; margin-bottom:4px;}
.flujo-card .meta{color:var(--text-faint); display:flex; justify-content:space-between; gap:6px; margin-top:6px;}
.hito-chips{display:flex; flex-wrap:wrap; gap:6px; margin:14px 0;}
.hito-chip{border:1px solid var(--border); background:var(--panel); color:var(--text-dim); border-radius:999px; padding:4px 10px; font-size:.75rem; cursor:pointer; font-family:inherit;}
.hito-chip.active{background:var(--gradient); color:#fff; border-color:transparent;}

.upload-result{margin-top:12px; font-size:.85rem;}
.upload-result.ok{color:var(--success);}
.upload-result.err{color:var(--danger);}
.dropzone.dragover{border-color:var(--purple); background:rgba(124,108,255,.08);}
.dropzone.has-file .dz-file{color:var(--text); font-weight:600;}

.app-toast-wrap{position:fixed; right:18px; bottom:18px; z-index:300; display:flex; flex-direction:column; gap:8px;}
.app-toast{background:var(--modal-bg); border:1px solid var(--border-strong); border-left:4px solid var(--purple); color:var(--text); padding:10px 14px; border-radius:10px; box-shadow:var(--shadow-lg); font-size:.85rem; max-width:360px;}
.app-toast.ok{border-left-color:var(--success);}
.app-toast.err{border-left-color:var(--danger);}

.marca-manual{color:var(--amber); font-weight:700; cursor:help;}
.editor-nota{font-size:.82rem; color:var(--text-dim);}
.editor-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:12px 16px; margin-top:12px;}
.editor-grid .filter-select{width:100%;}
.editor-ancho{grid-column:1 / -1;}
.editor-liberar{font-size:.74rem; color:var(--text-dim); display:flex; align-items:center; gap:6px; margin-top:4px; text-transform:none; letter-spacing:0;}
.editor-acciones{grid-column:1 / -1; display:flex; justify-content:flex-end; gap:10px;}
.btn-mini{padding:4px 9px; font-size:.75rem;}
.modulos-check{display:flex; gap:14px; flex-wrap:wrap; margin:10px 0 4px; font-size:.85rem;}
.modulos-check label{display:flex; align-items:center; gap:6px; cursor:pointer;}
.preview-box{margin-top:12px; font-size:.85rem;}
.preview-box table{font-size:.8rem;}

.form-inline{display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end;}
.form-inline .filter-field input{min-width:180px;}