:root {
  color-scheme: light;
  --ink: #17211b;
  --muted: #68736c;
  --line: #dfe6e1;
  --paper: #f4f6f2;
  --card: #ffffff;
  --green: #176b4d;
  --green-soft: #e4f3eb;
  --amber: #9a5b08;
  --amber-soft: #fff1d6;
  --red: #a23b38;
  --red-soft: #fae9e7;
}

* { box-sizing: border-box; }
.work-item.is-sending .decision-state::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 8px;
  border: 2px solid #bcd8cd;
  border-top-color: #176c50;
  border-radius: 50%;
  animation: sending-spin 1s linear infinite;
}
@keyframes sending-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .work-item.is-sending .decision-state::before { animation: none; }
}
.work-item.is-sent .work-main { display: none; }
.work-item.is-sent .work-actions > :not(.decision-state) { display: none; }
.work-item.is-sent { background: var(--green-soft); }
.work-item.is-sent .decision-state { color: var(--green); font-weight: 700; }
.work-item.send-error .decision-state { color: #a52d2d; font-weight: 700; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.topbar {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  align-items: end;
  padding: 2.5rem clamp(1.25rem, 4vw, 4rem);
  color: white;
  background:
    radial-gradient(circle at 80% 20%, rgba(116, 195, 152, .23), transparent 30%),
    #14271f;
}

h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: .5rem; font-size: clamp(2rem, 4vw, 3.5rem); letter-spacing: -.045em; }
h2 { margin-bottom: .35rem; font-size: 1.5rem; letter-spacing: -.025em; }
h3 { margin-bottom: .25rem; }

