:root{
  --bg:#18181b;              /* antes #0b1220 (azul) */
  --card:#242428;            /* gris, no azul */
  --line:rgba(255,255,255,.10);
  --text:#e5e7eb;
  --muted:#a7b0c0;
  --accent:#f59e0b;
  --accent2:#fb923c;
  --radius:18px;

  --paper:#ffffff;
  --paperText:#0b1220;
  --paperMuted:#4b5563;
  --paperLine:#e5e7eb;
}

*{box-sizing:border-box}

body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:
    radial-gradient(900px 600px at 15% 0%, rgba(245,158,11,.10), transparent 60%),
    radial-gradient(700px 500px at 85% 10%, rgba(251,146,60,.08), transparent 55%),
    var(--bg);
  color:var(--text);
}

.wrap{
  max-width:1200px;
  margin:0 auto;
  padding:22px;
  display:grid;
  gap:14px;
}

.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:14px 16px;
  border:1px solid var(--line);
  background: rgba(17,24,39,.62);
  backdrop-filter: blur(10px);
  border-radius: var(--radius);
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:280px;
}

/* (legacy) si alguna vez volvés a usar cajita */
.logoBox{
  width:44px;height:44px;border-radius:14px;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  box-shadow: 0 10px 30px rgba(245,158,11,.25);
  flex:0 0 auto;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  display:grid;place-items:center;
}
.logoBox img{width:100%;height:100%;object-fit:cover;display:block}

/* ✅ nuevo logo “plano” (sin cajita) */
.brandLogo{
  height:42px;
  width:auto;
  object-fit:contain;
  filter: drop-shadow(0 0 8px rgba(0,0,0,.35));
}

.brand h1{
  margin:0;
  font-size:15px;
  letter-spacing:.35px;
  line-height:1.1;
}

.brand p{
  margin:3px 0 0;
  font-size:12px;
  color:var(--muted);
}

.actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

button{
  border:0;
  cursor:pointer;
  padding:10px 12px;
  border-radius:14px;
  font-weight:700;
  font-size:13px;
}

.btn-primary{
  color:#111827;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
}

.btn-ghost{
  color:var(--text);
  background: rgba(255,255,255,.06);
  border:1px solid var(--line);
}

.grid{
  display:grid;
  grid-template-columns: 1.35fr .65fr;
  gap:14px;
  align-items:start;
}

@media (max-width: 980px){
  .grid{grid-template-columns: 1fr;}
  .actions{justify-content:flex-start;}
}

.card{
  padding:14px 16px;
  border-radius: var(--radius);
  border:1px solid var(--line);
  background: rgba(17,24,39,.55);
  backdrop-filter: blur(10px);
}

.card h2{
  margin:0 0 10px;
  font-size:14px;
  letter-spacing:.25px;
}

.sub{
  margin:0 0 10px;
  font-size:12px;
  color:var(--muted);
}

label{
  display:block;
  font-size:12px;
  color:var(--muted);
  margin:0 0 6px;
}

input[type="text"], input[type="number"], input[type="date"], input[type="password"]{
  width:100%;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.06);
  color:var(--text);
  outline:none;
}

input[type="number"]{appearance:textfield}

.row{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
}

.row-3{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap:10px;
}

@media (max-width: 680px){
  .row, .row-3{grid-template-columns: 1fr;}
}

.sect{
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid var(--line);
}

.hdr{
  display:grid;
  grid-template-columns: 1.25fr repeat(4, .58fr) 1fr;
  gap:8px;
  margin-bottom:8px;
  padding:0 8px;
  font-size:11px;
  color:var(--muted);
}

.hdr span{text-align:center}
.hdr span:first-child{text-align:left}
.hdr span:last-child{text-align:left}

.items{display:grid; gap:8px;}

.item{
  display:grid;
  grid-template-columns: 1.25fr repeat(4, .58fr) 1fr;
  gap:8px;
  align-items:center;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:16px;
  background: rgba(255,255,255,.04);
}

.item .name{
  font-weight:750;
  font-size:13px;
  line-height:1.15;
}

/* ✅ Varios editable (input dentro del “name”) */
.nameInput{
  width:100%;
  padding:8px 10px;
  border-radius:14px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.06);
  color:var(--text);
  outline:none;
  font-weight:750;
  font-size:13px;
}

.chk{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  font-size:12px;
  color:var(--muted);
  user-select:none;
}
.chk input{transform: scale(1.05);}

.obs input{
  width:100%;
  padding:8px 10px;
  border-radius:14px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.06);
  color:var(--text);
  outline:none;
}

.groupTitle{
  margin:10px 0 4px;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  letter-spacing:.25px;
}

.mini{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:10px;
  color:var(--muted);
  font-size:12px;
}

.tag{
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.05);
}

