:root{--brand:#9d1d20;--brand-dark:#7f1518;--brand-soft:#fde8e8;--ok:#2e7d32;--ok-bg:#ebf7ee;--warn:#ef6c00;--warn-bg:#fff4e7;--bad:#c62828;--muted:#6b7280;--line:#d8dce3;--bg:#f6f7f9;--card-shadow:0 18px 38px rgba(15,23,42,.06)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(180deg,#f6f7f9 0%,#eef1f6 100%);font-family:Arial,Helvetica,sans-serif;color:#1f2937}.public-shell{max-width:1040px;margin:0 auto;padding:20px}.hero{background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px 20px;display:flex;align-items:center;gap:16px;box-shadow:var(--card-shadow)}.hero-lg{padding:24px 26px}.hero img{width:72px;height:auto}.hero h1{margin:0 0 6px;color:var(--brand);font-size:clamp(1.7rem,2.5vw,2.3rem)}.hero p{margin:0;color:#4b5563;line-height:1.45}.hero-kicker{font-size:.82rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--brand);margin-bottom:8px}.wizard{margin-top:18px;background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:var(--card-shadow)}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:18px}.step{padding:12px;border-radius:14px;text-align:center;background:#f1f3f6;color:#6b7280;font-weight:700;border:1px solid transparent}.step.active{background:#fde8e8;color:var(--brand);border-color:#f3c2c2}.grid{display:grid;gap:14px}.grid-2{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.section-title{font-size:1.05rem;font-weight:800;margin-bottom:16px;color:#111827}.field{display:flex;flex-direction:column;gap:6px}.field label{font-weight:700}.field input,.field select,.field textarea{padding:12px 13px;border:1px solid var(--line);border-radius:12px;background:#fff;transition:border-color .18s ease,box-shadow .18s ease}.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:#d47274;box-shadow:0 0 0 4px rgba(157,29,32,.08)}.field textarea{min-height:100px;resize:vertical}.field-help{font-size:12px;color:var(--muted);line-height:1.4}.field-error{font-size:12px;color:var(--bad);min-height:16px}.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:var(--bad);background:#fff9f9}.wizard-actions{display:flex;justify-content:space-between;gap:12px;margin-top:22px;align-items:center}.wizard-actions-right{margin-left:auto;display:flex;gap:12px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border-radius:12px;border:1px solid transparent;font-weight:700;cursor:pointer;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease,background .15s ease,color .15s ease;box-shadow:0 8px 18px rgba(15,23,42,.05)}.btn:hover{transform:translateY(-1px)}.btn-primary{background:var(--brand);color:#fff}.btn-primary:hover{background:var(--brand-dark)}.btn-secondary{background:#fff;border-color:var(--line);color:#111827}.btn-secondary:hover{border-color:#bfc6d2;background:#f9fafb}.service-list{display:grid;gap:12px}.service-item{border:1px solid var(--line);border-radius:14px;padding:16px;background:#fff;cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease,transform .15s ease}.service-item:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(15,23,42,.05)}.service-item.active{border-color:var(--brand);box-shadow:0 0 0 3px rgba(157,29,32,.08)}.service-item.disabled{opacity:.55;cursor:not-allowed;background:#fafafa;box-shadow:none}.service-code{display:inline-block;background:#fef0f0;color:var(--brand);border-radius:999px;padding:4px 8px;font-weight:700;margin-right:8px}.autocomplete{position:relative}.autocomplete-list{position:absolute;left:0;right:0;top:100%;background:#fff;border:1px solid var(--line);border-radius:12px;margin-top:6px;box-shadow:0 12px 30px rgba(0,0,0,.08);z-index:20;max-height:260px;overflow:auto}.autocomplete-item{padding:10px 12px;cursor:pointer}.autocomplete-item:hover{background:#f7f7f8}.calendar-legend{display:flex;gap:14px;flex-wrap:wrap;margin:14px 0 18px}.legend-item{display:flex;align-items:center;gap:8px;font-size:14px}.legend-dot{width:14px;height:14px;border-radius:50%}.dot-green{background:#2e7d32}.dot-red{background:#c62828}.dot-orange{background:#ef6c00}.dot-gray{background:#9ca3af}.calendar-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;gap:8px;flex-wrap:wrap}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}.dow,.day{padding:10px;border-radius:12px;text-align:center}.dow{font-weight:700;color:#6b7280}.day{background:#f3f4f6;min-height:72px;border:1px solid transparent;transition:transform .15s ease}.day.available{background:#e8f5e9;border-color:#b8dfba;cursor:pointer}.day.available:hover{transform:translateY(-1px)}.day.complete{background:#fde8e8;border-color:#efb3b3}.day.festivo{background:#fff1dd;border-color:#f4c48a}.day.closed,.day.past{background:#edf0f4;color:#9ca3af}.day.selected{outline:3px solid rgba(157,29,32,.18);border-color:var(--brand)}.slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}.slot{padding:13px;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;text-align:center;transition:transform .15s ease,border-color .15s ease,background .15s ease}.slot:hover{transform:translateY(-1px)}.slot.active{border-color:var(--brand);background:#fde8e8}.summary{background:#fafafa;border:1px dashed var(--line);padding:18px;border-radius:16px}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px 18px}.summary p{margin:0;line-height:1.45}.summary strong{color:#111827}.compact-summary{margin-top:18px}.hidden{display:none!important}.error-global,.info-banner{margin:0 0 14px;padding:13px 15px;border-radius:12px;font-weight:700;border:1px solid transparent}.error-global{background:#fde8e8;color:#9b1c1c;border-color:#f3c2c2}.info-banner{background:#f4f6fb;color:#334155;border-color:#dbe2ee}.ok-banner{background:var(--ok-bg);color:var(--ok);border-color:#bee2c6}.warn-banner{background:var(--warn-bg);color:#a04e00;border-color:#f3d19c}.success-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px;margin-top:18px;box-shadow:var(--card-shadow)}.success-ticket-wrap{text-align:center;margin-bottom:18px}.success-subline{font-size:1rem;color:#4b5563}.success-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:22px}.ticket-big{font-size:38px;font-weight:800;color:var(--brand);letter-spacing:1px;margin:0}.muted{color:var(--muted)}.centered{text-align:center}.small{font-size:12px}@media (max-width:700px){.steps{grid-template-columns:1fr 1fr}.calendar-grid{gap:6px}.day{min-height:58px;padding:8px}.public-shell{padding:12px}.wizard{padding:16px}.hero-lg{padding:18px}.wizard-actions{align-items:stretch;flex-direction:column}.wizard-actions-right{margin-left:0;width:100%}.wizard-actions-right .btn,.wizard-actions .btn{width:100%}}
.error-global.hidden{display:none;}

/* --- Ajustes visuales para tablet --- */
@media (min-width: 768px) and (max-width: 1280px), (pointer: coarse) and (min-width: 768px) {
  html { font-size: 18px; }
  body { line-height: 1.5; }
  .public-shell { max-width: 1180px; padding: 28px; }
  .hero, .hero-lg { border-radius: 26px; padding: 28px 30px; gap: 22px; }
  .hero img { width: 92px; }
  .hero-kicker { font-size: 0.95rem; }
  .hero h1 { font-size: clamp(2.2rem, 3vw, 2.8rem); }
  .hero p { font-size: 1.08rem; }
  .wizard, .success-card { border-radius: 26px; padding: 30px; }
  .steps { gap: 12px; margin-bottom: 24px; }
  .step { padding: 16px 14px; min-height: 64px; display:flex; align-items:center; justify-content:center; font-size: 1.02rem; }
  .section-title { font-size: 1.3rem; margin-bottom: 18px; }
  .grid { gap: 18px; }
  .grid-2, .summary-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
  .field label { font-size: 1.02rem; }
  .field input, .field select, .field textarea {
    min-height: 58px;
    padding: 15px 16px;
    border-radius: 14px;
    font-size: 1.06rem;
  }
  .field textarea { min-height: 130px; }
  .field-help, .field-error, .small { font-size: 0.92rem; }
  .info-banner, .error-global {
    padding: 16px 18px;
    border-radius: 14px;
    font-size: 1rem;
  }
  .calendar-legend { gap: 18px; margin: 18px 0 22px; }
  .legend-item { font-size: 1rem; }
  .legend-dot { width: 16px; height: 16px; }
  .service-list, .slots { gap: 14px; }
  .service-item { padding: 20px; border-radius: 16px; }
  .service-code { padding: 6px 10px; font-size: 0.95rem; }
  .calendar-head { margin-bottom: 16px; }
  .dow, .day { border-radius: 14px; font-size: 1rem; }
  .day { min-height: 88px; padding: 14px 10px; }
  .slots { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
  .slot {
    min-height: 58px;
    padding: 16px 14px;
    border-radius: 14px;
    font-size: 1.02rem;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .summary { padding: 22px; border-radius: 18px; }
  .summary p { font-size: 1rem; }
  .wizard-actions { gap: 16px; margin-top: 28px; }
  .wizard-actions-right { gap: 14px; }
  .btn {
    min-height: 58px;
    padding: 15px 22px;
    border-radius: 14px;
    font-size: 1.05rem;
  }
  .ticket-big { font-size: 3.1rem; }
  .success-subline, .muted { font-size: 1rem; }
  #btnPantallaCompleta {
    padding: 16px 22px !important;
    font-size: 1.1rem !important;
    border-radius: 14px !important;
    bottom: 24px !important;
    right: 24px !important;
  }
}


/* --- Modo kiosco tablet (solo con print_ticket=1) --- */
body.kiosk-mode {
  min-height: 100vh;
}

body.kiosk-mode .public-shell {
  max-width: none;
  width: min(1400px, 100%);
  padding: 16px 18px 110px;
}

body.kiosk-mode .hero,
body.kiosk-mode .wizard,
body.kiosk-mode .success-card {
  border-radius: 26px;
}

body.kiosk-mode .wizard,
body.kiosk-mode .success-card {
  box-shadow: 0 24px 48px rgba(15,23,42,.08);
}

body.kiosk-mode .section-title {
  font-size: 1.2rem;
}

body.kiosk-mode .wizard-actions {
  position: sticky;
  bottom: 10px;
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.96) 24%, rgba(255,255,255,1) 100%);
  padding-top: 16px;
  z-index: 8;
}

