/* Urban Flora 2.0 · área tienda: Ramos, Plantas y talleres, La tienda. Carga después de secciones.css */

/* =================== RAMOS =================== */
.rm-cab { display: grid; grid-template-columns: minmax(0, 1fr) 96px; gap: 14px 16px; align-items: start; padding-block: 20px 18px; }
.rm-cab-txt { min-width: 0; }
.rm-cab .eyebrow { margin-bottom: 10px; gap: .7em; }
.rm-cab .eyebrow::before { display: none; }
.rm-cod { font-size: .72rem; padding-block: .3em; }
.rm-h1 { font-family: var(--f-disp); font-weight: 800; font-stretch: 66%; font-size: clamp(2.1rem, 6.2vw, 5.8rem); line-height: .92; letter-spacing: -.012em; margin: 0 0 10px; }
.rm-lead { margin: 0; font-size: clamp(.98rem, 1.25vw, 1.2rem); line-height: 1.45; color: var(--tinta-2); max-width: 54ch; }
.rm-cab-fig { border-radius: 4px; box-shadow: 0 0 0 1.5px var(--tinta); margin: 0; min-width: 0; }
.rm-alb { grid-column: 1 / -1; transform: none; background-image: repeating-linear-gradient(transparent 0 35px, #E4E7E3 35px 36px); padding: 12px 14px; }
.albaran-cab, .albaran-pie { font-size: .7rem; }
.albaran-pie { color: var(--tinta-2); }
.albaran-lista button { position: relative; }
@media (max-width: 699px) { .rm-solo-esc { display: none; } }
.albaran-lista .mono { font-size: .72rem; }
.albaran-lista button.is-manana span:first-child { text-decoration: line-through; text-decoration-color: var(--tinta-3); text-decoration-thickness: 1.5px; }
.albaran-lista button.is-manana .mono { color: var(--tinta-2); }
@media (max-width: 699px) {
  /* móvil: el albarán es una tira de una línea que se desliza */
  .rm-alb .albaran-lista { columns: auto; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin: 8px -14px 6px; padding: 2px 14px; scroll-snap-type: x proximity; }
  .rm-alb .albaran-lista::-webkit-scrollbar { display: none; }
  .rm-alb .albaran-lista li { flex: none; scroll-snap-align: start; }
  .rm-alb .albaran-lista button { grid-template-columns: auto auto; gap: 6px; padding: 7px 10px; border-radius: 3px; box-shadow: 0 0 0 1px #C4CAC5 inset; font-size: .9rem; background: var(--blanco); }
  .rm-alb .alb-dots { display: none; }
  .rm-alb .albaran-pie span:last-child { display: none; }
}
@media (min-width: 900px) {
  .rm-cab { grid-template-columns: minmax(0, 1fr) clamp(260px, 25vw, 360px); gap: 0 clamp(28px, 4vw, 64px); padding-block: clamp(28px, 3.4vw, 48px) clamp(28px, 3vw, 44px); }
  .rm-cab-txt { align-self: end; padding-bottom: 92px; }
  .rm-cab-fig { grid-row: 1; grid-column: 2; transform: rotate(-1.5deg); }
  .rm-alb { grid-row: 2; margin-top: -72px; position: relative; z-index: 2; transform: rotate(.4deg); padding: 14px 20px; }
  .rm-alb .albaran-lista { columns: 4; column-gap: 24px; }
}
@media (min-width: 700px) and (max-width: 899px) { .rm-cab { grid-template-columns: minmax(0, 1fr) 200px; } .rm-alb .albaran-lista { columns: 3; } }

/* filtros fijos bajo la cabecera (la cabecera ya no se esconde) */
.rm-filtros-sec { top: calc(var(--hdr-h) + env(safe-area-inset-top, 0px)); scroll-margin-top: calc(var(--hdr-h) + env(safe-area-inset-top, 0px)); }
.rm-filtros-sec .ramos-filtros { grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px 10px; padding-block: 10px; align-items: center; }
.rm-fila1 { display: contents; }
.rm-hoy { grid-column: 1; grid-row: 1; flex: none; }
.rm-filtros-sec [data-f-ocasion] { grid-column: 2 / -1; grid-row: 1; min-width: 0; }
.rm-filtros-sec [data-f-color] { grid-column: 1 / 3; grid-row: 2; min-width: 0; }
.rm-filtros-sec .ramos-cuenta { grid-column: 3; grid-row: 2; margin: 0; font-size: .72rem; color: var(--tinta-2); white-space: nowrap; }
.rm-hoy { background: var(--blanco); box-shadow: 0 0 0 1.5px var(--helecho) inset; color: var(--tinta); }
.rm-hoy i { width: .7em; height: .7em; background: var(--helecho); box-shadow: 0 0 0 3px #CFE3D6; }
.rm-hoy.is-on, .rm-hoy[aria-pressed="true"] { background: var(--helecho); color: #fff; }
.rm-hoy.is-on i { background: #fff; box-shadow: none; }
.ramos-filtros .chip:focus-visible { outline: 3px solid var(--aciano); outline-offset: 2px; }
@media (max-width: 699px) {
  .rm-filtros-sec .ramos-filtros { gap: 6px 8px; padding-block: 8px; }
  .ramos-filtros .chip { font-size: .82rem; padding: .48em .85em; }
  .rm-filtros-sec [data-f-color] { grid-column: 1 / -1; }
  .rm-filtros-sec .ramos-cuenta { grid-column: 1 / -1; grid-row: 3; font-size: .7rem; line-height: 1.2; }
}
.rm-cat { padding-top: clamp(20px, 3vw, 40px); }
.rm-hoy-aviso { margin: 0 0 18px; padding: 10px 14px; background: var(--blanco); border-left: 4px solid var(--helecho); font-size: .95rem; max-width: 70ch; }
.rm-vacio { padding: 24px 0; font-size: 1.05rem; }
.rm-vacio .lnk { appearance: none; border: 0; background: none; padding: 0; cursor: pointer; font: inherit; font-weight: 700; color: inherit; }

/* tarjetas */
.rm-figw { position: relative; display: block; }
.rm-badge { position: absolute; left: 8px; top: 8px; font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; padding: 4px 8px; border-radius: 3px; background: var(--blanco); color: var(--tinta); box-shadow: 0 0 0 1px var(--tinta); }
.rm-badge.is-hoy { background: var(--helecho); color: #fff; box-shadow: none; }
.muestra-cod { font-size: .7rem; color: var(--tinta-2); }
.ramo-calle { color: var(--tinta-2); }
@media (max-width: 699px) {
  .muestra .precio { font-size: .72rem; }
  .rm-badge { left: 4px; top: 4px; font-size: .7rem; padding: 3px 6px; }
}

/* metro */
.metro-lienzo { background: #1E2421; }
.metro-res dt, .metro-ctrl .tag { color: #B5BDB8; }

/* ficha: foto de producto cenital 1:1 y botón siempre a mano */
.rm-ficha .ficha-fig { aspect-ratio: 1 / 1; height: auto; min-height: 0; }
@media (min-width: 900px) { .rm-ficha .ficha-fig { position: sticky; top: 0; align-self: start; } }
.rm-ficha .ficha-cuerpo .tag, .ficha-receta li small, .ficha-receta li .mono { color: var(--tinta-2); }
.ficha-receta li .mono { font-size: .72rem; }
.ficha-receta li { border-bottom-color: #C4CAC5; }
.rm-ficha .ficha-nota { font-size: .76rem; color: var(--tinta-2); margin: 0; }
.rm-ficha .ficha-metro { background: var(--blanco); box-shadow: 0 0 0 1px #C4CAC5 inset; }
.rm-ficha .talla { background: var(--blanco); box-shadow: 0 0 0 1.5px #C4CAC5 inset; }
.rm-ficha .talla.is-on { background: var(--acc); box-shadow: 0 0 0 2px var(--tinta) inset; }
.rm-ficha .talla:focus-visible { outline: 3px solid var(--aciano); outline-offset: 2px; }
.rm-ficha .talla.is-falta .precio::after { content: " · mañana"; font-family: var(--f-mono); font-size: .7rem; }
.rm-acc { position: sticky; bottom: 0; z-index: 3; display: grid; gap: 10px; justify-items: stretch; margin: 0 calc(clamp(24px, 3.4vw, 48px) * -1) calc(clamp(24px, 3.4vw, 48px) * -1); padding: 14px clamp(24px, 3.4vw, 48px) 16px; background: var(--papel); border-top: 1.5px solid var(--tinta); box-shadow: 0 -12px 18px -14px rgba(18,23,21,.4); }
.rm-acc .btn { justify-self: start; }
.rm-llega { margin: 0; font-size: .9rem; font-weight: 600; display: flex; gap: 8px; align-items: baseline; }
.rm-llega::before { content: ""; flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--helecho); transform: translateY(-1px); }
.rm-llega.is-falta::before { background: var(--mimosa); box-shadow: 0 0 0 1.5px var(--tinta) inset; }
@media (max-width: 699px) {
  .rm-acc { gap: 8px; padding-block: 10px calc(12px + env(safe-area-inset-bottom, 0px)); }
  .rm-acc .btn { justify-self: stretch; justify-content: center; padding-inline: .8em; }
  .rm-ficha .talla { padding: 8px 10px 7px; }
  .rm-ficha .talla b { font-size: 1.4rem; }
  .rm-llega { font-size: .76rem; line-height: 1.3; }
  .rm-ficha .ficha-tallas .talla span:not(.precio) { font-size: .74rem; }
}

/* =================== PLANTAS Y TALLERES =================== */
.pl-hero-btns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.ficha-hosp-cab, .ficha-hosp-pie { font-size: .7rem; }
.ficha-hosp-pie { color: var(--tinta-2); }
.pl-campo { border: 0; padding: 0; margin: 0; display: grid; gap: 12px; min-width: 0; }
.pl-campo legend { font-weight: 600; padding: 0; margin-bottom: 12px; }
.pl-ayuda { margin: 0; font-size: .88rem; color: var(--tinta-2); max-width: 40ch; }
.brujula { background: var(--blanco); }
.brujula button:focus-visible { outline: 3px solid var(--aciano); outline-offset: 2px; }
.ven-dice b { background: linear-gradient(transparent 60%, #BFDCCB 60%); }
/* fichas de planta: fondo blanco de etiqueta (nada de texto pequeño gris sobre zinc 2) */
.pl-grid .planta { background: var(--blanco); box-shadow: 0 0 0 1px #C4CAC5 inset; }
.pl-grid .planta:not(.is-no) { box-shadow: 0 0 0 2px var(--helecho) inset; }
.pl-grid .planta.is-no { opacity: 1; filter: none; background: transparent; box-shadow: 0 0 0 1px #A9B0AB inset; }
.pl-grid .planta.is-no figure { opacity: .45; filter: grayscale(.85); }
.pl-grid .planta-l { color: var(--tinta-2); }
.pl-grid .kv { font-size: .72rem; gap: 3px 10px; }
.pl-grid .kv dt { color: var(--tinta-2); }
.pl-grid .planta-no { font-family: var(--f-text); text-transform: none; font-size: .8rem; font-weight: 600; color: var(--tinta); text-align: right; line-height: 1.25; }
.pl-grid .planta-pie { align-items: end; }
.pl-nota { margin: 20px 0 0; font-size: .72rem; text-transform: uppercase; color: var(--tinta-2); letter-spacing: .03em; }
.tal-intro { display: grid; gap: 18px; }
.tal-intro .lead { color: #CDD4CF; margin: 0; }
.tal-datos { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: .74rem; text-transform: uppercase; color: var(--mimosa); }
.tal-datos li::before { content: "· "; }
.taller-plazas .mono { font-size: .72rem; color: #B5BDB8; }
.plazas i { box-shadow: 0 0 0 1.5px #8E9590 inset; }
.plazas i.is-ocupada { background: #6E7771; }
.taller-f { font-size: .76rem; }
.taller.is-lleno .h3 { color: #A9B0AB; }
.taller-acc { flex-wrap: wrap; gap: 10px; }
.tal-sel { width: auto; min-width: 0; padding-block: .55em; }
.tal-ya { margin: 4px 0 0; font-size: .74rem; text-transform: uppercase; color: var(--mimosa); }
.tal-ya a { color: inherit; text-decoration: underline; text-underline-offset: .2em; }
.talleres-sec .btn-ghost { white-space: normal; text-align: left; }
.pl-kv { font-size: .8rem; }
.pl-kv dt { color: var(--tinta-2); }
@media (min-width: 1000px) { .taller { grid-template-columns: 130px minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, auto); } .taller-acc { justify-content: end; } }
.pl-grid .planta-pie .precio { white-space: nowrap; }

/* =================== LA TIENDA =================== */
.tienda-fig { border-radius: 10px; }
/* «A las cinco ya estamos eligiendo» (viene de la portada) */
.madrugada.band-dalia .mad-txt .txt { color: #E3D6DF; }
.madrugada.band-dalia .mad-datos { border-top-color: #5A3550; }
.madrugada.band-dalia .mad-datos div { border-color: #5A3550; }
.madrugada.band-dalia .mad-datos dt { color: #CDB9C7; }
.madrugada.band-dalia .mad-nota { font-size: .74rem; color: var(--mimosa); }
.madrugada .eyebrow::before { box-shadow: 0 0 0 2px var(--claro) inset; background: var(--mimosa); }
.tn-mad-fig { border-radius: 10px; }

/* equipo: carrusel con scroll-snap en móvil */
.tn-desliza { display: none; font-size: .72rem; text-transform: uppercase; color: var(--tinta-2); margin: 0; }
.tn-eq:focus-visible { outline: 3px solid var(--aciano); outline-offset: 4px; }
.tn-eq .eq figure { border-radius: 6px; }
@media (max-width: 699px) {
  .tn-desliza { display: block; }
  .tn-eq { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; margin-inline: calc(var(--gut) * -1) calc(var(--gut-r) * -1); padding: 4px var(--gut-r) 12px var(--gut); scroll-padding-inline: var(--gut); scrollbar-width: thin; }
  .tn-eq .eq { flex: 0 0 68%; min-width: 0; scroll-snap-align: start; }
}
@media (min-width: 700px) and (max-width: 1099px) { .tn-eq { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .tn-eq { grid-template-columns: repeat(5, minmax(0, 1fr)); } }

/* reloj */
.reloj-sec.band-dalia .reloj-txt .lead { color: #E3D6DF; }
.reloj-sec .reloj-panel { background: #3A1B34; }
.reloj-sec .reloj-envio { color: var(--mimosa); }
.reloj-sec .chip { box-shadow: 0 0 0 1.5px #8A6A82 inset; color: var(--claro); }
.reloj-sec .chip:hover { background: #4A2442; }
.reloj-sec .chip.is-on, .reloj-sec .chip[aria-checked="true"] { background: var(--claro); color: var(--dalia); }
.reloj-sec .chip:focus-visible { outline: 3px solid var(--mimosa); outline-offset: 2px; }
.reloj-sec .eyebrow::before { box-shadow: 0 0 0 2px var(--claro) inset; }
.reloj-sec input[type="range"]::-webkit-slider-runnable-track { background: #5A3550; }
.tn-dias { gap: 6px; flex-wrap: wrap; }
.tn-dias .chip { width: 42px; height: 42px; justify-content: center; padding: 0; font-family: var(--f-mono); font-stretch: 100%; }
.reloj { filter: drop-shadow(0 26px 34px rgba(0,0,0,.45)); }

/* diario */
.diario .post .tag, .diario-sig { color: var(--tinta-2); }
.diario-sig { font-size: .72rem; }
.tn-vermas { margin-top: clamp(28px, 3vw, 44px); display: flex; justify-content: center; }
.tn-vermas .mono { font-size: .8em; margin-left: .3em; }
.post:focus { outline: none; }
.post:focus-visible { outline: 3px solid var(--aciano); outline-offset: 6px; }
html.rm-lock { overflow: hidden; }

/* esquina de etiqueta en vez de píldora */
.ramos-filtros .chip, .rm-hoy, .tn-dias .chip, .reloj-sec .chip, .metro-ctrl .chip, .pl-grid .chip { border-radius: var(--r-tag); }
body[data-page="ramos"] .sel, body[data-page="plantas"] .sel, body[data-page="tienda"] .sel { border-radius: var(--r-tag); }
.rm-ficha .talla { border-radius: var(--r-tag); }