.repRow{
  display:grid;
  grid-template-columns: 1fr auto;
  gap:8px;
  align-items:center;
}
.repRow .repDel{padding:9px 12px;}

/* =========================
   PDF sheet (1 hoja, sin blanco)
   ========================= */
#pdfSheet{
  display:none;               /* se enciende solo al generar/preview */
  width:210mm;                /* A4 */
  background: var(--paper);
  color: var(--paperText);
  padding:16mm 14mm;          /* más compacto para evitar 2da hoja */
  overflow:hidden;            /* clave para que no “desborde” */
}

.pdf-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  border-bottom:1px solid var(--paperLine);
  padding-bottom:10px;
  margin-bottom:12px;
}

.pdf-title{
  margin:0;
  font-size:16px;
  font-weight:900;
  letter-spacing:.3px;
}

.pdf-sub{
  margin:4px 0 0;
  color:var(--paperMuted);
  font-size:11px;
  line-height:1.2;
}

.pdf-meta{
  text-align:right;
  font-size:11px;
  color:var(--paperMuted);
  line-height:1.35;
  white-space:nowrap;
}

.pdf-block{
  border:1px solid var(--paperLine);
  border-radius:10px;
  padding:10px;
  margin-top:10px;
}

.pdf-block h3{
  margin:0 0 8px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.2px;
}

.pdf-grid{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap:8px;
  font-size:11px;
}

.pdf-grid div span{color:var(--paperMuted);}

.pdf-list{
  margin:0;
  padding-left:16px;
  font-size:11px;
}
.pdf-list li{margin:4px 0;}

.pdf-totals{
  display:grid;
  grid-template-columns: 1fr;
  gap:6px;
  font-size:12px;
}

.pdf-totals .line{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:6px 0;
  border-bottom:1px dashed var(--paperLine);
}

.pdf-grand{
  margin-top:8px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding-top:8px;
  border-top:2px solid #111827;
  font-size:14px;
  font-weight:950;
}

/* =========================
   🔐 ACCESS GATE (prolijo)
   ========================= */
#accessGate{
  position:fixed;
  inset:0;
  z-index:99999;
  display:none; /* CLAVE: si no está esto, te queda “velo” siempre */
}

.gate-bg{
  position:absolute;
  inset:0;
  background:
    radial-gradient(1200px 800px at 10% 0%, rgba(245,158,11,.18), transparent 60%),
    radial-gradient(900px 700px at 90% 10%, rgba(251,146,60,.12), transparent 55%),
    #0b1220;
}

.gate-center{
  position:relative;
  height:100%;
  display:grid;
  place-items:center;
  padding:24px;
}

.gate-card{
  width:min(520px, 100%);
  border-radius:20px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(17,24,39,.68);
  backdrop-filter: blur(10px);
  padding:18px;
  color:#e5e7eb;
}

.gate-head{
  display:flex;
  gap:12px;
  align-items:center;
}

.gate-logo{
  width:54px;
  height:54px;
  border-radius:16px;
  background: linear-gradient(135deg,#f59e0b,#fb923c);
  box-shadow: 0 10px 30px rgba(245,158,11,.25);
  display:grid;
  place-items:center;
  overflow:hidden;
  flex:0 0 auto;
}
.gate-logo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.gate-title{
  font-weight:950;
  letter-spacing:.2px;
}

.gate-sub{
  margin-top:4px;
  font-size:12px;
  color:#a7b0c0;
  line-height:1.35;
}

.gate-form{
  margin-top:14px;
  display:grid;
  gap:10px;
}

.gate-error{
  display:none;
  color:#fca5a5;
  font-size:12px;
  font-weight:700;
}

.gate-tip{
  margin-top:10px;
  font-size:11px;
  color:#94a3b8;
}




/* =========================
   AJUSTES TSJ (logo limpio + PDF 1 hoja + varios editable)
   Pegalo al final de presupuesto.css
   ========================= */

.brandTop{ gap:14px; }
.brandLogo{
  height:42px;
  width:auto;
  object-fit:contain;
  filter: drop-shadow(0 0 8px rgba(0,0,0,.35));
}

.brandTitle{
  margin:0;
  font-weight:900;
  letter-spacing:.4px;
  font-size:15px;
  line-height:1.1;
}
.brandSubtitle{
  margin-top:2px;
  font-weight:900;
  opacity:.9;
}
.brandHint{
  margin:2px 0 0;
  font-size:12px;
  color:var(--muted);
}

.span-2{ grid-column: span 2; }
@media (max-width:680px){ .span-2{ grid-column:auto; } }

.variosName{
  width:100%;
  padding:8px 10px;
  border-radius:14px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.06);
  color:var(--text);
  outline:none;
  font-weight:750;
  font-size:13px;
}

