@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('/vendor/fonts/inter-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url('/vendor/fonts/inter-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('/vendor/fonts/inter-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url('/vendor/fonts/inter-latin-700-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 800; font-display: swap; src: url('/vendor/fonts/inter-latin-800-normal.woff2') format('woff2'); }

:root {
  /* Misma paleta navy + dorado que el resto de los sistemas del estudio
     (ver la nota en fideicomiso-app/public/style.css) — refuerza que este es un sistema más
     de la misma familia apenas se entra. */
  --navy: #101d3a;
  --navy-deep: #0a1428;
  --accent: #b5924c;
  --accent-2: #d8bd85;
  --bg: #f7f7f9;
  --radius: 14px;
  --shadow-soft: 0 4px 16px rgba(16,29,58,0.08);
  --shadow-hover: 0 10px 28px rgba(16,29,58,0.16);
  --rojo: #b02a37;
  --naranja: #c9691a;
  --amarillo: #a5860a;
  --verde: #2f6f4f;
}
* { font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; }
body { background: var(--bg); animation: fadeIn .35s ease; }
@keyframes fadeIn { from { opacity:0; transform: translateY(6px); } to { opacity:1; transform: translateY(0); } }
.app-navbar { background: var(--navy); box-shadow: 0 2px 12px rgba(0,0,0,.12); }
.app-navbar .nav-link { transition: color .15s ease; border-radius: 6px; }
.app-navbar .nav-link:hover { color: #fff !important; }
.brand-link { transition: opacity .15s; display:flex; align-items:center; }
.brand-link:hover { opacity: .85; }
.card { border: none; box-shadow: var(--shadow-soft); border-radius: var(--radius); transition: transform .18s ease, box-shadow .18s ease; }
.stat-card { border-left: 4px solid var(--accent); }
a.stat-card, .stat-card.hover-lift { cursor: pointer; text-decoration:none; color:inherit; display:block; }
.hover-lift:hover, a.card:hover, .stat-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); }
.table thead { background: var(--navy); color: #fff; }
.btn { border-radius: 8px; transition: transform .12s ease, box-shadow .12s ease, background .15s ease; }
.btn-primary { background: var(--accent); border-color: var(--accent); }
.btn-primary:hover { background: var(--navy); border-color: var(--navy); transform: translateY(-1px); box-shadow: 0 6px 14px rgba(181,146,76,.35); }
.btn:active { transform: translateY(0); }
.login-wrap { min-height: 100vh; display:flex; align-items:center; justify-content:center; background: linear-gradient(135deg, var(--navy-deep), var(--navy) 60%, var(--accent)); background-size: 200% 200%; animation: gradientShift 12s ease infinite; position: relative; overflow: hidden; }
@keyframes gradientShift { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
.login-card { max-width: 420px; width: 100%; animation: fadeIn .5s ease; position: relative; z-index: 1; }
.login-logo { max-width: 200px; max-height: 90px; object-fit: contain; }
.nav-logo { height: 36px; max-width: 160px; object-fit: contain; background:#fff; border-radius:6px; padding:3px 6px; margin-right:8px; }
.empty-state { text-align:center; padding: 2rem 1rem; color:#8592a6; }
.empty-state svg { width: 72px; height: 72px; opacity: .5; margin-bottom: .5rem; }
.volver-atras { display:inline-flex; align-items:center; gap:4px; color:#7a8699; font-size:.85rem; text-decoration:none; margin-bottom:.75rem; transition: color .15s, transform .15s; }
.volver-atras:hover { color: var(--navy); transform: translateX(-2px); }

.stat-tile { border-radius: var(--radius); padding:1.1rem 1.3rem; background:#fff; box-shadow: var(--shadow-soft); }
.stat-tile .stat-label { font-size:.78rem; color:#7a8699; text-transform:uppercase; letter-spacing:.03em; font-weight:600; }
.stat-tile .stat-num { font-size:2rem; font-weight:800; color: var(--navy); line-height:1.1; }
.stat-tile.tono-rojo { border-left: 5px solid var(--rojo); }
.stat-tile.tono-rojo .stat-num { color: var(--rojo); }
.stat-tile.tono-naranja { border-left: 5px solid var(--naranja); }
.stat-tile.tono-naranja .stat-num { color: var(--naranja); }
.stat-tile.tono-amarillo { border-left: 5px solid var(--amarillo); }
.stat-tile.tono-amarillo .stat-num { color: var(--amarillo); }
.stat-tile.tono-verde { border-left: 5px solid var(--verde); }
.stat-tile.tono-navy { border-left: 5px solid var(--navy); }

/* Clasificación visual de vencimientos (services/vencimientos.js#clasificar) — mismo código
   de colores en toda la app: tabla, ficha de cliente, calendario, resumen del dashboard. */
.venc-pill { display:inline-flex; align-items:center; gap:5px; padding:.22rem .6rem; border-radius:20px; font-size:.72rem; font-weight:700; white-space:nowrap; }
.venc-pill.vencido { background:#f8d7da; color:#842029; }
.venc-pill.hoy { background:#ffe5cc; color:#7a3e05; }
.venc-pill.proximo { background:#fff3cd; color:#7f6000; }
.venc-pill.futuro { background:#e9ecef; color:#495057; }
.venc-pill.presentado { background:#d1e7dd; color:#0f5132; }
.venc-tipo-dot { display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:5px; flex-shrink:0; }
.venc-item-borde { border-left: 4px solid #e9ecef; }
.venc-item-borde.vencido { border-left-color: var(--rojo); }
.venc-item-borde.hoy { border-left-color: var(--naranja); }
.venc-item-borde.proximo { border-left-color: var(--amarillo); }

.estado-chip { display:inline-flex; align-items:center; gap:6px; padding:.25rem .65rem; border-radius:20px; font-size:.75rem; font-weight:700; }
.estado-chip.pendiente { background:#fff3cd; color:#7f6000; }
.estado-chip.en_proceso { background:#cfe2ff; color:#084298; }
.estado-chip.presentado, .estado-chip.cumplida, .estado-chip.activo { background:#d1e7dd; color:#0f5132; }
.estado-chip.vencida { background:#f8d7da; color:#842029; }
.estado-chip.baja { background:#e9ecef; color:#495057; }

.prioridad-dot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:5px; }
.prioridad-alta { background: var(--rojo); }
.prioridad-media { background: var(--amarillo); }
.prioridad-baja { background:#adb5bd; }

/* Advertencia sobre vencimientos con fecha auto-generada aproximada (ver
   regimenes_obligacion.confianza / vencimientos.fecha_estimada en services/regimenes.js) —
   pedido explícito: nunca mostrar una fecha auto-generada como si fuera 100% segura sin serlo. */
.badge-verificar { display:inline-flex; align-items:center; gap:3px; padding:.05rem .45rem; border-radius:12px; font-size:.66rem; font-weight:700; background:#fff3cd; color:#7f6000; margin-left:4px; white-space:nowrap; }

/* Nivel de confianza de un régimen en el checklist de la ficha de cliente y en Admin → Regímenes. */
.badge-confianza { display:inline-flex; align-items:center; padding:.05rem .45rem; border-radius:12px; font-size:.66rem; font-weight:700; margin-left:6px; white-space:nowrap; }
.badge-confianza.alta { background:#d1e7dd; color:#0f5132; }
.badge-confianza.estimada { background:#fff3cd; color:#7f6000; }
.badge-confianza.sin_datos { background:#e9ecef; color:#495057; }

.regimen-item { border-bottom: 1px solid #f0f1f4; }
.regimen-item:last-child { border-bottom: none; }

/* Barra de grado de avance de una tarea (tareas.grado_avance, 0-100). */
.avance-barra { height:6px; border-radius:4px; background:#e9ecef; overflow:hidden; }
.avance-barra-relleno { height:100%; background: var(--accent); border-radius:4px; }

/* --- Calendario mensual de vencimientos --- */
.calendario-mes { border-collapse: separate; border-spacing: 6px; width:100%; table-layout: fixed; }
.calendario-mes th { text-align:center; font-size:.75rem; color:#7a8699; text-transform:uppercase; font-weight:700; padding-bottom:4px; }
.calendario-celda { vertical-align: top; background:#fff; border-radius:10px; box-shadow: var(--shadow-soft); padding:6px; height:96px; overflow:hidden; position:relative; }
.calendario-celda.vacia { background:transparent; box-shadow:none; }
.calendario-celda.hoy-celda { outline: 2px solid var(--accent); }
.calendario-dia-num { font-size:.78rem; font-weight:700; color:#495057; }
.calendario-celda.hoy-celda .calendario-dia-num { color: var(--accent); }
.calendario-item { display:block; font-size:.66rem; padding:1px 5px; border-radius:5px; margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#fff; text-decoration:none; }
.calendario-mas { font-size:.66rem; color:#7a8699; }

/* --- Grilla de tipos de obligación (Admin → Tipos) --- */
.tipo-color-swatch { display:inline-block; width:20px; height:20px; border-radius:5px; vertical-align:middle; border:1px solid rgba(0,0,0,.1); }

@media (max-width: 576px) {
  .hero-banner { padding: 1.1rem !important; }
  .card { border-radius: 10px; }
  .stat-tile { padding:.8rem 1rem; }
  .stat-tile .stat-num { font-size: 1.4rem !important; }
  .btn-sm { padding:.28rem .55rem; font-size:.78rem; }
  .table-responsive { -webkit-overflow-scrolling: touch; }
  .calendario-celda { height:72px; padding:4px; }
  .calendario-item { font-size:.6rem; }
}