:root { --bg:#ffffff; --text:#111; --muted:#555; --border:#d0d5dd; --border-strong:#98a2b3; --focus:#0a66ff; --accent:#0a66ff; --error:#b00020; --panel:#f7f8fa; --zebra:#f3f4f6; --heading:#0b1324; }
@media (prefers-color-scheme: dark) { :root { --bg:#0f1115; --text:#eef2f7; --muted:#b9c0cc; --border:#3b4252; --border-strong:#6b7280; --panel:#151922; --zebra:#1b2130; --heading:#f5f7fb; --focus:#7ab0ff; --accent:#7ab0ff; --error:#ff6b6b; } }

.calc-salario-widget { background: var(--panel); color: var(--text); padding: 1rem; border-radius: 10px; border: 1px solid var(--border); max-width: 52rem; line-height: 1.55; }
.calc-salario-widget fieldset { border: none; margin: 0; padding: 0; }
.calc-salario-widget legend { font-weight: 700; margin-bottom: .5rem; color: var(--heading); }
.field { margin-block: .6rem; }
.calc-salario-widget label { display: inline-block; margin-bottom: .25rem; font-weight: 600; }
.calc-salario-widget input[type=number], .calc-salario-widget input[type=date] { width: 100%; min-height: 44px; padding: .5rem .6rem; border-radius: 8px; border: 1.5px solid var(--border); background: var(--bg); color: var(--text); font-size: 1rem; box-sizing: border-box; }
.calc-salario-widget input:focus, .calc-salario-widget button:focus { outline: 3px solid var(--focus); outline-offset: 2px; }
.field-hint { display: block; margin-top: .25rem; color: var(--muted); font-size: .95rem; }
[aria-invalid=true]{ border-color: var(--error) !important; }
[aria-invalid=true] + .field-hint { color: var(--error); font-weight: 600; }
.actions { margin-top: .9rem; display:flex; gap:.6rem; flex-wrap: wrap; }
.calc-salario-widget button { min-height:44px; padding:.65rem 1rem; border-radius:8px; border:2px solid transparent; background: var(--accent); color:#fff; font-weight:700; cursor:pointer; }
.calc-salario-widget button.secondary { background: transparent; color: var(--accent); border-color: var(--accent); }
.calc-salario-widget button[disabled], .calc-salario-widget [aria-disabled=true] { opacity:.55; cursor:not-allowed; filter:none; }

/* RESULTADOS en pantalla (tabla + secciones) */
#resultado-salario{ margin-top:1.1rem; }
.results { background: var(--bg); border:1px solid var(--border); border-radius:10px; padding:1rem; }
.section { margin-top: .8rem; }
.section:first-child { margin-top: 0; }
.section-title { font-size: 1.15rem; line-height: 1.2; margin: .25rem 0 .5rem; color: var(--heading); }
.sep { border:0; border-top:2px solid var(--border-strong); margin: .8rem 0; }
.table { width:100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.table th, .table td { border:1px solid var(--border); padding:.5rem .6rem; }
.table th { text-align:left; background: var(--panel); color: var(--heading); font-weight:700; }
.table .num { text-align:right; white-space:nowrap; }
.table tbody tr:nth-child(odd) { background: var(--zebra); }
.total-row { font-weight: 800; background: #fff7e6; }
@media (prefers-color-scheme: dark) { .total-row { background:#2a2416; } }
.total-badge { display:inline-block; padding:.25rem .5rem; border-radius:6px; background:#fffaeb; color:#8a5800; font-weight:800; }
@media (prefers-color-scheme: dark) { .total-badge { background:#332a10; color:#ffd699; } }

/* Cabecera impresión / logo */
.print-header{ display:flex; align-items:center; gap:.6rem; margin-bottom:.6rem; }
.brand-logo{ height:40px; width:auto; object-fit:contain; }

.sr-only{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (prefers-reduced-motion: reduce){ *{ transition:none !important; animation:none !important; } }
@media (forced-colors: active){ .calc-salario-widget, .calc-salario-widget input, .calc-salario-widget button{ forced-color-adjust:none; background:Canvas; color:CanvasText; border-color:ButtonText;} .calc-salario-widget button{ background:ButtonFace; color:ButtonText; border-color:ButtonText;} .calc-salario-widget input:focus, .calc-salario-widget button:focus{ outline-color:Highlight; }}