/* Ajustes del tema sobre tienda.css (que es la copia de styles.css del plugin, sin cambios).
   Solo lo que cambia por ser páginas de WordPress: formularios reales, avisos de WooCommerce y enlaces en vez de botones. */

/* Cantidad: un campo real (se envía con el formulario) con el mismo aspecto que el número de la tienda */
.stepper input{width:44px;min-width:36px;height:var(--tap);border:0;padding:0;text-align:center;font:inherit;font-weight:800;color:inherit;background:transparent;-moz-appearance:textfield;appearance:textfield}
.stepper input::-webkit-outer-spin-button,.stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* Orden y filtros: formularios GET */
.sort label{display:contents}
.applied a{display:inline-flex;align-items:center;border:0;background:var(--blue-soft);color:var(--blue-ink);border-radius:999px;padding:0 14px;min-height:var(--tap);font-weight:700;font-size:13.5px;text-decoration:none}
@media (max-width:999px){.plp>.filters:target{display:block}}
.filters noscript .btn,.sort noscript .btn{margin-top:8px}
a.filters-open{text-decoration:none}

/* Enlaces con aspecto de botón (agregar, carrito) */
a.btn-add,a.icon-btn,a.cart-float{text-decoration:none}
.more .btn+.btn{margin-top:0}

/* Avisos de WooCommerce («Se agregó al carrito», errores) con el estilo de avisos de la tienda */
.woocommerce-notices-wrapper:empty{display:none}
.woocommerce-message,.woocommerce-info,.woocommerce-error{list-style:none;margin:16px 0;padding:12px 14px;border-radius:var(--r-m);font-size:14.5px;background:var(--blue-soft);color:var(--blue-ink);border:1px solid var(--line, #d7deea);display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:space-between}
.woocommerce-error{background:var(--warn-soft);color:var(--ink);border-color:var(--yellow-edge)}
.woocommerce-message .button,.woocommerce-info .button{order:2;font-weight:800;color:var(--blue);text-decoration:underline}

/* Formulario estándar de WooCommerce (productos con variaciones) dentro de la caja de compra */
.buy-wc .variations{width:100%;margin-bottom:12px;border-collapse:collapse}
.buy-wc .variations th,.buy-wc .variations td{padding:6px 0;text-align:left}
.buy-wc select{min-height:var(--tap);border:1.5px solid var(--field-line);border-radius:12px;padding:0 12px;font:inherit}
.buy-wc .single_add_to_cart_button{background:var(--blue);color:#fff;border:0;border-radius:12px;min-height:var(--tap);padding:0 20px;font-weight:800;cursor:pointer}

/* Páginas de WooCommerce (carrito, cuenta) dentro del marco de la tienda */
.doc-wc{max-width:none}
.doc-list{padding-left:1.2em}

/* Panel del menú: los nombres de WooCommerce (los largos de ORBITICO) en una sola línea, como se veían los cortos */
.cats-nav .mega .mm-col li a{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:36px}

/* Reels de Facebook en la portada (12-oct-2026), como las pantallas de la tienda 3D: fila de punta a punta, marco negro y franja «▶ REELS» */
.reels-fila .reels{list-style:none;margin:0;padding:0 10px 6px;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:10px}
.reel-it{display:grid;gap:6px;min-width:0}
.reel-cab{display:block;text-align:center;font:800 13px/1 var(--f-title,inherit);letter-spacing:.06em;color:#fff;padding:7px 0;border-radius:10px 10px 0 0;background:linear-gradient(90deg,#feda75,#fa7e1e 35%,#d62976 65%,#4f5bd5);margin-bottom:-6px}
.reel-pant{position:relative;aspect-ratio:9/16;background:#111114;border:6px solid #111114;border-radius:0 0 14px 14px;overflow:hidden;cursor:pointer}
.reel-pant video{width:100%;height:100%;object-fit:cover;display:block;border-radius:8px}
.reel-sonido{position:absolute;right:8px;top:8px;width:38px;height:38px;border-radius:50%;border:0;background:rgba(0,0,0,.55);color:#fff;font-size:17px;cursor:pointer}
.reel-fb{display:block;text-align:center;font-weight:800;font-size:13px;color:#082061;background:#eef2fb;border-radius:999px;padding:8px 6px;text-decoration:none}
.reel-fb:hover{background:#dfe7f8}
@media (max-width:900px){.reels-fila .reels{grid-auto-columns:44vw;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.reels-fila .reels::-webkit-scrollbar{display:none}.reel-it{scroll-snap-align:start}}

/* Franja de la tienda 3D en la portada (13-oct-2026): video del recorrido de compra + texto y botón */
.franja-3d .f3d{display:grid;grid-template-columns:1.35fr 1fr;gap:28px;align-items:center;background:linear-gradient(135deg,#082061,#0738b8);border-radius:var(--r-l,20px);padding:22px;color:#fff;box-shadow:0 18px 40px rgba(8,32,97,.25)}
.f3d-video{position:relative;display:block;border-radius:14px;overflow:hidden;aspect-ratio:16/9;background:#061a52;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.f3d-video video{width:100%;height:100%;object-fit:cover;display:block}
.f3d-sello{position:absolute;left:12px;top:12px;background:#ffd200;color:#082061;font:900 13px/1 var(--f-title,inherit);letter-spacing:.06em;padding:7px 11px;border-radius:999px}
.f3d-txt{display:grid;gap:12px;align-content:center}
.f3d-txt h2{margin:0;color:#fff;font-size:clamp(24px,3vw,36px);line-height:1.15}
.f3d-txt p{margin:0;color:#dfe7ff;font-size:16px;line-height:1.5}
.f3d-pasos{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.f3d-pasos li{background:rgba(255,255,255,.12);border-radius:999px;padding:7px 12px;font-weight:700;font-size:14px}
.f3d-btn{justify-self:start;background:#ffd200!important;color:#082061!important;font-weight:900;padding:14px 22px;border-radius:999px;text-decoration:none}
@media (max-width:820px){.franja-3d .f3d{grid-template-columns:1fr;padding:14px;gap:16px}.f3d-btn{justify-self:stretch;text-align:center}}

/* meta de envío gratis en el carrito (14-oct) */
.meta-envio { margin: 0 0 12px; padding: 10px 12px; border-radius: 12px; background: #eef8f1; border: 1px solid #bfe5cb; color: #10391f; font-size: 14px; line-height: 1.4; }
.meta-envio b { color: #1f8a4c; }
.meta-envio.ok { background: #1f8a4c; border-color: #1f8a4c; color: #fff; font-weight: 700; }
.meta-envio.ok b { color: #fff; }
.meta-barra { height: 8px; margin: 8px 0 6px; background: #d9eadf; border-radius: 999px; overflow: hidden; }
.meta-barra i { display: block; height: 100%; background: linear-gradient(90deg, #1f8a4c, #5ccf86); border-radius: inherit; }
.meta-envio small { display: block; color: #4b6355; font-size: 12px; }