/* ASTROS Gestión — mobile-first. Identidad: degradado naranja → amarillo, blanco. */
:root {
    --orange: #f97316;
    --amber: #facc15;
    --grad: linear-gradient(135deg, #f97316 0%, #fb923c 45%, #facc15 100%);
    --ink: #1f2937;
    --muted: #6b7280;
    --line: #e5e7eb;
    --bg: #fff8f0;
    --card: #ffffff;
    --danger: #dc2626;
    --ok: #15803d;
    --radius: 14px;
    --tab-h: 62px;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    color: var(--ink);
    background: var(--bg);
    line-height: 1.45;
    padding-bottom: calc(var(--tab-h) + env(safe-area-inset-bottom));
}

a { color: #c2410c; }
h1 { font-size: 1.5rem; margin: .4rem 0 1rem; }
h2 { font-size: 1.1rem; margin: 0 0 .75rem; }
h3 { font-size: 1rem; margin: 0 0 .5rem; }
code { background: #fff1e0; padding: 0 .3em; border-radius: 4px; }
small { color: var(--muted); }
.muted { color: var(--muted); }
[hidden] { display: none !important; }

/* Cabecera */
.topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: .65rem 1rem;
    background: var(--grad);
    color: #fff;
    box-shadow: 0 2px 10px rgba(249, 115, 22, .35);
}
.brand { display: flex; align-items: center; gap: .5rem; color: #fff; text-decoration: none; font-weight: 800; letter-spacing: .12em; font-size: 1.15rem; }
.topnav { display: none; gap: .25rem; margin-left: .5rem; }
.topnav a { color: #fff; text-decoration: none; padding: .45rem .8rem; border-radius: 999px; font-weight: 600; }
.topnav a.is-active, .topnav a:hover { background: rgba(255, 255, 255, .25); }
.logout { margin-left: auto; }

/* Barra inferior móvil */
.tabbar {
    position: fixed;
    inset: auto 0 0 0;
    z-index: 20;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    align-items: stretch;
    gap: 4px;
    height: calc(var(--tab-h) + env(safe-area-inset-bottom));
    padding: 6px 8px calc(6px + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, .96);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-top: 1px solid #fde4cf;
    border-radius: 18px 18px 0 0;
    box-shadow: 0 -6px 20px rgba(234, 88, 12, .10);
}
.tabbar a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 44px; border-radius: 14px; font-size: .7rem; font-weight: 600; color: #6b7280; text-decoration: none; transition: background-color .2s ease, color .2s ease; }
.tabbar a svg { transition: transform .2s ease; }
.tabbar a:focus-visible { outline: 3px solid #fdba74; outline-offset: -3px; }
.tabbar a.is-active { color: #c2410c; font-weight: 700; background: linear-gradient(180deg, #fff7ed, #ffedd5); }
.tabbar a.is-active svg { color: #ea580c; transform: translateY(-1px); }
@media (prefers-reduced-motion: reduce) { .tabbar a, .tabbar a svg { transition: none; } }

.container { max-width: 1100px; margin: 0 auto; padding: 1rem; }

/* Componentes */
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem; margin-bottom: 1rem; box-shadow: 0 1px 2px rgba(0, 0, 0, .04); }
.card.empty { text-align: center; color: var(--muted); }
.cards { display: grid; gap: 1rem; grid-template-columns: 1fr; }
.cards .card { margin-bottom: 0; }
.group-card { display: block; text-decoration: none; color: inherit; }
.group-card:hover { border-color: var(--orange); }
.group-card h2 { color: var(--ink); }

.page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.page-head h1 { margin-bottom: .75rem; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-height: 44px; padding: .55rem 1rem; border: 1px solid transparent; border-radius: 999px; font: inherit; font-weight: 700; cursor: pointer; text-decoration: none; }
.btn-primary { background: var(--grad); color: #fff; box-shadow: 0 2px 8px rgba(249, 115, 22, .35); }
.btn-ghost { background: #fff; color: #c2410c; border-color: #fdba74; }
.topbar .btn-ghost { background: rgba(255, 255, 255, .2); color: #fff; border-color: rgba(255, 255, 255, .6); min-height: 38px; }
.btn-light { background: #fff; color: #c2410c; }
.btn-danger { background: #fff; color: var(--danger); border-color: #fecaca; min-height: 38px; padding: .3rem .8rem; }
.btn-block { width: 100%; }

.alert { padding: .7rem 1rem; border-radius: 10px; margin-bottom: 1rem; }
.alert-ok { background: #dcfce7; color: #14532d; }
.alert-err { background: #fee2e2; color: #7f1d1d; }
.alert-warn { background: #fef3c7; color: #78350f; }

.pill { display: inline-block; padding: .15rem .6rem; border-radius: 999px; background: #ffedd5; color: #9a3412; font-size: .8rem; font-weight: 700; }
.pill-out { background: #facc15; color: #422006; }
.pill-soft { background: #f3f4f6; color: #374151; font-weight: 600; }
.tags { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .6rem; }

/* Inicio */
.hx-head { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; flex-wrap: wrap; margin-bottom: 1rem; }
.hx-head h1 { font-size: 2rem; margin: .1rem 0 .15rem; color: #1e2a44; }
.hx-sub { margin: 0; color: var(--muted); }
.hx-sep { margin: 0 .5rem; color: var(--orange); font-weight: 700; }
.hx-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 44px; padding: .45rem 1.1rem; border: 1.5px solid var(--orange); border-radius: 999px; background: #fff; color: #c2410c; font-weight: 700; text-decoration: none; }
.hx-btn svg { flex: none; }
.hx-btn:hover, .hx-btn:focus-visible { background: #fff3e6; }
.hx-btn-sm { min-height: 40px; padding: .3rem 1rem; }
.hx-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; align-items: start; }
.hx-side { display: grid; gap: 1rem; min-width: 0; }
.hx-card { background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 1rem 1.1rem; box-shadow: 0 1px 3px rgba(30, 42, 68, .05); min-width: 0; }
.hx-card-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; margin-bottom: .6rem; }
.hx-card-head h2 { display: flex; align-items: center; gap: .6rem; margin: 0; font-size: 1.15rem; color: #1e2a44; }
.hx-card-head h2 svg { color: var(--orange); flex: none; }
.hx-link { display: inline-flex; align-items: center; gap: .3rem; font-size: .85rem; font-weight: 700; color: #c2410c; text-decoration: none; min-height: 36px; }
.hx-link-pill { border: 1.5px solid var(--orange); border-radius: 999px; padding: .2rem .85rem; background: #fff; }
.hx-ico { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 40px; height: 40px; border-radius: 50%; background: #fff1e3; color: var(--orange); }
.hx-ico svg { width: 20px; height: 20px; }

.hx-table { display: grid; }
.hx-thead, .hx-row { display: grid; grid-template-columns: minmax(130px, 1.2fr) 4.5rem 4.5rem minmax(0, 3fr) minmax(110px, 1fr) 24px; align-items: center; gap: .75rem; padding: .55rem .6rem; }
.hx-thead { background: #fff6ec; border-radius: 10px; font-size: .75rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #374151; }
.hx-row { color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--line); min-height: 56px; }
.hx-row:last-child { border-bottom: 0; }
.hx-row:hover, .hx-row:focus-visible { background: #fffaf4; }
.hx-cell { min-width: 0; overflow-wrap: anywhere; }
.hx-master { display: flex; align-items: center; gap: .6rem; }
.hx-master strong { color: #1e2a44; }
.hx-go { color: #9ca3af; display: inline-flex; }
.hx-pill { display: inline-block; padding: .2rem .75rem; border-radius: 999px; font-size: .82rem; font-weight: 700; white-space: nowrap; }
.hx-pill-pend { background: #ffedd5; color: #c2410c; }
.hx-pill-done { background: #dcfce7; color: #166534; }
.hx-pill-in { background: #dbeafe; color: #1e40af; }
.hx-pill-run { background: #f3f4f6; color: #374151; }
.hx-pill-none { background: #ffedd5; color: #c2410c; }
.hx-pill-empty { background: #fef3c7; color: #92400e; }
.hx-pill-pendiente { background: #f3f4f6; color: #374151; }
.hx-pill-copiando { background: #dbeafe; color: #1e40af; }
.hx-pill-listo { background: #dcfce7; color: #166534; }
.hx-pill-repartidor { background: #ede9fe; color: #5b21b6; }
.hx-pill-entregado { background: #fef3c7; color: #92400e; }
.hx-pill-finalizado { background: #14532d; color: #fff; }
.hx-note { margin: 0 0 .5rem; color: var(--muted); font-size: .88rem; }
.hx-empty { text-align: center; padding: 1.5rem .5rem; }
.hx-empty p { margin: .2rem 0; }

.hx-attn { list-style: none; margin: 0; padding: 0; }
.hx-attn li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .75rem; padding: .7rem 0; }
.hx-attn li + li { border-top: 1px solid var(--line); }
.hx-attn strong { display: block; color: #1e2a44; }
.hx-attn small { display: block; color: var(--muted); font-size: .82rem; }
.hx-none { margin: .5rem 0; }
.hx-quick { display: grid; gap: .6rem; }
.hx-q { display: flex; align-items: center; gap: .75rem; min-height: 48px; padding: .5rem 1rem; border: 1.5px solid var(--orange); border-radius: 12px; background: #fff; color: #c2410c; font-weight: 700; text-decoration: none; }
.hx-q span { flex: 1; min-width: 0; }
.hx-q:hover, .hx-q:focus-visible { background: #fff3e6; }
.hx-q-main { background: #fff; border: 1.5px solid var(--orange); color: #c2410c; }
.hx-q-main svg { color: var(--orange); }
.hx-q-main:hover, .hx-q-main:focus-visible { background: #fff3e6; }
.hx-q-muted { background: #fff; border-color: #cbd5e1; color: #374151; }
.hx-q-muted svg { color: #6b7280; }
.hx-q-muted:hover, .hx-q-muted:focus-visible { background: #f8fafc; }
button.hx-q { font: inherit; width: 100%; text-align: left; cursor: pointer; }


/* móvil: la fila de la tabla se apila con etiquetas */
@media (max-width: 759px) {
    .hx-thead { display: none; }
    .hx-row { grid-template-columns: minmax(0, 1fr) auto 24px; grid-template-areas: "m s g" "c c c" "i o ."; row-gap: .35rem; padding: .7rem .4rem; }
    .hx-master { grid-area: m; }
    .hx-state { grid-area: s; }
    .hx-go { grid-area: g; }
    .hx-school { grid-area: c; }
    .hx-in { grid-area: i; }
    .hx-out { grid-area: o; }
    .hx-in, .hx-out { font-size: .85rem; color: var(--muted); }
    .hx-in::before, .hx-out::before { content: attr(data-l) " "; font-weight: 700; color: #374151; }
    .hx-attn li { grid-template-columns: auto minmax(0, 1fr); }
    .hx-attn li .hx-btn { grid-column: 1 / -1; }
    .hx-head .hx-btn { width: 100%; }
}
@media (min-width: 760px) {
}
.hx-today { padding: 1.25rem 1.4rem; }
.hx-q-prio { min-height: 64px; border: 0; background: #ea580c; color: #fff; font-size: 1.08rem; box-shadow: 0 4px 12px rgba(234, 88, 12, .3); }
.hx-q-prio:hover, .hx-q-prio:focus-visible { background: #c2410c; }
.hx-q-prio svg { color: #fff; }
@media (min-width: 760px) {
    .hx-quick { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
}

.meta { display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem 1rem; margin: 0; }
.meta dt { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.meta dd { margin: 0; font-weight: 600; }
.meta-lg { grid-template-columns: repeat(2, 1fr); margin-bottom: 1rem; }

.list { list-style: none; margin: 0; padding: 0; }
.list li { padding: .5rem 0; border-bottom: 1px solid var(--line); }

.row-item { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .6rem 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.row-item > div { flex: 1 1 200px; }
.inline { display: inline-flex; align-items: center; gap: .5rem; flex-wrap: wrap; }

/* Formularios */
label { display: flex; flex-direction: column; gap: .25rem; font-weight: 600; font-size: .9rem; margin-bottom: .75rem; }
input[type="text"], input[type="search"], input[type="password"], input[type="number"], input[type="date"], select, textarea {
    width: 100%;
    min-height: 44px;
    padding: .55rem .75rem;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    font: inherit;
    background: #fff;
    color: var(--ink);
}
input:focus, select:focus, textarea:focus, .btn:focus-visible, a:focus-visible { outline: 3px solid rgba(249, 115, 22, .45); outline-offset: 1px; }
.grid-2 { display: grid; gap: 0 1rem; grid-template-columns: 1fr; }
.form-inline { display: grid; gap: 0 1rem; grid-template-columns: 1fr; margin-top: 1rem; align-items: end; }
.actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.filters { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.filters input, .filters select { flex: 1 1 180px; width: auto; }
.check { flex-direction: row; align-items: center; font-weight: 500; font-size: .8rem; margin: 0; }
.check input { width: auto; min-height: 0; }

/* Tablas */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table { width: 100%; border-collapse: collapse; font-size: .92rem; }
th, td { padding: .55rem .6rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
thead th { background: #fff7ed; color: #9a3412; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; }
.num { text-align: right; font-variant-numeric: tabular-nums; }
tfoot th { background: #fff7ed; }

.schedule td { min-width: 190px; }
.schedule th { white-space: nowrap; }
.schedule th small { display: block; }
.schedule .cell-extra { display: flex; gap: .4rem; align-items: center; margin-top: .3rem; }
.schedule .cell-extra input[type="text"] { min-height: 34px; padding: .2rem .5rem; }
.schedule tr.is-out { background: #fffbeb; }
.schedule td.is-hl, .is-hl { background: #fef3c7; }

/* Grilla */
.gx-page { --hw: 46px; --lab: 34px; }
.gx-head-top { display: flex; align-items: flex-start; flex-wrap: wrap; gap: .75rem 1.25rem; margin-bottom: .9rem; }
.gx-head-top > div:first-child { flex: 1 1 260px; min-width: 0; }
.gx-head-top h1 { font-size: 1.9rem; margin: .1rem 0 .1rem; color: #1e2a44; }
.gx-sub { margin: 0; color: var(--muted); }
.gx-legend { display: flex; flex-wrap: wrap; gap: .35rem .9rem; list-style: none; margin: .4rem 0 0; padding: 0; font-size: .8rem; color: #374151; }
.gx-legend li { display: inline-flex; align-items: center; gap: .4rem; }
.gx-legend i { width: 14px; height: 14px; border-radius: 50%; flex: none; }
.gx-new { white-space: nowrap; margin-left: auto; }
.gx-legend { flex: 2 1 360px; }
@media (min-width: 1160px) { .gx-page { position: relative; left: 50%; transform: translateX(-50%); width: min(1500px, calc(100vw - 3rem)); } }
.gx-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem 1rem; background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: .8rem 1rem; margin-bottom: .9rem; }
.gx-start-val { display: flex; align-items: center; gap: .6rem; min-height: 42px; position: relative; }
.gx-start-val strong { color: #1e2a44; }
.gx-start-edit summary { cursor: pointer; color: #c2410c; font-weight: 700; font-size: .85rem; list-style: none; padding: .4rem .6rem; border: 1.5px solid var(--line); border-radius: 8px; background: #fff; }
.gx-start-edit summary::-webkit-details-marker { display: none; }
.gx-start-edit form { position: absolute; z-index: 8; top: 100%; left: 0; width: 260px; display: grid; gap: .5rem; padding: .8rem; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 8px 24px rgba(30, 42, 68, .15); }
.gx-warn { margin: 0; font-size: .8rem; color: #9a3412; }
.gx-find { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem 1rem; flex: 1 1 420px; min-width: 0; }
.gx-filters label { display: flex; flex-direction: column; gap: .25rem; font-size: .85rem; min-width: 0; }
.gx-lbl { font-weight: 700; color: #1e2a44; font-size: .8rem; }
.gx-filters input, .gx-filters select { min-height: 42px; }
.gx-search { flex: 1 1 200px; position: relative; }
.gx-search svg { position: absolute; left: .7rem; bottom: .8rem; color: var(--muted); pointer-events: none; }
.gx-search input { padding-left: 2.2rem; width: 100%; }
.gx-nav { display: flex; gap: .5rem; margin-left: auto; }
.gx-today-btn, .gx-arrow { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; min-width: 42px; border: 1.5px solid var(--line); border-radius: 10px; background: #fff; color: #1e2a44; text-decoration: none; font-weight: 700; }
.gx-today-btn { padding: 0 1.1rem; border-color: var(--orange); color: #c2410c; }
.gx-today-btn, .gx-arrow { cursor: pointer; font: inherit; }

.gx-wrap { overflow: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; max-height: 78vh; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.gx-inner { width: max-content; min-width: 100%; }
.gx-head { position: sticky; top: 0; z-index: 6; background: #fff; }
.gx-line, .gx-row { display: grid; grid-template-columns: var(--lab) repeat(var(--c), var(--hw)); }
.gx-lab { position: sticky; left: 0; z-index: 4; display: flex; align-items: center; justify-content: center; background: #fff; border-right: 1px solid var(--line); font-size: .78rem; font-weight: 700; color: #374151; }
.gx-day { grid-column: span 2; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: .35rem 0; border-left: 1px solid var(--line); font-size: .72rem; color: #374151; }
.gx-day strong { font-size: .9rem; color: #1e2a44; }
.gx-halves span { text-align: center; font-size: .68rem; font-weight: 700; color: #4b5563; padding: .25rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.gx-halves span:nth-child(odd) { border-left: 1px solid var(--line); }
.gx-halves .gx-lab { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.gx-day.is-today, .gx-halves .is-today { background: #fff0c2; }
.gx-halves span.is-today { color: #c2410c; }
.gx-row { position: relative; min-height: 58px; border-bottom: 1px solid var(--line); }
.gx-row:last-child { border-bottom: 0; }
.gx-bg { grid-column: 2 / -1; grid-row: 1; background-image: linear-gradient(to right, var(--line) 1px, transparent 1px); background-size: calc(100% / var(--n)) 100%; pointer-events: none; }
.gx-tcol { grid-row: 1; background: rgba(250, 204, 21, .22); pointer-events: none; }
.gx-row > .gx-lab { grid-row: 1; }
.gx-block { grid-row: 1; container-type: inline-size; display: flex; align-items: stretch; gap: 0; min-width: 0; margin: 4px 2px; border-radius: 10px; background: var(--bg); color: #1f2937; text-decoration: none; overflow: hidden; font-size: .78rem; line-height: 1.25; box-shadow: 0 0 0 1px rgba(0, 0, 0, .04); }
.gx-block:hover, .gx-block:focus-visible { box-shadow: 0 0 0 2px var(--ac); position: relative; z-index: 2; }
.gx-block.cut-l { border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: 0; }
.gx-block.cut-r { border-top-right-radius: 0; border-bottom-right-radius: 0; margin-right: 0; }
.gx-io { flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: .3rem .5rem; min-width: 52px; }
.gx-io b { color: var(--ac); font-size: .8rem; }
.gx-io i { font-style: normal; font-size: .78rem; }
.gx-io em { font-style: normal; font-size: .7rem; color: #047857; font-weight: 800; }
.gx-io-in { border-right: 1px solid rgba(0, 0, 0, .12); }
.gx-io-out { border-left: 1px solid rgba(0, 0, 0, .12); }
.gx-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: .1rem; padding: .3rem .55rem; }
.gx-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gx-t strong { color: #111827; }
.gx-meta { display: flex; align-items: center; gap: .3rem; color: #4b5563; font-size: .74rem; white-space: nowrap; overflow: hidden; }
.gx-meta svg { flex: none; color: var(--ac); }
.gx-pax { margin-left: auto; display: inline-flex; align-items: center; gap: .25rem; }
@container (max-width: 250px) { .gx-meta { display: none; } }
@container (max-width: 170px) { .gx-io { min-width: 0; padding: .3rem .35rem; } .gx-io b { display: none; } .gx-school { display: none; } }
@container (max-width: 100px) { .gx-io { display: none; } .gx-main { padding: .3rem .4rem; } }

/* Hoteles, columnas y ancho: clases porque la CSP no permite estilos en línea */
.gx-h0 { --bg: #ffe0cf; --ac: #c2410c; }
.gx-h1 { --bg: #d6e8ff; --ac: #1d4ed8; }
.gx-h2 { --bg: #d2f5e3; --ac: #047857; }
.gx-h3 { --bg: #e6dcff; --ac: #6d28d9; }
.gx-h4 { --bg: #fff0b3; --ac: #a16207; }
.gx-h5 { --bg: #ffd6e6; --ac: #be185d; }
.gx-h6 { --bg: #c9f2ea; --ac: #0f766e; }
.gx-h7 { --bg: #e3ecc4; --ac: #4d7c0f; }
/* Grupo que ya salió (OUT realizado): bloque completo en gris oscuro, texto claro */
.gx-block.is-out-done { --bg: #4b5563; --ac: #f9fafb; color: #f9fafb; }
.gx-block.is-out-done .gx-t strong, .gx-block.is-out-done .gx-school { color: #ffffff; }
.gx-block.is-out-done .gx-meta, .gx-block.is-out-done .gx-meta svg { color: #e5e7eb; }
.gx-block.is-out-done .gx-io em { color: #bbf7d0; }
.gx-block.is-out-done .gx-io-in, .gx-block.is-out-done .gx-io-out { border-color: rgba(255, 255, 255, .25); }
/* Ya salió: cada hotel conserva su tono, en la versión oscura de su color */
.gx-block.is-out-done.gx-h0 { --bg: #5c4747; }
.gx-block.is-out-done.gx-h1 { --bg: #3b4c71; }
.gx-block.is-out-done.gx-h2 { --bg: #335355; }
.gx-block.is-out-done.gx-h3 { --bg: #4b4174; }
.gx-block.is-out-done.gx-h4 { --bg: #584d47; }
.gx-block.is-out-done.gx-h5 { --bg: #5f4058; }
.gx-block.is-out-done.gx-h6 { --bg: #37535a; }
.gx-block.is-out-done.gx-h7 { --bg: #445447; }
.gx-block.is-out-done.gx-h8 { --bg: #574646; }
.gx-block.is-out-done.gx-h9 { --bg: #424a6e; }
.gx-h8 { --bg: #fddcc0; --ac: #9a3412; }
.gx-h9 { --bg: #d8dffb; --ac: #3730a3; }
.gx-h-none { --bg: #eceff3; --ac: #4b5563; }
.gx-legend i { background: var(--bg); box-shadow: inset 0 0 0 2px var(--ac); }

.gx-n1 { --n: 1; --c: 2; }
.gx-n2 { --n: 2; --c: 4; }
.gx-n3 { --n: 3; --c: 6; }
.gx-n4 { --n: 4; --c: 8; }
.gx-n5 { --n: 5; --c: 10; }
.gx-n6 { --n: 6; --c: 12; }
.gx-n7 { --n: 7; --c: 14; }
.gx-n8 { --n: 8; --c: 16; }
.gx-n9 { --n: 9; --c: 18; }
.gx-n10 { --n: 10; --c: 20; }
.gx-n11 { --n: 11; --c: 22; }
.gx-n12 { --n: 12; --c: 24; }
.gx-n13 { --n: 13; --c: 26; }
.gx-n14 { --n: 14; --c: 28; }
.gx-n15 { --n: 15; --c: 30; }
.gx-n16 { --n: 16; --c: 32; }
.gx-n17 { --n: 17; --c: 34; }
.gx-n18 { --n: 18; --c: 36; }
.gx-n19 { --n: 19; --c: 38; }
.gx-n20 { --n: 20; --c: 40; }
.gx-n21 { --n: 21; --c: 42; }
.gx-n22 { --n: 22; --c: 44; }
.gx-n23 { --n: 23; --c: 46; }
.gx-n24 { --n: 24; --c: 48; }
.gx-n25 { --n: 25; --c: 50; }
.gx-n26 { --n: 26; --c: 52; }
.gx-n27 { --n: 27; --c: 54; }
.gx-n28 { --n: 28; --c: 56; }
.gx-n29 { --n: 29; --c: 58; }
.gx-n30 { --n: 30; --c: 60; }
.gx-n31 { --n: 31; --c: 62; }
.gx-n32 { --n: 32; --c: 64; }
.gx-n33 { --n: 33; --c: 66; }
.gx-n34 { --n: 34; --c: 68; }
.gx-n35 { --n: 35; --c: 70; }
.gx-n36 { --n: 36; --c: 72; }
.gx-n37 { --n: 37; --c: 74; }
.gx-n38 { --n: 38; --c: 76; }
.gx-n39 { --n: 39; --c: 78; }
.gx-n40 { --n: 40; --c: 80; }
.gx-n41 { --n: 41; --c: 82; }
.gx-n42 { --n: 42; --c: 84; }
.gx-n43 { --n: 43; --c: 86; }
.gx-n44 { --n: 44; --c: 88; }
.gx-n45 { --n: 45; --c: 90; }
.gx-n46 { --n: 46; --c: 92; }
.gx-n47 { --n: 47; --c: 94; }
.gx-n48 { --n: 48; --c: 96; }
.gx-n49 { --n: 49; --c: 98; }
.gx-n50 { --n: 50; --c: 100; }
.gx-n51 { --n: 51; --c: 102; }
.gx-n52 { --n: 52; --c: 104; }
.gx-n53 { --n: 53; --c: 106; }
.gx-n54 { --n: 54; --c: 108; }
.gx-n55 { --n: 55; --c: 110; }
.gx-n56 { --n: 56; --c: 112; }
.gx-n57 { --n: 57; --c: 114; }
.gx-n58 { --n: 58; --c: 116; }
.gx-n59 { --n: 59; --c: 118; }
.gx-n60 { --n: 60; --c: 120; }
.gx-n61 { --n: 61; --c: 122; }
.gx-n62 { --n: 62; --c: 124; }
.gx-n63 { --n: 63; --c: 126; }
.gx-n64 { --n: 64; --c: 128; }
.gx-n65 { --n: 65; --c: 130; }
.gx-n66 { --n: 66; --c: 132; }
.gx-n67 { --n: 67; --c: 134; }
.gx-n68 { --n: 68; --c: 136; }
.gx-n69 { --n: 69; --c: 138; }
.gx-n70 { --n: 70; --c: 140; }
.gx-n71 { --n: 71; --c: 142; }
.gx-n72 { --n: 72; --c: 144; }
.gx-n73 { --n: 73; --c: 146; }
.gx-n74 { --n: 74; --c: 148; }
.gx-n75 { --n: 75; --c: 150; }
.gx-n76 { --n: 76; --c: 152; }
.gx-n77 { --n: 77; --c: 154; }
.gx-n78 { --n: 78; --c: 156; }
.gx-n79 { --n: 79; --c: 158; }
.gx-n80 { --n: 80; --c: 160; }
.gx-n81 { --n: 81; --c: 162; }
.gx-n82 { --n: 82; --c: 164; }
.gx-n83 { --n: 83; --c: 166; }
.gx-n84 { --n: 84; --c: 168; }
.gx-n85 { --n: 85; --c: 170; }
.gx-n86 { --n: 86; --c: 172; }
.gx-n87 { --n: 87; --c: 174; }
.gx-n88 { --n: 88; --c: 176; }
.gx-n89 { --n: 89; --c: 178; }
.gx-n90 { --n: 90; --c: 180; }
.gx-n91 { --n: 91; --c: 182; }
.gx-n92 { --n: 92; --c: 184; }
.gx-n93 { --n: 93; --c: 186; }
.gx-n94 { --n: 94; --c: 188; }
.gx-n95 { --n: 95; --c: 190; }
.gx-n96 { --n: 96; --c: 192; }
.gx-n97 { --n: 97; --c: 194; }
.gx-n98 { --n: 98; --c: 196; }
.gx-n99 { --n: 99; --c: 198; }
.gx-n100 { --n: 100; --c: 200; }
.gx-c0 { grid-column-start: 2; }
.gx-c1 { grid-column-start: 3; }
.gx-c2 { grid-column-start: 4; }
.gx-c3 { grid-column-start: 5; }
.gx-c4 { grid-column-start: 6; }
.gx-c5 { grid-column-start: 7; }
.gx-c6 { grid-column-start: 8; }
.gx-c7 { grid-column-start: 9; }
.gx-c8 { grid-column-start: 10; }
.gx-c9 { grid-column-start: 11; }
.gx-c10 { grid-column-start: 12; }
.gx-c11 { grid-column-start: 13; }
.gx-c12 { grid-column-start: 14; }
.gx-c13 { grid-column-start: 15; }
.gx-c14 { grid-column-start: 16; }
.gx-c15 { grid-column-start: 17; }
.gx-c16 { grid-column-start: 18; }
.gx-c17 { grid-column-start: 19; }
.gx-c18 { grid-column-start: 20; }
.gx-c19 { grid-column-start: 21; }
.gx-c20 { grid-column-start: 22; }
.gx-c21 { grid-column-start: 23; }
.gx-c22 { grid-column-start: 24; }
.gx-c23 { grid-column-start: 25; }
.gx-c24 { grid-column-start: 26; }
.gx-c25 { grid-column-start: 27; }
.gx-c26 { grid-column-start: 28; }
.gx-c27 { grid-column-start: 29; }
.gx-c28 { grid-column-start: 30; }
.gx-c29 { grid-column-start: 31; }
.gx-c30 { grid-column-start: 32; }
.gx-c31 { grid-column-start: 33; }
.gx-c32 { grid-column-start: 34; }
.gx-c33 { grid-column-start: 35; }
.gx-c34 { grid-column-start: 36; }
.gx-c35 { grid-column-start: 37; }
.gx-c36 { grid-column-start: 38; }
.gx-c37 { grid-column-start: 39; }
.gx-c38 { grid-column-start: 40; }
.gx-c39 { grid-column-start: 41; }
.gx-c40 { grid-column-start: 42; }
.gx-c41 { grid-column-start: 43; }
.gx-c42 { grid-column-start: 44; }
.gx-c43 { grid-column-start: 45; }
.gx-c44 { grid-column-start: 46; }
.gx-c45 { grid-column-start: 47; }
.gx-c46 { grid-column-start: 48; }
.gx-c47 { grid-column-start: 49; }
.gx-c48 { grid-column-start: 50; }
.gx-c49 { grid-column-start: 51; }
.gx-c50 { grid-column-start: 52; }
.gx-c51 { grid-column-start: 53; }
.gx-c52 { grid-column-start: 54; }
.gx-c53 { grid-column-start: 55; }
.gx-c54 { grid-column-start: 56; }
.gx-c55 { grid-column-start: 57; }
.gx-c56 { grid-column-start: 58; }
.gx-c57 { grid-column-start: 59; }
.gx-c58 { grid-column-start: 60; }
.gx-c59 { grid-column-start: 61; }
.gx-c60 { grid-column-start: 62; }
.gx-c61 { grid-column-start: 63; }
.gx-c62 { grid-column-start: 64; }
.gx-c63 { grid-column-start: 65; }
.gx-c64 { grid-column-start: 66; }
.gx-c65 { grid-column-start: 67; }
.gx-c66 { grid-column-start: 68; }
.gx-c67 { grid-column-start: 69; }
.gx-c68 { grid-column-start: 70; }
.gx-c69 { grid-column-start: 71; }
.gx-c70 { grid-column-start: 72; }
.gx-c71 { grid-column-start: 73; }
.gx-c72 { grid-column-start: 74; }
.gx-c73 { grid-column-start: 75; }
.gx-c74 { grid-column-start: 76; }
.gx-c75 { grid-column-start: 77; }
.gx-c76 { grid-column-start: 78; }
.gx-c77 { grid-column-start: 79; }
.gx-c78 { grid-column-start: 80; }
.gx-c79 { grid-column-start: 81; }
.gx-c80 { grid-column-start: 82; }
.gx-c81 { grid-column-start: 83; }
.gx-c82 { grid-column-start: 84; }
.gx-c83 { grid-column-start: 85; }
.gx-c84 { grid-column-start: 86; }
.gx-c85 { grid-column-start: 87; }
.gx-c86 { grid-column-start: 88; }
.gx-c87 { grid-column-start: 89; }
.gx-c88 { grid-column-start: 90; }
.gx-c89 { grid-column-start: 91; }
.gx-c90 { grid-column-start: 92; }
.gx-c91 { grid-column-start: 93; }
.gx-c92 { grid-column-start: 94; }
.gx-c93 { grid-column-start: 95; }
.gx-c94 { grid-column-start: 96; }
.gx-c95 { grid-column-start: 97; }
.gx-c96 { grid-column-start: 98; }
.gx-c97 { grid-column-start: 99; }
.gx-c98 { grid-column-start: 100; }
.gx-c99 { grid-column-start: 101; }
.gx-c100 { grid-column-start: 102; }
.gx-c101 { grid-column-start: 103; }
.gx-c102 { grid-column-start: 104; }
.gx-c103 { grid-column-start: 105; }
.gx-c104 { grid-column-start: 106; }
.gx-c105 { grid-column-start: 107; }
.gx-c106 { grid-column-start: 108; }
.gx-c107 { grid-column-start: 109; }
.gx-c108 { grid-column-start: 110; }
.gx-c109 { grid-column-start: 111; }
.gx-c110 { grid-column-start: 112; }
.gx-c111 { grid-column-start: 113; }
.gx-c112 { grid-column-start: 114; }
.gx-c113 { grid-column-start: 115; }
.gx-c114 { grid-column-start: 116; }
.gx-c115 { grid-column-start: 117; }
.gx-c116 { grid-column-start: 118; }
.gx-c117 { grid-column-start: 119; }
.gx-c118 { grid-column-start: 120; }
.gx-c119 { grid-column-start: 121; }
.gx-c120 { grid-column-start: 122; }
.gx-c121 { grid-column-start: 123; }
.gx-c122 { grid-column-start: 124; }
.gx-c123 { grid-column-start: 125; }
.gx-c124 { grid-column-start: 126; }
.gx-c125 { grid-column-start: 127; }
.gx-c126 { grid-column-start: 128; }
.gx-c127 { grid-column-start: 129; }
.gx-c128 { grid-column-start: 130; }
.gx-c129 { grid-column-start: 131; }
.gx-c130 { grid-column-start: 132; }
.gx-c131 { grid-column-start: 133; }
.gx-c132 { grid-column-start: 134; }
.gx-c133 { grid-column-start: 135; }
.gx-c134 { grid-column-start: 136; }
.gx-c135 { grid-column-start: 137; }
.gx-c136 { grid-column-start: 138; }
.gx-c137 { grid-column-start: 139; }
.gx-c138 { grid-column-start: 140; }
.gx-c139 { grid-column-start: 141; }
.gx-c140 { grid-column-start: 142; }
.gx-c141 { grid-column-start: 143; }
.gx-c142 { grid-column-start: 144; }
.gx-c143 { grid-column-start: 145; }
.gx-c144 { grid-column-start: 146; }
.gx-c145 { grid-column-start: 147; }
.gx-c146 { grid-column-start: 148; }
.gx-c147 { grid-column-start: 149; }
.gx-c148 { grid-column-start: 150; }
.gx-c149 { grid-column-start: 151; }
.gx-c150 { grid-column-start: 152; }
.gx-c151 { grid-column-start: 153; }
.gx-c152 { grid-column-start: 154; }
.gx-c153 { grid-column-start: 155; }
.gx-c154 { grid-column-start: 156; }
.gx-c155 { grid-column-start: 157; }
.gx-c156 { grid-column-start: 158; }
.gx-c157 { grid-column-start: 159; }
.gx-c158 { grid-column-start: 160; }
.gx-c159 { grid-column-start: 161; }
.gx-c160 { grid-column-start: 162; }
.gx-c161 { grid-column-start: 163; }
.gx-c162 { grid-column-start: 164; }
.gx-c163 { grid-column-start: 165; }
.gx-c164 { grid-column-start: 166; }
.gx-c165 { grid-column-start: 167; }
.gx-c166 { grid-column-start: 168; }
.gx-c167 { grid-column-start: 169; }
.gx-c168 { grid-column-start: 170; }
.gx-c169 { grid-column-start: 171; }
.gx-c170 { grid-column-start: 172; }
.gx-c171 { grid-column-start: 173; }
.gx-c172 { grid-column-start: 174; }
.gx-c173 { grid-column-start: 175; }
.gx-c174 { grid-column-start: 176; }
.gx-c175 { grid-column-start: 177; }
.gx-c176 { grid-column-start: 178; }
.gx-c177 { grid-column-start: 179; }
.gx-c178 { grid-column-start: 180; }
.gx-c179 { grid-column-start: 181; }
.gx-c180 { grid-column-start: 182; }
.gx-c181 { grid-column-start: 183; }
.gx-c182 { grid-column-start: 184; }
.gx-c183 { grid-column-start: 185; }
.gx-c184 { grid-column-start: 186; }
.gx-c185 { grid-column-start: 187; }
.gx-c186 { grid-column-start: 188; }
.gx-c187 { grid-column-start: 189; }
.gx-c188 { grid-column-start: 190; }
.gx-c189 { grid-column-start: 191; }
.gx-c190 { grid-column-start: 192; }
.gx-c191 { grid-column-start: 193; }
.gx-c192 { grid-column-start: 194; }
.gx-c193 { grid-column-start: 195; }
.gx-c194 { grid-column-start: 196; }
.gx-c195 { grid-column-start: 197; }
.gx-c196 { grid-column-start: 198; }
.gx-c197 { grid-column-start: 199; }
.gx-c198 { grid-column-start: 200; }
.gx-c199 { grid-column-start: 201; }
.gx-s1 { grid-column-end: span 1; }
.gx-s2 { grid-column-end: span 2; }
.gx-s3 { grid-column-end: span 3; }
.gx-s4 { grid-column-end: span 4; }
.gx-s5 { grid-column-end: span 5; }
.gx-s6 { grid-column-end: span 6; }
.gx-s7 { grid-column-end: span 7; }
.gx-s8 { grid-column-end: span 8; }
.gx-s9 { grid-column-end: span 9; }
.gx-s10 { grid-column-end: span 10; }
.gx-s11 { grid-column-end: span 11; }
.gx-s12 { grid-column-end: span 12; }
.gx-s13 { grid-column-end: span 13; }
.gx-s14 { grid-column-end: span 14; }
.gx-s15 { grid-column-end: span 15; }
.gx-s16 { grid-column-end: span 16; }
.gx-s17 { grid-column-end: span 17; }
.gx-s18 { grid-column-end: span 18; }
.gx-s19 { grid-column-end: span 19; }
.gx-s20 { grid-column-end: span 20; }
.gx-s21 { grid-column-end: span 21; }
.gx-s22 { grid-column-end: span 22; }
.gx-s23 { grid-column-end: span 23; }
.gx-s24 { grid-column-end: span 24; }
.gx-s25 { grid-column-end: span 25; }
.gx-s26 { grid-column-end: span 26; }
.gx-s27 { grid-column-end: span 27; }
.gx-s28 { grid-column-end: span 28; }
.gx-s29 { grid-column-end: span 29; }
.gx-s30 { grid-column-end: span 30; }
.gx-s31 { grid-column-end: span 31; }
.gx-s32 { grid-column-end: span 32; }
.gx-s33 { grid-column-end: span 33; }
.gx-s34 { grid-column-end: span 34; }
.gx-s35 { grid-column-end: span 35; }
.gx-s36 { grid-column-end: span 36; }
.gx-s37 { grid-column-end: span 37; }
.gx-s38 { grid-column-end: span 38; }
.gx-s39 { grid-column-end: span 39; }
.gx-s40 { grid-column-end: span 40; }
.gx-s41 { grid-column-end: span 41; }
.gx-s42 { grid-column-end: span 42; }
.gx-s43 { grid-column-end: span 43; }
.gx-s44 { grid-column-end: span 44; }
.gx-s45 { grid-column-end: span 45; }
.gx-s46 { grid-column-end: span 46; }
.gx-s47 { grid-column-end: span 47; }
.gx-s48 { grid-column-end: span 48; }
.gx-s49 { grid-column-end: span 49; }
.gx-s50 { grid-column-end: span 50; }
.gx-s51 { grid-column-end: span 51; }
.gx-s52 { grid-column-end: span 52; }
.gx-s53 { grid-column-end: span 53; }
.gx-s54 { grid-column-end: span 54; }
.gx-s55 { grid-column-end: span 55; }
.gx-s56 { grid-column-end: span 56; }
.gx-s57 { grid-column-end: span 57; }
.gx-s58 { grid-column-end: span 58; }
.gx-s59 { grid-column-end: span 59; }
.gx-s60 { grid-column-end: span 60; }
.gx-s61 { grid-column-end: span 61; }
.gx-s62 { grid-column-end: span 62; }
.gx-s63 { grid-column-end: span 63; }
.gx-s64 { grid-column-end: span 64; }
.gx-s65 { grid-column-end: span 65; }
.gx-s66 { grid-column-end: span 66; }
.gx-s67 { grid-column-end: span 67; }
.gx-s68 { grid-column-end: span 68; }
.gx-s69 { grid-column-end: span 69; }
.gx-s70 { grid-column-end: span 70; }
.gx-s71 { grid-column-end: span 71; }
.gx-s72 { grid-column-end: span 72; }
.gx-s73 { grid-column-end: span 73; }
.gx-s74 { grid-column-end: span 74; }
.gx-s75 { grid-column-end: span 75; }
.gx-s76 { grid-column-end: span 76; }
.gx-s77 { grid-column-end: span 77; }
.gx-s78 { grid-column-end: span 78; }
.gx-s79 { grid-column-end: span 79; }
.gx-s80 { grid-column-end: span 80; }
.gx-s81 { grid-column-end: span 81; }
.gx-s82 { grid-column-end: span 82; }
.gx-s83 { grid-column-end: span 83; }
.gx-s84 { grid-column-end: span 84; }
.gx-s85 { grid-column-end: span 85; }
.gx-s86 { grid-column-end: span 86; }
.gx-s87 { grid-column-end: span 87; }
.gx-s88 { grid-column-end: span 88; }
.gx-s89 { grid-column-end: span 89; }
.gx-s90 { grid-column-end: span 90; }
.gx-s91 { grid-column-end: span 91; }
.gx-s92 { grid-column-end: span 92; }
.gx-s93 { grid-column-end: span 93; }
.gx-s94 { grid-column-end: span 94; }
.gx-s95 { grid-column-end: span 95; }
.gx-s96 { grid-column-end: span 96; }
.gx-s97 { grid-column-end: span 97; }
.gx-s98 { grid-column-end: span 98; }
.gx-s99 { grid-column-end: span 99; }
.gx-s100 { grid-column-end: span 100; }
.gx-s101 { grid-column-end: span 101; }
.gx-s102 { grid-column-end: span 102; }
.gx-s103 { grid-column-end: span 103; }
.gx-s104 { grid-column-end: span 104; }
.gx-s105 { grid-column-end: span 105; }
.gx-s106 { grid-column-end: span 106; }
.gx-s107 { grid-column-end: span 107; }
.gx-s108 { grid-column-end: span 108; }
.gx-s109 { grid-column-end: span 109; }
.gx-s110 { grid-column-end: span 110; }
.gx-s111 { grid-column-end: span 111; }
.gx-s112 { grid-column-end: span 112; }
.gx-s113 { grid-column-end: span 113; }
.gx-s114 { grid-column-end: span 114; }
.gx-s115 { grid-column-end: span 115; }
.gx-s116 { grid-column-end: span 116; }
.gx-s117 { grid-column-end: span 117; }
.gx-s118 { grid-column-end: span 118; }
.gx-s119 { grid-column-end: span 119; }
.gx-s120 { grid-column-end: span 120; }
.gx-s121 { grid-column-end: span 121; }
.gx-s122 { grid-column-end: span 122; }
.gx-s123 { grid-column-end: span 123; }
.gx-s124 { grid-column-end: span 124; }
.gx-s125 { grid-column-end: span 125; }
.gx-s126 { grid-column-end: span 126; }
.gx-s127 { grid-column-end: span 127; }
.gx-s128 { grid-column-end: span 128; }
.gx-s129 { grid-column-end: span 129; }
.gx-s130 { grid-column-end: span 130; }
.gx-s131 { grid-column-end: span 131; }
.gx-s132 { grid-column-end: span 132; }
.gx-s133 { grid-column-end: span 133; }
.gx-s134 { grid-column-end: span 134; }
.gx-s135 { grid-column-end: span 135; }
.gx-s136 { grid-column-end: span 136; }
.gx-s137 { grid-column-end: span 137; }
.gx-s138 { grid-column-end: span 138; }
.gx-s139 { grid-column-end: span 139; }
.gx-s140 { grid-column-end: span 140; }
.gx-s141 { grid-column-end: span 141; }
.gx-s142 { grid-column-end: span 142; }
.gx-s143 { grid-column-end: span 143; }
.gx-s144 { grid-column-end: span 144; }
.gx-s145 { grid-column-end: span 145; }
.gx-s146 { grid-column-end: span 146; }
.gx-s147 { grid-column-end: span 147; }
.gx-s148 { grid-column-end: span 148; }
.gx-s149 { grid-column-end: span 149; }
.gx-s150 { grid-column-end: span 150; }
.gx-s151 { grid-column-end: span 151; }
.gx-s152 { grid-column-end: span 152; }
.gx-s153 { grid-column-end: span 153; }
.gx-s154 { grid-column-end: span 154; }
.gx-s155 { grid-column-end: span 155; }
.gx-s156 { grid-column-end: span 156; }
.gx-s157 { grid-column-end: span 157; }
.gx-s158 { grid-column-end: span 158; }
.gx-s159 { grid-column-end: span 159; }
.gx-s160 { grid-column-end: span 160; }
.gx-s161 { grid-column-end: span 161; }
.gx-s162 { grid-column-end: span 162; }
.gx-s163 { grid-column-end: span 163; }
.gx-s164 { grid-column-end: span 164; }
.gx-s165 { grid-column-end: span 165; }
.gx-s166 { grid-column-end: span 166; }
.gx-s167 { grid-column-end: span 167; }
.gx-s168 { grid-column-end: span 168; }
.gx-s169 { grid-column-end: span 169; }
.gx-s170 { grid-column-end: span 170; }
.gx-s171 { grid-column-end: span 171; }
.gx-s172 { grid-column-end: span 172; }
.gx-s173 { grid-column-end: span 173; }
.gx-s174 { grid-column-end: span 174; }
.gx-s175 { grid-column-end: span 175; }
.gx-s176 { grid-column-end: span 176; }
.gx-s177 { grid-column-end: span 177; }
.gx-s178 { grid-column-end: span 178; }
.gx-s179 { grid-column-end: span 179; }
.gx-s180 { grid-column-end: span 180; }
.gx-s181 { grid-column-end: span 181; }
.gx-s182 { grid-column-end: span 182; }
.gx-s183 { grid-column-end: span 183; }
.gx-s184 { grid-column-end: span 184; }
.gx-s185 { grid-column-end: span 185; }
.gx-s186 { grid-column-end: span 186; }
.gx-s187 { grid-column-end: span 187; }
.gx-s188 { grid-column-end: span 188; }
.gx-s189 { grid-column-end: span 189; }
.gx-s190 { grid-column-end: span 190; }
.gx-s191 { grid-column-end: span 191; }
.gx-s192 { grid-column-end: span 192; }
.gx-s193 { grid-column-end: span 193; }
.gx-s194 { grid-column-end: span 194; }
.gx-s195 { grid-column-end: span 195; }
.gx-s196 { grid-column-end: span 196; }
.gx-s197 { grid-column-end: span 197; }
.gx-s198 { grid-column-end: span 198; }
.gx-s199 { grid-column-end: span 199; }
.gx-s200 { grid-column-end: span 200; }

.gx-undated { margin-top: 1rem; }
.gx-undated h2 { font-size: 1rem; margin: 0 0 .2rem; }
.gx-undated ul { display: flex; flex-wrap: wrap; gap: .4rem; list-style: none; margin: .5rem 0 0; padding: 0; }
.gx-undated li a { display: inline-block; padding: .3rem .7rem; border: 1px solid var(--line); border-radius: 999px; background: #fff; text-decoration: none; font-size: .85rem; }
.gx-page .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@media (max-width: 639px) {
    .gx-page { --hw: 40px; }
    .gx-head-top h1 { font-size: 1.6rem; }
    .gx-new { width: 100%; text-align: center; }
    .gx-filters { padding: .7rem; }
    .gx-find { display: contents; }
    .gx-start { flex: 1 1 44%; min-width: 0; }
    .gx-start input { width: 100%; }
    .gx-filters label:not(.gx-search) { flex: 1 1 44%; }
    .gx-search { flex: 1 1 100%; }
    .gx-nav { margin-left: 0; width: 100%; }
    .gx-nav a { flex: 1; }
}

/* Consulta por día */
.chips { display: flex; gap: .4rem; overflow-x: auto; padding: .25rem 0; margin-top: .5rem; }
.chip { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; min-width: 52px; padding: .35rem .5rem; border: 1px solid #fdba74; border-radius: 12px; text-decoration: none; color: #c2410c; font-weight: 800; background: #fff; }
.chip small { font-weight: 600; }
.chip.is-active { background: var(--grad); color: #fff; border-color: transparent; }
.chip.is-active small { color: #fff; }
.slots { margin: .75rem 0 0; padding-left: 1.2rem; }
.slots li { padding: .15rem 0; }

.danger-zone { border-color: #fecaca; }
.notes { white-space: normal; }

/* Login */
.login-body { min-height: 100vh; display: grid; place-items: center; background: var(--grad); padding: 1rem; margin: 0; }
.login-card { width: 100%; max-width: 380px; color: #fff; text-align: center; }
.login-card h1 { font-size: 2rem; letter-spacing: .2em; margin: .5rem 0 0; }
.login-logo { display: block; width: min(320px, 84%); height: auto; margin: 0 auto 1.25rem; }
.login-card .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.login-card p { margin: 0 0 1.25rem; opacity: .95; }
.login-card form { text-align: left; }
.login-card label { color: #fff; }
.login-card .alert { text-align: left; }

@media (min-width: 640px) {
    .cards { grid-template-columns: repeat(2, 1fr); }
    .grid-2 { grid-template-columns: repeat(2, 1fr); }
    .form-inline { grid-template-columns: repeat(3, 1fr); }
}

@media (min-width: 900px) {
    body { padding-bottom: 0; }
    .tabbar { display: none; }
    .topnav { display: flex; }
    .cards { grid-template-columns: repeat(3, 1fr); }
    .meta { grid-template-columns: repeat(4, 1fr); }
    .meta-lg { grid-template-columns: repeat(4, 1fr); }
    .grid-2 { grid-template-columns: repeat(3, 1fr); }
    .form-inline { grid-template-columns: repeat(5, 1fr); }
}

@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* Cuenta y usuarios */
.account { display: flex; gap: .25rem; margin-left: auto; font-size: .85rem; }
.account a { color: #fff; text-decoration: none; padding: .3rem .6rem; border-radius: 999px; background: rgba(255, 255, 255, .15); }
.logout { margin-left: 0; }
.form-narrow { max-width: 440px; }
.form-inline-2 { display: grid; grid-template-columns: 1fr auto; gap: 0 .75rem; align-items: end; margin-top: .75rem; }
.form-inline-2 .check { grid-column: 1 / -1; }

@media (max-width: 639px) {
    .row-item form.inline select { min-width: 150px; }
}
@media (max-width: 639px) { .hide-sm { display: none; } }
td select { min-width: 128px; }

/* Pedidos */
.pedidos td small { display: block; color: var(--muted); max-width: 190px; }
.pedidos td.wide { min-width: 180px; }
.pedidos .thumb { width: 48px; height: 48px; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); display: block; }
.btn-sm { min-height: 34px; padding: .25rem .75rem; font-size: .85rem; }
.filter-date { flex-direction: row; align-items: center; gap: .4rem; margin: 0; font-weight: 500; }
.filter-date input { width: auto; }
.grid-3 { display: grid; gap: 0 1rem; grid-template-columns: 1fr; }
.photos { display: grid; gap: 1rem; grid-template-columns: 1fr; }
.photo-card { border: 1px solid var(--line); border-radius: var(--radius); padding: .75rem; }
.photo-preview { width: 100%; max-height: 260px; object-fit: contain; background: #f3f4f6; border-radius: 10px; display: block; }
.photo-empty { height: 120px; display: grid; place-items: center; background: #f9fafb; border: 1px dashed #d1d5db; border-radius: 10px; color: var(--muted); }
.photo-form { display: grid; gap: .5rem; margin: .6rem 0; }
@media (min-width: 640px) { .grid-3 { grid-template-columns: repeat(3, 1fr); } .photos { grid-template-columns: repeat(3, 1fr); } }

.pedidos td.master { min-width: 150px; }
.pedidos td, .pedidos th { white-space: nowrap; }
.pedidos td.wide, .pedidos td.master { white-space: normal; }

/* Selector de fotos */
.filepick { margin-bottom: .75rem; }
.filepick-label { display: block; font-weight: 600; font-size: .9rem; margin-bottom: .25rem; }
.filepick-drop { position: relative; display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin: 0; padding: .8rem 1rem; min-height: 76px; border: 2px dashed #fdba74; border-radius: var(--radius); background: #fff7ed; color: #9a3412; cursor: pointer; font-weight: 500; transition: border-color .15s, background .15s; }
.filepick-drop:hover, .filepick-drop.is-dragover { border-color: var(--orange); background: #ffedd5; }
.filepick-drop:focus-within { outline: 3px solid rgba(249, 115, 22, .45); outline-offset: 1px; }
.filepick-input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; min-height: 0; padding: 0; border: 0; }
.filepick-text { display: flex; flex-direction: column; }
.filepick-text small { color: var(--muted); font-weight: 400; }
.filepick-preview { width: 72px; height: 72px; object-fit: cover; border-radius: 10px; border: 1px solid var(--line); background: #fff; }
.filepick.has-file .filepick-drop { border-style: solid; border-color: #86efac; background: #f0fdf4; }
.filepick-meta { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-top: .4rem; font-size: .85rem; color: var(--muted); }
.filepick-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.filepick-error { color: var(--danger); font-size: .85rem; margin: .4rem 0 0; }
.photo-form .filepick { margin-bottom: 0; }


/* Logo en la barra superior */
.topbar { padding-top: .4rem; padding-bottom: .4rem; }
.brand { line-height: 0; }
.brand-logo { height: 50px; width: auto; display: block; background: none; border-radius: 0; }
@media (max-width: 380px) { .brand-logo { height: 40px; } }

/* Estados (colores) */
.pill.st-pendiente { background: #f3f4f6; color: #374151; }
.pill.st-copiando { background: #dbeafe; color: #1e40af; }
.pill.st-listo { background: #dcfce7; color: #166534; }
.pill.st-repartidor { background: #ede9fe; color: #5b21b6; }
.pill.st-entregado { background: #fef3c7; color: #92400e; }
.pill.st-finalizado { background: #14532d; color: #fff; }

/* Lista de masters: 7 columnas en escritorio, tarjetas en celular */
.pedidos-list th { white-space: nowrap; }
.pedidos-list td { vertical-align: middle; }
.pedidos-list .c-master strong { font-size: 1.05rem; }
.pedidos-list .c-colegio { min-width: 200px; }
.div-chip { display: inline-block; margin: 0 .35rem .2rem 0; padding: .1rem .55rem; border-radius: 999px; background: #fff7ed; border: 1px solid #fed7aa; font-size: .85rem; }
.div-chip b { color: #c2410c; }
.list-note { font-size: .85rem; margin-top: .25rem; }
@media (max-width: 760px) {
    .pedidos-list thead { display: none; }
    .pedidos-list, .pedidos-list tbody { display: block; }
    .list-card { padding: .5rem; background: transparent; border: 0; box-shadow: none; }
    .pedidos-list tr { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem .75rem; margin-bottom: .75rem; padding: .8rem .9rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); border-left: 5px solid var(--orange); }
    .pedidos-list td { display: block; padding: 0; border: 0; min-width: 0; }
    .pedidos-list td::before { content: attr(data-label); display: block; font-size: .65rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
    .pedidos-list .c-master, .pedidos-list .c-estado { order: -2; }
    .pedidos-list .c-estado { order: -1; text-align: right; }
    .pedidos-list .c-master::before, .pedidos-list .c-estado::before { display: none; }
    .pedidos-list .c-master strong { font-size: 1.3rem; }
    .pedidos-list .c-colegio, .pedidos-list .c-coord { grid-column: 1 / -1; }
    .pedidos-list .c-colegio { min-width: 0; }
}

/* Divisiones y productos */
.division-row { display: flex; align-items: center; gap: .5rem; margin-bottom: .5rem; }
.division-form { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; flex: 1; }
.division-form input[type="text"], .division-form input[type="number"] { flex: 1 1 140px; width: auto; min-width: 0; }
.division-form input[type="number"] { flex: 0 1 100px; }
.division-code { display: inline-flex; align-items: center; gap: .15rem; font-weight: 800; color: #c2410c; }
.division-code input { width: 64px !important; flex: none !important; text-transform: uppercase; }
.division-add { padding-top: .5rem; border-top: 1px dashed var(--line); }
.section-title { margin: 1.25rem 0 .75rem; }
.producto-head { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-bottom: .75rem; }
.producto-head h3 { margin: 0; flex: 1 1 auto; }
.producto-actions { margin-top: .75rem; }
.producto-actions form { margin: 0; }

/* ===== Grupos (rediseño) — todo acotado a .groups-page ===== */
.groups-page { --gp-ink: #1e2a44; --gp-orange: #c2410c; --gp-cream: #fff7ed; --gp-line: #f1e3d3; max-width: 1180px; margin: 0 auto; color: var(--gp-ink); }
.groups-page .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.gp-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.gp-head h1 { margin: 0; font-size: 1.9rem; line-height: 1.15; color: var(--gp-ink); }
.gp-sub { margin: .2rem 0 0; color: var(--muted); font-size: .95rem; }
.gp-new { white-space: nowrap; }
.gp-new-short { display: none; }

.gp-filters { display: flex; align-items: center; gap: .6rem; margin-bottom: 1rem; }
.gp-search { flex: 1 1 auto; position: relative; display: block; margin: 0; }
.gp-search .gp-ico { position: absolute; left: .85rem; top: 50%; transform: translateY(-50%); color: #4b5563; pointer-events: none; }
.gp-search input { width: 100%; height: 48px; padding: 0 1rem 0 2.6rem; border: 1px solid #e5d9cb; border-radius: 12px; background: #fff; font-size: .98rem; color: var(--gp-ink); }
.gp-toggle { display: none; align-items: center; justify-content: center; gap: .4rem; height: 48px; padding: 0 .9rem; border: 1px solid #e5d9cb; border-radius: 12px; background: #fff; color: var(--gp-ink); font: inherit; font-weight: 600; cursor: pointer; }
.gp-extra { display: flex; align-items: center; gap: .6rem; flex: 0 0 auto; }
.gp-field { display: flex; flex-direction: row; align-items: center; gap: .45rem; height: 48px; margin: 0; padding: 0 .65rem; border: 1px solid #e5d9cb; border-radius: 12px; background: #fff; font-weight: 500; }
.gp-lbl { color: var(--muted); font-size: .85rem; font-weight: 600; }
.gp-field select, .gp-field input { width: auto; min-height: 0; height: 100%; padding: 0; border: 0; background: transparent; font: inherit; font-size: .95rem; color: var(--gp-ink); outline: none; }
.gp-field:focus-within, .gp-search input:focus { outline: 3px solid rgba(249, 115, 22, .35); outline-offset: 1px; }
.gp-field:has(input:disabled) { opacity: .55; }
.gp-clear { color: var(--gp-orange); font-weight: 700; text-decoration: none; padding: 0 .4rem; white-space: nowrap; }

.gp-card { background: #fff; border: 1px solid var(--gp-line); border-radius: 16px; box-shadow: 0 6px 22px rgba(194, 65, 12, .07); }
.groups-list { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0; font-size: .95rem; }
.groups-list col.cw-master { width: 92px; } .groups-list col.cw-b { width: 64px; } .groups-list col.cw-in { width: 134px; } .groups-list col.cw-out { width: 138px; }
.groups-list col.cw-coord { width: 140px; } .groups-list col.cw-est { width: 138px; } .groups-list col.cw-act { width: 50px; }
.groups-list th { height: 50px; padding: 0 .85rem; text-align: left; background: var(--gp-cream); color: var(--gp-orange); font-size: .82rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; border-bottom: 1px solid var(--gp-line); }
.groups-list th:first-child { border-top-left-radius: 15px; } .groups-list th:last-child { border-top-right-radius: 15px; }
.groups-list td { height: 50px; padding: 0 .85rem; vertical-align: middle; border-bottom: 1px solid var(--gp-line); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--gp-ink); }
.groups-list tbody tr:last-child td { border-bottom: 0; }
.groups-list tbody tr:hover td { background: #fffaf5; }
.groups-list tbody tr[data-href] { cursor: pointer; }
.groups-list .gl-link { color: var(--gp-orange); text-decoration: none; }
.groups-list .gl-link strong { font-size: 1.05rem; font-weight: 800; }
.groups-list .gl-link:hover strong { text-decoration: underline; }
.groups-list .gl-m { display: none; }
.groups-list .gl-colline { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.groups-list .gl-name { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--gp-ink); text-decoration: none; }
.groups-list .gl-name:hover { text-decoration: underline; }
.groups-list .gl-tag { flex: 0 1 auto; max-width: 120px; overflow: hidden; text-overflow: ellipsis; padding: .12rem .55rem; border-radius: 999px; background: #f3f4f6; color: #4b5563; font-size: .75rem; font-weight: 600; }
.groups-list .gl-info { flex: none; display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: #fef3c7; color: #92400e; font-size: .72rem; font-weight: 800; font-style: italic; cursor: help; }
.groups-list .pill { padding: .24rem .8rem; font-size: .78rem; font-weight: 700; }
.groups-list .pill.st-pendiente { background: #ffedd5; color: #c2410c; }
.groups-list .pill.st-listo { background: #dcfce7; color: #166534; }
.groups-list .pill.st-aereo { background: #dbeafe; color: #1d4ed8; }
.groups-list .gl-act { padding: 0 .4rem; text-align: center; overflow: visible; }
.groups-list .gl-chev { display: none; }
.row-menu { position: relative; display: inline-block; }
.row-menu summary { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; color: #4b5563; cursor: pointer; list-style: none; }
.row-menu summary::-webkit-details-marker { display: none; }
.row-menu summary:hover, .row-menu[open] summary { background: var(--gp-cream); color: var(--gp-orange); }
.row-menu-pop { position: absolute; right: 0; top: calc(100% + 4px); z-index: 30; min-width: 200px; padding: .3rem; text-align: left; background: #fff; border: 1px solid var(--gp-line); border-radius: 12px; box-shadow: 0 10px 28px rgba(31, 41, 55, .16); }
.row-menu-pop a, .row-menu-pop button { display: block; width: 100%; padding: .55rem .75rem; border: 0; border-radius: 8px; background: none; color: var(--gp-ink); font: inherit; font-size: .92rem; text-align: left; text-decoration: none; cursor: pointer; }
.row-menu-pop a:hover, .row-menu-pop button:hover { background: var(--gp-cream); color: var(--gp-orange); }
.row-menu-pop form { margin: 0; }
.gp-foot { margin: .6rem .25rem 0; color: var(--muted); font-size: .88rem; }

@media (min-width: 761px) and (max-width: 1040px) {
    .groups-list { font-size: .9rem; }
    .groups-list th, .groups-list td { padding: 0 .55rem; }
    .groups-list col.cw-master { width: 76px; } .groups-list col.cw-b { width: 52px; } .groups-list col.cw-in { width: 118px; } .groups-list col.cw-out { width: 122px; }
    .groups-list col.cw-coord { width: 100px; } .groups-list col.cw-est { width: 118px; } .groups-list col.cw-act { width: 42px; }
    .gp-extra { flex-wrap: wrap; }
}

@media (max-width: 760px) {
    .gp-head { margin-bottom: .75rem; }
    .gp-head h1 { font-size: 1.55rem; }
    .gp-new-long { display: none; } .gp-new-short { display: inline; }
    .gp-new { min-height: 40px; padding: .4rem 1rem; }
    .gp-filters { flex-wrap: wrap; gap: .5rem; }
    .gp-search input { height: 44px; }
    .gp-toggle { display: inline-flex; height: 44px; padding: 0 .75rem; }
    .gp-toggle span { display: none; }
    .gp-extra { display: none; flex: 1 1 100%; flex-wrap: wrap; }
    .gp-filters.gp-open .gp-extra { display: flex; }
    .gp-field { height: 44px; flex: 1 1 calc(50% - .5rem); min-width: 0; }
    .gp-extra .gp-field:first-child { flex-basis: 100%; }
    .gp-field select, .gp-field input { flex: 1; min-width: 0; }
    .groups-list, .groups-list tbody { display: block; }
    .groups-list colgroup, .groups-list thead { display: none; }
    .groups-list tr { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto 30px; align-items: center; min-height: 58px; border-bottom: 1px solid var(--gp-line); }
    .groups-list tbody tr:last-child { border-bottom: 0; }
    .groups-list td { height: auto; border: 0; padding: 0; }
    .groups-list td.gl-b, .groups-list td.gl-in, .groups-list td.gl-out, .groups-list td.gl-coord, .groups-list td.gl-col { display: none; }
    .groups-list td.gl-master { display: flex; align-items: center; gap: .8rem; min-width: 0; padding: .45rem 0 .45rem .9rem; overflow: visible; }
    .groups-list .gl-link { flex: none; min-width: 48px; }
    .groups-list .gl-link::after { content: ''; position: absolute; inset: 0; }
    .groups-list .gl-m { display: block; min-width: 0; line-height: 1.25; }
    .groups-list .gl-m1 { display: flex; gap: .6rem; overflow: hidden; white-space: nowrap; font-size: .93rem; }
    .groups-list .gl-m1 > span { flex: none; }
    .groups-list .gl-m1 > .gl-m1c { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; color: var(--muted); }
    .groups-list .pill { padding: .2rem .6rem; font-size: .72rem; }
    .groups-list .gl-m2 { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: .78rem; text-transform: uppercase; }
    .groups-list td.gl-est { padding: 0 .35rem 0 .5rem; }
    .groups-list td.gl-act { padding: 0 .5rem 0 0; }
    .groups-list .row-menu { display: none; }
    .groups-list .gl-chev { display: inline-grid; place-items: center; width: 28px; height: 44px; color: #6b7280; }
    .groups-list tbody tr:hover td { background: none; }
}

/* Agregar pedido: una sola tarjeta (MASTER) con sus productos en filas y las divisiones debajo */
.mx-page { max-width: 1040px; margin: 0 auto; --navy: #1e2a44; }
.mx-page h1 { color: var(--navy); }
.mx-form { display: grid; gap: .8rem; }
.mx-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: .8rem 1rem; color: var(--navy); }
.mx-card h2, .mx-card h3 { margin: 0; color: var(--navy); }

.mx-head { display: flex; align-items: center; gap: .6rem; padding-bottom: .6rem; }
.mx-ico { flex: none; color: var(--muted); display: inline-flex; }
.mx-title { flex: 1; min-width: 0; }
.mx-title h2 { font-size: 1.05rem; }
.mx-title h2 span { font-size: .85rem; font-weight: 500; color: var(--muted); margin-left: .35rem; }
.mx-title p { margin: .1rem 0 0; font-size: .85rem; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mx-tools { display: flex; align-items: center; gap: .9rem; flex: none; }
.mx-tools a { font-size: .9rem; font-weight: 600; white-space: nowrap; }
.mx-arrow { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 0; border-radius: 8px; background: none; color: var(--muted); cursor: pointer; padding: 0; }
.mx-arrow svg, .mx-dhead svg { transition: transform .15s; flex: none; }
.mx-arrow[aria-expanded=false] svg, .mx-dhead[aria-expanded=false] svg { transform: rotate(-90deg); }
.mx-warn { margin: 0 0 .5rem; padding: .3rem .6rem; font-size: .85rem; color: #78350f; background: #fef3c7; border-radius: 8px; }

/* filas: nombre a la izquierda, cantidad a la derecha */
.mx-rows { display: grid; grid-template-columns: 1fr; column-gap: 2rem; }
.mx-row { display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: .75rem; margin: 0; min-height: 44px; padding: 0; border-top: 1px solid var(--line); font-size: .95rem; font-weight: 500; }
.mx-row > input { width: 5.5rem; min-height: 36px; padding: .2rem .5rem; text-align: right; font-weight: 600; }
.mx-rows[hidden], #mx-dlist[hidden], .mx-new[hidden] { display: none; }

/* divisiones: dentro de la misma tarjeta, separadas por una línea fina */
.mx-divs { margin-top: .4rem; border-top: 1px solid var(--line); padding-top: .4rem; }
.mx-divs-head { display: flex; align-items: center; gap: .25rem; min-height: 40px; }
.mx-divs-head h3 { flex: 1; font-size: .95rem; }
.mx-add { min-height: 36px; padding: 0 .25rem; border: 0; background: none; color: #c2410c; font: inherit; font-weight: 700; font-size: .9rem; cursor: pointer; }
#mx-dlist, .mx-new { margin-left: 1rem; }
.mx-div { padding: .2rem 0 .5rem; }
.mx-div + .mx-div { border-top: 1px solid var(--line); padding-top: .5rem; }
.mx-dhead { display: flex; align-items: center; gap: .6rem; width: 100%; min-height: 40px; padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.mx-letter { flex: none; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: #fff1e0; color: #c2410c; font-size: .8rem; }
.mx-dname { flex: 1; min-width: 0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mx-pax { flex: none; font-size: .85rem; color: var(--muted); }
.mx-div .mx-rows .mx-row:first-child { border-top: 0; }
.mx-new { border-top: 1px solid var(--line); padding-top: .5rem; }
.mx-fields { display: grid; grid-template-columns: 1fr; gap: .5rem; margin-bottom: .4rem; }
.mx-fields label { display: grid; gap: .15rem; margin: 0; font-size: .85rem; font-weight: 600; }
.mx-fields input { min-height: 40px; }
.mx-page .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.mx-actions { display: flex; gap: .6rem; flex-wrap: wrap; }
@media (max-width: 760px) {
    .mx-title p { white-space: normal; }
}
@media (min-width: 761px) {
    .mx-card { padding: 1rem 1.25rem; }
    .mx-rows { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mx-card > .mx-rows { grid-template-rows: repeat(3, auto); grid-auto-flow: column; }
    .mx-div .mx-row { border-top: 0; }
    .mx-fields { grid-template-columns: 6rem 1fr 8rem; }
}

.form-section { margin: 1rem 0 .4rem; font-size: 1rem; color: var(--ink); }
.div-list { margin: 0 0 .6rem; padding-left: 1.1rem; font-size: .92rem; }
.div-edit { border: 0; border-top: 1px solid var(--line); margin: 0 0 .6rem; padding: .5rem 0 0; min-width: 0; }
.div-edit legend { padding: 0 .3rem 0 0; font-size: .95rem; }
.div-edit input[type=file] { font-size: .85rem; max-width: 100%; }

/* Selector compacto de foto (botón personalizado + nombre del archivo) */
.filebtn { display: grid; gap: .3rem; min-width: 0; margin-bottom: .5rem; }
.filebtn-title { font-weight: 600; font-size: .9rem; color: var(--ink); }
.filebtn-row { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.filebtn-btn { position: relative; flex: none; display: inline-flex; align-items: center; justify-content: center; margin: 0; min-height: 40px; padding: 0 1rem; border: 1px solid #fdba74; border-radius: 999px; background: #fff; color: #9a3412; font-size: .9rem; font-weight: 700; cursor: pointer; transition: background .15s, border-color .15s, box-shadow .15s; }
.filebtn-btn:hover { background: #fff7ed; border-color: #f97316; }
.filebtn-btn:active { background: #ffedd5; }
.filebtn-btn:has(.filebtn-input:focus-visible) { outline: 2px solid #c2410c; outline-offset: 2px; }
.filebtn-input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; font-size: 0; }
.filebtn-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .85rem; font-weight: 400; color: var(--muted); }
.filebtn.has-file .filebtn-name { color: var(--ink); font-weight: 600; }
.filebtn.has-file .filebtn-btn { border-color: #f97316; }
@media (max-width: 420px) {
    .filebtn-row { flex-wrap: wrap; }
    .filebtn-name { flex-basis: 100%; }
}

.div-pair { display: grid; grid-template-columns: 1fr; gap: 0 1rem; }
@media (min-width: 761px) { .div-pair { grid-template-columns: 1fr 1fr; } }

.div-add { margin: 0 0 .6rem; min-height: 40px; padding: 0 1rem; border: 1px solid #fdba74; border-radius: 999px; background: #fff; color: #9a3412; font: inherit; font-weight: 700; cursor: pointer; transition: background .15s, border-color .15s; }
.div-add:hover { background: #fff7ed; border-color: #f97316; }
.div-add:active { background: #ffedd5; }
.div-add:focus-visible, .div-remove:focus-visible { outline: 2px solid #c2410c; outline-offset: 2px; }
.div-remove { margin-left: .5rem; padding: 0 .4rem; border: 0; background: none; color: var(--danger); font: inherit; font-size: .85rem; font-weight: 600; cursor: pointer; text-decoration: underline; }

/* Ficha del grupo: fotos por producto (miniaturas) */
.gal { margin-top: .6rem; }
.gal-title { margin: .8rem 0 .4rem; font-size: .95rem; color: var(--ink); }
.gal-title small { color: var(--muted); font-weight: 400; margin-left: .3rem; }
.gal-items { display: flex; flex-wrap: wrap; gap: .75rem; margin: 0; padding: 0; list-style: none; }
.gal-item { display: grid; grid-template-columns: auto; justify-items: start; gap: .2rem; width: 96px; font-size: .8rem; }
.gal-thumb { display: grid; place-items: center; width: 96px; height: 96px; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; }
.gal-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gal-empty { color: var(--muted); font-size: .75rem; background: #faf5ee; border-style: dashed; }
.gal-label { font-weight: 600; line-height: 1.2; }
.gal-qty { color: var(--muted); }
.lightbox { max-width: min(94vw, 1100px); max-height: 94vh; padding: .5rem; border: 0; border-radius: 12px; background: #fff; }
.lightbox::backdrop { background: rgba(31, 41, 55, .75); }
.lightbox img { display: block; max-width: 100%; max-height: 82vh; margin: 0 auto; }
.lightbox-cap { margin: .4rem 0 0; text-align: center; font-size: .9rem; color: var(--muted); }
.lightbox-close { position: absolute; top: .3rem; right: .3rem; width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .9); font-size: 1.5rem; line-height: 1; cursor: pointer; color: var(--ink); }
@media (max-width: 420px) { .gal-item, .gal-thumb { width: 88px; } .gal-thumb { height: 88px; } }

.gal-thumb { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; touch-action: manipulation; }
.gal-thumb img { -webkit-user-drag: none; }
.gal-peek { position: fixed; z-index: 60; padding: .35rem; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 8px 28px rgba(31, 41, 55, .28); pointer-events: none; overflow: hidden; }
.gal-peek[hidden] { display: none; }
.gal-peek img { display: block; width: auto; max-width: 100%; margin: 0 auto; object-fit: contain; border-radius: 8px; }
.gal-peek span { display: block; margin-top: .25rem; text-align: center; font-size: .8rem; color: var(--muted); }

/* Ventana "Agregar fotos" (ficha del grupo) */
.pm { font-family: inherit; font-size: 1rem; line-height: 1.45; width: min(860px, calc(100vw - 24px)); max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); padding: 0; border: 0; border-radius: 18px; background: #fff; color: #1e2a44; box-shadow: 0 24px 60px rgba(31, 41, 55, .35); overflow: hidden; }
.pm::backdrop { background: rgba(31, 41, 55, .6); }
.pm[open] { display: flex; }
.pm .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.pm-box { display: flex; flex-direction: column; width: 100%; max-height: inherit; margin: 0; }
.pm-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.4rem .6rem; }
.pm-head h2 { margin: 0 0 .2rem; font-size: 1.5rem; color: #1e2a44; }
.pm-head p { margin: 0; color: #4b5563; font-size: .95rem; }
.pm-x { flex: none; width: 40px; height: 40px; border: 0; border-radius: 10px; background: #f1f5f9; color: #475569; font-size: 1.5rem; line-height: 1; cursor: pointer; }
.pm-x:hover { background: #e2e8f0; }
.pm-body { flex: 1; min-height: 0; overflow-y: auto; padding: .4rem 1.4rem 1rem; display: grid; gap: .9rem; align-content: start; }
.pm-alert { padding: .6rem .8rem; border-radius: 10px; background: #fee2e2; color: #7f1d1d; font-size: .9rem; }
.pm-alert p { margin: 0 0 .25rem; }
.pm-alert p:last-child { margin: 0; }
.pm-master { border: 1px solid #fdba74; background: #fff7ed; border-radius: 14px; padding: .9rem 1rem; }
.pm-master-head { display: flex; align-items: center; gap: .8rem; margin-bottom: .7rem; }
.pm-master-ico { flex: none; color: #f97316; display: inline-flex; }
.pm-master-head strong { font-size: 1.05rem; }
.pm-master-head strong span { font-weight: 500; color: #475569; }
.pm-master-head small { display: block; color: #6b7280; }
.pm-divs-head { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; flex-wrap: wrap; padding-top: .6rem; border-top: 1px solid var(--line); }
.pm-divs-head h3 { margin: 0; font-size: 1.05rem; color: #1e2a44; }
.pm-divs-head span { font-size: .85rem; color: #6b7280; }
.pm-empty { margin: 0; color: #6b7280; font-size: .9rem; }
.pm-div { display: grid; grid-template-columns: auto 1fr; gap: .8rem; align-items: start; padding-bottom: .9rem; border-bottom: 1px solid var(--line); }
.pm-div:last-child { border-bottom: 0; padding-bottom: 0; }
.pm-letter { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: #ffedd5; color: #ea580c; font-size: 1.2rem; }
.pm-div-main { min-width: 0; }
.pm-div-main h4 { margin: .1rem 0 .5rem; font-size: .98rem; color: #1e2a44; overflow-wrap: anywhere; }
.pm-pair { display: grid; grid-template-columns: 1fr; gap: .7rem; }
.pm-div .pm-cell { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: .6rem .7rem; }
.pm-master .pm-cell { padding: .1rem 0; }
.pm-label { display: block; margin-bottom: .4rem; font-size: .9rem; font-weight: 600; }
.pm-row { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.pm-thumb { position: relative; flex: none; width: 64px; height: 64px; border: 1px solid var(--line); border-radius: 10px; background: #f8fafc; display: grid; place-items: center; }
.pm-thumb img { width: 100%; height: 100%; object-fit: cover; border-radius: 9px; display: block; }
.pm-noimg { color: #94a3b8; display: inline-flex; }
.pm-noimg[hidden] { display: none; }
.pm-clear { position: absolute; top: -8px; right: -8px; width: 22px; height: 22px; border: 1px solid var(--line); border-radius: 50%; background: #fff; color: #475569; font-size: .95rem; line-height: 1; cursor: pointer; padding: 0; }
.pm-pick { display: grid; gap: .15rem; min-width: 0; justify-items: start; }
.pm-btn { position: relative; display: inline-flex; flex-direction: row; align-items: center; gap: .4rem; margin: 0; min-height: 40px; padding: 0 .9rem; border: 1px solid #fdba74; border-radius: 999px; background: #fff; color: #9a3412; font-size: .9rem; font-weight: 700; cursor: pointer; white-space: nowrap; transition: background .15s, border-color .15s; }
.pm-btn:hover { background: #fff7ed; border-color: #f97316; }
.pm-btn:active { background: #ffedd5; }
.pm-btn:has(.pm-input:focus-visible) { outline: 2px solid #c2410c; outline-offset: 2px; }
.pm-input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; font-size: 0; }
.pm-file { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .85rem; color: #64748b; }
.pm-cell.has-file .pm-file { color: #1e2a44; font-weight: 600; }
.pm-cell.has-file .pm-btn { border-color: #f97316; }
.pm-size { color: #94a3b8; font-size: .78rem; }
.pm-err { color: #b91c1c; font-size: .8rem; font-weight: 600; }
.pm-err[hidden] { display: none; }
.pm-foot { display: flex; justify-content: space-between; gap: .75rem; padding: .8rem 1.4rem 1.1rem; border-top: 1px solid var(--line); background: #fff; }
.pm-foot .btn { min-height: 46px; }
@media (min-width: 761px) {
    .pm-pair { grid-template-columns: 1fr 1fr; gap: 0; }
    .pm-master .pm-pair .pm-cell + .pm-cell { border-left: 1px solid #fed7aa; padding-left: 1rem; margin-left: 1rem; }
    .pm-div .pm-pair { gap: .7rem; }
}
@media (max-width: 760px) {
    .pm { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); border-radius: 14px; }
    .pm-head { padding: .9rem 1rem .4rem; }
    .pm-head h2 { font-size: 1.25rem; }
    .pm-body { padding: .3rem 1rem .8rem; }
    .pm-div { grid-template-columns: 1fr; }
    .pm-letter { width: 36px; height: 36px; font-size: 1rem; }
    .pm-div { gap: .4rem; }
    .pm-pair { gap: .6rem; }
    .pm-master .pm-cell { background: #fff; border: 1px solid #fed7aa; border-radius: 12px; padding: .6rem .7rem; }
    .pm-foot { padding: .7rem 1rem .9rem; }
    .pm-foot .btn { flex: 1; white-space: nowrap; padding-left: .5rem; padding-right: .5rem; font-size: .95rem; }
}

/* Ventana "Agregar pedido" (usa la misma estructura que "Agregar fotos") */
.om { width: min(780px, calc(100vw - 24px)); }
.mx-in-modal { max-width: none; margin: 0; --navy: #1e2a44; }
.mx-in-modal .mx-card { border: 0; border-radius: 0; padding: 0; background: transparent; }
.mx-in-modal .mx-title h2 { font-size: 1.05rem; }
.mx-in-modal .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.mx-note, .pm-note { margin: .5rem 0 .2rem; font-size: .85rem; color: var(--muted); }
a.mx-add { display: inline-flex; align-items: center; text-decoration: none; }
a.mx-add:hover { text-decoration: underline; }
@media (max-width: 760px) { .om { width: calc(100vw - 16px); } }

/* Agregar pedido: miniatura de la foto y foto del remito en cada producto */
.mx-row { gap: .5rem; }
.mx-row-name { flex: 1; min-width: 0; }
.mx-media { display: inline-flex; align-items: center; gap: .35rem; flex: none; }
.mx-thumb { position: relative; display: inline-flex; width: 30px; height: 30px; border: 1px solid var(--line); border-radius: 7px; overflow: hidden; background: #fff; -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; touch-action: manipulation; }
.mx-thumb[hidden] { display: none; }
.mx-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; -webkit-user-drag: none; }
.mx-rem { position: relative; display: inline-flex; align-items: center; gap: .25rem; }
.mx-rem-thumb { border-color: #fdba74; }
.mx-rem-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin: 0; border: 1px solid #fdba74; border-radius: 999px; background: #fff; color: #9a3412; cursor: pointer; transition: background .15s, border-color .15s; }
.mx-rem-btn:hover { background: #fff7ed; border-color: #f97316; }
.mx-rem-btn:has(.mx-rem-input:focus-visible) { outline: 2px solid #c2410c; outline-offset: 2px; }
.mx-rem-input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; font-size: 0; }
.mx-rem-clear { position: absolute; top: -7px; right: -7px; width: 18px; height: 18px; border: 1px solid var(--line); border-radius: 50%; background: #fff; color: #475569; font-size: .8rem; line-height: 1; padding: 0; cursor: pointer; }
.mx-rem.has-file .mx-rem-btn { border-color: #f97316; background: #fff7ed; }
.mx-rem-err { position: absolute; right: 0; top: 100%; z-index: 2; white-space: nowrap; font-size: .7rem; font-weight: 600; color: #b91c1c; background: #fff; padding: 0 .2rem; }
.gal-peek { z-index: 2147483000; }
.mx-media { min-width: 74px; justify-content: flex-end; }

/* Remito: una sola foto para todo el pedido */
.mx-media { min-width: 0; justify-content: flex-end; }
.mx-remito { margin: .2rem 0 .6rem; padding: .55rem .7rem; border: 1px solid #fed7aa; border-radius: 12px; background: #fff7ed; }
.mx-remito-label { display: block; margin-bottom: .35rem; font-size: .85rem; font-weight: 700; color: var(--navy, #1e2a44); }
.mx-remito-body { position: relative; display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.mx-remito-btn { position: relative; display: inline-flex; flex-direction: row; align-items: center; gap: .4rem; margin: 0; min-height: 38px; padding: 0 .9rem; border: 1px solid #fdba74; border-radius: 999px; background: #fff; color: #9a3412; font-size: .88rem; font-weight: 700; white-space: nowrap; cursor: pointer; transition: background .15s, border-color .15s; }
.mx-remito-btn:hover { background: #fff7ed; border-color: #f97316; }
.mx-remito-btn:has(.mx-rem-input:focus-visible) { outline: 2px solid #c2410c; outline-offset: 2px; }
.mx-remito.has-file .mx-remito-btn { border-color: #f97316; }
.mx-remito-file { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .82rem; color: var(--muted); }
.mx-remito.has-file .mx-remito-file { color: var(--navy, #1e2a44); font-weight: 600; }
.mx-remito .mx-rem-clear { position: static; }
.mx-import-btn { font: inherit; font-size: .88rem; font-weight: 700; }
.mx-remito.has-file .mx-import-btn { border-color: #fdba74; }
.mx-remito .mx-rem-err { position: static; flex-basis: 100%; white-space: normal; }
.mx-remito .mx-thumb { width: 38px; height: 38px; }.mx-remito-file { flex-basis: 100%; order: 5; }
.mx-remito .mx-rem-clear { order: 3; }
.mx-remito .mx-rem-clear { order: 1; margin-left: -.2rem; }
.mx-remito-btn { order: 2; }

/* ---- Agregar pedido: tarjeta de datos, MASTER y divisiones en tarjetas ---- */
.om .pm-body { gap: .8rem; }
.om-group { border: 1px solid var(--line); border-radius: 14px; padding: .75rem 1rem; background: #fff; }
.om-group-head { display: flex; align-items: center; gap: .6rem; margin-bottom: .45rem; }
.om-group-head h3 { flex: 1; margin: 0; font-size: 1rem; color: #1e2a44; }
.om-group-ico { color: #f97316; display: inline-flex; }
.om-data { display: flex; flex-wrap: wrap; gap: .3rem 1.6rem; margin: 0; }
.om-data > div { min-width: 0; }
.om-data dt { font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.om-data dd { margin: 0; font-weight: 700; color: #1e2a44; }
.om-schools { margin: .5rem 0 0; font-size: .88rem; color: #1e2a44; overflow-wrap: anywhere; }
.om-master { border: 1px solid #fed7aa; background: #fff7ed; border-radius: 14px; padding: .75rem 1rem; }
.om-title { margin: 0 0 .5rem; font-size: 1.02rem; color: #1e2a44; }
.om-title span { font-size: .85rem; font-weight: 500; color: var(--muted); margin-left: .35rem; }
.om-master .mx-remito { background: #fff; margin-top: 0; }
.om-master .mx-row { border-top-color: #fed7aa; }
.om-divs-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.om-divs-head h3 { margin: 0; font-size: 1.02rem; color: #1e2a44; }
.om-add { white-space: nowrap; }
.om-div-list, .om-new-list { display: grid; gap: .6rem; margin-top: .6rem; }
.om-new-list:empty { margin-top: 0; }
.om-div { border: 1px solid var(--line); border-radius: 14px; background: #fff; padding: .55rem .8rem .7rem; }
.om-div-new { border-color: #fdba74; }
.om-div-head { display: flex; align-items: center; gap: .5rem; min-height: 44px; }
.om-div-head-new { gap: .6rem; }
.om-div-toggle { flex: 1; min-width: 0; display: flex; align-items: center; gap: .6rem; padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; min-height: 44px; }
.om-div-toggle svg { margin-left: auto; transition: transform .15s; flex: none; color: var(--muted); }
.om-div-toggle[aria-expanded=false] svg { transform: rotate(-90deg); }
.om-div-name { flex: 1; min-width: 0; font-weight: 700; color: #1e2a44; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.om-div-name small { margin-left: .5rem; font-weight: 500; color: var(--muted); }
.om-del { flex: none; padding: 0 .3rem; min-height: 32px; border: 0; background: none; color: #b91c1c; font: inherit; font-size: .85rem; font-weight: 600; text-decoration: underline; cursor: pointer; }
.om-div-body { display: grid; grid-template-columns: 1fr; gap: .7rem; margin-top: .3rem; padding-top: .55rem; border-top: 1px solid var(--line); }
.om-div-body[hidden] { display: none; }
.om-cell-title { display: block; margin-bottom: .35rem; font-size: .88rem; font-weight: 600; color: #1e2a44; }
.om-cell-row { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.om-new-fields { display: grid; grid-template-columns: 6rem 1fr; gap: .6rem; margin-top: .2rem; }
.om-new-fields label { display: grid; gap: .15rem; margin: 0; font-size: .85rem; font-weight: 600; }
.om-new-fields input { min-height: 40px; }
.mx-pic { position: relative; display: inline-flex; align-items: center; gap: .35rem; flex-wrap: wrap; }
.mx-pic .mx-thumb { width: 34px; height: 34px; }
.mx-pick { position: relative; display: inline-flex; flex-direction: row; align-items: center; gap: .35rem; margin: 0; min-height: 36px; padding: 0 .75rem; border: 1px solid #fdba74; border-radius: 999px; background: #fff; color: #9a3412; font-size: .85rem; font-weight: 700; white-space: nowrap; cursor: pointer; transition: background .15s, border-color .15s; }
.mx-pick:hover { background: #fff7ed; border-color: #f97316; }
.mx-pick:has(.mx-rem-input:focus-visible) { outline: 2px solid #c2410c; outline-offset: 2px; }
.mx-pic.has-file .mx-pick { border-color: #f97316; background: #fff7ed; }
.mx-pic .mx-rem-clear { position: static; }
.mx-pic-name { display: none; }
.mx-pic .mx-rem-err { position: absolute; left: 0; top: 100%; white-space: nowrap; }
/* cantidades: campo limpio, sin flechas, valor centrado */
input.om-qty { width: 5.2rem; min-height: 38px; padding: .2rem .4rem; text-align: center; font-weight: 700; border-radius: 10px; -moz-appearance: textfield; appearance: textfield; }
input.om-qty::-webkit-outer-spin-button, input.om-qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.mx-row input.om-qty { margin-left: .4rem; }
@media (min-width: 761px) { .om-div-body { grid-template-columns: 1fr 1fr; column-gap: 1.2rem; } }
@media (max-width: 760px) { .om-data { gap: .3rem 1.1rem; } input.om-qty { width: 4.6rem; } }

/* ---- Agregar pedido: afinado según la referencia ---- */
.om-group { display: flex; align-items: center; gap: .9rem; padding: .8rem 1rem; }
.om-group-ico { flex: none; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: #ffedd5; color: #ea580c; }
.om-group-main { flex: 1; min-width: 0; }
.om-group-main h3 { margin: 0; font-size: 1.3rem; color: #1e2a44; }
.om-group .om-data { display: flex; flex-wrap: wrap; align-items: center; gap: .1rem .5rem; margin: .1rem 0 0; font-size: .9rem; color: var(--muted); }
.om-group .om-data b { color: #1e2a44; font-weight: 600; }
.om-group .om-data i { font-style: normal; color: #cbd5e1; }
.om-group .om-schools { margin: .15rem 0 0; font-size: .88rem; }
.om-edit { flex: none; display: inline-flex; align-items: center; gap: .4rem; min-height: 40px; padding: 0 1rem; border: 1px solid #fdba74; border-radius: 999px; background: #fff; color: #c2410c; font-size: .9rem; font-weight: 700; text-decoration: none; transition: background .15s; }
.om-edit:hover { background: #fff7ed; }
.om-master-head { display: flex; align-items: center; gap: .8rem; margin-bottom: .7rem; }
.om-master-ico { flex: none; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: #ffedd5; color: #ea580c; }
.om-title b { color: #c2410c; font-weight: 800; letter-spacing: .01em; }
.om-sub { margin: .1rem 0 0; font-size: .85rem; color: var(--muted); }
.om-codes { display: grid; grid-template-columns: 1fr; gap: .6rem; }
.om-code { display: grid; gap: .3rem; margin: 0; }
.om-code-label { font-size: .9rem; font-weight: 600; color: #1e2a44; }
.om-code input.om-qty { width: 100%; min-height: 44px; }
.om-master .mx-remito { margin-top: .7rem; }
.om-master-photos { display: grid; grid-template-columns: 1fr; gap: .7rem; margin-top: .8rem; padding-top: .7rem; border-top: 1px solid #fed7aa; }
.om-divs-head { gap: .4rem; }
.om-divs-head h3 { flex: 1; }
.om-add { display: inline-flex; align-items: center; gap: .35rem; }
.om-div { padding: .5rem .9rem .8rem; }
.om-div-toggle { align-items: center; }
.om-div-name { display: flex; flex-direction: column; justify-content: center; white-space: normal; line-height: 1.25; }
.om-div-name small { margin: 0; font-size: .85rem; font-weight: 500; }
.om-div-toggle .mx-letter { width: 40px; height: 40px; font-size: 1.1rem; }
.om-del { display: inline-grid; place-items: center; width: 36px; height: 36px; min-height: 0; padding: 0; border-radius: 10px; background: #fee2e2; color: #dc2626; text-decoration: none; }
.om-del:hover { background: #fecaca; }
.om-cell .mx-pic { flex-wrap: nowrap; }
.om-cell .mx-pic .mx-thumb { width: 64px; height: 48px; border-radius: 8px; }
.om-cell .mx-pick { min-height: 40px; padding: 0 .9rem; }
.om-cell .mx-pick span { white-space: nowrap; }
@media (min-width: 761px) {
    .om-codes { grid-template-columns: repeat(3, 1fr); gap: 1rem; }
    .om-master-photos { grid-template-columns: 1fr 1fr; column-gap: 1.2rem; }
    .om-div-body > .om-cell + .om-cell, .om-master-photos > .om-cell + .om-cell { border-left: 1px solid var(--line); padding-left: 1.2rem; }
}
@media (max-width: 760px) {
    .om-group { flex-wrap: wrap; }
    .om-edit { margin-left: 66px; }
    .om-group-main h3 { font-size: 1.15rem; }
    .om-cell .mx-pic .mx-thumb { width: 52px; height: 40px; }
    .om-cell .mx-pick { padding: 0 .65rem; }
}

/* Datos del grupo: en pantallas angostas el icono y el texto en una fila y el botón debajo (antes el texto se colapsaba) */
.om-group-main { flex: 1 1 12rem; min-width: 0; }
@media (max-width: 760px) {
    .om-group { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: .6rem .8rem; }
    .om-group-ico { width: 44px; height: 44px; }
    .om-edit { grid-column: 1 / -1; justify-self: start; margin: 0; }
    .om-group-main h3 { overflow-wrap: anywhere; }
}
.pm-body { grid-template-columns: minmax(0, 1fr); }
.om-divs-head { flex-wrap: wrap; }
.om-div-name { min-width: 0; overflow-wrap: anywhere; }
.mx-remito-btn { max-width: 100%; white-space: normal; text-align: left; line-height: 1.2; padding-top: .3rem; padding-bottom: .3rem; }

/* Grilla: modo edición */
.gx-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-left: auto; }
.gx-actions .gx-new { margin-left: 0; }
.gx-editbtn { border: 1.5px solid var(--orange); background: #fff; color: #c2410c; font-weight: 700; text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; padding: 0 1.1rem; border-radius: 999px; }
.gx-editbtn.is-on { background: #1e2a44; border-color: #1e2a44; color: #fff; }
.gx-help { margin: 0 0 .8rem; padding: .6rem .9rem; border: 1px dashed #fdba74; border-radius: 12px; background: #fff7ed; color: #7c2d12; font-size: .9rem; }
.gx-wrap.is-edit .gx-block { cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-user-drag: none; position: relative; }
.gx-wrap.is-edit .gx-block:active { cursor: grabbing; }
.gx-block.is-sel { box-shadow: 0 0 0 3px #1e2a44; position: relative; z-index: 3; }
.gx-grip { position: absolute; top: 0; bottom: 0; width: 14px; z-index: 4; cursor: ew-resize; touch-action: none; }
.gx-grip::after { content: ""; position: absolute; top: 25%; bottom: 25%; left: 5px; width: 4px; border-radius: 2px; background: var(--ac); opacity: .7; }
.gx-grip-l { left: 0; }
.gx-grip-r { right: 0; }
.gx-bulk { position: sticky; bottom: .75rem; z-index: 30; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; margin-top: .8rem; padding: .6rem .9rem; border-radius: 14px; background: #1e2a44; color: #fff; box-shadow: 0 6px 20px rgba(30, 42, 68, .3); }
.gx-bulk[hidden] { display: none; }
.gx-bulk-grp { display: inline-flex; align-items: center; gap: .3rem; font-size: .85rem; }
.gx-bulk button, .gx-bulk-open { min-height: 36px; min-width: 36px; padding: 0 .6rem; border: 0; border-radius: 8px; background: #fff; color: #1e2a44; font: inherit; font-weight: 700; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; }
.gx-bulk input { min-height: 36px; width: 150px; border-radius: 8px; border: 0; padding: 0 .6rem; }
.gx-bulk .gx-bulk-clear { background: transparent; color: #fff; text-decoration: underline; margin-left: auto; }
.gx-msg { margin: .6rem 0 0; padding: .5rem .8rem; border-radius: 10px; background: #fee2e2; color: #991b1b; }
@media (max-width: 639px) { .gx-actions { width: 100%; } .gx-actions > * { flex: 1; justify-content: center; text-align: center; } }

/* Bastidores a cuenta */
.fr-page { max-width: 720px; margin: 0 auto; --navy: #1e2a44; }
.fr-page h1 { margin: .1rem 0 .9rem; font-size: 1.9rem; color: var(--navy); }
.fr-card { background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 1.1rem 1.2rem; box-shadow: 0 1px 3px rgba(30, 42, 68, .05); min-width: 0; margin-bottom: 1rem; }
.fr-card h2 { margin: 0 0 .5rem; font-size: 1.1rem; color: var(--navy); }
.fr-big { display: flex; align-items: baseline; flex-wrap: wrap; gap: .3rem .8rem; padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid var(--line); }
.fr-big strong { font-size: 3.4rem; line-height: 1; font-weight: 800; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.fr-big span { color: #4b5563; font-size: 1rem; }
.fr-kind { border: 0; padding: 0; margin: 0 0 .8rem; display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.fr-opt { position: relative; display: block; }
.fr-opt input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.fr-opt span { display: flex; align-items: center; justify-content: center; gap: .4rem; min-height: 48px; padding: 0 .5rem; border: 1.5px solid var(--line); border-radius: 12px; background: #fff; font-weight: 700; color: #4b5563; text-align: center; }
.fr-opt input:focus-visible + span { outline: 3px solid #fdba74; outline-offset: 2px; }
.fr-opt-entrega input:checked + span { border-color: var(--orange); background: #fff3e6; color: #c2410c; }
.fr-opt-devolucion input:checked + span { border-color: #16a34a; background: #ecfdf3; color: #166534; }
.fr-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: .6rem; align-items: end; }
.fr-field { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.fr-lbl { font-size: .8rem; font-weight: 700; color: var(--navy); }
.fr-form input[type="number"], .fr-form input[type="date"] { min-height: 48px; width: 100%; }
.fr-submit { min-height: 48px; padding: 0 1.6rem; }
.fr-hint { min-height: 1.2em; margin: .5rem 0 0; font-size: .85rem; color: #7c2d12; }
.fr-empty, .fr-more { margin: .4rem 0; color: var(--muted); font-size: .92rem; }
.fr-moves { list-style: none; margin: 0; padding: 0; }
.fr-move { display: grid; grid-template-columns: 7rem minmax(0, 1fr) 4.5rem; align-items: center; gap: .6rem; min-height: 50px; border-top: 1px solid var(--line); }
.fr-move:first-child { border-top: 0; }
.fr-when { color: #4b5563; font-size: .9rem; }
.fr-pill { justify-self: start; padding: .2rem .8rem; border-radius: 999px; font-size: .82rem; font-weight: 700; white-space: nowrap; }
.fr-k-entrega { background: #ffedd5; color: #c2410c; }
.fr-k-devolucion { background: #dcfce7; color: #166534; }
.fr-qty { text-align: right; font-size: 1.2rem; font-weight: 800; color: var(--navy); }
.fr-page .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@media (max-width: 639px) {
    .fr-page h1 { font-size: 1.6rem; }
    .fr-big strong { font-size: 3rem; }
    .fr-fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .fr-submit { grid-column: 1 / -1; width: 100%; }
    .fr-move { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "pill qty" "when when"; row-gap: 0; padding: .5rem 0; }
    .fr-pill { grid-area: pill; }
    .fr-qty { grid-area: qty; }
    .fr-when { grid-area: when; font-size: .82rem; }
}
.fr-hint:empty { display: none; }

/* Importar pedido */
.pi { width: min(900px, calc(100vw - 24px)); }
.pi .pm-body { padding: .4rem 1.4rem 1rem; }
.pi-lbl { display: block; margin: 0 0 .3rem; font-size: .8rem; font-weight: 700; color: #1e2a44; }
.pi textarea { width: 100%; font: inherit; padding: .7rem .8rem; border: 1px solid var(--line); border-radius: 12px; resize: vertical; }
.pi-help, .pi-source { margin: .4rem 0 0; color: var(--muted); font-size: .85rem; }
.pi-link { border: 0; background: none; color: #c2410c; font: inherit; font-weight: 700; text-decoration: underline; cursor: pointer; padding: .3rem; }
.pi-summary { display: flex; align-items: flex-end; flex-wrap: wrap; gap: .5rem 1.2rem; margin-bottom: .6rem; }
.pi-out { display: flex; flex-direction: column; gap: .25rem; }
.pi-out input { min-height: 42px; }
.pi-warnings { list-style: none; margin: 0 0 .8rem; padding: .6rem .9rem; border-radius: 12px; background: #fef3c7; color: #92400e; font-size: .9rem; }
.pi-warnings li { padding: .15rem 0; }
.pi-warnings li::before { content: "⚠ "; }
.pi-warnings-in { margin: .5rem 0; }
.pi-warnings[hidden] { display: none; }
.pi-empty { padding: 1rem; color: var(--muted); }
.pi-block { margin: 0 0 1rem; padding: .9rem 1rem; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.pi-block-head { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem .8rem; margin-bottom: .3rem; }
.pi-block-head h3 { margin: 0; font-size: 1.1rem; color: #1e2a44; }
.pi-block-head select { flex: 1 1 260px; min-height: 42px; min-width: 0; }
.pi-meta { margin: 0 0 .5rem; color: #4b5563; font-size: .88rem; }
.pi-codes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem .7rem; margin-bottom: .8rem; }
.pi-codes .pi-lbl { grid-column: 1 / -1; margin: 0; }
.pi-field { display: flex; flex-direction: column; gap: .25rem; font-size: .8rem; color: #4b5563; min-width: 0; }
.pi input[type="number"], .pi input[type="text"], .pi input[type="date"] { min-height: 42px; width: 100%; }
.pi-rows { display: grid; gap: .35rem; margin-bottom: .6rem; }
.pi-row { display: grid; grid-template-columns: 7rem repeat(2, minmax(0, 1fr)) 2.4rem; gap: .5rem; align-items: end; padding: .5rem 0; border-top: 1px solid var(--line); }
.pi-row-head { align-items: center; padding: 0 0 .2rem; border-top: 0; font-size: .75rem; font-weight: 700; color: #4b5563; text-transform: uppercase; letter-spacing: .03em; }
.pi-cell { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.pi-cell-l { display: none; font-size: .75rem; color: #4b5563; }
.pi-div { text-transform: uppercase; }
.pi-x { min-width: 40px; min-height: 42px; border: 0; border-radius: 10px; background: #f3f4f6; color: #6b7280; font-size: 1.2rem; cursor: pointer; }
.pi-row-note { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: .35rem; }
.pi-row-note:empty { display: none; }
.pi-tag { padding: .15rem .6rem; border-radius: 999px; background: #f3f4f6; color: #374151; font-size: .78rem; }
.pi-tag-new { background: #dbeafe; color: #1e40af; }
.pi-tag-school { background: #ecfdf5; color: #065f46; font-weight: 600; }
.pi-tag-pend { background: #fef3c7; color: #92400e; }
.pi-pending { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .4rem; padding: .2rem .6rem; border-radius: 10px; background: #ffedd5; color: #9a3412; font-size: .82rem; }
.pi-pending select { min-height: 34px; }
.pi-total { display: flex; align-items: flex-end; flex-wrap: wrap; gap: .5rem 1rem; margin-top: .4rem; }
.pi-total .pi-field { width: 11rem; }
.pi-sum { margin: 0; font-size: .88rem; color: #4b5563; }
.pi-sum.is-ok { color: #166534; }
.pi-sum.is-warn { color: #92400e; font-weight: 700; }
.pi-status { margin: .5rem 0 0; font-size: .9rem; }
.pi-status.is-ok { color: #166534; font-weight: 700; }
.pi-status.is-warn { color: #b91c1c; }
.pi-more { margin: .6rem 0; }
.pi-more summary { cursor: pointer; font-weight: 700; color: #4b5563; }
.pi-more textarea { margin: .5rem 0; }
@media (max-width: 639px) {
    .pi .pm-body { padding: .3rem .9rem 1rem; }
    .pi-codes { grid-template-columns: 1fr; }
    .pi-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .pi-row-head { display: none; }
    .pi-cell-l { display: block; }
    .pi-cell:first-child { grid-column: 1 / -1; }
    .pi-x { grid-column: 1 / -1; width: 100%; }
}
@media (max-width: 639px) {
    .pi .pm-foot { flex-wrap: wrap; gap: .5rem; }
    .pi .pm-foot .btn { flex: 1 1 calc(50% - .5rem); justify-content: center; text-align: center; }
    .pi .pm-foot [data-pi-confirm], .pi .pm-foot [data-pi-analyze] { flex-basis: 100%; order: -1; }
}

/* Ficha del grupo: filas de «Pedidos y fotos» */
.pr-list { list-style: none; margin: .4rem 0 1rem; padding: 0; }
.pr-row { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr) 12.5rem 17rem; align-items: center; gap: .6rem 1rem; padding: .75rem 0; border-top: 1px solid var(--line); }
.pr-row:first-child { border-top: 0; }
.pr-id { display: flex; flex-direction: column; min-width: 0; align-self: start; padding-top: .2rem; }
.pr-id strong { color: #1e2a44; font-size: 1.05rem; }
.pr-id span { color: #4b5563; font-size: .75rem; text-transform: uppercase; letter-spacing: .02em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pr-main { display: flex; align-items: center; gap: .8rem; min-width: 0; flex-wrap: nowrap; }
.pr-main .gal-thumb { flex: none; width: 64px; height: 64px; }
.pr-main .gal-thumb img { width: 64px; height: 64px; object-fit: cover; border-radius: 10px; }
.pr-main .gal-empty { display: flex; align-items: center; justify-content: center; border: 1px dashed var(--line); border-radius: 10px; color: var(--muted); font-size: .7rem; background: #fafafa; }
.pr-name { display: flex; flex-direction: column; min-width: 5.5rem; flex: 1 1 6rem; }
.pr-name strong { color: #1e2a44; font-size: .95rem; }
.pr-name small { color: #6b7280; font-size: .8rem; }
.pr-qty { display: inline-flex; align-items: center; gap: .15rem; padding: .2rem; border-radius: 999px; background: #f3f4f6; flex: none; }
.pr-qty input.pr-qty-input { flex: none; width: 3.2rem; min-width: 0; min-height: 34px; padding: 0; margin: 0; border: 0; box-shadow: none; background: transparent; text-align: center; font: inherit; font-size: 1.05rem; font-weight: 600; color: #1e2a44; -moz-appearance: textfield; appearance: textfield; }
.pr-qty input.pr-qty-input:focus { outline: 2px solid #fdba74; border-radius: 8px; background: #fff; }
.pr-grad { position: relative; display: flex; align-items: center; gap: .5rem; min-width: 0; }
.pr-add { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .2rem; width: 100%; min-height: 64px; padding: .3rem; border: 1.5px dashed #d1d5db; border-radius: 12px; background: #fafafa; color: #6b7280; font-size: .78rem; text-align: center; cursor: pointer; position: relative; }
.pr-add:hover, .pr-add:focus-within { border-color: var(--orange); color: #c2410c; background: #fff7ed; }
.pr-add input, .pr-change input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; font-size: 0; }
.pr-thumb2 img { width: 64px; height: 64px; object-fit: cover; border-radius: 10px; display: block; }
.pr-grad-side { display: flex; flex-direction: column; gap: .2rem; justify-content: center; min-width: 0; }
/* título de graduados igual que el de mural: centrado junto a la foto, sin estirarse hasta el botón Cambiar */
.pr-grad-side .pr-name { flex: none; min-width: 0; }
.pr-change { position: relative; border: 0; background: none; padding: .15rem .3rem; font: inherit; font-size: .75rem; font-weight: 700; color: #c2410c; cursor: pointer; text-align: left; }
.pr-grad.is-busy { opacity: .55; pointer-events: none; }
.pr-err { position: absolute; left: 0; top: 100%; z-index: 2; margin-top: .15rem; padding: .1rem .5rem; border-radius: 8px; background: #fee2e2; color: #991b1b; font-size: .75rem; font-weight: 600; white-space: normal; max-width: 15rem; }
.pr-states { display: flex; gap: 1rem; padding-left: 1rem; border-left: 1px solid var(--line); }
.pr-state { display: flex; flex-direction: column; gap: .3rem; }
.pr-state-l { font-size: .78rem; font-weight: 700; color: #374151; }
.pr-chip { display: inline-flex; align-items: center; gap: .4rem; min-height: 34px; padding: 0 .85rem 0 .6rem; border: 0; border-radius: 999px; font: inherit; font-size: .85rem; font-weight: 600; cursor: pointer; white-space: nowrap; }
.pr-chip.is-off { background: #f3f4f6; color: #6b7280; }
.pr-chip.is-on { background: #dcfce7; color: #166534; }
.pr-chip:disabled { opacity: .6; cursor: progress; }
.pr-dot { width: 16px; height: 16px; border: 2px solid #9ca3af; border-radius: 50%; box-sizing: border-box; }
.pr-chip.is-on .pr-dot { border-color: #16a34a; background: #16a34a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 8.3 2.5 2.5L12 5.3' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat; }
@media (max-width: 899px) {
    .pr-main { flex-wrap: wrap; }
    .pr-row { grid-template-columns: minmax(0, 1fr) 12.5rem; }
    .pr-id { grid-column: 1 / -1; flex-direction: row; align-items: baseline; gap: .5rem; padding-top: 0; }
    .pr-main { grid-column: 1; }
    .pr-grad { grid-column: 2; }
    .pr-states { grid-column: 1 / -1; padding-left: 0; border-left: 0; }
}
@media (max-width: 479px) {
    .pr-row { grid-template-columns: minmax(0, 1fr); }
    .pr-grad { grid-column: 1; }
    .pr-add { flex-direction: row; justify-content: center; min-height: 48px; }
    .pr-states { gap: .6rem; flex-wrap: wrap; }
}
.pr-state { min-width: 7.6rem; }

/* Muestra aparte de las fotos vendidas («Muestra + 16») y foto de graduados 30x30 */
.pr-sample { align-self: center; padding: .12rem .55rem; border-radius: 999px; background: #fff3e6; color: #c2410c; font-size: .72rem; font-weight: 700; letter-spacing: .01em; white-space: nowrap; margin-left: .2rem; }
.pr-sample-plus { align-self: center; color: #9ca3af; font-weight: 600; margin: 0 .05rem 0 .25rem; }
.pr-sample[hidden], .pr-sample-plus[hidden] { display: none; }
.pr-qty input.pr-qty-input { width: 2.8rem; }
.pr-grad-cap { font-size: .72rem; color: #4b5563; font-weight: 600; line-height: 1.2; }
.pr-grad.has-photo { gap: .6rem; }
.pr-grad-none { min-height: 1px; }
.pr-add span { font-weight: 600; }
.pr-grad-n { font-style: normal; font-size: .72rem; color: #4b5563; font-weight: 600; }
/* cantidad de graduados con la misma forma que la cápsula del mural: número grande y muestra visible */
.pr-grad-t { display: block; }
.pr-grad-qty { display: inline-flex; align-items: center; gap: .3rem; margin-top: .2rem; padding: .2rem .65rem; border-radius: 999px; background: #fff; border: 1.5px solid #fdba74; color: #111827; font-size: 1rem; font-weight: 800; line-height: 1.2; align-self: flex-start; }
.pr-grad-qty em { font-style: normal; font-size: .7rem; font-weight: 600; padding: .1rem .45rem; border-radius: 999px; background: #fde9d9; color: #c2410c; }

/* ---------- Estados con color: fila completa (verde), incompleta (ámbar) y pendiente (neutral) ---------- */
.pill.st-parcial { background: #fef3c7; color: #92400e; box-shadow: inset 0 0 0 1px #fcd34d; }
.pill.st-finalizado { background: #166534; color: #fff; }
.pill.st-entregado { background: #fef9c3; color: #854d0e; }
.pill.gst-sin_pedido { background: #f3f4f6; color: #6b7280; }
.pill.gst-pendiente { background: #f3f4f6; color: #374151; }
.pill.gst-parcial { background: #fef3c7; color: #92400e; box-shadow: inset 0 0 0 1px #fcd34d; }
.pill.gst-cerrado { background: #166534; color: #fff; }
.hx-pill-parcial { background: #fef3c7; color: #92400e; }
.hx-pill-finalizado { background: #dcfce7; color: #166534; }
tr.row-final > td, .groups-list tbody tr.row-final > td { background: #ecfdf3; }
tr.row-final > td:first-child { box-shadow: inset 5px 0 0 #22c55e; }
tr.row-partial > td { background: #fffbeb; }
tr.row-partial > td:first-child { box-shadow: inset 5px 0 0 #f59e0b; }
.pr-row.row-final { background: #ecfdf3; border-color: #bbf7d0; }
.gl-pedido { display: block; margin-top: .25rem; font-size: .72rem; color: var(--muted); }

/* ---------- Lista de pedidos: todo el contenido a la vista ---------- */
.pedidos-list tbody tr[data-resumen], .groups-list tbody tr[data-resumen] { cursor: pointer; }
.pedidos-list tbody tr[data-resumen]:hover > td { filter: brightness(.98); }
.pedidos-list tbody tr[data-resumen]:focus-visible { outline: 3px solid #fdba74; outline-offset: -3px; }
.pedidos-list td { vertical-align: top; padding-top: .35rem; padding-bottom: .35rem; }
.pedidos-list .c-master strong { font-size: 1.05rem; letter-spacing: .01em; }
.pedidos-list .c-coord .div-chip { margin: 0 .25rem .1rem 0; padding: 0 .45rem; font-size: .76rem; }
.pedidos-list .c-coord > strong { font-size: .85rem; margin-bottom: .1rem; }
.pedidos-list .c-cole { font-size: .78rem; }
.pedidos-list .c-fechas span { font-size: .8rem; }
.pedidos-list .c-remitos { font-size: .8rem; }
.pedidos-list .c-count { font-size: .68rem; }
.pl-exp > summary { min-height: 28px; }
.pedidos-list .c-master a { text-decoration: none; color: inherit; }
.pedidos-list .c-bus { display: block; font-size: .78rem; color: var(--muted); margin-top: .1rem; }
.pedidos-list .c-fechas span { display: block; font-size: .88rem; white-space: nowrap; }
.pedidos-list .c-fechas b { display: inline-block; min-width: 2.2rem; font-size: .68rem; color: var(--muted); letter-spacing: .06em; }
.pedidos-list .c-coord { min-width: 190px; }
.pedidos-list .c-coord > strong { display: block; font-size: .95rem; margin-bottom: .25rem; }
.pedidos-list .c-cole { font-size: .85rem; color: #374151; }
.pedidos-list .c-prods { min-width: 280px; }
.pedidos-list .c-remitos { font-size: .85rem; max-width: 130px; overflow-wrap: anywhere; }
.pedidos-list .c-estado { white-space: nowrap; }
.pedidos-list .c-count { display: block; margin-top: .35rem; font-size: .72rem; line-height: 1.35; color: #4b5563; }
.pl-line { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .35rem; margin-bottom: .3rem; }
.pl-lv { flex: none; min-width: 3.4rem; font-size: .75rem; font-weight: 800; color: #c2410c; }
.pl-chip { display: inline-flex; align-items: baseline; gap: .3rem; padding: .12rem .55rem; border-radius: 8px; font-size: .82rem; background: #f3f4f6; border: 1px solid #e5e7eb; color: #1e2a44; }
.pl-chip b { font-weight: 700; }
.pl-chip em { font-style: normal; font-size: .62rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #7c3aed; }
.pl-chip i { font-style: normal; font-size: .66rem; font-weight: 700; color: #6b7280; }
.pl-chip.is-rec { background: #eff6ff; border-color: #bfdbfe; }
.pl-chip.is-rec i { color: #1d4ed8; }
.pl-chip.is-del { background: #dcfce7; border-color: #86efac; }
.pl-chip.is-del i { color: #166534; }
/* Pedido con varios productos: resumen en una línea; al expandir (fila propia) muestra todos */
.pl-exp > summary { list-style: none; display: flex; align-items: center; gap: .5rem; min-height: 40px; cursor: pointer; }
.pl-exp > summary::-webkit-details-marker { display: none; }
.pl-exp > summary:focus-visible { outline: 3px solid #fdba74; outline-offset: 2px; border-radius: 8px; }
.pl-sum { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .85rem; color: #1e2a44; }
.pl-ind { flex: none; color: #c2410c; font-size: 1.1rem; line-height: 1; transition: transform .15s; }
.pl-exp[open] > summary .pl-ind { transform: rotate(180deg); }
.pl-full { margin-top: .35rem; }
@media (max-width: 760px) {
    .pedidos-list tr.row-final { background: #ecfdf3; border-left-color: #22c55e; }
    .pedidos-list tr.row-partial { background: #fffbeb; border-left-color: #f59e0b; }
    .pedidos-list tr > td { background: transparent !important; box-shadow: none !important; }
    .pedidos-list td { padding-top: 0; padding-bottom: 0; }
    .pedidos-list .c-prods, .pedidos-list .c-coord, .pedidos-list .c-remitos { grid-column: 1 / -1; min-width: 0; max-width: none; }
    .pedidos-list .c-estado { white-space: normal; }
    .pedidos-list .c-count { display: inline-block; margin: 0 0 0 .5rem; vertical-align: middle; }
    .pedidos-list .c-fechas { display: flex; gap: .9rem; }
    .pedidos-list .c-fechas::before { display: none; }
}

/* ---------- Botón «Volver» claro y fácil de tocar ---------- */
.btn-back { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; margin: 0 0 .4rem; padding: .4rem .95rem; border: 1.5px solid #fdba74; border-radius: 999px; background: #fff; color: #c2410c; font-weight: 700; font-size: .95rem; text-decoration: none; }
.btn-back:hover { background: #fff3e6; }

/* Producto extra (pedido adicional cargado después del original) */
.pr-extra { margin-left: .4rem; padding: .05rem .45rem; border-radius: 999px; background: #ede9fe; color: #5b21b6; font-style: normal; font-size: .64rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; vertical-align: middle; }

/* ---------- Ventana de consulta (sólo lectura) ---------- */
html.rs-open { overflow: hidden; }
dialog.rs { font-family: inherit; font-size: 1rem; line-height: 1.45; width: min(820px, calc(100vw - 24px)); max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); padding: 0; border: 0; border-radius: 18px; background: #fff; color: #1e2a44; box-shadow: 0 24px 60px rgba(31, 41, 55, .35); overflow: hidden; }
dialog.rs::backdrop { background: rgba(17, 24, 39, .55); }
.rs-box { display: flex; flex-direction: column; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); }
.rs-head { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; padding: 1rem 1.15rem .85rem; background: linear-gradient(135deg, #fff7ed, #fffbeb); border-bottom: 1px solid #fed7aa; }
.rs-head.row-final { background: linear-gradient(135deg, #ecfdf3, #f0fdf4); border-bottom-color: #bbf7d0; }
.rs-head.row-partial { background: linear-gradient(135deg, #fffbeb, #fef3c7); border-bottom-color: #fcd34d; }
.rs-head h2 { margin: 0; font-size: 1.5rem; line-height: 1.15; }
.rs-head h2 small { font-size: .95rem; font-weight: 600; color: var(--muted); }
.rs-sub { margin: .3rem 0 0; font-size: .82rem; color: var(--muted); display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.rs-x { flex: none; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .85); color: #1e2a44; font-size: 1.6rem; line-height: 1; cursor: pointer; box-shadow: 0 0 0 1px #e5e7eb; }
.rs-x:hover { background: #fff; box-shadow: 0 0 0 1px #fdba74; }
.rs-body { overflow-y: auto; padding: 1rem 1.15rem; -webkit-overflow-scrolling: touch; }
.rs-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: .6rem 1rem; margin: 0 0 .7rem; }
.rs-meta dt { font-size: .65rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.rs-meta dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.rs-colegios { margin: 0 0 .8rem; font-size: .92rem; }
.rs-pedido { margin-top: .8rem; padding: .8rem .9rem; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.rs-pedido.row-final { background: #ecfdf3; border-color: #86efac; }
.rs-pedido.row-partial { background: #fffbeb; border-color: #fcd34d; }
.rs-pedido-head { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .7rem; }
.rs-pedido-head h3 { margin: 0; font-size: 1.1rem; }
.rs-count { font-size: .78rem; color: #4b5563; }
.rs-remitos { margin: .4rem 0 0; font-size: .85rem; }
.rs-level { margin: .8rem 0 .3rem; font-size: .9rem; color: #c2410c; }
.rs-level small { color: var(--muted); font-weight: 600; }
.rs-none { margin: .4rem 0; color: var(--muted); font-size: .9rem; }
.rs-prods { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; }
.rs-prod { display: grid; grid-template-columns: minmax(0, 1.5fr) auto auto auto; align-items: center; gap: .3rem .8rem; padding: .5rem .65rem; border: 1px solid #e5e7eb; border-radius: 10px; background: #fff; }
.rs-prod.is-done { border-color: #86efac; background: #f0fdf4; }
.rs-prod.is-part { border-color: #fcd34d; }
.rs-pn small { color: var(--muted); }
.rs-pn .rs-det { display: block; font-size: .75rem; }
.rs-extra { margin-left: .35rem; padding: .05rem .45rem; border-radius: 999px; background: #ede9fe; color: #5b21b6; font-style: normal; font-size: .62rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.rs-q { font-weight: 800; font-size: 1.05rem; white-space: nowrap; }
.rs-q small { font-size: .7rem; font-weight: 600; }
.rs-rm { font-size: .8rem; color: #374151; white-space: nowrap; }
.rs-st { display: inline-flex; flex-wrap: wrap; gap: .3rem; }
.rs-tag { display: inline-flex; align-items: center; gap: .3rem; padding: .15rem .55rem; border-radius: 999px; font-size: .74rem; font-weight: 700; white-space: nowrap; background: #f3f4f6; color: #4b5563; }
.rs-tag i { width: .55rem; height: .55rem; border-radius: 50%; background: #9ca3af; }
.rs-tag.is-on { background: #dcfce7; color: #166534; }
.rs-tag.is-on i { background: #22c55e; }
.rs-foot { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .75rem 1.15rem; border-top: 1px solid var(--line); background: #fff; }
.rs-open { color: #c2410c; font-weight: 700; font-size: .9rem; }
@media (max-width: 640px) {
    dialog.rs { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); border-radius: 14px; }
    .rs-head h2 { font-size: 1.3rem; }
    .rs-prod { grid-template-columns: 1fr auto; }
    .rs-rm, .rs-st { grid-column: 1 / -1; }
    .rs-foot { flex-wrap: wrap; }
    .rs-foot .btn { min-height: 44px; }
}

/* ---------- Grupos: encabezados que ordenan ---------- */
.groups-list th .gp-th { display: flex; align-items: center; gap: .3rem; height: 100%; color: inherit; text-decoration: none; white-space: nowrap; }
.groups-list th .gp-th:hover { text-decoration: underline; }
.groups-list th .gp-arrow { font-size: .7rem; opacity: .35; }
.groups-list th.is-sorted { background: #ffedd5; }
.groups-list th.is-sorted .gp-arrow { opacity: 1; font-size: .8rem; }
.groups-list th .gp-th:focus-visible { outline: 3px solid rgba(249, 115, 22, .45); outline-offset: -3px; border-radius: 6px; }
.gp-sortfield select { height: 100%; }
.gp-sortfield select + select { margin-left: .2rem; }
@media (max-width: 760px) {
    .gp-sortfield { flex: 1 1 100%; }
    .gp-sortfield select { flex: 1; }
}

/* ---------- Ventana de consulta: miniaturas y acceso a la gestión ---------- */
.rs-prod { grid-template-columns: 48px minmax(0, 1.5fr) auto auto auto; }
.rs-thumb { display: block; width: 48px; height: 48px; border-radius: 8px; object-fit: cover; background: #f3f4f6; }
.rs-nothumb { border: 1.5px dashed #d1d5db; background: #fafafa; }
.rs-open.btn { min-height: 44px; display: inline-flex; align-items: center; color: #fff; font-size: .95rem; text-decoration: none; }
@media (max-width: 640px) {
    .rs-prod { grid-template-columns: 48px 1fr auto; }
    .rs-prod .rs-rm, .rs-prod .rs-st { grid-column: 1 / -1; }
    .rs-foot .rs-open.btn { flex: 1 1 100%; justify-content: center; }
}
.gp-filters { flex-wrap: wrap; }
.gp-search { flex: 1 1 240px; min-width: 200px; }
.gp-extra { flex-wrap: wrap; }
.groups-list col.cw-master { width: 104px; } .groups-list col.cw-b { width: 72px; } .groups-list col.cw-coord { width: 170px; } .groups-list col.cw-est { width: 150px; }
.groups-list .gl-pedido .pill { padding: .1rem .55rem; font-size: .68rem; }
.groups-list .gl-pedido { display: block; margin-top: .15rem; }
.groups-list td.gl-est { line-height: 1.2; }
.groups-list th .gp-th { overflow: hidden; text-overflow: ellipsis; }

/* ---------- Gestión completa del grupo dentro de un modal grande ---------- */
dialog.fm { font-family: inherit; font-size: 1rem; line-height: 1.45; width: min(1240px, calc(100vw - 24px)); max-width: none; height: calc(100vh - 24px); height: calc(100dvh - 24px); max-height: none; padding: 0; border: 0; border-radius: 18px; background: #fffaf5; color: #1e2a44; box-shadow: 0 24px 60px rgba(31, 41, 55, .35); overflow: hidden; }
dialog.fm::backdrop { background: rgba(17, 24, 39, .55); }
dialog.fm > [data-fm-content] { height: 100%; }
.fm-box { display: flex; flex-direction: column; height: 100%; }
.fm-head { flex: none; display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .8rem 1.15rem; background: linear-gradient(135deg, #f97316, #facc15); color: #fff; }
.fm-title { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; min-width: 0; }
.fm-title h2 { margin: 0; font-size: 1.45rem; line-height: 1.15; color: #fff; overflow-wrap: anywhere; }
.fm-x { flex: none; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .9); color: #1e2a44; font-size: 1.7rem; line-height: 1; cursor: pointer; }
.fm-x:hover { background: #fff; }
.fm-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 1rem 1.15rem 1.5rem; -webkit-overflow-scrolling: touch; }
.fm-body > [data-ficha-toast]:empty { display: none; }
.fm-body .page-head { margin-top: 0; }
.fm-dim { opacity: .55; pointer-events: none; transition: opacity .15s; }
.fm-loading { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: .6rem; font-weight: 700; color: #c2410c; pointer-events: none; }
.fm-loading[hidden] { display: none; }
.fm-spin { width: 22px; height: 22px; border: 3px solid #fed7aa; border-top-color: #f97316; border-radius: 50%; animation: fm-rot .8s linear infinite; }
@keyframes fm-rot { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .fm-spin { animation-duration: 2.4s; } }
@media (max-width: 760px) {
    dialog.fm { width: 100vw; height: 100vh; height: 100dvh; border-radius: 0; }
    .fm-head { padding: .6rem .8rem; }
    .fm-title h2 { font-size: 1.25rem; }
    .fm-body { padding: .8rem .75rem 1.5rem; }
    .fm-body .page-head .actions { display: flex; flex-wrap: wrap; gap: .5rem; }
    .fm-body .page-head .actions .btn { flex: 1 1 calc(50% - .5rem); min-height: 44px; justify-content: center; text-align: center; }
}

/* ---------- Guardar todas las modificaciones: barra fija mientras se hace scroll ---------- */
.save-bar { position: sticky; bottom: 0; z-index: 20; display: flex; align-items: center; flex-wrap: wrap; gap: .5rem 1rem; margin-top: 1rem; padding: .7rem 1rem; background: rgba(255, 250, 245, .97); border: 1px solid #fed7aa; border-radius: 14px; box-shadow: 0 -8px 20px rgba(194, 65, 12, .12); }
.save-bar .btn { min-height: 46px; }
.save-bar.has-changes { border-color: #f97316; }
.save-status { font-size: .9rem; font-weight: 600; color: #4b5563; overflow-wrap: anywhere; }
.save-status.is-ok { color: #166534; }
.save-status.is-warn { color: #9a3412; }
.save-status.is-err { color: #b91c1c; }
@media (max-width: 760px) {
    .save-bar { bottom: 72px; } /* por encima de la barra de navegación inferior */
    .fm-body .save-bar { bottom: 0; }
    .save-bar .btn { flex: 1 1 100%; }
}

/* ---------- Recibido / Entregado generales por master ---------- */
.pr-group-states { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .6rem 1.4rem; margin: .5rem 0 .8rem; padding: .8rem 1rem; background: #fff7ed; border: 1px solid #fed7aa; border-radius: 14px; }
.pr-group-title { flex: 1 1 100%; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: #9a3412; }
.pr-group-states .pr-state { min-width: 9rem; }
.pr-group-states .pr-chip { min-height: 44px; font-size: .98rem; cursor: pointer; }
.pr-chip.is-partial { background: #fef3c7; color: #92400e; }
.pr-chip.is-partial .pr-dot { border-color: #f59e0b; background: #fde68a; }
.pr-chip-ro { cursor: default; min-height: 28px; font-size: .78rem; padding: 0 .6rem 0 .45rem; pointer-events: none; }
@media (max-width: 760px) {
    .pr-group-states .pr-state { flex: 1 1 calc(50% - .75rem); min-width: 0; }
    .pr-group-states .pr-chip { width: 100%; justify-content: flex-start; }
}
/* los indicadores por producto son sólo de lectura: compactos y sin título (se marcan con el control general del master) */
.pr-row .pr-states { gap: .35rem; padding-left: .75rem; align-items: center; }
.pr-row .pr-state-l { display: none; }
.pr-row .pr-state { min-width: 0; }
.groups-list .gl-main { margin-top: 0; }

/* Unir grupos (grilla, modo edición) */
.gx-bulk .gx-bulk-merge { background: #f59e0b; color: #1e2a44; }
.gx-merge { border: 0; border-radius: 14px; padding: 0; width: min(94vw, 460px); max-height: 88vh; color: #1e2a44; }
.gx-merge::backdrop { background: rgba(15, 23, 42, .55); }
.gx-merge__box { padding: 1.1rem 1.2rem; display: grid; gap: .6rem; }
.gx-merge h2 { margin: 0; font-size: 1.15rem; }
.gx-merge__list { display: grid; gap: .35rem; max-height: 40vh; overflow: auto; }
.gx-merge__list label { display: flex; align-items: center; gap: .5rem; padding: .4rem .5rem; border: 1px solid #d6dbe6; border-radius: 10px; }
.gx-merge__warn { margin: 0; padding: .5rem .7rem; border-radius: 10px; background: #fef3c7; color: #78350f; }
.gx-merge__block { margin: 0; padding: .5rem .7rem; border-radius: 10px; background: #fee2e2; color: #991b1b; }
.gx-merge__conflict { margin: 0; font-size: .92rem; }
.gx-merge__conflict span { display: inline-block; margin-right: .3rem; }
.gx-merge__note { margin: 0; font-size: .88rem; color: #475569; }
.gx-merge__actions { display: flex; justify-content: flex-end; gap: .5rem; }
.gx-merge__actions button { min-height: 40px; padding: 0 1rem; border: 0; border-radius: 10px; background: #1e2a44; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.gx-merge__actions button.secondary { background: #e2e8f0; color: #1e2a44; }
.gx-merge__actions button:disabled { opacity: .45; cursor: not-allowed; }
.gx-bulk .gx-bulk-merge[hidden] { display: none; }
.gx-merge__total { margin: 0; font-size: 1.05rem; font-weight: 700; }
.gx-merge__schools { margin: 0; padding-left: 1.1rem; max-height: 30vh; overflow: auto; font-size: .92rem; }

/* Ingresos recibidos: comparación apilada (celular primero; en escritorio, dos columnas). */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ing-message-head { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.ing-message-head h2 { margin: 0; }
.ing-state-title { margin: 1rem 0 .5rem; }
.ing-item { border: 1px solid var(--line); border-radius: 12px; padding: .8rem; margin-bottom: .75rem; background: #fffdfa; }
.ing-item-head { display: flex; justify-content: space-between; align-items: baseline; gap: .25rem .75rem; flex-wrap: wrap; }
.ing-action { margin: .35rem 0; font-weight: 700; color: #1e2a44; }
.ing-loc, .ing-missing, .ing-adds, .ing-keep { margin: .3rem 0; font-size: .93rem; }
.ing-rows { margin: .6rem 0; display: grid; gap: .5rem; }
.ing-row { border-top: 1px solid var(--line); padding-top: .5rem; }
.ing-row dt { font-weight: 700; color: #1e2a44; display: flex; justify-content: space-between; gap: .5rem; flex-wrap: wrap; }
.ing-row dd { margin: .2rem 0 0; display: grid; gap: .15rem; font-size: .93rem; overflow-wrap: anywhere; }
.ing-estado { font-size: .78rem; font-weight: 700; color: var(--muted); }
.ing-row-agregar .ing-estado, .ing-row-conflicto .ing-estado { color: #c2410c; }
.ing-row-conflicto { background: #fff7ed; border-radius: 8px; padding: .5rem; }
.ing-decide fieldset { border: 1px solid var(--line); border-radius: 10px; padding: .5rem .75rem; margin: .5rem 0; }
.ing-decide legend { font-weight: 700; padding: 0 .3rem; }
.ing-radio { display: flex; align-items: flex-start; gap: .5rem; min-height: 44px; padding: .35rem 0; cursor: pointer; }
.ing-radio input { width: 20px; height: 20px; margin-top: .15rem; flex: none; accent-color: var(--orange); }
.ing-actions { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .6rem; }
.ing-actions form { margin: 0; }
.ing-original { margin: .75rem 0; }
.ing-original pre { white-space: pre-wrap; overflow-wrap: anywhere; background: #fff8f0; border: 1px solid var(--line); border-radius: 10px; padding: .6rem; font: inherit; font-size: .9rem; }
.ing-history { margin-bottom: .75rem; }
.prov-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem; align-items: center; margin-top: .5rem; }
.prov-edit { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem; margin: 0; }
.prov-edit input { min-height: 44px; border: 1px solid var(--line); border-radius: 10px; padding: .4rem .7rem; font: inherit; }
.prov-move { display: flex; gap: .35rem; }
.prov-move form { margin: 0; }
.prov-move .btn { min-width: 44px; padding: 0 .6rem; }
@media (min-width: 760px) {
    .ing-row { display: grid; grid-template-columns: minmax(10rem, 14rem) minmax(0, 1fr); gap: .75rem; align-items: start; }
    .ing-row dt { display: block; }
    .ing-row dd { margin-top: 0; grid-template-columns: 1fr 1fr; }
}

/* Coordinadores del grupo: lista (chips) y campo para agregar. */
.coord-list { border: 1px solid var(--line); border-radius: 12px; padding: .6rem .8rem; margin: 0 0 1rem; }
.coord-list legend { font-weight: 700; padding: 0 .3rem; }
.coord-chips { list-style: none; margin: 0 0 .6rem; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.coord-chips li { background: #fff3e6; border: 1px solid #fdba74; border-radius: 999px; padding: .2rem .7rem; font-size: .9rem; font-weight: 600; color: #7c2d12; }

/* Ingreso: «Recordar usuario» */
.login-card label.login-remember { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: .75rem; width: fit-content; margin: .35rem 0 1.1rem; min-height: 44px; font-weight: 600; font-size: .98rem; cursor: pointer; user-select: none; -webkit-tap-highlight-color: transparent; }
.login-card .login-remember input { position: absolute; left: 0; top: 50%; width: 52px; height: 44px; margin: 0; padding: 0; transform: translateY(-50%); opacity: 0; cursor: pointer; }
.login-switch { position: relative; flex: none; width: 46px; height: 26px; border-radius: 999px; background: rgba(255, 255, 255, .28); box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .75); transition: background-color .18s ease, box-shadow .18s ease; }
.login-switch::after { content: ''; position: absolute; top: 4px; left: 4px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 2px 5px rgba(120, 53, 15, .35); transition: transform .18s ease, background-color .18s ease; }
.login-remember input:checked + .login-switch { background: #fff; box-shadow: inset 0 0 0 2px #fff; }
.login-remember input:checked + .login-switch::after { transform: translateX(20px); background: linear-gradient(135deg, #f97316, #ea580c); box-shadow: 0 2px 5px rgba(194, 65, 12, .45); }
.login-remember input:focus-visible + .login-switch { outline: 3px solid #fff; outline-offset: 3px; }
.login-remember:hover .login-switch { box-shadow: inset 0 0 0 2px #fff; }
.login-remember-text { line-height: 1.2; text-shadow: 0 1px 2px rgba(124, 45, 18, .25); }
@media (prefers-reduced-motion: reduce) { .login-switch, .login-switch::after { transition: none; } }

/* ---------- Cargar remito (varios grupos a la vez) ---------- */
.rm-form { display: grid; gap: 1rem; }
.rm-number { padding: 1rem 1.2rem; }
.rm-field { display: grid; gap: .35rem; }
.rm-lbl { font-size: .8rem; font-weight: 700; color: #374151; text-transform: uppercase; letter-spacing: .04em; }
.rm-field input[type="text"], .rm-field input[type="search"] { min-height: 44px; font-size: 1rem; }
.rm-cols { display: grid; gap: 1rem; align-items: start; }
@media (min-width: 900px) { .rm-cols { grid-template-columns: minmax(0, 1fr) 340px; } }
.rm-pick, .rm-selected { padding: 1rem 1.2rem; display: grid; gap: .6rem; }
.rm-pick h2, .rm-selected h2, .rm-warn h2 { margin: 0; font-size: 1.1rem; color: #1e2a44; }
.rm-count-line { margin: 0; font-size: .85rem; }
.rm-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; max-height: 62vh; overflow-y: auto; }
.rm-item[hidden] { display: none; }
.rm-row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .65rem; align-items: start; padding: .6rem .75rem; border: 1px solid var(--line); border-radius: 12px; background: #fff; cursor: pointer; }
.rm-row:hover { background: #fffaf4; }
.rm-row input[type="checkbox"] { width: 20px; height: 20px; margin-top: .2rem; accent-color: #ea580c; }
.rm-item.is-out .rm-row { background: #f3f4f6; }
.rm-main { display: grid; gap: .25rem; min-width: 0; }
.rm-top { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem; }
.rm-code { color: #1e2a44; font-size: 1rem; }
.rm-name, .rm-sub { font-size: .88rem; color: #374151; overflow-wrap: anywhere; }
.rm-sub { color: var(--muted); }
.rm-divs { display: flex; flex-wrap: wrap; gap: .25rem; }
.rm-badge { display: inline-block; padding: .05rem .55rem; border-radius: 999px; font-size: .74rem; font-weight: 700; background: #e5e7eb; color: #374151; }
.rm-badge-remito { background: #fff1e3; color: #9a3412; }
.rm-chips { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; }
.rm-chips li { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .4rem .6rem; border-radius: 10px; background: #fff7ed; border: 1px solid #fed7aa; font-size: .9rem; }
.rm-chips li span { min-width: 0; overflow-wrap: anywhere; }
.rm-remove { min-height: 36px; padding: .2rem .7rem; border: 1px solid #fdba74; border-radius: 999px; background: #fff; color: #c2410c; font-weight: 700; cursor: pointer; flex: none; }
.rm-remove:hover, .rm-remove:focus-visible { background: #fff3e6; }
.rm-submit { min-height: 48px; width: 100%; }
.rm-warn { display: grid; gap: .5rem; padding: 1rem 1.2rem; border-color: #fdba74; background: #fffaf4; }
.rm-warn-list { margin: 0; padding-left: 1.2rem; }
.rm-photo { padding: 1rem 1.2rem; display: grid; gap: .7rem; }
.rm-photo h2 { margin: 0; font-size: 1.1rem; color: #1e2a44; }
.rm-file-input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; pointer-events: none; }
.rm-photo-actions { display: grid; gap: .6rem; }
@media (min-width: 560px) { .rm-photo-actions { grid-template-columns: 1fr 1fr; } }
.rm-big { min-height: 56px; font-size: 1.05rem; width: 100%; }
.rm-hint { margin: 0; font-size: .85rem; }
.rm-preview { display: grid; gap: .5rem; padding: .6rem; border: 1px solid var(--line); border-radius: 12px; background: #fffaf4; }
.rm-thumb { display: block; width: 160px; max-width: 100%; margin: 0 auto; padding: 0; border: 0; border-radius: 8px; background: #fff; cursor: zoom-in; }
.rm-thumb img { display: block; width: 160px; height: 160px; max-width: 100%; margin: 0 auto; object-fit: contain; border-radius: 8px; background: #fff; }
/* Zoom con mouse: la imagen crece en el centro de la pantalla, sin recortarla ni deformarla */
.rm-thumb.is-zoom img { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 60; width: auto; height: auto; max-width: 92vw; max-height: 92vh; max-height: 92dvh; box-shadow: 0 12px 40px rgba(17, 24, 39, .45); }
.rm-preview[hidden] { display: none; }
/* Ficha del grupo: miniaturas de remitos con foto */
.rf-remitos { display: grid; gap: .5rem; margin-top: .8rem; }
.rf-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.rf-item { display: flex; align-items: center; gap: .75rem; padding: .4rem .6rem; border: 1px solid #fed7aa; border-radius: 12px; background: #fff7ed; }
.rf-thumb { display: block; flex: none; appearance: none; -webkit-appearance: none; width: 72px; height: 72px; margin: 0; padding: 0; font: inherit; color: inherit; border: 1px solid var(--line); border-radius: 10px; background: #fff; overflow: hidden; cursor: zoom-in; -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
.rf-thumb img { display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.rf-thumb:focus-visible { outline: 3px solid #fdba74; outline-offset: 2px; }
.rf-info { display: grid; gap: .1rem; min-width: 0; font-size: .9rem; }
.rf-info small { color: var(--muted); }
/* Ampliación de la foto (mouse o mantener presionado): conserva proporciones, sin recortar */
.rf-zoom { position: fixed; inset: 0; z-index: 70; display: flex; align-items: center; justify-content: center; padding: 12px; background: rgba(17, 24, 39, .55); pointer-events: none; }
.rf-zoom[hidden] { display: none; }
.rf-zoom img { display: block; width: auto; height: auto; max-width: 92vw; max-height: 92vh; max-height: 92dvh; object-fit: contain; border-radius: 10px; background: #fff; box-shadow: 0 12px 40px rgba(17, 24, 39, .45); }

/* Grilla en celular: se muestra directamente debajo de la navegación. Título, subtítulo, hoteles, botones y filtros
   quedan ocultos (display: none, sin espacio vacío). Sólo se oculta visualmente; la vista de PC no cambia. */
@media (max-width: 768px) {
    .gx-page > .gx-head-top,
    .gx-page > .gx-filters { display: none; }
}
.rm-zoom-hint { margin: 0; font-size: .8rem; text-align: center; }
.rm-hint-search { margin: 0; padding: .6rem .8rem; border: 1px dashed #fdba74; border-radius: 12px; background: #fff7ed; color: #7c2d12; font-size: .9rem; }
.rm-lightbox { width: min(96vw, 900px); max-width: 96vw; max-height: 94vh; max-height: 94dvh; padding: .5rem; border: 0; border-radius: 16px; background: #1f2937; color: #fff; }
.rm-lightbox::backdrop { background: rgba(17, 24, 39, .8); }
.rm-lightbox img { display: block; width: auto; height: auto; max-width: 100%; max-height: calc(94vh - 4rem); max-height: calc(94dvh - 4rem); margin: 0 auto; object-fit: contain; }
.rm-lb-close { display: block; margin: 0 0 .5rem auto; min-height: 44px; padding: .35rem 1.1rem; border: 1.5px solid #fdba74; border-radius: 999px; background: #fff; color: #c2410c; font-weight: 700; cursor: pointer; }
.rm-lb-close:hover, .rm-lb-close:focus-visible { background: #fff3e6; }
.rm-preview-meta { display: flex; align-items: center; justify-content: space-between; gap: .5rem; font-size: .85rem; overflow-wrap: anywhere; }
.rm-foto-list { list-style: none; margin: .4rem 0 0; padding: 0; display: grid; gap: .4rem; }
.rm-foto-list li { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .45rem .7rem; border: 1px solid #fed7aa; border-radius: 10px; background: #fff7ed; font-size: .9rem; }

/* Subida masiva de fotos (/fotos/subir) */
.fs-page { max-width: 880px; margin: 0 auto; padding: 1rem; }
.fs-head h1 { margin: 0; font-size: 1.5rem; }
.fs-sub { margin: .3rem 0 1rem; color: var(--muted); font-size: .92rem; }
.fs-empty { color: var(--muted); }
.fs-drop { display: block; position: relative; padding: 2rem 1rem; text-align: center; border: 2px dashed #fdba74; border-radius: var(--radius); background: #fff7ed; cursor: pointer; }
.fs-drop.is-over { border-color: var(--orange); background: #ffedd5; }
.fs-input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
.fs-drop-text { font-weight: 600; color: var(--ink); }
.fs-bar { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin: 1rem 0 .5rem; flex-wrap: wrap; }
.fs-count { font-size: .92rem; color: var(--muted); }
.fs-list { display: grid; gap: .5rem; }
.fs-row { padding: .6rem .8rem; border: 1px solid var(--line); border-radius: 12px; background: var(--card); }
.fs-row.is-ok { border-color: #bbf7d0; }
.fs-row.is-todo { border-color: #fed7aa; background: #fffbeb; }
.fs-row-head { display: flex; justify-content: space-between; gap: .75rem; flex-wrap: wrap; font-size: .92rem; }
.fs-name { font-weight: 600; word-break: break-all; }
.fs-msg { color: var(--muted); }
.fs-row.is-ok .fs-msg { color: var(--ok); }
.fs-row.is-todo .fs-msg { color: #b45309; }
.fs-pick { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-top: .45rem; }
.fs-select { min-width: 220px; padding: .35rem .5rem; border: 1px solid var(--line); border-radius: 8px; font: inherit; }
.fs-master { width: 90px; padding: .35rem .5rem; border: 1px solid var(--line); border-radius: 8px; font: inherit; text-transform: uppercase; }
.fs-hint { font-size: .85rem; color: var(--muted); }
.fs-result { margin-top: 1rem; padding: .75rem 1rem; border-radius: 12px; }
.fs-result p { margin: .2rem 0; }
.fs-result.is-ok { background: #f0fdf4; color: var(--ok); }
.fs-result.is-bad { background: #fef2f2; color: var(--danger); }
.fs-divform { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-top: .5rem; padding-top: .5rem; border-top: 1px dashed #fed7aa; }
.fs-school { flex: 1 1 220px; min-width: 180px; padding: .35rem .5rem; border: 1px solid var(--line); border-radius: 8px; font: inherit; }
.fs-create { white-space: nowrap; }