:root { font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #1f2937; background: #f3f4f6; }
* { box-sizing: border-box; }
body { margin: 0; }
.topbar { background: #111827; color: white; padding: 22px 5vw; display: flex; justify-content: space-between; gap: 24px; align-items: center; }
.topbar h1 { margin: 0; font-size: 1.55rem; }
.topbar p { margin: 4px 0 0; color: #cbd5e1; }
.topbar nav { display: flex; gap: 12px; flex-wrap: wrap; }
.topbar a { color: white; text-decoration: none; padding: 9px 12px; border-radius: 8px; }
.topbar a:hover { background: #374151; }
.container { width: min(1680px, 96vw); margin: 24px auto; }
.hero, .panel, .stats article, .notice { background: white; border-radius: 16px; box-shadow: 0 10px 30px rgba(15, 23, 42, .06); }
.hero { padding: 34px; margin-bottom: 22px; }
.hero h2 { margin: 10px 0 8px; font-size: 2rem; }
.hero p { margin: 0; color: #64748b; }
.tag { display: inline-block; background: #ffedd5; color: #9a3412; padding: 6px 10px; border-radius: 999px; font-weight: 700; font-size: .8rem; }
.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-bottom: 22px; }
.stats article { padding: 22px; }
.stats span { display: block; color: #64748b; margin-bottom: 8px; }
.stats strong { font-size: 1.65rem; }
.ok { color: #15803d; }
.warning-text { color: #b45309; }
.danger-text { color: #b91c1c; }
.panel { padding: 26px; margin-bottom: 22px; }
.notice { padding: 18px 22px; margin-bottom: 22px; border-left: 5px solid #ea580c; }
.panel-heading, .month-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.month-heading { margin-bottom: 0; text-align: center; }
.panel-heading h2, .panel-heading h3, .month-heading h2 { margin: 0 0 5px; }
.panel-heading p, .month-heading p { margin: 0; color: #64748b; }
.button, button { background: #ea580c; color: white; border: 0; border-radius: 9px; padding: 11px 15px; font-weight: 700; text-decoration: none; cursor: pointer; }
button.secondary { background: #e2e8f0; color: #334155; padding: 8px 11px; }
.secondary-link { background: #e2e8f0; color: #334155; padding: 9px 12px; border-radius: 9px; text-decoration: none; font-weight: 700; }
.worker-form { display: grid; grid-template-columns: 2fr 1fr 1.6fr 1fr auto; gap: 14px; align-items: end; }
.inline-form { display: flex; align-items: center; gap: 8px; }
.inline-form input { width: 88px; }
label { display: grid; gap: 7px; font-size: .9rem; font-weight: 700; }
input, select { width: 100%; padding: 11px 12px; border: 1px solid #cbd5e1; border-radius: 9px; background: white; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 13px 12px; border-bottom: 1px solid #e2e8f0; white-space: nowrap; }
th { color: #475569; font-size: .82rem; text-transform: uppercase; }
td small { display: block; color: #64748b; margin-top: 4px; }
.status, .balance { display: inline-block; padding: 5px 9px; border-radius: 999px; font-size: .8rem; font-weight: 700; }
.status.active, .balance.zero { background: #dcfce7; color: #166534; }
.status.inactive, .balance.negative { background: #fee2e2; color: #991b1b; }
.status.warning, .balance.positive { background: #ffedd5; color: #9a3412; }
.status.pending { background: #fef3c7; color: #92400e; }
.row-warning { background: #fffaf0; }
.row-danger { background: #fff5f5; }
.empty { text-align: center; color: #64748b; padding: 30px; }
@media (max-width: 900px) {
  .topbar, .panel-heading, .month-heading { align-items: flex-start; flex-direction: column; text-align: left; }
  .stats { grid-template-columns: 1fr; }
  .worker-form { grid-template-columns: 1fr; }
}
.stats-four { grid-template-columns: repeat(4, 1fr); }
.absence-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; align-items: end; }
.absence-form .wide { grid-column: span 3; }
textarea { width: 100%; padding: 11px 12px; border: 1px solid #cbd5e1; border-radius: 9px; resize: vertical; font: inherit; }
.check { display: flex; grid-template-columns: auto 1fr; align-items: center; gap: 8px; padding-bottom: 10px; }
.check input { width: auto; }
.action-stack { display: flex; gap: 8px; align-items: center; }
.action-stack form { display: flex; gap: 6px; align-items: center; }
.action-stack select { min-width: 115px; padding: 8px; }
.danger-button { background: #b91c1c; padding: 8px 11px; }
@media (max-width: 1100px) { .stats-four { grid-template-columns: repeat(2, 1fr); } .absence-form { grid-template-columns: repeat(2, 1fr); } .absence-form .wide { grid-column: span 2; } }
@media (max-width: 700px) { .stats-four, .absence-form { grid-template-columns: 1fr; } .absence-form .wide { grid-column: span 1; } }
/* Versión 0.4: cuadrante mensual */
.month-panel { padding: 22px 26px; }
.compact-panel { padding-top: 20px; padding-bottom: 20px; }
.holiday-form { display: grid; grid-template-columns: 180px minmax(220px, 1fr) auto; gap: 12px; align-items: end; }
.holiday-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.holiday-list span { display: flex; align-items: center; gap: 7px; background: #ffedd5; color: #9a3412; padding: 6px 9px; border-radius: 999px; font-weight: 700; }
.holiday-list form { display: inline; }
.tiny-danger { background: transparent; color: #991b1b; padding: 0 3px; font-size: 1rem; }
.roster-panel { padding: 0; overflow: hidden; }
.roster-wrap { overflow: auto; max-height: 68vh; }
.roster-table { min-width: 1650px; font-size: .82rem; }
.roster-table th, .roster-table td { padding: 5px 4px; text-align: center; border-right: 1px solid #edf2f7; }
.roster-table thead th { position: sticky; top: 0; z-index: 4; background: #f8fafc; }
.roster-table .sticky-worker { position: sticky; left: 0; z-index: 5; min-width: 190px; text-align: left; background: white; box-shadow: 3px 0 5px rgba(15,23,42,.06); }
.roster-table thead .sticky-worker { z-index: 7; background: #f8fafc; }
.worker-cell { padding-left: 12px !important; }
.day-head { min-width: 47px; }
.day-head small { display: block; margin: 0; font-size: .65rem; }
.special-day { background: #fff7ed !important; }
.shift-cell { min-width: 47px; }
.shift-form { margin: 0; }
.shift-select { width: 43px; min-width: 43px; padding: 6px 2px; border-radius: 6px; font-weight: 800; text-align: center; appearance: none; }
.shift-m { background: #fef3c7; color: #92400e; }
.shift-t {
  background: #bfdbfe;
  color: #1d4ed8;
  border-color: #3b82f6;
}
.shift-n {
  background: #cbd5e1;
  color: #334155;
  border-color: #94a3b8;
}
.shift-d12 { background: #dcfce7; color: #166534; }
.shift-n12 { background: #ede9fe; color: #5b21b6; }
.shift-l { background: #f1f5f9; color: #475569; }
.absence-cell { min-width: 43px; padding: 7px 2px; border-radius: 6px; background: #fee2e2; color: #991b1b; font-weight: 800; overflow: hidden; }
.total-head, .total-cell { position: sticky; right: 58px; z-index: 3; background: white; min-width: 58px; font-weight: 800; }
.roster-table thead .total-head { background: #f8fafc; z-index: 6; }
.coverage-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(86px, 1fr)); gap: 8px; }
.coverage-grid article { border: 1px solid #e2e8f0; border-radius: 9px; padding: 9px; text-align: center; }
.coverage-grid article strong, .coverage-grid article small, .coverage-grid article span { display: block; }
.coverage-grid article span { margin-top: 5px; font-size: .72rem; color: #475569; }
@media (max-width: 800px) { .holiday-form { grid-template-columns: 1fr; } }
@media print {
  .topbar, .notice, .compact-panel, .secondary-link, .shift-select { display: none !important; }
  .container { width: 100%; margin: 0; }
  .panel { box-shadow: none; border-radius: 0; }
  .roster-wrap { overflow: visible; max-height: none; }
  .roster-table { min-width: 0; font-size: 7px; }
  .roster-table th, .roster-table td { padding: 2px; }
  .roster-table .sticky-worker, .roster-table thead th, .total-head, .total-cell { position: static; box-shadow: none; }
}
/* Versión 0.5: marcador diario de trabajadores por turno */
.coverage-head-row th { top: 37px !important; z-index: 4; border-top: 1px solid #e2e8f0; }
.coverage-head-row .sticky-worker { z-index: 7; }
.coverage-label { font-size: .62rem; line-height: 1.05; color: #64748b; }
.coverage-head { min-width: 47px; padding: 3px 1px !important; vertical-align: middle; }
.coverage-head span { display: block; font-size: .61rem; line-height: 1.1; margin: 1px 0; border-radius: 4px; background: #e2e8f0; color: #334155; cursor: help; }
.coverage-grid article span { cursor: help; }
@media print {
  .coverage-head-row th { position: static !important; }
}
/* Versión 0.6: semáforo de cobertura por turno */
.coverage-head .coverage-badge,
.coverage-grid article .coverage-badge {
  font-weight: 800;
  border: 1px solid transparent;
}
.coverage-head .coverage-warning,
.coverage-grid article .coverage-warning {
  background: #ffedd5;
  color: #9a3412;
  border-color: #fdba74;
}
.coverage-head .coverage-ok,
.coverage-grid article .coverage-ok {
  background: #dcfce7;
  color: #166534;
  border-color: #86efac;
}
.coverage-grid article .coverage-badge {
  margin: 5px auto 0;
  padding: 4px 6px;
  border-radius: 6px;
}
/* Versión 0.7: descansos, turnos reducidos, vistas y PDF */
.shift-mr { background:#fef9c3; color:#854d0e; }
.shift-nr { background:#ddd6fe; color:#5b21b6; }
.shift-d10r { background:#ccfbf1; color:#115e59; }
.error-notice { border-left-color:#b91c1c; background:#fff1f2; color:#991b1b; }
.print-actions { display:flex; gap:8px; justify-content:center; margin-top:12px; flex-wrap:wrap; }
.worker-form-v07 { grid-template-columns:2fr 1fr 1.5fr 1fr 1fr auto; }
.profile-form { min-width:270px; }
.mini-check { display:flex; grid-template-columns:auto 1fr; align-items:center; gap:5px; font-size:.78rem; }
.mini-check input { width:auto; }
.individual-selector { display:flex; align-items:end; gap:14px; }
.individual-selector label { min-width:320px; }
@media (max-width:1000px){ .worker-form-v07{grid-template-columns:1fr 1fr;} .individual-selector{align-items:stretch;flex-direction:column;} }
@media print { .print-actions, .individual-selector { display:none !important; } }
/* Versión 0.8: impresión completa e individuales conjuntos */
.secondary-button { background:#334155; }
.print-button { border:0; cursor:pointer; }
@media print {
  .print-button, .button, .secondary-button { display:none !important; }
  body { background:white; }
  .stats { break-inside:avoid; }
  .table-wrap { overflow:visible; }
}

/* Version 0.9: vista mural visual, separada del cuadrante operativo */
.visual-month-panel { text-align:center; }
.mural-panel { padding:0; overflow:hidden; }
.mural-scroll { overflow:auto; max-height:76vh; }
.mural-table { min-width:2100px; table-layout:fixed; border-collapse:separate; border-spacing:0; font-size:.72rem; }
.mural-table th,.mural-table td { border-right:1px solid #94a3b8; border-bottom:1px solid #94a3b8; padding:2px; vertical-align:top; }
.mural-table thead th { position:sticky; top:0; z-index:5; background:#fef08a; text-align:center; }
.mural-label { width:150px; min-width:150px; background:#ede9fe; text-align:left; padding:8px !important; }
.mural-label strong,.mural-label small { display:block; }
.mural-label small { margin-top:3px; color:#475569; }
.sticky-mural-label { position:sticky; left:0; z-index:4; box-shadow:3px 0 5px rgba(15,23,42,.12); }
thead .sticky-mural-label { z-index:7; }
.mural-day { width:62px; min-width:62px; }
.mural-day span,.mural-day strong { display:block; }
.mural-day strong { font-size:.9rem; }
.mural-special { background:#fff7ed !important; }
.mural-cell { height:80px; background:#fff; }
.mural-person { display:block; padding:3px 4px; margin:1px 0; border:1px solid rgba(15,23,42,.18); border-radius:3px; line-height:1.12; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mural-separator th { background:#111827; color:#fff; text-align:left; padding:7px 10px; text-transform:uppercase; letter-spacing:.04em; }
.mural-absence-label { background:#ffedd5; color:#9a3412; }
.mural-absence-cell { min-height:48px; background:#fffaf0; }
@media print {
  @page { size:A3 landscape; margin:5mm; }
  .visual-month-panel .month-heading a,.visual-month-panel .print-actions { display:none !important; }
  .visual-month-panel { padding:4px; margin:0; }
  .visual-month-panel h2 { font-size:16px; }
  .visual-month-panel p,.visual-month-panel .tag { display:none; }
  .mural-panel { overflow:visible; }
  .mural-scroll { overflow:visible; max-height:none; }
  .mural-table { min-width:0; width:100%; font-size:5px; table-layout:fixed; }
  .mural-table th,.mural-table td { padding:1px; }
  .mural-label { width:27mm; min-width:27mm; padding:2px !important; }
  .mural-day { width:auto; min-width:0; }
  .mural-cell { height:18mm; }
  .sticky-mural-label,.mural-table thead th { position:static; box-shadow:none; }
  .mural-person { padding:1px; margin:0; border-radius:0; }
}

/* v1.0 perfiles avanzados de trabajadores */
.worker-form-v10{display:grid;grid-template-columns:2fr 1fr 1.35fr 1fr;gap:14px;align-items:end}
.profile-create-box,.advanced-profile-form fieldset{border:1px solid #d9e0ea;border-radius:12px;padding:12px;background:#f8fafc}
.profile-create-box{grid-column:1 / -1}
.shift-check-grid{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:8px}
.availability-checks{display:flex;flex-wrap:wrap;gap:12px 20px;margin-top:10px}
.notes-field{grid-column:1 / -1}
.notes-field textarea{width:100%;resize:vertical}
.worker-profile-list{display:grid;gap:16px}
.worker-profile-card{border:1px solid #dfe5ed;border-radius:16px;padding:16px;background:#fff}
.worker-profile-summary{display:grid;grid-template-columns:minmax(220px,1fr) 2fr auto;gap:16px;align-items:center;margin-bottom:14px}
.worker-profile-summary small{display:block;color:#66758a;margin-top:3px}
.profile-tags{display:flex;flex-wrap:wrap;gap:6px}
.profile-tags span{background:#e7eef7;border-radius:999px;padding:4px 8px;font-size:.78rem;font-weight:700}
.profile-tags .restriction-tag{background:#fff0dc;color:#a84c00}
.advanced-profile-form{display:grid;grid-template-columns:180px 1fr 1.2fr;gap:14px;align-items:start}
.advanced-profile-form fieldset{margin:0;min-width:0}
.advanced-profile-form legend{font-weight:800;padding:0 5px}
.advanced-profile-form button{align-self:end}
.toggle-profile-form{margin-top:10px;text-align:right}
@media(max-width:1000px){.worker-form-v10,.advanced-profile-form,.worker-profile-summary{grid-template-columns:1fr}.profile-create-box,.notes-field{grid-column:auto}}

/* v1.1: identidad IBERCRA, importación y ámbitos festivos */
.brand{display:flex;align-items:center;gap:18px;min-width:310px}.brand img{width:240px;max-height:62px;object-fit:contain;background:#fff;padding:4px}.brand p{margin:0;color:#dbe4f3}.topbar{gap:24px}.import-form{display:flex;gap:14px;align-items:end;flex-wrap:wrap}.import-form label{min-width:280px}.helper{color:#64748b;margin-bottom:0}.holiday-form{grid-template-columns:180px 1fr 190px auto}.holiday-item small{font-weight:700;padding:2px 7px;border-radius:999px;background:#eef2f7}.holiday-nacional{border-left:4px solid #294f8a}.holiday-autonomico{border-left:4px solid #16846a}.holiday-local{border-left:4px solid #e85a0a}.holiday-empresa,.holiday-manual{border-left:4px solid #7c3aed}@media(max-width:900px){.brand{min-width:0}.brand img{width:180px}.topbar{align-items:flex-start}.holiday-form{grid-template-columns:1fr}}

/* v1.2: buscador, orden de activos y eliminación segura */
.workers-heading{align-items:end;gap:20px}.worker-search-tools{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.worker-search-tools label{min-width:220px}.worker-search-tools select{min-width:135px}.worker-inactive-card{background:#f3f4f6;border-color:#d1d5db;opacity:.82}.worker-actions{display:flex;justify-content:flex-end;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px}.worker-actions form{margin:0}.danger-button{background:#b91c1c}.danger-button:hover{background:#991b1b}.delete-disabled{font-size:.82rem;color:#64748b;background:#f1f5f9;border-radius:8px;padding:8px 10px}.flash-message{margin:0 0 18px;padding:14px 18px;border-radius:12px;font-weight:700}.flash-message.ok{background:#dcfce7;color:#166534;border:1px solid #86efac}.flash-message.error{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5}.worker-no-results{text-align:center;padding:24px}@media(max-width:900px){.workers-heading{align-items:stretch}.worker-search-tools{display:grid;grid-template-columns:1fr}.worker-search-tools label{min-width:0}.worker-actions{justify-content:flex-start}}
.user-menu{display:flex;align-items:center;gap:8px;margin-left:auto;font-size:.82rem}.user-menu span{background:#334155;padding:4px 8px;border-radius:999px}.user-menu a{padding:4px 6px}.login-container{min-height:100vh;display:grid;place-items:center}.login-card{width:min(420px,92vw);background:#fff;padding:38px;border-radius:20px;box-shadow:0 20px 55px rgba(15,23,42,.18)}.login-card img{width:230px;max-width:100%;display:block;margin:0 auto 24px}.login-card h1{text-align:center;margin-bottom:4px}.login-card p{text-align:center;color:#64748b}.login-card form,.stack-form{display:grid;gap:16px;margin-top:24px}.login-card label,.stack-form label{display:grid;gap:6px;font-weight:700}.narrow-panel{max-width:650px;margin-inline:auto}.balance{font-weight:800;padding:4px 8px;border-radius:999px}.balance.positive{background:#dcfce7;color:#166534}.balance.negative{background:#fee2e2;color:#991b1b}
.profile-save-status{display:inline-block;margin-left:12px;font-weight:700;min-width:120px}.profile-save-status.saving{color:#8a5a00}.profile-save-status.saved{color:#087a38}.profile-save-status.error{color:#b42318}.holiday-management-list{display:grid;gap:10px}.holiday-management-item{display:flex;align-items:center;justify-content:space-between;border:1px solid #dce3ed;border-left:5px solid #f25a05;border-radius:12px;padding:12px 14px}.holiday-management-item>div{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.holiday-management-item small{background:#eef2f7;border-radius:999px;padding:4px 9px}.holiday-management-item.holiday-nacional{border-left-color:#c62828}.holiday-management-item.holiday-autonomico{border-left-color:#2e7d32}.holiday-management-item.holiday-local{border-left-color:#1565c0}.holiday-management-item.holiday-empresa{border-left-color:#6a1b9a}

/* Parche v1.5.5: paneles desplegables y cobertura mínima absoluta */
.collapsible-panel{padding:0;overflow:hidden}
.collapsible-panel>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 24px;user-select:none}
.collapsible-panel>summary::-webkit-details-marker{display:none}
.collapsible-panel>summary span:first-child{display:grid;gap:4px}
.collapsible-panel>summary strong{font-size:1.08rem;color:#17233a}
.collapsible-panel>summary small{font-weight:400;color:#64748b}
.collapsible-panel[open]>summary{border-bottom:1px solid #e2e8f0}
.summary-arrow{font-size:1.4rem;transition:transform .18s ease;color:#475569}
.collapsible-panel[open] .summary-arrow{transform:rotate(180deg)}
.collapsible-content{padding:20px 24px 24px}
.coverage-alert-panel{background:#fff1f2;border:2px solid #dc2626;border-left-width:8px;border-radius:16px;padding:18px 22px;margin-bottom:22px;box-shadow:0 10px 30px rgba(185,28,28,.08);color:#881337}
.coverage-alert-heading div{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.coverage-alert-heading strong{font-size:1.1rem;color:#b91c1c}
.coverage-alert-list{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.coverage-alert-list span{background:#fff;border:1px solid #fecaca;border-radius:9px;padding:7px 10px}
.coverage-danger{background:#fee2e2!important;color:#991b1b!important;border-color:#ef4444!important}
@media print{.collapsible-panel,.coverage-alert-panel{display:none!important}}

/* Contadores por trabajador */
.worker-counter-list {
  display: grid;
  gap: 18px;
}

.worker-counter-card {
  border: 1px solid #dfe5ec;
  border-radius: 16px;
  padding: 18px;
  background: #fff;
}

.worker-counter-header {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: flex-start;
}

.worker-counter-header h3 {
  margin: 0 0 4px;
}

.worker-counter-header p {
  margin: 0;
  color: #64748b;
}

.worker-counter-result {
  display: grid;
  text-align: right;
  gap: 3px;
  min-width: 150px;
}

.worker-counter-result span:first-child {
  color: #64748b;
  font-size: 0.8rem;
}

.worker-counter-result strong {
  font-size: 1.25rem;
}

.worker-main-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.worker-stat {
  min-width: 58px;
  padding: 8px 12px;
  border-radius: 10px;
  background: #f1f5f9;
  text-align: center;
}

.worker-stat span {
  display: block;
  color: #64748b;
  font-size: 0.75rem;
}

.worker-stat strong {
  display: block;
  font-size: 1.05rem;
}

.worker-stat-wide {
  min-width: 115px;
}

.worker-source-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
}

.worker-counter-details {
  margin-top: 15px;
  border-top: 1px solid #e2e8f0;
  padding-top: 12px;
}

.worker-counter-details summary {
  cursor: pointer;
  font-weight: 700;
  color: #c2410c;
}

.worker-detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(245px, 1fr));
  gap: 14px;
  margin-top: 15px;
}

.worker-detail-block {
  padding: 14px;
  border-radius: 12px;
  background: #f8fafc;
}

.worker-detail-block h4 {
  margin-top: 0;
  margin-bottom: 12px;
}

.worker-detail-block dl {
  margin: 0;
}

.worker-detail-block dl div {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  padding: 6px 0;
  border-bottom: 1px solid #e2e8f0;
}

.worker-detail-block dt {
  color: #475569;
}

.worker-detail-block dd {
  margin: 0;
  text-align: right;
  font-weight: 600;
}

.shift-detail-table {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px 16px;
}

@media (max-width: 700px) {
  .worker-counter-header {
    display: block;
  }

  .worker-counter-result {
    margin-top: 12px;
    text-align: left;
  }
}

/* =========================================================
   CABECERA Y BUSCADOR DE CONTADORES
   ========================================================= */

.counter-toolbar {
  display: grid;
  grid-template-columns: minmax(145px, auto) 1fr minmax(145px, auto);
  align-items: center;
  gap: 24px;
  margin-bottom: 14px;
  padding: 20px 24px;
  border: 1px solid #dde4ec;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 8px 26px rgba(15, 23, 42, 0.05);
}

.counter-toolbar-title {
  min-width: 0;
  text-align: center;
}

.counter-toolbar-label {
  display: inline-block;
  margin-bottom: 4px;
  color: #ea580c;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.counter-toolbar-title h2 {
  margin: 0;
  color: #0f172a;
  font-size: clamp(1.55rem, 2.5vw, 2rem);
  line-height: 1.1;
}

.counter-toolbar-title p {
  margin: 7px 0 0;
  color: #64748b;
  font-size: 0.95rem;
}

.counter-nav-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid #d8e0e8;
  border-radius: 999px;
  background: #f8fafc;
  color: #243247;
  font-weight: 750;
  text-decoration: none;
  white-space: nowrap;
  transition:
    transform 0.15s ease,
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.counter-nav-button:hover {
  transform: translateY(-1px);
  border-color: #fdba74;
  background: #fff7ed;
  color: #c2410c;
  box-shadow: 0 6px 16px rgba(194, 65, 12, 0.09);
}

.counter-search-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
  padding: 12px 16px;
  border: 1px solid #dde4ec;
  border-radius: 15px;
  background: #ffffff;
}

.counter-search-box {
  position: relative;
  display: flex;
  align-items: center;
  flex: 1;
  max-width: 620px;
}

.counter-search-icon {
  position: absolute;
  left: 14px;
  z-index: 1;
  color: #94a3b8;
  font-size: 1.35rem;
  pointer-events: none;
}

.counter-search-box input {
  width: 100%;
  min-height: 44px;
  padding: 10px 88px 10px 43px;
  border: 1px solid #cfd8e3;
  border-radius: 12px;
  background: #f8fafc;
  color: #0f172a;
  font-size: 0.98rem;
  outline: none;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.counter-search-box input:focus {
  border-color: #fb923c;
  background: #ffffff;
  box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.12);
}

.counter-search-clear {
  position: absolute;
  right: 8px;
  min-height: 32px;
  padding: 5px 10px;
  border: 0;
  border-radius: 8px;
  background: #e9eef4;
  color: #475569;
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
}

.counter-search-clear:hover {
  background: #dce4ed;
  color: #0f172a;
}

.counter-search-summary {
  color: #64748b;
  white-space: nowrap;
}

.counter-search-summary strong {
  color: #0f172a;
  font-size: 1.05rem;
}

.counter-no-results {
  margin: 18px 0 0;
  padding: 22px;
  border: 1px dashed #cbd5e1;
  border-radius: 13px;
  background: #f8fafc;
  color: #64748b;
  text-align: center;
  font-weight: 650;
}

.worker-counter-card[hidden] {
  display: none !important;
}

@media (max-width: 900px) {
  .counter-toolbar {
    grid-template-columns: 1fr 1fr;
  }

  .counter-toolbar-title {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .counter-nav-button:first-child {
    grid-column: 1;
    grid-row: 2;
  }

  .counter-nav-button:last-child {
    grid-column: 2;
    grid-row: 2;
  }
}

@media (max-width: 680px) {
  .counter-toolbar {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 17px;
  }

  .counter-toolbar-title,
  .counter-nav-button:first-child,
  .counter-nav-button:last-child {
    grid-column: 1;
    grid-row: auto;
  }

  .counter-search-panel {
    display: block;
  }

  .counter-search-box {
    max-width: none;
  }

  .counter-search-summary {
    margin-top: 10px;
    text-align: center;
  }
}

/* Mejorar lectura de etiquetas largas en el detalle de contadores */
.worker-detail-block dl > div {
  align-items: flex-start;
}

.worker-detail-block dt {
  flex: 1 1 auto;
  min-width: 0;
  line-height: 1.25;
}

.worker-detail-block dd {
  flex: 0 0 auto;
  min-width: 82px;
  white-space: nowrap;
}

.worker-detail-block:nth-child(2) {
  min-width: 280px;
}


/* Ajuste fino del detalle de Contadores */
.worker-detail-grid {
  grid-template-columns:
    minmax(220px, 0.95fr)
    minmax(285px, 1.15fr)
    minmax(230px, 1fr)
    minmax(245px, 1fr)
    minmax(230px, 0.95fr);
}

.worker-detail-block:nth-child(2) {
  min-width: 0;
}

.worker-detail-block:nth-child(2) dd {
  min-width: 90px;
  white-space: nowrap;
}

.worker-detail-block:nth-child(2) dt {
  padding-right: 12px;
}

@media (max-width: 1250px) {
  .worker-detail-grid {
    grid-template-columns: repeat(2, minmax(280px, 1fr));
  }
}

@media (max-width: 700px) {
  .worker-detail-grid {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   CONTROL ANUAL DE HORAS
   ========================================================= */

.view-switcher {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin: 0 0 18px;
}

.view-switcher a {
  padding: 9px 18px;
  border: 1px solid #d8e0e8;
  border-radius: 999px;
  background: #ffffff;
  color: #475569;
  font-weight: 700;
  text-decoration: none;
}

.view-switcher a.active {
  border-color: #fb923c;
  background: #fff7ed;
  color: #c2410c;
}

.annual-worker-selector {
  width: 100%;
}

.annual-worker-selector label {
  display: grid;
  gap: 6px;
  color: #475569;
  font-weight: 700;
}

.annual-worker-selector select {
  width: 100%;
  min-height: 44px;
  padding: 9px 12px;
  border: 1px solid #cbd5e1;
  border-radius: 11px;
  background: #ffffff;
}

.annual-worker-panel {
  margin-bottom: 18px;
}

.annual-worker-heading {
  display: flex;
  justify-content: space-between;
  gap: 22px;
  align-items: flex-start;
  margin-bottom: 18px;
}

.annual-worker-heading h3 {
  margin: 0 0 5px;
  font-size: 1.35rem;
}

.annual-worker-heading p {
  margin: 0;
  color: #64748b;
}

.annual-target-box {
  display: grid;
  justify-items: end;
  min-width: 205px;
  padding: 13px 17px;
  border: 1px solid #fed7aa;
  border-radius: 13px;
  background: #fff7ed;
}

.annual-target-box span,
.annual-target-box small {
  color: #9a3412;
}

.annual-target-box strong {
  margin: 3px 0;
  font-size: 1.35rem;
}

.annual-main-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
  gap: 10px;
}

.annual-main-stats > div {
  display: grid;
  gap: 4px;
  padding: 13px;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #f8fafc;
}

.annual-main-stats span {
  color: #64748b;
  font-size: 0.8rem;
  font-weight: 700;
}

.annual-main-stats strong {
  font-size: 1.12rem;
}

.annual-total-stat {
  border-color: #bfdbfe !important;
  background: #eff6ff !important;
}

.annual-positive {
  border-color: #bbf7d0 !important;
  background: #f0fdf4 !important;
}

.annual-negative {
  border-color: #fecaca !important;
  background: #fef2f2 !important;
  color: #b91c1c;
}

.annual-hours-table {
  min-width: 1450px;
}

.annual-month-pendiente {
  opacity: 0.68;
}

.annual-month-en-curso {
  background: #fffbeb;
}

.annual-row-button,
.annual-detail-button {
  min-height: 34px;
  padding: 6px 11px;
  font-size: 0.82rem;
}

.annual-detail-button {
  margin-top: 14px;
}

.annual-counter-block {
  border-color: #fed7aa;
  background: #fffaf5;
}

@media (max-width: 760px) {
  .annual-worker-heading {
    display: block;
  }

  .annual-target-box {
    justify-items: start;
    margin-top: 14px;
  }
}

/* =========================================================
   APARTADO ACTIVO EN EL MENÚ PRINCIPAL
   ========================================================= */

.topbar nav a {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: #ffffff;
  text-decoration: none;
  transition:
    color 0.16s ease,
    background 0.16s ease,
    border-color 0.16s ease,
    transform 0.16s ease;
}

.topbar nav a:hover {
  background: rgba(255, 255, 255, 0.08);
  transform: translateY(-1px);
}

.topbar nav a.active {
  border-color: rgba(249, 115, 22, 0.38);
  background: rgba(249, 115, 22, 0.12);
  color: #fb923c;
  font-weight: 800;
}

.topbar nav a.active::after {
  content: "";
  position: absolute;
  right: 12px;
  bottom: 4px;
  left: 12px;
  height: 2px;
  border-radius: 999px;
  background: #f97316;
}


/* =========================================================
   CUALIFICACIONES DE TRABAJADORES
   ========================================================= */

.qualification-tag {
  display: inline-flex;
  align-items: center;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1;
}

.english-tag {
  border: 1px solid #93c5fd;
  background: #eff6ff;
  color: #1d4ed8;
}

.responsible-tag {
  border: 1px solid #fdba74;
  background: #fff7ed;
  color: #c2410c;
}

.night-special-tag {
  border: 1px solid #c4b5fd;
  background: #f5f3ff;
  color: #6d28d9;
}


/* =========================================================
   TABLA DE AUSENCIAS Y SOLICITUDES
   ========================================================= */

.absences-table-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  padding-bottom: 8px;
}

.absences-table {
  width: 100%;
  min-width: 1180px;
  table-layout: fixed;
  border-collapse: collapse;
}

.absences-table th,
.absences-table td {
  padding: 12px 10px;
  vertical-align: top;
  overflow-wrap: anywhere;
}

.absences-table th {
  white-space: nowrap;
  font-size: 0.78rem;
}

.absences-table th:nth-child(1),
.absences-table td:nth-child(1) {
  width: 21%;
}

.absences-table th:nth-child(2),
.absences-table td:nth-child(2) {
  width: 16%;
}

.absences-table th:nth-child(3),
.absences-table td:nth-child(3) {
  width: 17%;
  white-space: nowrap;
}

.absences-table th:nth-child(4),
.absences-table td:nth-child(4) {
  width: 10%;
}

.absences-table th:nth-child(5),
.absences-table td:nth-child(5) {
  width: 12%;
}

.absences-table th:nth-child(6),
.absences-table td:nth-child(6) {
  width: 8%;
  text-align: center;
}

.absences-table th:nth-child(7),
.absences-table td:nth-child(7) {
  width: 11%;
}

.absences-table th:nth-child(8),
.absences-table td:nth-child(8) {
  width: 170px;
  min-width: 170px;
}

.absences-table .action-stack {
  display: grid;
  gap: 7px;
  min-width: 150px;
}

.absences-table .action-stack form {
  display: grid;
  grid-template-columns: minmax(88px, 1fr) auto;
  gap: 6px;
  align-items: center;
  margin: 0;
}

.absences-table .action-stack form:last-child {
  grid-template-columns: 1fr;
}

.absences-table .action-stack select,
.absences-table .action-stack button {
  width: 100%;
  min-width: 0;
  margin: 0;
  white-space: nowrap;
}

@media (max-width: 1250px) {
  .absences-table {
    min-width: 1080px;
  }

  .absences-table th,
  .absences-table td {
    padding: 10px 8px;
    font-size: 0.88rem;
  }
}


/* Ajuste final de la tabla de ausencias */

.absences-table-wrap {
  padding-right: 18px;
  box-sizing: border-box;
}

.absences-table {
  min-width: 1240px;
}

.absences-table th:nth-child(8),
.absences-table td:nth-child(8) {
  width: 190px;
  min-width: 190px;
  padding-right: 16px;
}

.absences-table .action-stack {
  min-width: 170px;
}

.absences-table .action-stack form:first-child {
  grid-template-columns: 105px 1fr;
}

.absences-table .action-stack select {
  min-width: 105px;
}

.absences-table .action-stack button {
  min-width: 72px;
}


/* Aprovechamiento de pantallas anchas */

@media (min-width: 1800px) {
  .container {
    width: min(1760px, 97vw);
  }

  .panel {
    padding: 24px 28px;
  }
}

/* Distribucion definitiva del perfil de trabajador */

.advanced-profile-form {
  display: grid;
  grid-template-columns:
    minmax(220px, 1.1fr)
    minmax(135px, .55fr)
    minmax(180px, .75fr)
    minmax(280px, 1.35fr)
    minmax(150px, .55fr);
  grid-template-areas:
    "name code dni planning target"
    "employment employment employment employment employment"
    "shifts shifts availability availability availability"
    "preferences preferences preferences preferences preferences"
    "notes notes notes notes notes"
    "save save save save save";
  gap: 16px;
  align-items: start;
}

.profile-field-name {
  grid-area: name;
}

.profile-field-code {
  grid-area: code;
}

.profile-field-dni {
  grid-area: dni;
}

.profile-field-planning {
  grid-area: planning;
}

.profile-field-target {
  grid-area: target;
}

.profile-employment {
  grid-area: employment;
}

.profile-shifts {
  grid-area: shifts;
}

.profile-availability {
  grid-area: availability;
}

.profile-preferences {
  grid-area: preferences;
}

.advanced-profile-form .notes-field {
  grid-area: notes;
}

.advanced-profile-form > button {
  grid-area: save;
  justify-self: start;
}

.advanced-profile-form > .profile-save-status {
  grid-area: save;
  align-self: center;
  margin-left: 150px;
}

/* Preferencias en una sola línea */
.profile-preferences {
  display: block;
}

.preference-grid {
  display: grid;
  grid-template-columns:
    repeat(3, minmax(160px, 210px));
  gap: 18px;
  align-items: end;
  margin-top: 8px;
}

.preference-grid label {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.preference-help {
  display: block;
  margin-top: 12px;
  color: #64748b;
  line-height: 1.45;
}

/* Controles */
.advanced-profile-form input,
.advanced-profile-form select,
.advanced-profile-form textarea {
  width: 100%;
  box-sizing: border-box;
}

.advanced-profile-form fieldset {
  min-width: 0;
  margin: 0;
}

.advanced-profile-form .shift-check-grid,
.advanced-profile-form .availability-checks {
  align-items: center;
}

/* Pantallas medianas */
@media (max-width: 1250px) {
  .advanced-profile-form {
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "name code"
      "dni planning"
      "target target"
      "employment employment"
      "shifts shifts"
      "availability availability"
      "preferences preferences"
      "notes notes"
      "save save";
  }

  .preference-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Pantallas pequeñas */
@media (max-width: 760px) {
  .advanced-profile-form {
    grid-template-columns: 1fr;
    grid-template-areas:
      "name"
      "code"
      "dni"
      "planning"
      "target"
      "employment"
      "shifts"
      "availability"
      "preferences"
      "notes"
      "save";
  }

  .preference-grid {
    grid-template-columns: 1fr;
  }

  .advanced-profile-form > .profile-save-status {
    margin-left: 0;
    margin-top: 52px;
  }
}



.success-notice {
    background: #ecfdf3;
    border-left: 5px solid #18864b;
    color: #12633a;
}

.success-notice strong {
    color: #0f6a3b;
}

/* Buscador de ausencias */
.absence-search-panel {
    margin: 0 0 18px;
    max-width: 760px;
}

.absence-search-panel > label {
    display: block;
    margin-bottom: 7px;
    font-weight: 700;
    color: #17233b;
}

.absence-search-controls {
    display: flex;
    align-items: center;
    gap: 10px;
}

.absence-search-controls input {
    flex: 1;
    min-width: 240px;
}

.absence-search-controls button {
    width: auto;
    min-width: 100px;
    margin: 0;
}

.absence-record-row[hidden] {
    display: none;
}

@media (max-width: 720px) {
    .absence-search-controls {
        align-items: stretch;
        flex-direction: column;
    }

    .absence-search-controls button {
        width: 100%;
    }
}

/* Filtros y paginación de ausencias */
.absence-filter-form {
    display: grid;
    grid-template-columns:
        minmax(260px, 2fr)
        repeat(5, minmax(125px, 1fr));
    gap: 12px;
    align-items: end;
    margin-bottom: 20px;
}

.absence-filter-form label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-weight: 700;
}

.absence-filter-form input,
.absence-filter-form select {
    width: 100%;
}

.absence-filter-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    grid-column: 1 / -1;
}

.absence-filter-actions button,
.absence-filter-actions .button {
    width: auto;
    min-width: 110px;
    margin: 0;
}

.absence-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
    margin-top: 22px;
}

.absence-pagination form {
    margin: 0;
}

.absence-pagination button {
    width: auto;
    min-width: 125px;
    margin: 0;
}

.absence-pagination button:disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

@media (max-width: 1180px) {
    .absence-filter-form {
        grid-template-columns:
            repeat(3, minmax(160px, 1fr));
    }
}

@media (max-width: 720px) {
    .absence-filter-form {
        grid-template-columns: 1fr;
    }

    .absence-filter-actions {
        grid-column: auto;
        flex-direction: column;
        align-items: stretch;
    }

    .absence-filter-actions button,
    .absence-filter-actions .button {
        width: 100%;
    }

    .absence-pagination {
        flex-wrap: wrap;
    }
}

/* Ajuste visual de filtros de ausencias */
.absence-filter-form {
    grid-template-columns:
        minmax(280px, 2fr)
        repeat(5, minmax(120px, 1fr))
        auto;
    align-items: end;
    margin-bottom: 26px;
}

.absence-filter-actions {
    grid-column: auto;
    display: flex;
    align-items: flex-end;
    gap: 8px;
    white-space: nowrap;
}

.absence-filter-actions button,
.absence-filter-actions .button {
    min-height: 40px;
    padding: 9px 22px;
}

.absences-table-wrap {
    margin-top: 4px;
}

@media (max-width: 1450px) {
    .absence-filter-form {
        grid-template-columns:
            minmax(260px, 2fr)
            repeat(3, minmax(135px, 1fr));
    }

    .absence-filter-actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 720px) {
    .absence-filter-form {
        grid-template-columns: 1fr;
    }

    .absence-filter-actions {
        grid-column: auto;
        flex-direction: row;
    }

    .absence-filter-actions button,
    .absence-filter-actions .button {
        flex: 1;
        min-width: 0;
    }
}


/* MENU AGRUPADO 2026-07-31 */

.app-header {
  position: relative;
  z-index: 1200;
  background: #111827;
  color: #ffffff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.16);
}

.app-header-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  width: min(1680px, 96vw);
  margin: 0 auto;
  padding: 15px 0 12px;
}

.app-brand {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
  padding: 0;
  color: #ffffff;
  text-decoration: none;
}

.app-brand:hover {
  background: transparent;
}

.app-brand img {
  width: 205px;
  max-height: 58px;
  padding: 4px 8px;
  border-radius: 3px;
  background: #ffffff;
  object-fit: contain;
}

.app-brand span {
  display: grid;
  gap: 2px;
}

.app-brand strong {
  font-size: 1rem;
}

.app-brand small {
  color: #94a3b8;
  font-size: 0.78rem;
}

.app-navigation-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  border-top: 1px solid rgba(148, 163, 184, 0.16);
  background: #0f172a;
  padding: 0 max(2vw, calc((100vw - 1680px) / 2));
}

.app-navigation {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
}

.nav-direct-link,
.nav-manual-link,
.nav-dropdown > summary {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 46px;
  padding: 0 13px;
  border: 0;
  border-radius: 0;
  color: #e2e8f0;
  font-size: 0.9rem;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  list-style: none;
}

.nav-dropdown > summary::-webkit-details-marker,
.account-menu > summary::-webkit-details-marker {
  display: none;
}

.nav-direct-link:hover,
.nav-manual-link:hover,
.nav-dropdown > summary:hover {
  background: rgba(255, 255, 255, 0.06);
  color: #ffffff;
}

.nav-direct-link.active,
.nav-dropdown.active > summary {
  color: #fb923c;
}

.nav-direct-link.active::after,
.nav-dropdown.active > summary::after {
  content: "";
  position: absolute;
  right: 12px;
  bottom: 0;
  left: 12px;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: #f97316;
}

.nav-dropdown {
  position: relative;
}

.nav-dropdown[open] > summary {
  background: rgba(249, 115, 22, 0.1);
  color: #fb923c;
}

.nav-dropdown > summary span {
  color: #94a3b8;
  font-size: 0.8rem;
  transition: transform 0.15s ease;
}

.nav-dropdown[open] > summary span {
  transform: rotate(180deg);
}

.nav-dropdown-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 1300;
  display: grid;
  width: 310px;
  padding: 9px;
  border: 1px solid #dce3ec;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 22px 55px rgba(15, 23, 42, 0.22);
}

.nav-dropdown-menu-right {
  right: 0;
  left: auto;
}

.nav-dropdown-menu a {
  display: grid;
  gap: 3px;
  padding: 11px 13px;
  border-radius: 10px;
  color: #1e293b;
  text-decoration: none;
}

.nav-dropdown-menu a:hover {
  background: #f8fafc;
}

.nav-dropdown-menu a.active {
  background: #fff7ed;
  color: #c2410c;
}

.nav-dropdown-menu a strong {
  font-size: 0.9rem;
}

.nav-dropdown-menu a small {
  color: #64748b;
  font-size: 0.76rem;
  font-weight: 500;
}

.account-menu {
  position: relative;
  flex: 0 0 auto;
}

.account-menu > summary {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding: 6px 10px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.04);
  cursor: pointer;
  list-style: none;
}

.account-menu > summary:hover,
.account-menu[open] > summary {
  border-color: rgba(249, 115, 22, 0.55);
  background: rgba(249, 115, 22, 0.08);
}

.account-avatar {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 50%;
  background: #f97316;
  color: #ffffff;
  font-weight: 900;
}

.account-identity {
  display: grid;
  gap: 1px;
  text-align: left;
}

.account-identity strong {
  max-width: 190px;
  overflow: hidden;
  font-size: 0.82rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-identity small {
  color: #94a3b8;
  font-size: 0.68rem;
  font-weight: 800;
}

.menu-chevron {
  color: #94a3b8;
}

.account-dropdown {
  position: absolute;
  top: calc(100% + 9px);
  right: 0;
  z-index: 1400;
  display: grid;
  width: 225px;
  padding: 9px;
  border: 1px solid #dce3ec;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 22px 55px rgba(15, 23, 42, 0.22);
}

.account-dropdown-heading {
  display: grid;
  gap: 3px;
  margin-bottom: 6px;
  padding: 8px 10px 12px;
  border-bottom: 1px solid #e2e8f0;
  color: #0f172a;
}

.account-dropdown-heading span {
  color: #64748b;
  font-size: 0.72rem;
  font-weight: 800;
}

.account-dropdown a {
  padding: 10px 11px;
  border-radius: 9px;
  color: #334155;
  text-decoration: none;
}

.account-dropdown a:hover {
  background: #f1f5f9;
}

.account-dropdown .logout-link {
  color: #b91c1c;
}

.app-header-meta {
  flex: 0 0 auto;
  color: #64748b;
  font-size: 0.66rem;
  white-space: nowrap;
}

@media (max-width: 1250px) {
  .app-header-meta {
    display: none;
  }

  .app-navigation-row {
    overflow-x: auto;
  }

  .app-navigation {
    min-width: max-content;
  }
}

@media (max-width: 760px) {
  .app-header-main {
    padding: 11px 0;
  }

  .app-brand img {
    width: 170px;
  }

  .app-brand span {
    display: none;
  }

  .account-identity {
    display: none;
  }

  .app-navigation-row {
    padding-inline: 2vw;
  }

  .nav-direct-link,
  .nav-manual-link,
  .nav-dropdown > summary {
    min-height: 43px;
    padding-inline: 10px;
    font-size: 0.82rem;
  }

  .nav-dropdown-menu {
    position: fixed;
    top: auto;
    right: 12px;
    left: 12px;
    width: auto;
  }
}

@media print {
  .app-header {
    display: none !important;
  }
}

/* AJUSTE DESPLEGABLES MENU 2026-07-31 */

.app-navigation-row {
  overflow: visible;
}

.app-navigation {
  position: relative;
  overflow: visible;
}

.nav-dropdown {
  z-index: 1250;
}

.nav-dropdown[open] {
  z-index: 1350;
}

.nav-dropdown-menu {
  z-index: 1500;
}

.account-menu[open] {
  z-index: 1450;
}

.account-dropdown {
  z-index: 1600;
}

@media (max-width: 1250px) {
  .app-navigation-row {
    overflow-x: auto;
    overflow-y: visible;
  }
}

/* ACCIONES GENERADOR CUADRANTE 2026-07-31 */
.roster-generator-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 18px;
}

.roster-generator-main-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.roster-generator-actions form {
  margin: 0;
}

.generator-action-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid transparent;
  border-radius: 11px;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 750;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition:
    transform 0.15s ease,
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.generator-action-button:hover {
  transform: translateY(-1px);
}

.generator-action-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  min-width: 18px;
  font-size: 1rem;
  line-height: 1;
}

.generator-action-primary {
  background: #ea580c;
  color: #ffffff;
  box-shadow: 0 5px 14px rgba(234, 88, 12, 0.18);
}

.generator-action-primary:hover {
  background: #c94c08;
  box-shadow: 0 7px 18px rgba(234, 88, 12, 0.24);
}

.generator-action-secondary {
  background: #334155;
  color: #ffffff;
  border-color: #334155;
  box-shadow: 0 4px 12px rgba(51, 65, 85, 0.12);
}

.generator-action-secondary:hover {
  background: #1e293b;
  border-color: #1e293b;
  color: #ffffff;
  box-shadow: 0 6px 16px rgba(30, 41, 59, 0.18);
}

.roster-generator-danger-form {
  margin-left: auto !important;
}

.generator-action-danger {
  background: #fff1f2;
  color: #b42318;
  border-color: #fecaca;
}

.generator-action-danger:hover {
  background: #fee2e2;
  border-color: #fca5a5;
  color: #991b1b;
  box-shadow: 0 6px 16px rgba(185, 28, 28, 0.12);
}

@media (max-width: 900px) {
  .roster-generator-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .roster-generator-main-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .roster-generator-main-actions form,
  .roster-generator-main-actions a,
  .roster-generator-danger-form,
  .generator-action-button {
    width: 100%;
  }

  .roster-generator-danger-form {
    margin-left: 0 !important;
    padding-top: 12px;
    border-top: 1px solid #e2e8f0;
  }
}

/* Control compacto de publicación del mural */
.mural-publication-control {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.mural-publication-buttons {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  background: #e2e8f0;
  border-radius: 10px;
}

.mural-publication-buttons form {
  margin: 0;
}

.mural-mode-button {
  min-height: 34px;
  padding: 7px 13px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #334155;
  font-size: .84rem;
  font-weight: 700;
  cursor: pointer;
}

.mural-mode-button:hover {
  background: #f8fafc;
}

.mural-mode-button.is-active {
  background: #ffffff;
  color: #0f172a;
  box-shadow: 0 1px 4px rgba(15, 23, 42, .16);
}

.mural-publication-status {
  color: #64748b;
  font-size: .76rem;
  line-height: 1.3;
}

.mural-publication-status strong {
  color: #334155;
}

@media (max-width: 700px) {
  .mural-publication-buttons {
    width: 100%;
  }

  .mural-publication-buttons form {
    flex: 1;
  }

  .mural-mode-button {
    width: 100%;
    padding-left: 8px;
    padding-right: 8px;
  }
}

/* Corrección de alineación del control del mural */
.visual-month-panel .print-actions {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
}

.visual-month-panel .print-actions > .button,
.visual-month-panel .print-actions > .secondary-button,
.visual-month-panel .print-actions > .secondary-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 38px;
  height: 38px;
  margin: 0;
  padding: 8px 14px;
  line-height: 1.1;
  flex: 0 0 auto;
}

.visual-month-panel .mural-publication-control {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  width: auto;
  margin: 0;
  gap: 5px;
}

.visual-month-panel .mural-publication-buttons {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  width: auto;
  margin: 0;
  padding: 3px;
  gap: 3px;
}

.visual-month-panel .mural-publication-buttons form {
  display: block;
  width: auto;
  margin: 0;
  padding: 0;
  flex: 0 0 auto;
}

.visual-month-panel .mural-mode-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 72px;
  min-height: 32px;
  height: 32px;
  margin: 0;
  padding: 6px 11px;
  line-height: 1;
  white-space: nowrap;
}

.visual-month-panel .mural-publication-status {
  display: block;
  max-width: 360px;
  margin: 0;
  text-align: left;
  white-space: normal;
}

@media (max-width: 850px) {
  .visual-month-panel .print-actions {
    align-items: center;
  }

  .visual-month-panel .mural-publication-control {
    align-items: center;
    width: 100%;
  }

  .visual-month-panel .mural-publication-buttons {
    width: auto;
  }

  .visual-month-panel .mural-publication-buttons form {
    flex: 0 0 auto;
  }

  .visual-month-panel .mural-mode-button {
    width: auto;
  }

  .visual-month-panel .mural-publication-status {
    text-align: center;
  }
}

/* FORMULARIO COMPACTO DE VACACIONES 2026-07-31 */

.vacation-request-panel {
  padding: 22px 26px;
}

.vacation-request-heading {
  margin-bottom: 18px;
}

.vacation-request-heading h3 {
  margin: 0 0 4px;
}

.vacation-request-heading p {
  margin: 0;
  color: #64748b;
  font-size: 0.9rem;
}

.vacation-request-form {
  display: grid;
  grid-template-columns:
    minmax(280px, 2fr)
    minmax(145px, 0.8fr)
    minmax(145px, 0.8fr)
    minmax(145px, 0.8fr)
    minmax(190px, 1fr);
  grid-template-areas:
    "worker start end status hours"
    "notes notes notes notes notes"
    "actions actions actions actions actions";
  gap: 14px;
  align-items: start;
}

.vacation-request-form label {
  min-width: 0;
}

.vacation-request-form input,
.vacation-request-form select,
.vacation-request-form textarea {
  width: 100%;
  box-sizing: border-box;
}

.vacation-field-worker {
  grid-area: worker;
}

.vacation-field-start {
  grid-area: start;
}

.vacation-field-end {
  grid-area: end;
}

.vacation-field-status {
  grid-area: status;
}

.vacation-field-hours {
  grid-area: hours;
}

.vacation-field-hours small {
  color: #64748b;
  font-weight: 500;
  line-height: 1.25;
}

.vacation-field-notes {
  grid-area: notes;
}

.vacation-field-notes textarea {
  min-height: 62px;
  max-height: 130px;
  resize: vertical;
}

.vacation-request-actions {
  grid-area: actions;
  display: flex;
  justify-content: flex-start;
  margin-top: 2px;
}

.vacation-request-actions button {
  width: auto;
  min-width: 190px;
  margin: 0;
  padding: 10px 18px;
}

@media (max-width: 1350px) {
  .vacation-request-form {
    grid-template-columns:
      minmax(250px, 2fr)
      repeat(2, minmax(145px, 1fr));
    grid-template-areas:
      "worker start end"
      "status hours hours"
      "notes notes notes"
      "actions actions actions";
  }
}

@media (max-width: 760px) {
  .vacation-request-panel {
    padding: 20px;
  }

  .vacation-request-form {
    grid-template-columns: 1fr;
    grid-template-areas:
      "worker"
      "start"
      "end"
      "status"
      "hours"
      "notes"
      "actions";
  }

  .vacation-request-actions button {
    width: 100%;
    min-width: 0;
  }
}


/* =========================================================
   DATOS LABORALES DEL TRABAJADOR
   ========================================================= */

.worker-employment-box {
  grid-column: 1 / -1;
  min-width: 0;
  margin: 0;
  padding: 14px;
  border: 1px solid #d9e0ea;
  border-radius: 12px;
  background: #f8fafc;
}

.worker-employment-box legend,
.profile-employment legend {
  padding: 0 5px;
  font-weight: 800;
}

.profile-employment {
  grid-column: 1 / -1;
}

.worker-employment-grid {
  display: grid;
  grid-template-columns:
    repeat(5, minmax(150px, 1fr));
  gap: 14px;
  align-items: start;
}

.worker-employment-grid label {
  min-width: 0;
}

.worker-employment-grid small {
  color: #64748b;
  font-weight: 500;
}

.employment-help {
  display: block;
  margin-top: 10px;
  color: #64748b;
  font-weight: 500;
}

.worker-employment-grid input[readonly] {
  color: #475569;
  background: #eef2f7;
  cursor: default;
}

.first-month-hours-field input:disabled {
  color: #94a3b8;
  background: #f1f5f9;
}

@media (max-width: 1250px) {
  .worker-employment-grid {
    grid-template-columns:
      repeat(3, minmax(160px, 1fr));
  }
}

@media (max-width: 800px) {
  .worker-employment-grid {
    grid-template-columns: 1fr;
  }

  .profile-employment {
    grid-column: auto;
  }
}

/* =========================================================
   CORRECCION DEFINITIVA DATOS LABORALES
   ========================================================= */

.advanced-profile-form > .profile-employment {
  grid-area: employment !important;
  grid-column: 1 / -1 !important;
  width: 100% !important;
}

@media (max-width: 1250px) {
  .advanced-profile-form > .profile-employment {
    grid-area: employment !important;
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 760px) {
  .advanced-profile-form > .profile-employment {
    grid-area: employment !important;
    grid-column: 1 !important;
  }
}

/* Acciones de ausencias: distribución limpia en dos filas */

.absences-table th:nth-child(8),
.absences-table td:nth-child(8) {
  width: 285px;
  min-width: 285px;
  padding-right: 16px;
}

.absences-table .action-stack {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 7px 8px;
  min-width: 260px;
}

.absences-table .action-stack form {
  margin: 0;
}

/* Regularizar ocupa toda la primera fila */
.absences-table .action-stack form:first-child {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(155px, 1fr) auto;
  gap: 7px;
  align-items: center;
}

/* Cambio de estado */
.absences-table .action-stack form:nth-child(2) {
  display: grid;
  grid-template-columns: minmax(105px, 1fr) auto;
  gap: 7px;
  align-items: center;
}

/* Eliminar queda junto al cambio de estado */
.absences-table .action-stack form:last-child {
  display: block;
  align-self: stretch;
}

.absences-table .action-stack form:last-child button {
  height: 100%;
}

.absences-table .action-stack select,
.absences-table .action-stack button {
  width: 100%;
  min-width: 0;
  margin: 0;
  white-space: nowrap;
}

.absences-table .action-stack form:first-child select {
  min-width: 155px;
}

.absences-table .action-stack button {
  min-width: 78px;
}


/* Tabla Ausencias: separar correctamente Tipo y Periodo */

.absences-table {
  min-width: 1450px;
}

/* Tipo */
.absences-table th:nth-child(2),
.absences-table td:nth-child(2) {
  width: 260px;
  min-width: 260px;
  white-space: normal;
  overflow-wrap: normal;
  word-break: normal;
}

/* Periodo */
.absences-table th:nth-child(3),
.absences-table td:nth-child(3) {
  width: 220px;
  min-width: 220px;
  white-space: nowrap;
}


/* Ausencias: Eliminar siempre en fila inferior completa */

.absences-table .action-stack {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
}

.absences-table .action-stack form {
  width: 100%;
}

/* Regularizar */
.absences-table .action-stack form:first-child {
  display: grid;
  grid-template-columns: minmax(155px, 1fr) auto;
  gap: 7px;
  align-items: center;
}

/* Estado */
.absences-table .action-stack form:nth-child(2) {
  display: grid;
  grid-template-columns: minmax(105px, 1fr) auto;
  gap: 7px;
  align-items: center;
}

/* Eliminar */
.absences-table .action-stack form:last-child {
  display: block;
  width: 100%;
}

.absences-table .action-stack form:last-child button {
  width: 100%;
  min-width: 0;
}