.eyebrow {
  margin-bottom: .5rem;
  color: #87cfa9;
  font-size: .73rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.subtitle, .panel-heading p, .opportunity p { color: var(--muted); }
.topbar .subtitle { margin-bottom: 0; color: #b9c9c1; }

.safety {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: .55rem;
  padding: .7rem .9rem;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  color: #d7e7df;
  font-size: .82rem;
}
.safety-dot { width: .55rem; height: .55rem; border-radius: 50%; background: #69d399; }
.nav-link { color: #d7e7df; }

main { padding: 1.5rem clamp(1.25rem, 4vw, 4rem) 4rem; }

.summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}

.summary-card, .panel {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--card);
  box-shadow: 0 8px 30px rgba(22, 44, 33, .04);
}

.summary-card { padding: 1.1rem 1.25rem; }
button.summary-card {
  font: inherit;
  text-align: left;
  cursor: pointer;
  width: 100%;
  transition: border-color .15s, box-shadow .15s;
}
button.summary-card:hover, button.summary-card:focus-visible {
  border-color: var(--green);
  box-shadow: 0 10px 32px rgba(23, 107, 77, .13);
}
.leads-detail-panel .panel-heading button {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--card);
  padding: .4rem .8rem;
  cursor: pointer;
  font: inherit;
}
.leads-detail-panel td small { color: var(--muted); }

.objectives-list { display: grid; gap: .5rem; margin-top: 1rem; }
.objective-line {
  display: grid;
  grid-template-columns: 1.4rem 3.2rem minmax(9rem, 1.6fr) 4.5rem minmax(6rem, 1fr) minmax(9rem, 1.3fr);
  gap: .6rem;
  align-items: center;
  padding: .65rem .8rem;
  border-left: 5px solid var(--green);
  border-radius: .7rem;
  background: #f4f8f5;
  font-size: .85rem;
}
.objective-line.objective-behind { border-left-color: var(--red); background: #fff7f5; }
.priority-mark { color: #c58a16; font-size: 1.1rem; text-align: center; }
.grade-badge {
  font-weight: 800; font-size: .75rem; text-align: center;
  padding: .2rem .3rem; border-radius: 6px; letter-spacing: -.02em;
  background: #eef3ef; color: var(--muted);
}
.grade-badge.grade-good { background: #e3f3ea; color: var(--green); }
.grade-badge.grade-watch { background: #fff6df; color: #8a6a10; }
.grade-badge.grade-critical { background: #fbe9e7; color: var(--red); }
.objective-name { display: flex; flex-direction: column; }
.objective-name small { color: var(--muted); font-weight: 400; font-size: .7rem; }
.today-link {
  font-weight: 800; text-align: center; padding: .3rem .4rem; border-radius: 8px;
  background: var(--green); color: white; text-decoration: none;
}
.today-link.disabled { background: #dfe6e1; color: var(--muted); }
.objective-progress small { color: var(--muted); }
.objective-line .negative { color: var(--red); }
.objective-line .positive { color: var(--green); }
.quota-badge {
  display: inline-block; margin-left: .3rem; padding: .05rem .4rem;
  border-radius: 999px; font-size: .72rem; font-weight: 800;
  background: #d7f0e4; color: #0d6b45; vertical-align: middle;
}
.quota-badge.quota-warning { background: #ffe9c2; color: #8a5a06; }
.quota-badge.quota-full, .quota-badge.quota-danger { background: #fbdad6; color: var(--red); }
.objective-total {
  margin-top: .5rem; border-left-color: var(--ink); background: #eef1ef;
  font-weight: 800;
}
.objective-counts { display: flex; flex-direction: column; gap: .3rem; }
.queue-badge { color: #8a5a06; background: #fff0d4; border-radius: 6px; padding: .2rem .35rem; text-align: center; font-size: .7rem; white-space: nowrap; }
.objective-total .today-link { font-size: 1.25rem; }
.objective-counts button.today-link { border: 0; cursor: pointer; font-size: inherit; font-family: inherit; }
.coupons-dialog { width: min(640px, calc(100vw - 24px)); max-height: 88dvh; border: 0; border-radius: 20px; padding: 20px; color: var(--ink); background: #fff; box-sizing: border-box; }
.coupons-dialog::backdrop { background: rgba(15, 35, 26, .65); }
.coupons-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.coupons-heading h2 { font-size: 1.15rem; margin: 0; }
.coupons-heading button { padding: 8px 12px; border: 0; border-radius: 8px; background: #edf2ee; cursor: pointer; }
.coupons-days { display: flex; gap: 8px; overflow-x: auto; padding: 8px 0; }
.coupon-day { flex: 0 0 76px; display: flex; flex-direction: column; gap: 4px; padding: 8px; background: #f0f5f2; color: var(--ink); border: 1px solid #dbe5de; border-radius: 10px; cursor: pointer; }
.coupon-day span { font-size: .75rem; }
.coupon-day strong { font-size: 1.25rem; }
.coupon-day[aria-pressed="true"] { background: var(--green); color: #fff; }
.coupons-items { display: grid; gap: 8px; max-height: 45dvh; overflow-y: auto; }
.coupon-item { padding: 12px; border: 1px solid #dbe5de; border-radius: 10px; background: #f6faf7; }
.coupon-item p { margin: 5px 0; }
.coupon-item small { color: var(--muted); }
.coupons-pagination { display: flex; justify-content: space-between; gap: 8px; margin-top: 12px; }

@media (max-width: 760px) {
  .objective-line { grid-template-columns: 1.2rem 2.6rem 1fr auto; }
  .objective-line .objective-progress, .objective-line > span:last-child { grid-column: 3 / -1; font-size: .78rem; }
}
.summary-card span { display: block; color: var(--muted); font-size: .8rem; }
.summary-card strong { display: block; margin-top: .15rem; font-size: 2rem; letter-spacing: -.04em; }
.summary-card.alert { border-color: #edcfcc; background: #fff9f8; }
.summary-card.alert strong { color: var(--red); }
.summary-link { color: inherit; text-decoration: none; }
.summary-link small { display: block; margin-top: .3rem; color: var(--muted); }
.summary-link:hover, .summary-link:focus-visible {
  border-color: var(--green); box-shadow: 0 10px 32px rgba(23, 107, 77, .13);
}
.date-value { font-size: 1.35rem !important; }

.notice {
  margin-bottom: 1rem;
  padding: 1rem 1.2rem;
  border: 1px solid #d7c99f;
  border-radius: 12px;
  color: #6b5412;
  background: #fff9e8;
}

.panel { margin-top: 1rem; overflow: hidden; }
.panel-heading {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  align-items: end;
  padding: 1.25rem 1.4rem;
  border-bottom: 1px solid var(--line);
}
.panel-heading p { max-width: 35rem; margin-bottom: 0; font-size: .85rem; }

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: .86rem; }
th, td { padding: .9rem 1rem; border-bottom: 1px solid #edf0ed; text-align: left; vertical-align: top; }
th { color: var(--muted); background: #fafbf9; font-size: .7rem; letter-spacing: .04em; text-transform: uppercase; }
tbody tr:last-child td { border-bottom: 0; }

.status {
  display: inline-block;
  padding: .3rem .5rem;
  border-radius: 999px;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
}
.status-critical { color: var(--red); background: var(--red-soft); }
.status-behind { color: var(--amber); background: var(--amber-soft); }
.status-on_track, .status-ahead { color: var(--green); background: var(--green-soft); }
.negative { color: var(--red); font-weight: 700; }
.positive { color: var(--green); font-weight: 700; }
.course { display: block; max-width: 17rem; }
.muted { display: block; margin-top: .2rem; color: var(--muted); font-size: .72rem; }
.policy {
  display: inline-block;
  margin-bottom: .25rem;
  padding: .25rem .45rem;
  border-radius: 6px;
  color: #294238;
  background: #e5eee9;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
}
.policy-increase { color: var(--green); background: var(--green-soft); }
.policy-decrease { color: var(--amber); background: var(--amber-soft); }
.policy-minimum { color: #31558d; background: #e8f0fb; }

.opportunity-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.opportunity {
  display: grid;
  grid-template-columns: 4rem 1fr;
  gap: 1rem;
  padding: 1.4rem;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.score {
  display: grid;
  place-items: center;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  color: white;
  background: var(--green);
  font-size: 1.25rem;
  font-weight: 800;
}
.opportunity ul { margin: 1rem 0 0; padding: 0; list-style: none; }
.opportunity li {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .1rem 1rem;
  padding: .5rem 0;
  border-top: 1px solid #edf0ed;
}
.opportunity li strong { color: var(--green); }
.opportunity small { grid-column: 1 / -1; color: var(--muted); }
.opportunity.compact { align-items: start; }
.opportunity.compact .score { width: 2.8rem; height: 2.8rem; font-size: 1rem; }
.batch-actions { display: flex; gap: 1rem; align-items: center; padding: 1rem 1.4rem; }
.batch-actions button {
  padding: .7rem 1rem; border: 0; border-radius: 9px;
  color: white; background: var(--green); font-weight: 750; cursor: pointer;
}
.batch-decision, .batch-note {
  width: 100%; min-width: 9rem; padding: .45rem; border: 1px solid var(--line); border-radius: 7px;
}
.batch-note { margin-top: .4rem; }

@media (max-width: 900px) {
  .topbar, .panel-heading { align-items: start; flex-direction: column; }
  .summary-grid { grid-template-columns: repeat(2, 1fr); }
  .opportunity-grid { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .summary-grid { grid-template-columns: 1fr; }
  .safety { align-items: start; border-radius: 12px; }
}

.mobile-body { min-height: 100vh; background: #edf2ee; }
.mobile-header {
  position: sticky; top: 0; z-index: 10; display: flex; justify-content: space-between;
  align-items: center; padding: max(1rem, env(safe-area-inset-top)) 1.1rem 1rem;
  color: white; background: #14271f; box-shadow: 0 4px 20px rgba(0,0,0,.12);
}
.mobile-header h1 { margin: 0; font-size: 1.45rem; letter-spacing: -.03em; }
.mobile-header .eyebrow { margin-bottom: .15rem; }
.mobile-live { display: flex; align-items: center; gap: .4rem; font-size: .75rem; }
.mobile-live i { width: .55rem; height: .55rem; border-radius: 50%; background: #69d399; }
.mobile-main { max-width: 46rem; margin: auto; padding: 1rem 1rem 5rem; }
.mobile-summary { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.mobile-summary article, .chat-card, .mobile-audit {
  border: 1px solid var(--line); border-radius: 16px; background: white;
  box-shadow: 0 8px 25px rgba(22,44,33,.05);
}
.mobile-summary article { padding: .8rem; }
.mobile-summary span { display: block; color: var(--muted); font-size: .68rem; }
.mobile-summary strong { font-size: .85rem; }
.chat-card { margin-top: .8rem; overflow: hidden; }
.assistant-message { display: flex; gap: .75rem; padding: 1rem; background: #f7faf8; }
.assistant-message p { margin: .15rem 0 0; color: var(--muted); font-size: .83rem; }
.avatar {
  display: grid; place-items: center; flex: 0 0 2.1rem; height: 2.1rem;
  border-radius: 50%; color: white; background: var(--green); font-weight: 800;
}
.mobile-candidates { margin: 0; padding: 0; list-style: none; }
.mobile-candidates li { display: flex; gap: .75rem; padding: .9rem 1rem; border-top: 1px solid #edf0ed; }
.candidate-number {
  display: grid; place-items: center; flex: 0 0 1.8rem; height: 1.8rem;
  border-radius: 8px; color: var(--green); background: var(--green-soft); font-weight: 800;
}
.mobile-candidates span, .mobile-candidates b, .mobile-candidates small { display: block; }
.mobile-candidates span { margin-top: .18rem; color: var(--muted); font-size: .78rem; }
.mobile-candidates b { margin-top: .25rem; color: var(--green); font-size: .78rem; }
.mobile-candidates small { margin-top: .18rem; color: var(--muted); }
.command-box { padding: 1rem; border-top: 1px solid var(--line); background: #fafcfb; }
.command-box label { display: block; margin-bottom: .4rem; font-size: .78rem; font-weight: 750; }
.command-box textarea {
  width: 100%; padding: .75rem; border: 1px solid #cad7cf; border-radius: 10px;
  font: inherit; resize: vertical;
}
.command-box button {
  width: 100%; margin-top: .6rem; padding: .8rem; border: 0; border-radius: 10px;
  color: white; background: var(--green); font-weight: 800;
}
.command-result { margin: .55rem 0 0; color: var(--muted); font-size: .78rem; }
.mobile-audit { margin-top: .8rem; padding: 1rem; }
.mobile-audit h2 { font-size: 1rem; }
.mobile-audit article { display: grid; grid-template-columns: 3rem 1fr; padding: .5rem 0; border-top: 1px solid #edf0ed; }
.mobile-audit article span, .mobile-audit article small { color: var(--muted); font-size: .7rem; }
.mobile-audit article small { grid-column: 2; }

.safety-warning .safety-dot { background: #f2b84b; }
.work-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.source-state { color: var(--amber); font-size: 1.25rem !important; }
.queue-count {
  display: inline-grid; place-items: center; min-width: 1.8rem; height: 1.8rem;
  margin-left: .35rem; border-radius: 999px; color: var(--green);
  background: var(--green-soft); font-size: .8rem; vertical-align: .15rem;
}
.work-list { display: grid; }
.work-item {
  display: grid; grid-template-columns: auto 5rem minmax(0, 1fr) auto; gap: 1rem;
  align-items: start; padding: 1rem 1.4rem; border-bottom: 1px solid #edf0ed;
}
.work-item:last-child { border-bottom: 0; }
.work-item.tone-valid { box-shadow: inset 4px 0 0 #2f9e44; }
.work-item.tone-invalid { box-shadow: inset 4px 0 0 #d94841; }
.work-item.tone-centre-rejected { box-shadow: inset 4px 0 0 #e67700; }
.work-state {
  padding: .35rem .45rem; border-radius: 8px; text-align: center;
  font-size: .65rem; font-weight: 850; letter-spacing: .04em;
}
.state-ready { color: var(--green); background: var(--green-soft); }
.state-review { color: var(--amber); background: var(--amber-soft); }
.state-block { color: var(--red); background: var(--red-soft); }
.work-title { display: flex; justify-content: space-between; gap: 1rem; }
.work-title strong, .work-title span { display: block; }
.work-title span, .work-title time { margin-top: .2rem; color: var(--muted); font-size: .76rem; }
.tone-text-valid { color: #238636 !important; }
.tone-text-invalid { color: #c92a2a !important; }
.tone-text-centre-rejected { color: #d05a00 !important; }
.quality { margin: .65rem 0; font-size: .82rem; }
.work-history {
  display: grid;
  gap: .25rem;
  margin: .65rem 0;
}
.work-history > small {
  color: var(--muted);
  font-weight: 750;
}
.work-data-alert {
  display: grid;
  width: 100%;
  margin: .65rem 0;
  padding: .7rem .8rem;
  border: 1px solid #e9c675;
  border-radius: 10px;
  color: #6b4b08;
  text-align: left;
  background: #fff8df;
  font: inherit;
}
.work-data-alert span { font-size: .7rem; font-weight: 850; text-transform: uppercase; }
.work-data-alert strong { margin-top: .15rem; font-size: .92rem; }
.work-data-alert small { margin-top: .15rem; color: var(--muted); }
.work-data-alert.phone-invalid { border-color: #e9aaa5; color: var(--red); background: #fff4f2; }
.history-entry {
  margin: 0;
  font-size: .82rem;
  line-height: 1.4;
}
.proposal {
  display: grid; grid-template-columns: 5rem 1fr; gap: .15rem .5rem;
  padding: .65rem .75rem; border-radius: 10px; background: #f5f8f6;
}
.proposal span { color: var(--muted); font-size: .7rem; text-transform: uppercase; }
.proposal strong { color: var(--green); font-size: .82rem; }
.proposal small { grid-column: 2; color: var(--muted); }
.proposal-studies { display: flex; align-items: center; gap: .35rem; }
.proposal-studies[hidden] { display: none; }
.link-button {
  padding: 0; border: 0; background: none; color: var(--green);
  font: inherit; font-size: .78rem; font-weight: 700; text-decoration: underline;
  cursor: pointer;
}
.work-actions { display: grid; gap: .35rem; min-width: 6.5rem; }
.work-actions button {
  padding: .5rem .7rem; border: 0; border-radius: 8px;
  color: white; background: var(--green); font-weight: 750;
}
.work-actions button.secondary { color: var(--ink); background: #e9eeeb; }
.work-actions button.danger { color: var(--red); background: var(--red-soft); }
.work-actions button:disabled { cursor: not-allowed; opacity: .55; }
.work-batchbar {
  display: flex; flex-wrap: wrap;
  align-items: center; gap: .65rem; margin-bottom: 1rem; padding: .8rem 1rem;
  border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.96);
  box-shadow: 0 8px 25px rgba(22,44,33,.08);
}
.work-queue { scroll-margin-top: 1rem; }
.work-batchbar button, .work-batchbar a {
  padding: .6rem .8rem; border: 0; border-radius: 8px; color: white;
  background: var(--green); font-weight: 800; text-decoration: none; display: inline-block;
}
.work-batchbar button.danger { color: var(--red); background: var(--red-soft); }
.work-batchbar a.secondary-link { color: var(--ink); background: #e9eeeb; }
#decision-feedback { flex-basis: 100%; color: var(--muted); font-size: .75rem; }
.objectives-button { background: #c58a16 !important; }
.blue-loading { padding: 1.25rem; color: var(--muted); background: #f7faf8; }
.objectives-results {
  display: grid;
  gap: .55rem;
  max-height: 58vh;
  overflow: auto;
}
.objective-row {
  display: grid;
  grid-template-columns: minmax(9rem, 1.5fr) repeat(3, minmax(5rem, .7fr));
  gap: .35rem .8rem;
  align-items: center;
  padding: .75rem;
  border-left: 5px solid var(--green);
  border-radius: .7rem;
  background: #f4f8f5;
}
.objective-row.objective-behind { border-left-color: var(--red); background: #fff7f5; }
.objective-row small { grid-column: 1 / -1; color: var(--muted); }
.objective-row .negative { color: var(--red); }
.objective-row .positive { color: var(--green); }
.decision-state { color: var(--muted); text-align: center; }
.decided { box-shadow: inset 4px 0 0 var(--green); }
.decided-edit { box-shadow: inset 4px 0 0 var(--amber); }
.decided-block { box-shadow: inset 4px 0 0 var(--red); opacity: .72; }

.setup-body { min-height: 100vh; display: grid; place-items: center; }
.setup-main { width: min(100%, 34rem); padding: 1rem; }
.setup-card {
  padding: 1.5rem; border: 1px solid var(--line); border-radius: 18px;
  background: white; box-shadow: 0 18px 50px rgba(22,44,33,.1);
}
.setup-card h1 { color: var(--ink); font-size: 2rem; }
.setup-card p { color: var(--muted); line-height: 1.5; }
.setup-card label { display: grid; gap: .35rem; margin-top: 1rem; font-weight: 750; }
.setup-card input {
  width: 100%; padding: .8rem; border: 1px solid #cad7cf;
  border-radius: 10px; font: inherit;
}
.setup-card button {
  width: 100%; margin: 1rem 0; padding: .85rem; border: 0; border-radius: 10px;
  color: white; background: var(--green); font-weight: 850;
}

/* iPad (768-1024px aprox) caía en el grid de escritorio de 4 columnas fijas,
   aplastando el texto del lead en una columna muy estrecha. Ampliamos el
   punto de corte para que tablet tambien use el layout apilado de movil. */
@media (max-width: 1024px) {
  .objective-row {
    grid-template-columns: 1fr auto;
  }
  .objective-row strong { grid-column: 1 / -1; }
  .work-summary { grid-template-columns: repeat(2, 1fr); }
  .work-item {
    grid-template-columns: auto minmax(0, 1fr);
    gap: .65rem;
    padding: .9rem;
  }
  .work-select { grid-column: 1; grid-row: 1; }
  .work-state {
    grid-column: 2;
    grid-row: 1;
    justify-self: start;
  }
  .work-main { grid-column: 1 / -1; min-width: 0; }
  .work-actions {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-width: 0;
  }
  .work-actions .scope-override { grid-column: 1 / -1; }
  .work-actions button.danger { grid-column: 1 / -1; }
  .decision-state { grid-column: 1 / -1; }
  .work-title { flex-direction: column; gap: 0; }
  .proposal { grid-template-columns: 4.5rem minmax(0, 1fr); }
}
.course-dialog {
  width: min(720px, calc(100% - 24px));
  max-height: 85vh;
  padding: 0;
  border: 0;
  border-radius: 24px;
  box-shadow: 0 24px 80px rgb(0 0 0 / 25%);
}

.course-dialog::backdrop {
  background: rgb(8 24 18 / 70%);
}

.course-search-card {
  display: grid;
  gap: 18px;
  padding: 24px;
}

.course-search-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.course-search-card label {
  display: grid;
  gap: 8px;
  font-weight: 700;
}

.course-search-card input {
  width: 100%;
  padding: 14px 16px;
  border: 1px solid #bdd0c7;
  border-radius: 12px;
  font: inherit;
}

.course-results {
  display: grid;
  gap: 10px;
  max-height: 52vh;
  overflow: auto;
}

.data-fields {
  display: grid;
  gap: 0.8rem;
  max-height: 55vh;
  overflow: auto;
}

/* One scroll surface: header/close and save remain outside the scrolling body. */
.data-dialog {
  height: min(850px, 88dvh);
  max-height: 88dvh;
  overflow: hidden;
}
.data-dialog .course-search-card {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0;
}
.data-dialog .course-search-heading {
  flex-shrink: 0;
  padding: 18px 20px;
  background: white;
  border-bottom: 1px solid #dce6e0;
}
.data-dialog .course-search-heading h2 {
  font-size: clamp(1.15rem, 4vw, 1.6rem);
  margin: 0;
}
.data-dialog .course-search-heading button {
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid #bdd0c7;
  border-radius: 12px;
  font: inherit;
  flex-shrink: 0;
}
.data-dialog-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  padding: 0 20px 20px;
}
.data-dialog .data-fields {
  max-height: none;
  overflow: visible;
}
.data-dialog-footer {
  flex-shrink: 0;
  padding: 12px 20px max(16px, env(safe-area-inset-bottom));
  background: white;
  border-top: 1px solid #dce6e0;
}
.data-dialog-footer p {
  margin: 0 0 10px;
  font-size: 0.9rem;
}
#save-client-data {
  display: block;
  width: 100%;
  min-height: 52px;
  padding: 14px 20px;
  border: 0;
  border-radius: 14px;
  background: #176c50;
  color: white;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
#save-client-data:disabled { opacity: 0.65; cursor: wait; }

/* En iPad el dialogo (720px) sobraba espacio y cada campo ocupaba una fila
   entera: 8 campos obligaban a hacer scroll vertical para ver el boton de
   guardar. A partir de 640px los mostramos de dos en dos. */
@media (min-width: 640px) {
  .data-fields {
    grid-template-columns: repeat(2, 1fr);
  }
}

.data-field {
  display: grid;
  gap: 0.35rem;
  padding: 0.75rem;
  border: 1px solid #dce6e0;
  border-radius: 0.8rem;
  background: #f7faf8;
}

.data-field small {
  color: #5e6c66;
  line-height: 1.35;
}

.data-field input {
  width: 100%;
}

.data-field-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.data-field-choices button {
  padding: 0.5rem 0.65rem;
  font-size: 0.82rem;
}

.work-location {
  margin: 0.45rem 0;
  padding: 0.55rem 0.7rem;
  border-radius: 0.65rem;
  background: #eef6f1;
  color: #234c3b;
  line-height: 1.35;
}

.scope-override {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.15rem 0.45rem;
  align-items: start;
  padding: 0.55rem 0.65rem;
  border: 1px solid #e5c46c;
  border-radius: 0.65rem;
  background: #fff7df;
  color: #6c4d00;
  font-size: 0.9rem;
  text-align: left;
}

.scope-override input {
  margin-top: 0.15rem;
}

.scope-override small {
  grid-column: 2;
  line-height: 1.25;
}

.course-result {
  width: 100%;
  padding: 14px;
  border: 1px solid #d8e3de;
  border-radius: 12px;
  background: #f7faf8;
  color: #14271f;
  text-align: left;
}

.course-result:hover,
.course-result:focus {
  border-color: #177653;
  background: #eaf5ef;
}

.login-body {
  min-height: 100vh;
  display: grid;
  place-items: center;
  margin: 0;
  padding: max(1rem, env(safe-area-inset-top))
    max(1rem, env(safe-area-inset-right))
    max(1rem, env(safe-area-inset-bottom))
    max(1rem, env(safe-area-inset-left));
  background: #eef3f0;
}

.login-card {
  width: min(100%, 28rem);
  padding: 1.5rem;
  border: 1px solid var(--line);
  border-radius: 1.2rem;
  background: white;
  box-shadow: 0 18px 60px rgb(20 39 31 / 12%);
}

.login-card h1 { margin-top: .3rem; }
.login-card p { color: var(--muted); line-height: 1.45; }
.login-card form, .login-card label { display: grid; gap: .55rem; }
.login-card form { gap: 1rem; }
.login-card label { color: var(--ink); font-weight: 750; }
.login-card input {
  width: 100%;
  padding: .85rem;
  border: 1px solid #c8d6cf;
  border-radius: .7rem;
  font: inherit;
}
.login-card button {
  padding: .85rem;
  border: 0;
  border-radius: .7rem;
  color: white;
  background: var(--green);
  font-weight: 800;
}

.auth-navigation {
  position: fixed;
  z-index: 30;
  right: max(.75rem, env(safe-area-inset-right));
  bottom: max(.75rem, env(safe-area-inset-bottom));
  display: flex;
  gap: .4rem;
  padding: .35rem;
  border: 1px solid var(--line);
  border-radius: .8rem;
  background: rgb(255 255 255 / 94%);
  box-shadow: 0 8px 30px rgb(20 39 31 / 16%);
}

.auth-navigation a,
.auth-navigation button {
  padding: .55rem .65rem;
  border: 0;
  border-radius: .55rem;
  color: var(--ink);
  background: #edf3ef;
  font: inherit;
  font-size: .78rem;
  font-weight: 750;
  text-decoration: none;
}

.operations-dashboard { max-width: 92rem; margin: 0 auto; }
.range-panel { display: flex; gap: 1rem; justify-content: space-between; align-items: end; padding: 1rem; }
.range-presets, .range-form { display: flex; gap: .55rem; align-items: end; flex-wrap: wrap; }
.range-panel button { border: 0; border-radius: .65rem; padding: .7rem .9rem; font: inherit; font-weight: 800; color: var(--green); background: var(--green-soft); }
.range-panel button.active, .range-form button { color: white; background: var(--green); }
.range-form label { display: grid; gap: .25rem; color: var(--muted); font-size: .75rem; font-weight: 750; }
.range-form input { padding: .55rem; border: 1px solid var(--line); border-radius: .55rem; font: inherit; }
.live-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0; }
.summary-card.total { color: white; background: var(--green); }.summary-card.total span { color: #d9eee5; }
.daily-chart { display: flex; gap: .65rem; align-items: end; min-height: 245px; padding: 1.5rem; overflow-x: auto; }
.day-column { display: grid; grid-template-rows: 1.4rem 180px 1.4rem; flex: 1 0 2.3rem; min-width: 2.3rem; align-items: end; justify-items: center; }
.day-column strong { font-size: .72rem; }.day-column small { color: var(--muted); font-size: .62rem; white-space: nowrap; }
.stack { display: flex; flex-direction: column; justify-content: end; width: min(2.2rem, 85%); border-radius: .35rem .35rem 0 0; overflow: hidden; }
.stack i { display: block; width: 100%; }.stack .spain { background: #376cc0; }.stack .latam { background: #e59a9a; }.stack .other { background: #bada9c; }
.objective-legend { display: flex; gap: .5rem; padding: .75rem 1.4rem 0; }.objective-legend span { padding: .25rem .45rem; border-radius: 999px; font-size: .68rem; font-weight: 800; }
.objective-legend .critical { color: var(--red); background: var(--red-soft); }.objective-legend .watch { color: var(--amber); background: var(--amber-soft); }.objective-legend .good { color: var(--green); background: var(--green-soft); }
.objective-row.critical { background: #fff8f7; }.objective-row.watch { background: #fffdf6; }.objective-row.good { background: #fbfefc; }
.objectives-table td:first-child small { display: block; color: var(--muted); font-size: .67rem; }.today-count { font-size: 1.2rem; font-weight: 850; }.dashboard-error { margin-top: 1rem; }
@media (max-width: 700px) {
  .operations-topbar { align-items: start; flex-direction: column; }.range-panel { align-items: stretch; flex-direction: column; }.range-form { display: grid; grid-template-columns: 1fr 1fr; }.range-form button { grid-column: 1 / -1; }
  .live-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.live-summary-grid .summary-card { padding: .9rem; }.live-summary-grid .summary-card strong { font-size: 1.75rem; }
  .objectives-table th:nth-child(5),.objectives-table td:nth-child(5),.objectives-table th:nth-child(7),.objectives-table td:nth-child(7){display:none}.objectives-table th,.objectives-table td{padding:.7rem .55rem}
}

.queue-badge-link { text-decoration: none; }
.queue-badge-link:hover .queue-badge { background: #ffe3a8; }