/* ============================================================
   TIENDA — extiende los tokens de styles.css
   ============================================================ */

.store-banner{
  background:var(--signal-soft, rgba(18,192,124,.12));
  border-bottom:1px solid var(--ink-line);
  color:var(--on-ink);
  font-family:var(--font-mono);
  font-size:.75rem;
  letter-spacing:.04em;
  text-align:center;
  padding:.6rem var(--gutter);
}

.store-header{padding:clamp(2.5rem,6vw,4rem) 0 2rem;border-bottom:1px solid var(--ink-line-2);}
.store-header h1{
  font-family:var(--font-display);font-weight:600;font-size:var(--fs-h2);
  margin:0 0 .6rem;
}
.store-header p{color:var(--on-ink-muted);max-width:56ch;}

.cart-link{
  position:relative;display:inline-flex;align-items:center;gap:.4rem;
  font-size:.92rem;color:var(--on-ink-muted);
}
.cart-badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:20px;height:20px;padding:0 5px;border-radius:999px;
  background:var(--signal);color:var(--ink);font-family:var(--font-mono);
  font-size:.7rem;font-weight:700;
}

.product-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;
  padding:clamp(2rem,5vw,3.5rem) 0 clamp(3rem,7vw,5rem);
}
.product-card{
  background:var(--ink-2);border:1px solid var(--ink-line);border-radius:var(--r-md);
  overflow:hidden;display:flex;flex-direction:column;
}
.product-card img{width:100%;aspect-ratio:1/1;object-fit:cover;background:var(--ink-3);}
.product-card__body{padding:1.25rem;display:flex;flex-direction:column;gap:.6rem;flex-grow:1;}
.product-card__body h3{font-family:var(--font-display);font-size:1.05rem;font-weight:600;}
.product-card__body p{color:var(--on-ink-muted);font-size:.88rem;flex-grow:1;}
.product-card__price{font-family:var(--font-display);font-weight:700;font-size:1.2rem;color:var(--signal);}
.product-card__row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-top:.25rem;}

.qty-input{
  width:56px;background:var(--ink);border:1px solid var(--ink-line);border-radius:var(--r-sm);
  color:var(--on-ink);padding:.5rem;text-align:center;font-family:var(--font-mono);
}

.cart-table{width:100%;border-collapse:collapse;margin:2rem 0;}
.cart-table th{
  text-align:left;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--on-ink-faint);padding:0 0 .75rem;border-bottom:1px solid var(--ink-line);
}
.cart-table td{padding:1rem 0;border-bottom:1px solid var(--ink-line-2);vertical-align:middle;}
.cart-table td.num{text-align:right;font-family:var(--font-mono);}
.cart-table .remove-btn{color:var(--on-ink-faint);font-size:.8rem;text-decoration:underline;}
.cart-table .remove-btn:hover{color:var(--signal);}

.cart-empty{padding:3rem 0;color:var(--on-ink-muted);}

.totals-box{
  margin-left:auto;max-width:360px;display:flex;flex-direction:column;gap:.6rem;
  padding:1.5rem;background:var(--ink-2);border:1px solid var(--ink-line);border-radius:var(--r-md);
}
.totals-box .row{display:flex;justify-content:space-between;font-size:.92rem;color:var(--on-ink-muted);}
.totals-box .row.total{
  color:var(--on-ink);font-weight:700;font-size:1.15rem;
  border-top:1px solid var(--ink-line);padding-top:.6rem;margin-top:.2rem;
}

.checkout-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,4rem);padding:clamp(2rem,5vw,3rem) 0 4rem;align-items:start;}
.checkout-grid .field,.pay-card .field{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem;}
.checkout-grid .field span,.pay-card .field span{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--on-ink-faint);}
.checkout-grid input,.pay-card input{
  background:var(--ink);border:1px solid var(--ink-field);border-radius:var(--r-sm);
  padding:.75rem .9rem;color:var(--on-ink);font-size:.95rem;
}
.checkout-grid input:focus,.pay-card input:focus{outline:none;border-color:var(--accent);}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}

.order-summary{
  background:var(--ink-2);border:1px solid var(--ink-line);border-radius:var(--r-md);padding:1.5rem;
}
.order-summary h3{font-family:var(--font-display);font-size:1.1rem;margin-bottom:1rem;}
.order-summary .line{display:flex;justify-content:space-between;font-size:.88rem;color:var(--on-ink-muted);padding:.4rem 0;border-bottom:1px solid var(--ink-line-2);}

.form-error{
  background:rgba(255,80,80,.1);border:1px solid rgba(255,80,80,.35);color:#ff9d9d;
  padding:.8rem 1rem;border-radius:var(--r-sm);font-size:.88rem;margin-bottom:1rem;
}
.form-error[hidden]{display:none;}

