/* Tareas frecuentes y controles legibles, tanto en caja como en teléfono. */
html{scroll-padding-top:120px}
:focus-visible{outline:3px solid #438768;outline-offset:3px}
.container a:not(.btn):not(.task-primary){color:var(--green)}
.metric-link{text-decoration:none}
.metric-link:hover{border-color:var(--green2)}
.metric strong,.collection-summary strong,td[data-label],.checkout-amount{font-variant-numeric:tabular-nums}
.home-tasks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:22px}
.home-tasks a{display:flex;flex-direction:column;gap:7px;padding:22px 18px;border:1px solid var(--line);border-radius:12px;background:#fff;text-decoration:none}
.home-tasks strong{font-size:1.1rem}
.home-tasks span{font-size:.86rem;color:var(--muted)}
.home-tasks a:hover{border-color:var(--green2)}
.home-tasks .task-primary{background:var(--green2);color:white}
.home-tasks .task-primary span{color:#eef7f1}
details.setup-hint{display:block;padding:14px 18px}
details.setup-hint>div{margin:14px 0}
details.setup-hint summary,.secondary-summary summary{font-weight:700;cursor:pointer;min-height:24px}
.secondary-summary{padding:14px 18px;box-shadow:none}
.secondary-summary[open]>section{margin-top:16px}
.collection-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:14px}
.collection-summary article{padding:16px;border:1px solid var(--line);border-radius:12px;background:white}
.collection-summary span,.collection-summary small{display:block;color:var(--muted);font-size:.85rem}
.collection-summary strong{display:block;margin:5px 0;font-size:1.5rem}
.list-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.list-toolbar p{color:var(--muted);margin:0}
.list-toolbar summary{cursor:pointer;font-weight:650;padding:9px 0}
.list-toolbar details[open] .actions{margin-top:8px}
.responsive-records .record-title{min-width:180px}
.responsive-records td[data-label="Saldo pendiente"],.responsive-records td[data-label="Precio de venta"]{text-align:right}
.responsive-records .record-actions{white-space:nowrap}
.draft-notice:empty{display:none}
.draft-notice{margin:6px 0 10px;font-size:.85rem}
.pos-mobile-dock{display:none}
.pos-cart .card-head .actions{align-items:center;gap:10px}
.product-card>span{font-weight:650;line-height:1.4}
.product-card>strong{font-size:1.12rem}
.pos-table .cart-quantity{min-width:70px;font-size:1rem}
.cash-warning .link-button{padding:0 3px;min-height:28px;text-decoration:underline}
#caja-pos-dialog .actions{margin-top:18px}
.sale-confirm-content{padding:24px}
.sale-confirm-content h2{margin:0}
.sale-confirm-content dl{margin:20px 0}
.sale-confirm-content dl>div{display:flex;justify-content:space-between;gap:18px;padding:10px 0;border-bottom:1px solid var(--line)}
.sale-confirm-content dt{color:var(--muted)}
.sale-confirm-content dd{margin:0;font-weight:700;text-align:right}
.pos-layout[inert]{opacity:.55}
@media(min-width:901px){
  .topbar{gap:14px}
  .desktop-nav>a,.desktop-nav-menu>summary{padding-inline:8px}
  .account-copy{display:none}
  .pos-catalog .product-grid{grid-template-columns:repeat(auto-fill,minmax(215px,1fr))}
  .pos-cart .card-head{min-height:32px}
}
@media(min-width:761px) and (max-width:900px){
  .topbar{gap:8px}
  .topbar .brand{max-width:150px;overflow:hidden;text-overflow:ellipsis}
  .desktop-nav>a,.desktop-nav-menu>summary{padding-inline:6px}
}
@media(max-width:900px){
  .container:has(.pos-layout){margin-bottom:110px}
  .pos-head{align-items:center;margin-bottom:12px}
  .pos-head h1{font-size:1.5rem}
  .pos-head>div>p:not(.eyebrow){display:none}
  .pos-head .btn{padding:8px 10px;font-size:.85rem}
  .cash-warning{font-size:.9rem}
  .pos-catalog,.pos-cart{padding:16px}
  .pos-catalog .card-head{margin-bottom:12px}
  .pos-catalog .card-head .eyebrow{display:none}
  .pos-catalog .card-head h2{font-size:1.15rem}
  .pos-catalog .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .pos-catalog .product-card{padding:12px;min-width:0;overflow-wrap:anywhere}
  #pos-mensaje{font-size:.8rem}
  .pos-mobile-dock{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:10px;position:fixed;z-index:8;bottom:0;left:0;right:0;padding:12px 14px calc(12px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--line);box-shadow:0 -3px 14px #173e2b12}
  .pos-mobile-dock .btn{min-height:48px;font-weight:700;font-size:1rem}
  #carrito,#cobro,#registrar-abono{scroll-margin-top:16px}
}
@media(max-width:760px){
  .container:has(.responsive-records)>.filter-bar{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:end}
  .container:has(.responsive-records)>.filter-bar .grow{grid-column:1/-1}
  .container:has(.responsive-records)>.filter-bar>.btn{width:100%;margin:0;min-height:44px}
  .home-tasks{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .home-tasks a{padding:16px 13px;gap:5px}
  .home-tasks strong{font-size:1rem}
  .home-tasks span{font-size:.8rem}
  .container:has(.home-tasks)>.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .container:has(.home-tasks)>.metrics .metric{padding:14px}
  .container:has(.home-tasks)>.metrics strong{font-size:1.4rem}
  .collection-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .collection-summary article{padding:12px}
  .collection-summary article:first-child{grid-column:1/-1;display:grid;grid-template-columns:1fr auto;align-items:center}
  .collection-summary article:first-child strong{grid-column:2;grid-row:1/3}
  .collection-summary strong{font-size:1.25rem}
  .collection-summary span,.collection-summary small{font-size:.8rem}
  .responsive-records,.responsive-records tbody{display:block;width:100%;min-width:0}
  .responsive-records thead{display:none}
  .responsive-records tbody{padding:12px;background:var(--bg)}
  .responsive-records tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:16px;margin-bottom:12px;background:white;border:1px solid var(--line);border-radius:12px}
  .responsive-records td{display:block;border:0;padding:0;min-width:0;text-align:left!important;overflow-wrap:anywhere}
  .responsive-records td::before{content:attr(data-label);display:block;color:var(--muted);font-size:.75rem;margin-bottom:3px}
  .responsive-records td.record-title,.responsive-records td.record-actions,.responsive-records td.empty{grid-column:1/-1;min-width:0}
  .responsive-records td.record-title{font-size:1rem;padding-bottom:10px;border-bottom:1px solid var(--line)}
  .responsive-records .record-actions .btn{width:100%;min-height:44px}
  .collection-records td.record-balance{grid-column:1;grid-row:2}
  .collection-records td[data-label="Situación"]{grid-column:2;grid-row:2}
  .collection-records .record-balance strong{font-size:1.25rem}
  .pos-table{min-width:0;table-layout:fixed}
  .pos-table th:first-child{width:43%}
  .pos-table th:nth-child(2){width:23%}
  .pos-table th:nth-child(3){width:24%}
  .pos-table th:last-child{width:10%}
  .pos-table th,.pos-table td{padding:9px 4px}
  .pos-table td:first-child{overflow-wrap:anywhere}
  .pos-table .cart-quantity{min-width:0;padding:8px 4px}
  .pos-table .icon-button{width:30px;height:40px}
}
@media print{.pos-mobile-dock{display:none}}

/* Recepción compartida: el escaneo va arriba y grande, la lista se lee de un vistazo. */
.scan-card .input-action input{font-size:1.1rem}
.rec-cantidad{max-width:220px;margin-top:10px}
.rec-desconocido{margin-top:16px;padding-top:14px;border-top:2px dashed var(--line)}
.rec-desconocido h2{margin:0 0 4px}
.rec-candidatos{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px;margin:10px 0;max-height:360px;overflow:auto}
.rec-no-esta{margin:8px 0}
#recepcion{min-width:0}
.rec-tabla{min-width:0}
.rec-tabla th:nth-child(2),.rec-tabla td:nth-child(2){width:64px;text-align:center}
.rec-tabla th:nth-child(3),.rec-tabla td:nth-child(3){width:30%}
.rec-tabla td{padding:10px 8px;vertical-align:top}
.rec-restar{display:block;margin:6px auto 0;min-width:44px;padding:4px 8px}
.rec-metricas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 16px}
.rec-metricas .metric{padding:10px 12px;margin:0}
.rec-metricas .metric span{font-size:.75rem}
.rec-metricas .metric strong{font-size:1.4rem}
.rec-tabla td small{display:block;color:var(--muted);overflow-wrap:anywhere}
.rec-resolver{padding:12px 0;border-bottom:1px solid var(--line)}

.pago-vuelto{display:block;min-height:1.1em;font-weight:700;font-size:.85rem;margin-top:3px}

/* Devolución: nota o dinero como opciones claras, no como campos de texto. */
.return-destino{display:grid;gap:8px}
.return-choice{display:flex !important;flex-direction:row !important;align-items:flex-start;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;cursor:pointer}
.return-choice input{width:20px !important;height:20px;min-height:0;margin:2px 0 0;flex:0 0 auto}
.return-choice span{display:flex;flex-direction:column;gap:2px}
.return-choice small{font-weight:400;color:var(--muted)}
.return-choice:has(input:checked){border-color:var(--green2);background:#f2faf5}
.return-choice:has(input:disabled){opacity:.6;cursor:not-allowed}

/* Carrito en la terminal de escritorio (sep-2026). En una laptop de 1000px la
   columna del ticket mide ~390px: el nombre se partía en cinco renglones, cada
   producto medía 200px y el botón de quitar quedaba cortado. Las columnas
   numéricas son angostas para que el nombre tenga ancho. EL NOMBRE NO SE
   RECORTA: se probó limitarlo a dos renglones y con otras fuentes se comía el
   final, que es justo lo que distingue «… 1L» de «… galón». */
@media(min-width:901px){
  .pos-table{table-layout:fixed;width:100%}
  .pos-table th:nth-child(2),.pos-table td:nth-child(2){width:78px}
  .pos-table th:nth-child(3),.pos-table td:nth-child(3){width:86px}
  .pos-table th:last-child,.pos-table td:last-child{width:44px}
  .pos-table th,.pos-table td{padding:8px 6px}
  .pos-table td:first-child strong{display:block;font-size:.88rem;line-height:1.25;overflow-wrap:anywhere}
  .pos-table td:first-child small{display:block;overflow-wrap:anywhere}
  .pos-table input[type=number]{min-width:0;width:100%}
  .pos-table .icon-button{width:32px;height:32px}
}
@media(min-width:901px) and (max-width:1180px){
  .pos-layout{grid-template-columns:minmax(0,1fr) minmax(390px,1fr)}
}

/* Comprobante y cotización en teléfono (sep-2026): con ancho automático los
   precios no cabían en 347px y la tabla se salía de la pantalla. */
@media(max-width:480px){
  .receipt-lines{table-layout:fixed;width:100%;font-size:.8rem}
  .receipt-lines th,.receipt-lines td{padding:6px 3px;overflow-wrap:anywhere}
  .receipt-lines th:first-child,.receipt-lines td:first-child{width:40%}
  .receipt-lines th:nth-child(2),.receipt-lines td:nth-child(2){width:14%}
  .receipt-lines th:nth-child(3),.receipt-lines td:nth-child(3),
  .receipt-lines th:nth-child(4),.receipt-lines td:nth-child(4){width:23%}
}