/* Access gate header simple */
.gate-head-simple{ gap:14px; align-items:center; }
.gate-logo-flat{
  width:64px;
  height:64px;
  object-fit:contain;
  border-radius:14px;
  background:transparent;
}
.gate-head-text .gate-title{ font-weight:950; letter-spacing:.3px; }

/* PDF header + 1 hoja sin blanco */
#pdfSheet{
  width:210mm;
  height:297mm;
  box-sizing:border-box;
  padding:16mm 14mm;
  overflow:hidden;
}

.pdfTopHeader{ align-items:center; }
.pdfBrand{ display:flex; gap:12px; align-items:center; }
.pdfLogo{ width:26mm; height:18mm; object-fit:contain; }
.pdfTitleClean{ letter-spacing:.6px; font-weight:950; }
.pdfSubClean{ font-size:12px; font-weight:900; }
.h2tight{ margin-top:0; }
.repAutoBox{ display:grid; gap:8px; }
.repManualBox{ display:grid; gap:8px; }






/* ================================
   VEHÍCULO PRO – Estilo integrado
================================ */

#marca,
#modelo,
#tipo,
#anio,
#vehiculo{
  width:100%;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.06);
  color: var(--text);
  outline:none;
  font-weight:800;
  font-size:13px;
}

/* Quitar estilo blanco nativo del select */
#marca,
#tipo{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(255,255,255,.7) 50%),
    linear-gradient(135deg, rgba(255,255,255,.7) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 12px) 50%;
  background-size:6px 6px, 6px 6px;
  background-repeat:no-repeat;
  padding-right:34px;
}

/* Placeholder */
#modelo::placeholder,
#anio::placeholder,
#vehiculo::placeholder{
  color: rgba(229,231,235,.55);
  font-weight:750;
}

/* Resumen readonly */
#vehiculo[readonly]{
  opacity:.95;
}

/* Acciones vehículo */
.vehActions{
  display:flex;
  gap:12px;
  margin-top:10px;
  align-items:center;
  flex-wrap:wrap;
}

.vehHint{
  font-size:12px;
  opacity:.75;
}

/* =======================================
   VEHÍCULO PRO – Layout y estilo final
======================================= */

.vehGrid{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr 0.7fr;
  gap:10px;
  align-items:start;
}

/* Resumen ocupa fila completa */
.vehGrid #vehiculo{
  grid-column: 1 / -1;
}

/* Inputs y selects con estilo integrado */
#marca,
#modelo,
#tipo,
#anio,
#vehiculo{
  width:100%;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.06);
  color: var(--text);
  outline:none;
  font-weight:800;
  font-size:13px;
}

/* Quitar estilo blanco nativo del select */
#marca,
#tipo{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(255,255,255,.7) 50%),
    linear-gradient(135deg, rgba(255,255,255,.7) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 12px) 50%;
  background-size:6px 6px, 6px 6px;
  background-repeat:no-repeat;
  padding-right:34px;
}

/* Placeholder coherente */
#modelo::placeholder,
#anio::placeholder,
#vehiculo::placeholder{
  color: rgba(229,231,235,.55);
  font-weight:750;
}

/* Resumen readonly más sutil */
#vehiculo[readonly]{
  opacity:.95;
}

/* Acciones */
.vehActions{
  display:flex;
  gap:12px;
  margin-top:10px;
  align-items:center;
  flex-wrap:wrap;
}

.vehHint{
  font-size:12px;
  opacity:.75;
}

/* Responsive */
@media (max-width: 980px){
  .vehGrid{
    grid-template-columns: 1fr 1fr;
  }
  .vehGrid #vehiculo{
    grid-column: 1 / -1;
  }
}


/* ===== MODO SOL (alto contraste, para exterior) ===== */
body.sunmode{
  background:#ffffff !important;
  color:#111827 !important;
}

body.sunmode .card,
body.sunmode .panel,
body.sunmode .box,
body.sunmode .wrap,
body.sunmode .container{
  background:#ffffff !important;
  border:2px solid #111827 !important;
  box-shadow:none !important;
}

body.sunmode input,
body.sunmode select,
body.sunmode textarea{
  background:#ffffff !important;
  color:#111827 !important;
  border:2px solid #111827 !important;
}

body.sunmode label,
body.sunmode .muted,
body.sunmode .sub,
body.sunmode .hint{
  color:#111827 !important;
  opacity:1 !important;
}

body.sunmode h1,
body.sunmode h2,
body.sunmode h3{
  color:#000 !important;
}

body.sunmode .btn,
body.sunmode button{
  background:#111827 !important;
  color:#fff !important;
  border:2px solid #111827 !important;
}

body.sunmode{
  font-size:18px;            /* sube lectura */
}

@media (max-width: 900px){
  body.sunmode{ font-size:19px; }
}