.pay-status{padding:clamp(4rem,10vw,7rem) 0;text-align:center;}
.pay-status h1{font-family:var(--font-display);font-size:var(--fs-h2);font-weight:600;margin-bottom:1rem;}
.pay-status p{color:var(--on-ink-muted);max-width:50ch;margin:0 auto 2rem;}
.pay-status--ok h1{color:var(--signal);}

@media (max-width: 900px){
  .product-grid{grid-template-columns:repeat(2,1fr);}
  .checkout-grid{grid-template-columns:1fr;}
  .field-row{grid-template-columns:1fr;}
}
@media (max-width: 560px){
  .product-grid{grid-template-columns:1fr;}
  .cart-table thead{display:none;}
  .cart-table, .cart-table tbody, .cart-table tr, .cart-table td{display:block;width:100%;}
  .cart-table tr{border-bottom:1px solid var(--ink-line);padding:1rem 0;}
  .cart-table td{border:none;padding:.25rem 0;}
  .cart-table td.num{text-align:left;}
}


/* ---------- Filtros de categoría y subcategoría ---------- */
.store-filters{display:flex;flex-direction:column;gap:1rem;padding:2rem 0 0;}
.tabs,.chips{display:flex;flex-wrap:wrap;gap:.5rem;}
.tab,.chip{
  display:inline-flex;align-items:center;gap:.5rem;cursor:pointer;
  border:1px solid var(--ink-line);background:transparent;color:var(--on-ink-muted);
  transition:color .2s,border-color .2s,background .2s;
}
.tab{padding:.6rem 1.1rem;border-radius:var(--r-lg);font-family:var(--font-sans);font-weight:600;font-size:.92rem;}
.chip{padding:.35rem .75rem;border-radius:var(--r-sm);font-family:var(--font-mono);font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;}
.tab:hover,.chip:hover{color:var(--on-ink);border-color:var(--on-ink-faint);}
.tab[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--ink);}
.chip[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft);color:var(--accent);}
.filter-count{font-family:var(--font-mono);font-size:.72rem;opacity:.85;}
.tab:focus-visible,.chip:focus-visible,.qty-input:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

.store-note{color:var(--on-ink-muted);font-size:.92rem;max-width:72ch;margin:1.25rem 0 0;line-height:1.6;}
.store-empty{color:var(--on-ink-muted);grid-column:1 / -1;}

.card-tag{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);}
.product-card--quote .product-card__body{padding:1.5rem;}
.product-card__price--quote{font-family:var(--font-sans);font-size:.92rem;font-weight:600;color:var(--on-ink-muted);}

/* ---------- Página de pago por enlace (/pagar) ---------- */
.pay-card{max-width:640px;margin:0 auto;padding:clamp(2rem,5vw,3rem) 0 4rem;}
.pay-summary{background:var(--ink-2);border:1px solid var(--ink-line);border-radius:var(--r-md);padding:1.5rem;margin-bottom:1.75rem;}
.pay-summary__label{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--on-ink-faint);}
.pay-summary__concept{font-family:var(--font-display);font-size:1.2rem;font-weight:600;line-height:1.3;margin:.35rem 0 1.25rem;overflow-wrap:anywhere;}
.pay-summary__amount{font-family:var(--font-display);font-size:2.3rem;font-weight:700;color:var(--accent);line-height:1;}
.pay-summary__meta{color:var(--on-ink-muted);font-size:.85rem;margin-top:.9rem;}
.pay-state{background:var(--ink-2);border:1px solid var(--ink-line);border-radius:var(--r-md);padding:2rem;}
.pay-state h2{font-family:var(--font-display);font-size:1.3rem;margin-bottom:.6rem;}
.pay-state p{color:var(--on-ink-muted);margin-bottom:1rem;}
.pay-state a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;}

/* Casillas y texto de ayuda de los formularios de pago */
.privacy-note{font-size:.78rem;color:var(--on-ink-muted);line-height:1.55;margin:0 0 1rem;}
.privacy-note a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;}
.pay-card .consent input,.checkout-grid .consent input{outline-offset:2px;}

/* En móvil el carrito va en el menú desplegable: en la cabecera aplastaba el logo */
@media (max-width: 640px){
  .cart-link{display:none;}
}

/* Carrito en móvil: cada celda con su etiqueta, para distinguir precio e importe */
@media (max-width: 560px){
  .cart-table td[data-label]::before{
    content:attr(data-label);display:inline-block;min-width:5.5rem;margin-right:.5rem;
    font-family:var(--font-mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--on-ink-faint);
  }
}
