/* Perfil visual COTRAPAN · manual de estilo v1.0
   El rojo es acento y nunca fondo; nada de blanco puro. */
:root{
  --papel:#F0E5D1; --papel-claro:#F8F1E2; --tinta:#17120E;
  --rojo:#E20613; --rojo-tostado:#A81D10; --marron:#7A5A34;
  --trigo:#B8913F; --filete:#C2AC85; --borde:#BFA97F; --crema:#FFF6E6;
  --ok:#4A6B3A; --ok-fondo:#E2E6D2; --aviso:#8A6412; --aviso-fondo:#F0E4C6;
}
*{box-sizing:border-box;}
body{margin:0; background:var(--papel); color:var(--tinta);
  font-family:"Century Schoolbook","Bookman Old Style",Georgia,serif;
  font-size:15px; line-height:1.55;}
h1,h2,h3{font-family:"Bookman Old Style",Georgia,serif; font-weight:700; margin:0;}
a{color:var(--rojo-tostado);}

.marco{display:grid; grid-template-columns:15rem 1fr; min-height:100vh;}

/* ── el menú de la izquierda ── */
.lateral{background:var(--tinta); color:var(--crema); padding:0 0 2rem;}
.marca{display:flex; gap:.6rem; align-items:center; padding:1.1rem 1rem;
  border-bottom:2px solid var(--rojo);}
.marca b{display:block; font-family:"Bookman Old Style",Georgia,serif; font-size:1.05rem;}
.marca small{display:block; font-size:.66rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--trigo);}
.sello{width:2rem; height:2rem;}
.grupo{font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:var(--trigo);
  padding:1.1rem 1rem .35rem;}
.lateral a{display:flex; align-items:center; gap:.55rem; padding:.5rem 1rem;
  color:var(--crema); text-decoration:none; border-left:3px solid transparent; font-size:.92rem;}
.lateral a:hover{background:#241C15;}
.lateral a.puesto{border-left-color:var(--rojo); background:#241C15; font-weight:700;}
.lateral .cnt{margin-left:auto; background:var(--rojo); color:#FFF6E6; border-radius:9px;
  font-size:.68rem; padding:0 .4rem; font-weight:700;}

.quien-soy{margin-top:1.6rem; padding:.8rem 1rem; border-top:.4px solid #3A2E23;}
.quien-soy b{display:block; font-size:.88rem;}
.quien-soy small{display:block; font-size:.66rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--trigo); margin-bottom:.5rem;}
.quien-soy button{font-size:.78rem; padding:.25rem .7rem; background:transparent;
  border:.7px solid #4A3B2C; color:var(--crema);}
.quien-soy button:hover{border-color:var(--rojo); color:#FFF6E6;}

/* ── el cuerpo ── */
.principal{padding:1.6rem 2rem 3rem; max-width:78rem;}
.titulo{display:flex; justify-content:space-between; align-items:baseline; gap:1rem;
  border-bottom:.7px solid var(--borde); padding-bottom:.5rem; margin-bottom:.3rem;}
.titulo h1{font-size:1.5rem;}
.titulo .fecha{font-size:.72rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--marron);}
.sub{color:var(--marron); margin:.3rem 0 1.3rem; font-size:.95rem;}

.fichas{display:flex; gap:.8rem; flex-wrap:wrap; margin-bottom:1.2rem;}
.ficha{background:var(--papel-claro); border:.7px solid var(--borde);
  border-bottom:3px solid var(--rojo); padding:.6rem .9rem; min-width:9rem;}
.ficha b{display:block; font-size:.64rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--marron); font-family:"Century Schoolbook",Georgia,serif;}
.ficha .g{font-family:"Bookman Old Style",Georgia,serif; font-size:1.7rem; line-height:1.1;
  font-variant-numeric:tabular-nums;}

.acciones{display:flex; gap:.5rem; flex-wrap:wrap; margin:1rem 0;}
button,.boton{font:inherit; font-size:.9rem; padding:.42rem .95rem; cursor:pointer;
  background:var(--papel-claro); border:.9px solid var(--borde); color:var(--tinta);
  text-decoration:none; display:inline-block;}
button:hover,.boton:hover{border-color:var(--rojo); color:var(--rojo-tostado);}
button.pri{background:var(--rojo); border-color:var(--rojo); color:#FFF6E6; font-weight:700;}
button.pri:hover{background:var(--rojo-tostado); color:#FFF6E6;}
button:disabled{opacity:.45; cursor:default;}

table{border-collapse:collapse; width:100%; background:var(--papel-claro);
  border:.7px solid var(--borde); font-size:.88rem;}
th{background:var(--tinta); color:var(--crema); text-align:left; padding:.45rem .6rem;
  font-size:.64rem; letter-spacing:.13em; text-transform:uppercase;
  font-family:"Century Schoolbook",Georgia,serif;}
td{padding:.4rem .6rem; border-bottom:.4px solid var(--filete); vertical-align:top;}
tbody tr:last-child td{border-bottom:0;}
tr.grupo td{background:var(--papel); font-weight:700; font-size:.82rem;}
td.n,th.n{text-align:right; font-variant-numeric:tabular-nums;}
.mas{color:var(--ok); font-weight:700;}
.menos{color:var(--rojo); font-weight:700;}
.apagado{color:var(--marron);}

.caja{background:var(--papel-claro); border:.7px solid var(--borde);
  border-left:3px solid var(--trigo); padding:.8rem 1rem; margin:1rem 0;}
.caja.aviso{border-left-color:var(--aviso); background:var(--aviso-fondo);}
.caja.mal{border-left-color:var(--rojo); }
.caja.bien{border-left-color:var(--ok); background:var(--ok-fondo);}
.caja b{display:block; margin-bottom:.2rem;}
.vacio{color:var(--marron); font-style:italic; padding:1.4rem 0;}
.nota{color:var(--marron); font-size:.82rem; margin-top:.7rem;}

label{display:block; margin-bottom:.8rem;}
label span{display:block; font-size:.64rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--marron); margin-bottom:.2rem;}
input[type=text],input[type=date],input[type=time],input[type=number],select,textarea{
  font:inherit; font-size:.92rem; padding:.35rem .5rem; background:var(--crema);
  border:.9px solid var(--borde); color:var(--tinta); width:100%; max-width:34rem;}
input[type=number]{max-width:6rem; text-align:right;}
textarea{min-height:4.5rem; resize:vertical;}
.linea-form{display:flex; gap:.6rem; align-items:flex-end; flex-wrap:wrap;}
.linea-form label{margin-bottom:0;}
.dias{display:flex; gap:.4rem; flex-wrap:wrap;}
.dias label{display:flex; align-items:center; gap:.3rem; margin:0;
  background:var(--papel-claro); border:.9px solid var(--borde); padding:.3rem .6rem;}
.dias label span{margin:0; font-size:.8rem; letter-spacing:0; text-transform:none;
  color:var(--tinta);}