:root {
	--bg:#f2f3f2; --ink:#252d31; --panel:#fff;
	--brand:#303b41; --brand2:#46545b; --accent:#e49782;
	--line:#d0d6d7; --mut:#697478; --soft:#e9edee; --soft2:#f2f4f4;
	--bd:#e1e5e5; --acc:#303b41; --gold:#e49782;
  --serif: Georgia, "Times New Roman", serif;
}
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color:var(--ink); background:var(--bg); }

/* ---------- barra superior ---------- */
.topbar { display:flex; justify-content:space-between; align-items:center; gap:1.5rem; background:var(--brand); color:#f2f3f2; padding:.7rem clamp(1rem, 3vw, 1.6rem); }
.brand { font-family:var(--serif); font-size:1.15rem; letter-spacing:.3px; }
.topbar-content { display:flex; align-items:center; justify-content:flex-end; gap:1.1rem; min-width:0; }
.topbar-links,.topbar-user { display:flex; align-items:center; gap:.7rem; }
.topbar a { color:#e4e8e9; text-decoration:none; font-size:.74rem; text-transform:uppercase; letter-spacing:.075em; opacity:.9; }
.topbar a:hover { color:var(--accent); opacity:1; }
.topbar-user .who { opacity:.95; white-space:nowrap; }
.topbar-user .inline { margin:0; }
.topbar-user .badge { margin:0; }
.rol { font-size:.62rem; text-transform:uppercase; letter-spacing:.12em; background:#ffffff24; padding:.08rem .4rem; border-radius:999px; }
.badge { background:#b84b3d; color:#fff; border-radius:999px; padding:.05rem .5rem; font-size:.78rem; margin-left:.6rem; }

/* ---------- layout ---------- */
.wrap { max-width:1200px; margin:1.4rem auto; padding:0 1rem; }
.narrow { max-width:380px; }
h1 { font-family:var(--serif); font-size:1.7rem; font-weight:400; margin:.2rem 0 1rem; }
h2 { font-family:var(--serif); font-size:1.2rem; font-weight:400; margin:1rem 0 .5rem; }
.card { background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:.9rem 1.1rem; margin-bottom:1rem; }
.cardhead { font-weight:600; text-transform:uppercase; letter-spacing:.08em; font-size:.72rem; color:var(--brand); display:flex; justify-content:space-between; align-items:center; gap:.6rem; flex-wrap:wrap; border-bottom:1px solid var(--line); padding-bottom:.45rem; margin-bottom:.6rem; }
.grid3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1rem; }
.grid4 { display:grid; grid-template-columns:repeat(4,1fr); gap:.7rem; }
@media (max-width:1000px){ .grid3, .grid4 { grid-template-columns:1fr 1fr; } }
.grid2 { display:grid; grid-template-columns: 1.2fr 1fr; gap:1rem; }
@media (max-width:900px){ .grid2 { grid-template-columns:1fr; } }

label { display:block; font-size:.78rem; font-weight:600; color:#394449; margin-bottom:.15rem; }
input, select, textarea { width:100%; padding:.45rem .55rem; border:1px solid var(--line); border-radius:4px; font:inherit; background:var(--panel); color:var(--ink); }
input:focus, select:focus, textarea:focus { border-color:#bd6c58; outline:3px solid #bd6c5826; }
input[type="checkbox"] { accent-color:var(--brand); }

table { width:100%; border-collapse:collapse; font-size:.85rem; }
th, td { text-align:left; padding:.3rem .35rem; }
thead th { color:var(--mut); font-weight:700; text-transform:uppercase; letter-spacing:.06em; font-size:.68rem; border-bottom:1px solid var(--line); }
tfoot th { border-top:2px solid var(--line); background:var(--soft2); }
.tot { font-variant-numeric: tabular-nums; font-weight:700; }
.num { text-align:right; }
td input { padding:.25rem .4rem; }
.chico { font-size:.78rem; }

/* ---------- botones ---------- */
button, a.btn { background:var(--brand); color:#fff; border:0; border-radius:4px; padding:.5rem .95rem; cursor:pointer; font:inherit; font-weight:600; text-decoration:none; display:inline-block; }
button:hover, a.btn:hover { background:var(--brand2); }
button.mini { padding:.15rem .5rem; font-size:.78rem; background:var(--soft); color:var(--brand); font-weight:600; }
button.mini:hover { background:#dce2e3; }
button.del { background:#f8e9e5; color:#8f3028; }
button.link { background:none; color:#e4e8e9; padding:0; text-decoration:underline; font-weight:400; }
.btn.secondary { background:var(--soft); color:var(--brand); }
a.btn.small, button.small { padding:.22rem .55rem; font-size:.74rem; min-width:88px; text-align:center; display:inline-flex; align-items:center; justify-content:center; }
a.btn.small.secondary { background:var(--soft); color:var(--brand); }
a.btn.small.secondary:hover { background:#dbe4d3; }
.btn.primary, a.btn.primary { background:var(--brand); color:#fff; }
.btn.primary:hover, a.btn.primary:hover { background:var(--brand2); }
.btn.gold, a.btn.gold { background:var(--accent); color:#22330a; }
.btn.gold:hover, a.btn.gold:hover { background:#bcd46e; }
.btn.blue, a.btn.blue { background:#2b6cb0; color:#fff; }
.btn.blue:hover, a.btn.blue:hover { background:#245992; }
.row-form { display:flex; gap:.8rem; align-items:end; flex-wrap:wrap; }
.actions { display:flex; gap:.6rem; margin-top:.7rem; flex-wrap:wrap; }

/* ---------- etiquetas / avisos ---------- */
.tag { font-size:.68rem; padding:.12rem .5rem; border-radius:999px; background:var(--soft); color:var(--brand); text-transform:uppercase; letter-spacing:.05em; }
.tag.cerrado { background:#e6f0dd; color:#3f6212; }
.tag.borrador { background:#f7ecd2; color:#8a5a13; }
.muted { color:var(--mut); }
.error { color:#8f3028; }
.ok { color:#2f5d45; background:#e8f0e0; border-left:3px solid var(--accent); padding:.55rem .8rem; border-radius:4px; margin-bottom:.8rem; display:block; }
.ok a { color:#2f5d45; }
.inline { display:inline; }
hr { border:0; border-top:1px solid var(--line); }

/* ---------- tablas scrolleables ---------- */
.scrollable { max-height: 55vh; overflow-y: auto; border:1px solid var(--line); border-radius:6px; }
.scrollable table { margin:0; }
.scrollable thead th { position: sticky; top: 0; background:var(--soft2); z-index: 2; }
.scrollable tfoot th { position: sticky; bottom: 0; background:var(--soft2); z-index: 2; }

/* ---------- cierre estilo planilla ---------- */
.cierre-tabla th, .cierre-tabla td { border:1px solid var(--line); padding:.3rem .4rem; }
.cierre-tabla .titulo-tabla { background:#e8ede4; text-align:center; text-transform:uppercase; letter-spacing:.08em; font-size:.72rem; color:var(--brand); }
.cierre-tabla.inicio th:first-child { background:var(--soft2); }
.fila-total th, .fila-total td { background:#eef2e6; }
/* El verde del TOTAL DE FICHAS no debe invadir las columnas de adelantos */
table.inicio tr.fila-total > * { background:transparent; }
table.inicio tr.fila-total > th:first-child,
table.inicio tr.fila-total > td:nth-child(2) { background:#eef2e6; }
.cierre-tabla input { max-width: 190px; }

/* ---------- montos ---------- */
.money { display:flex; align-items:center; gap:.25rem; width:100%; }
.money > .sign { color:var(--mut); font-weight:700; font-size:.8rem; line-height:1; }
.money > input { flex:1; min-width:0; text-align:right; }

/* ---------- cálculos ---------- */
table.calcs { table-layout:fixed; }
table.calcs .cal-etq { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pager { display:flex; justify-content:space-between; align-items:center; margin-top:.8rem; font-size:.9rem; gap:1rem; }
.pager a { text-decoration:none; color:var(--brand); }

/* ---------- permisos ---------- */
.checks { display:flex; flex-wrap:wrap; gap:.5rem 1.4rem; }
.check { display:flex; align-items:center; gap:.35rem; font-size:.9rem; }
.check input { width:auto; }

/* ---------- Acceso (login) ---------- */
.login-page { min-height:100vh; background:var(--bg); color:var(--ink); }
.login-shell { display:grid; grid-template-columns:minmax(300px, .92fr) 1.08fr; min-height:100vh; }
.login-brand { position:relative; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; padding:2.5rem clamp(2rem, 5vw, 5.5rem); background-color:var(--brand); color:var(--bg); }
.login-brand::after { position:absolute; inset:0; background-image:linear-gradient(#ffffff0a 1px, transparent 1px),linear-gradient(90deg,#ffffff0a 1px,transparent 1px); background-size:48px 48px; content:""; pointer-events:none; }
.login-brand-top,.login-brand-bottom,.login-brand-title { position:relative; z-index:1; }
.login-brand-top { display:flex; align-items:center; gap:.8rem; }
.login-mark { display:grid; width:2.4rem; aspect-ratio:1; place-items:center; border:1px solid var(--accent); color:var(--accent); font-family:Georgia,serif; font-size:1.35rem; }
.login-brand-label,.login-kicker,.login-brand-bottom,.login-form-eyebrow { font-size:.68rem; font-weight:700; letter-spacing:.12em; }
.login-brand-label { color:#d6ded7; }
.login-brand-title { margin:auto 0; padding:4rem 0; }
.login-kicker { margin:0 0 1rem; color:var(--accent); }
.login-brand-title h1 { margin:0; font-family:Georgia,"Times New Roman",serif; font-size:clamp(3.5rem, 7vw, 6.5rem); font-weight:400; line-height:.95; }
.login-brand-title h1 span { color:var(--accent); }
.login-brand-caption { margin:.8rem 0 0; color:#d6ded7; font-size:1.2rem; }
.login-brand-bottom { display:flex; align-items:center; gap:.65rem; color:#d6ded7; }
.login-status-dot { width:.5rem; aspect-ratio:1; border-radius:50%; background:var(--accent); box-shadow:0 0 0 4px #e4978226; }
.login-brand-index { margin-left:auto; color:#9aafa5; font-variant-numeric:tabular-nums; }
.login-content { display:grid; place-items:center; padding:3rem 1.5rem; }
.login-form-wrap { width:min(100%, 390px); }
.login-form-eyebrow { margin:0 0 .8rem; color:var(--mut); }
.login-form-wrap h2 { margin:0; color:var(--ink); font-family:Georgia,"Times New Roman",serif; font-size:2.35rem; font-weight:400; }
.login-intro { margin:.65rem 0 2rem; color:#68736d; font-size:.95rem; }
.login-form { display:grid; gap:.55rem; }
.login-form label { margin-top:.55rem; color:#394449; font-size:.82rem; font-weight:650; }
.login-form input { min-height:3rem; padding:.7rem .8rem; border:1px solid var(--line); border-radius:4px; background:var(--panel); color:var(--ink); font-size:.95rem; }
.login-form input:focus { border-color:#bd6c58; outline:3px solid #bd6c5826; }
.login-password-wrap { position:relative; }
.login-password-wrap input { padding-right:5rem; }
.login-reveal { position:absolute; top:50%; right:.25rem; transform:translateY(-50%); padding:.45rem .55rem; background:transparent; color:var(--brand2); font-size:.78rem; font-weight:650; }
.login-reveal:hover { background:var(--soft); }
.login-submit { display:flex; align-items:center; justify-content:space-between; min-height:3.1rem; margin-top:1.1rem; padding:.7rem 1rem; border-radius:4px; background:var(--brand); color:#fff; font-weight:650; }
.login-submit span { color:var(--accent); font-size:1.2rem; transition:transform .18s ease; }
.login-submit:hover { background:var(--brand2); }
.login-submit:hover span { transform:translateX(3px); }
.login-error { margin:0 0 1.1rem; padding:.75rem .85rem; border-left:3px solid #b84b3d; background:#f8e9e5; color:#8f3028; font-size:.88rem; }
.login-footnote { margin:2.5rem 0 0; color:#78827c; font-size:.78rem; }
.login-footnote span { padding:0 .25rem; color:#a0a9a1; }
@media (max-width:720px) {
	.login-shell { grid-template-columns:1fr; }
	.login-brand { min-height:250px; padding:1.25rem 1.5rem; }
	.login-brand-title { padding:2rem 0 1.5rem; }
	.login-brand-title h1 { font-size:3.7rem; }
	.login-brand-caption { margin-top:.45rem; font-size:1rem; }
	.login-brand-bottom { font-size:.6rem; }
	.login-content { padding:3rem 1.5rem; }
	.login-form-wrap h2 { font-size:2rem; }
}
@media (prefers-reduced-motion: reduce) {
	.login-submit span { transition:none; }
}

/* ---------- listado administrativo de turnos ---------- */
.admin-shifts { max-width:1180px; margin:0 auto; }
.shifts-heading { display:flex; justify-content:space-between; align-items:end; gap:1rem; padding:.35rem 0 1.2rem; }
.shifts-eyebrow,.shifts-section-label { margin:0 0 .35rem; color:var(--mut); font-size:.66rem; font-weight:750; letter-spacing:.12em; }
.shifts-heading h1 { margin:0; font-size:2.15rem; }
.shifts-description { margin:.35rem 0 0; color:var(--mut); font-size:.9rem; }
.shifts-count { display:flex; align-items:baseline; gap:.65rem; padding:.45rem .75rem; border-left:2px solid var(--accent); color:var(--mut); }
.shifts-count span { font-size:.64rem; font-weight:700; letter-spacing:.1em; }
.shifts-count strong { color:var(--brand); font-size:1.35rem; font-variant-numeric:tabular-nums; }
.shifts-alert { display:flex; align-items:center; gap:.65rem; margin:0 0 1rem; padding:.75rem .9rem; border:1px solid #d8c68e; border-left:3px solid #b78b37; background:#fbf7e9; color:#59451e; font-size:.86rem; }
.shifts-alert-dot { flex:0 0 auto; width:.5rem; aspect-ratio:1; border-radius:50%; background:#b78b37; }
.shifts-alert a { margin-left:auto; color:#59451e; font-weight:700; white-space:nowrap; }
.shifts-filters { margin-bottom:1rem; padding:.7rem .85rem .8rem; border:1px solid var(--line); border-radius:6px; background:var(--panel); }
.shifts-section-label { margin-bottom:.5rem; font-size:.68rem; }
.shifts-filter-form { display:grid; grid-template-columns:minmax(210px,1.5fr) minmax(135px,.8fr) minmax(135px,.8fr) auto; align-items:end; gap:.55rem; }
.shifts-filter-form label { margin:0; font-size:.72rem; }
.shifts-filter-form input { min-height:2.05rem; margin-top:.2rem; }
.shifts-filter-actions { display:flex; align-items:center; gap:.4rem; }
.shifts-filter-actions button,.shifts-filter-actions .btn { min-height:2.05rem; white-space:nowrap; }
.shifts-results-heading { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; margin:0 0 .55rem; }
.shifts-results-heading h2 { margin:0; font-size:1.35rem; }
.shifts-results-heading > span { color:var(--mut); font-size:.78rem; }
.shifts-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:6px; background:var(--panel); }
.shifts-table { min-width:760px; }
.shifts-table thead th { padding:.75rem .65rem; background:var(--soft2); white-space:nowrap; }
.shifts-table tbody td { padding:.72rem .65rem; border-bottom:1px solid var(--soft); vertical-align:middle; }
.shifts-table tbody tr:last-child td { border-bottom:0; }
.shifts-table tbody tr:hover { background:#f6f7f7; }
.shift-id { color:var(--mut); font-variant-numeric:tabular-nums; }
.shift-operator { color:var(--ink); font-weight:650; }
.shift-state { white-space:nowrap; }
.shift-request { display:inline-block; width:.48rem; aspect-ratio:1; margin-left:.35rem; border-radius:50%; background:#b84b3d; vertical-align:middle; }
.shift-view-link { display:inline-block; padding:.22rem .55rem; min-width:88px; text-align:center; background:var(--brand); color:#fff; border-radius:4px; font-size:.74rem; font-weight:600; text-decoration:none; white-space:nowrap; }
.shift-view-link:hover { background:var(--brand2); color:#fff; text-decoration:none; }
.shift-view-link span { color:var(--accent); }
.shifts-empty-panel { overflow:hidden; border:1px solid var(--line); border-radius:6px; background:var(--panel); }
.shifts-empty { display:flex; min-height:175px; flex-direction:column; justify-content:center; align-items:center; gap:.45rem; padding:1.5rem; text-align:center; }
.shifts-empty-mark { display:grid; width:2.2rem; aspect-ratio:1; place-items:center; margin-bottom:.2rem; border:1px solid var(--line); border-radius:50%; color:var(--accent); }
.shifts-empty strong { color:var(--ink); font-size:.92rem; }
.shifts-empty > span:last-child { color:var(--mut); font-size:.8rem; }
@media (max-width:720px) {
	.topbar { display:grid; grid-template-columns:1fr; gap:.7rem; padding:.8rem 1rem; }
	.topbar-content { display:grid; grid-template-columns:1fr; justify-content:stretch; gap:.6rem; }
	.topbar-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.35rem; }
	.topbar-links a { display:flex; min-height:2rem; align-items:center; justify-content:center; padding:.35rem .2rem; border:1px solid #ffffff2b; border-radius:4px; font-size:.64rem; text-align:center; }
	.topbar-user { min-height:2.2rem; gap:.7rem; padding-top:.45rem; border-top:1px solid #ffffff2b; }
	.topbar-user .who { margin-right:auto; margin-left:0; font-size:.8rem; }
	.topbar-user .rol { margin-left:.2rem; }
}
@media (max-width:800px) {
	.shifts-filter-form { grid-template-columns:repeat(2,minmax(0,1fr)); }
	.shifts-operator-field { grid-column:1 / -1; }
	.shifts-filter-actions { grid-column:1 / -1; }
}
@media (max-width:520px) {
	.shifts-heading { align-items:start; }
	.shifts-heading h1 { font-size:1.85rem; }
	.shifts-description { max-width:25rem; font-size:.82rem; }
	.shifts-count { flex-direction:column; align-items:start; gap:.1rem; padding:.2rem 0 .2rem .6rem; }
	.shifts-count strong { font-size:1.15rem; }
	.shifts-alert { align-items:flex-start; flex-wrap:wrap; }
	.shifts-alert a { margin-left:1.15rem; }
	.shifts-filters { padding:.85rem; }
	.shifts-filter-form { grid-template-columns:1fr; }
	.shifts-operator-field,.shifts-filter-actions { grid-column:auto; }
	.shifts-filter-actions > * { flex:1; text-align:center; }
	.shifts-results-heading h2 { font-size:1.2rem; }
}

/* ---------- perfil / avatar ---------- */
.topbar-user .profile { display:flex; align-items:center; gap:.55rem; }
.topbar-user .who { display:flex; flex-direction:column; line-height:1.15; }
.topbar-user .who .rol { align-self:flex-start; }
.avatar { display:grid; place-items:center; width:2rem; height:2rem; border-radius:50%; background:var(--accent); color:#33201a; font-weight:700; font-size:.9rem; overflow:hidden; }
.avatar-img { object-fit:cover; border:2px solid #ffffff33; background:#1d2326; }
.avatar-lg { width:4rem; height:4rem; font-size:1.7rem; }