body.kiosk-mode .summary,
body.kiosk-mode .info-banner,
body.kiosk-mode .error-global {
  border-radius: 18px;
}

body.kiosk-mode .btn-kiosk-fullscreen {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 99999;
  box-shadow: 0 18px 30px rgba(10,124,221,.28);
}

body.kiosk-mode .kiosk-actions .btn,
body.kiosk-mode .wizard-actions .btn {
  min-width: 220px;
}

@media (min-width: 768px) and (max-width: 1366px), (pointer: coarse) and (min-width: 768px) {
  body.kiosk-mode html { font-size: 20px; }
  body.kiosk-mode .public-shell {
    width: 100%;
    padding: 20px 22px 130px;
  }
  body.kiosk-mode .hero,
  body.kiosk-mode .hero-lg {
    padding: 32px 34px;
    gap: 24px;
  }
  body.kiosk-mode .hero img { width: 104px; }
  body.kiosk-mode .hero-kicker { font-size: 1rem; }
  body.kiosk-mode .hero h1 { font-size: clamp(2.5rem, 3.8vw, 3.2rem); }
  body.kiosk-mode .hero p { font-size: 1.18rem; }
  body.kiosk-mode .wizard,
  body.kiosk-mode .success-card {
    padding: 34px;
  }
  body.kiosk-mode .steps { gap: 14px; margin-bottom: 26px; }
  body.kiosk-mode .step {
    min-height: 82px;
    padding: 18px 16px;
    font-size: 1.12rem;
    border-radius: 18px;
  }
  body.kiosk-mode .section-title { font-size: 1.45rem; }
  body.kiosk-mode .field label,
  body.kiosk-mode .summary p,
  body.kiosk-mode .legend-item,
  body.kiosk-mode .success-subline,
  body.kiosk-mode .muted,
  body.kiosk-mode .dow,
  body.kiosk-mode .day,
  body.kiosk-mode .slot,
  body.kiosk-mode .service-item,
  body.kiosk-mode .btn,
  body.kiosk-mode .info-banner,
  body.kiosk-mode .error-global {
    font-size: 1.12rem;
  }
  body.kiosk-mode .field input,
  body.kiosk-mode .field select,
  body.kiosk-mode .field textarea,
  body.kiosk-mode .btn,
  body.kiosk-mode .slot {
    min-height: 68px;
    padding: 18px 18px;
    border-radius: 16px;
  }
  body.kiosk-mode .btn {
    font-size: 1.16rem;
    min-width: 240px;
  }
  body.kiosk-mode .field textarea { min-height: 150px; }
  body.kiosk-mode .grid-2,
  body.kiosk-mode .summary-grid { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
  body.kiosk-mode .service-list,
  body.kiosk-mode .slots { gap: 16px; }
  body.kiosk-mode .service-item { padding: 24px; border-radius: 18px; }
  body.kiosk-mode .service-code { font-size: 1rem; padding: 7px 12px; }
  body.kiosk-mode .calendar-grid { gap: 10px; }
  body.kiosk-mode .day { min-height: 100px; padding: 16px 12px; border-radius: 16px; }
  body.kiosk-mode .slots { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
  body.kiosk-mode .summary { padding: 24px; }
  body.kiosk-mode .ticket-big { font-size: 4rem; }
  body.kiosk-mode .btn-kiosk-fullscreen {
    right: 22px;
    bottom: 22px;
    min-width: auto;
    padding: 18px 24px;
    font-size: 1.15rem;
    border-radius: 16px;
  }
}


.hero-actions{margin-top:16px;display:flex;gap:12px;flex-wrap:wrap}.ticket-label{font-size:.92rem;font-weight:800;color:var(--brand);letter-spacing:.04em;text-transform:uppercase;margin-bottom:6px}.ticket-manage{font-size:42px}.ticket-inline{margin-top:10px;font-size:1rem;color:#374151}.consult-card{margin-top:18px}.consult-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.consult-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-start;margin-top:20px}.consult-summary{margin-top:18px}.state-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;font-weight:800;font-size:.92rem;background:#eef2ff;color:#3730a3}.state-chip.cancelada,.state-chip.ausente{background:#fde8e8;color:#991b1b}.state-chip.finalizada{background:#ebf7ee;color:#166534}.result-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}.result-meta{display:flex;flex-direction:column;gap:8px}.management-card{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;border-radius:16px;padding:14px 16px;font-weight:700}.management-card strong{display:block;font-size:1.45rem;color:#7c2d12;margin-top:4px}.inline-note{font-size:.92rem;color:#4b5563;margin-top:10px}.summary-span{grid-column:1/-1}@media (max-width:700px){.result-head,.consult-actions,.hero-actions{flex-direction:column}.consult-actions .btn,.hero-actions .btn{width:100%}}
