/* Big Shoulders Display (latin, variable 400-900) para botones y pestañas, por si la página no la carga por Elementor. */
@font-face{font-family:"Big Shoulders Display";src:url(fonts/bigshoulders.woff2) format("woff2");font-weight:400 900;font-style:normal;font-display:swap}
/*!
 * Clamford · Tarjetas de producto con selector de color y talla
 * Componente compartido entre la maqueta HTML y el plugin de WooCommerce.
 * Colores y tipografías salen de variables: si el Kit de Elementor está activo,
 * toma sus colores globales; si no, usa los valores de respaldo.
 */
.cf-grid,
.cf-card{
  --cf-ink:var(--e-global-color-primary,#000);
  --cf-paper:#fff;
  --cf-muted:#5c5c5c;
  --cf-line:#d4d4d4;
  --cf-accent:var(--e-global-color-accent,#c62828);
  --cf-media-bg:#0d0d0d;
  --cf-display:"Big Shoulders Display","Arial Narrow",Impact,sans-serif;
}
.cf-grid{display:grid;grid-template-columns:repeat(var(--cf-cols,4),minmax(0,1fr));gap:clamp(32px,3vw,48px) clamp(12px,1.6vw,20px);margin:0;padding:0;list-style:none}
@media (max-width:1100px){.cf-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.cf-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 12px}}

/* pestañas Mujer / Hombre ([clamford_pestanas]) */
.cf-tabs{--cf-ink:var(--e-global-color-primary,#000);--cf-paper:#fff;--cf-accent:var(--e-global-color-accent,#c62828);--cf-display:"Big Shoulders Display","Arial Narrow",Impact,sans-serif}
.cf-tabs__head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin-bottom:clamp(24px,3vw,40px)}
.cf-tabs__title{margin:0}
.cf-tablist{display:inline-flex;border:2px solid var(--cf-ink)}
.cf-tabs .cf-tablist button{min-height:48px;margin:0;padding:0 26px;border:0;border-radius:0;background:var(--cf-paper);color:var(--cf-ink);font-family:var(--cf-display);font-weight:800;font-size:20px;line-height:1;letter-spacing:.04em;text-transform:uppercase;cursor:pointer}
.cf-tablist button:hover{background:#ececec}
.cf-tablist button[aria-selected="true"]{background:var(--cf-ink);color:var(--cf-paper)}
.cf-tablist button:focus-visible{outline:3px solid var(--cf-accent);outline-offset:3px}
.cf-tabpanel[hidden]{display:none}

.cf-card{list-style:none;margin:0;padding:0;min-width:0;color:var(--cf-ink);container:cfcard/inline-size}
.cf-card__form{display:flex;flex-direction:column;height:100%;margin:0}
.cf-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* imagen */
.cf-card__media{position:relative;display:block;aspect-ratio:3/4;background:var(--cf-media-bg);overflow:hidden}
.cf-card__img{display:block;width:100%;height:100%;object-fit:cover;transition:opacity .2s ease,transform .5s ease}
.cf-card__media:hover .cf-card__img{transform:scale(1.03)}
.cf-card__media.is-swapping .cf-card__img{opacity:.55}
.cf-card__tag{position:absolute;left:12px;top:12px;z-index:1;background:var(--cf-paper);color:var(--cf-ink);font-size:13px;font-weight:700;line-height:1;padding:6px 9px}

/* nombre y precio */
.cf-card__info{margin-top:14px}
.cf-card .cf-card__title{margin:0;font-family:inherit;font-size:16px;font-weight:600;line-height:1.35;letter-spacing:0;text-transform:none;color:inherit}
.cf-card .cf-card__title a{color:inherit;text-decoration:none}
.cf-card .cf-card__title a:hover{text-decoration:underline;text-underline-offset:.2em}
.cf-card__price{margin:4px 0 0;font-weight:800;font-size:17px;font-variant-numeric:tabular-nums}
.cf-card__price del{font-weight:400;color:var(--cf-muted);margin-right:6px}
.cf-card__price ins{text-decoration:none}

/* opciones */
.cf-card__buy{margin-top:auto;padding-top:10px}
.cf-opt{border:0;margin:0;padding:0;min-width:0}
.cf-opt+.cf-opt{margin-top:8px}
.cf-opt--color{display:flex;align-items:center;flex-wrap:wrap;column-gap:6px}
.cf-swatches{display:flex;flex-wrap:wrap;margin-left:-6px}
.cf-swatch{position:relative;display:grid;place-items:center;width:34px;height:34px;cursor:pointer}
.cf-swatch input,.cf-size input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.cf-dot{display:block;width:22px;height:22px;border-radius:50%;background:var(--sw,#999);box-shadow:inset 0 0 0 1px rgba(0,0,0,.28);transition:box-shadow .15s}
.cf-swatch input:checked+.cf-dot{box-shadow:inset 0 0 0 1px rgba(0,0,0,.28),0 0 0 2px var(--cf-paper),0 0 0 4px var(--cf-ink)}
.cf-swatch:hover .cf-dot{box-shadow:inset 0 0 0 1px rgba(0,0,0,.28),0 0 0 2px var(--cf-paper),0 0 0 3px var(--cf-muted)}
.cf-swatch input:checked:hover+.cf-dot{box-shadow:inset 0 0 0 1px rgba(0,0,0,.28),0 0 0 2px var(--cf-paper),0 0 0 4px var(--cf-ink)}
.cf-swatch input:focus-visible+.cf-dot{outline:3px solid var(--cf-accent);outline-offset:5px}
.cf-swatch input:disabled{cursor:not-allowed}
.cf-swatch input:disabled+.cf-dot{opacity:.5;background:linear-gradient(to top right,transparent calc(50% - 1px),var(--cf-ink) calc(50% - 1px),var(--cf-ink) calc(50% + 1px),transparent calc(50% + 1px)),var(--sw,#999)}
.cf-color-name{font-size:14px;line-height:1.2;color:var(--cf-muted)}

.cf-sizes{display:flex;flex-wrap:wrap;gap:6px}
.cf-size{position:relative;display:block}
.cf-size span{display:grid;place-items:center;min-width:44px;height:40px;padding:0 10px;border:1.5px solid var(--cf-line);background:var(--cf-paper);font-size:14px;font-weight:600;line-height:1;transition:border-color .15s,background-color .15s,color .15s}
.cf-size:hover span{border-color:var(--cf-ink)}
.cf-size input:checked+span{background:var(--cf-ink);border-color:var(--cf-ink);color:var(--cf-paper)}
.cf-size input:focus-visible+span{outline:3px solid var(--cf-accent);outline-offset:2px}
.cf-size input:disabled{cursor:not-allowed}
.cf-size input:disabled+span{color:#9a9a9a;border-style:dashed;text-decoration:line-through}
.cf-opt.is-error .cf-size span{border-color:var(--cf-accent)}
/* Talla con pocas unidades (inventario real): punto de color en la esquina; el texto lo da [clamford_existencias] */
.cf-size.is-low::after{content:"";position:absolute;top:-4px;right:-4px;width:9px;height:9px;border-radius:50%;background:var(--cf-accent,#c62828);box-shadow:0 0 0 2px var(--cf-paper,#fff);pointer-events:none}

/* botón */
.cf-card .cf-card__add{display:flex;box-sizing:border-box;text-decoration:none;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;margin-top:12px;padding:.5em 1em .45em;border:2px solid var(--cf-ink);border-radius:0;background:var(--cf-ink);color:var(--cf-paper);font-family:var(--cf-display);font-weight:800;font-size:19px;line-height:1;letter-spacing:.03em;text-transform:uppercase;cursor:pointer;transition:background-color .18s,color .18s}
.cf-card .cf-card__add:hover{background:var(--cf-paper);color:var(--cf-ink)}
.cf-card .cf-card__add:focus-visible{outline:3px solid var(--cf-accent);outline-offset:3px}
.cf-card .cf-card__add[disabled]{opacity:.55;cursor:not-allowed;background:var(--cf-ink);color:var(--cf-paper)}
.cf-card .cf-card__add.is-added{background:var(--cf-paper);color:var(--cf-ink)}
.cf-card .cf-card__add.is-warn,.cf-card .cf-card__add.is-warn:hover{background:var(--cf-paper);color:var(--cf-accent);border-color:var(--cf-accent)}
.cf-card .cf-card__add svg{width:18px;height:18px;flex:none}
.cf-card__msg{margin:6px 0 0;font-size:14px;line-height:1.4;min-height:0}
.cf-card__msg:empty{display:none}
.cf-card__msg.is-error{color:var(--cf-accent);font-weight:600}
.cf-card__msg.cf-sr{display:block}

/* aviso flotante */
.cf-toast{position:fixed;left:50%;bottom:clamp(16px,3vw,28px);z-index:9999;display:flex;align-items:center;gap:16px;width:max-content;max-width:min(560px,calc(100vw - 32px));box-sizing:border-box;padding:14px 18px;background:#000;color:#fff;font-size:15px;line-height:1.4;box-shadow:0 10px 30px rgba(0,0,0,.3);transform:translate(-50%,20px);opacity:0;visibility:hidden;transition:transform .25s ease,opacity .25s ease,visibility 0s .25s}
.cf-toast.is-open{transform:translate(-50%,0);opacity:1;visibility:visible;transition:transform .25s ease,opacity .25s ease}
.cf-toast a{flex:none;color:#fff;font-weight:700;text-decoration:underline;text-underline-offset:.25em;white-space:nowrap}
.cf-toast .cf-toast__close{flex:none;display:grid;place-items:center;width:32px;height:32px;margin:-6px -8px -6px 0;background:none;border:0;color:#fff;cursor:pointer;font-size:22px;line-height:1}

/* Compacta según el ancho de la propia tarjeta (sirve igual para 2, 3, 4 o 5 columnas) */
@container cfcard (max-width:250px){
  .cf-card .cf-card__title{font-size:15px}
  .cf-card__price{font-size:16px}
  .cf-swatch{width:30px;height:30px}
  .cf-dot{width:20px;height:20px}
  .cf-swatches{margin-left:-5px}
  .cf-color-name{display:none}
  .cf-sizes{gap:5px}
  .cf-size span{min-width:38px;height:38px;padding:0 6px;font-size:13px}
  .cf-card .cf-card__add{font-size:16px;min-height:46px;padding-inline:.4em;letter-spacing:.01em}
}
@container cfcard (max-width:165px){
  .cf-card .cf-card__add{font-size:14px}
  .cf-size span{min-width:34px}
}
@media (prefers-reduced-motion:reduce){
  .cf-card__img,.cf-toast{transition:none}
  .cf-card__media:hover .cf-card__img{transform:none}
}

/* Elementor: la tarjeta dentro de un widget Shortcode en un contenedor flex en columna (Loop Item).
   Sin ancho explícito, Chrome calcula mal el alto del widget por la container query de la tarjeta. */
.elementor-widget-shortcode:has(>.elementor-shortcode>.cf-card),.e-loop-item .elementor-widget-shortcode{width:100%}

/* Ficha de producto: muestras sobre el formulario de variaciones de WooCommerce */
.cf-pdp,.cf-pdp-msg{--cf-ink:var(--e-global-color-primary,#000);--cf-paper:#fff;--cf-muted:#5c5c5c;--cf-line:#d4d4d4;--cf-accent:var(--e-global-color-accent,#c62828)}
.variations_form .cf-pdp-select{display:none}
.cf-pdp{border:0;margin:0;padding:0;min-width:0}
.cf-pdp.cf-opt--color{column-gap:10px}
.cf-pdp .cf-swatches{margin-left:-7px}
.cf-pdp .cf-swatch{width:44px;height:44px}
.cf-pdp .cf-dot{width:30px;height:30px}
.cf-pdp .cf-color-name{font-size:15px;font-weight:600;color:var(--cf-ink)}
.cf-pdp .cf-sizes{gap:8px}
.cf-pdp .cf-size span{min-width:54px;height:48px;padding:0 14px;font-size:15px}
.cf-pdp.is-error .cf-size span,.cf-pdp.is-error .cf-dot{border-color:var(--cf-accent);box-shadow:0 0 0 2px var(--cf-accent)}
.cf-pdp-msg{margin:4px 0 0;min-height:1.2em;color:var(--cf-accent);font-size:14px;font-weight:600}
.cf-pdp-msg:empty{display:none}

/* ---------- Ficha de producto: modelo, guía de tallas, personas viendo, existencias, envío ---------- */
.cf-pdp-extra,.cf-guide,.cf-guide-inline,.cf-live,.cf-stock,.cf-ship,.cf-buybar,.cf-related{--cf-ink:var(--e-global-color-primary,#000);--cf-paper:#fff;--cf-muted:#5c5c5c;--cf-line:#d9d9d9;--cf-accent:var(--e-global-color-accent,#c62828);--cf-display:"Big Shoulders Display","Big Shoulders Fallback","Arial Narrow",Impact,sans-serif}
.cf-pdp-extra{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 16px;margin-top:10px}
.cf-model{margin:0;font-size:14px;line-height:1.4;color:var(--cf-muted,#5c5c5c)}
.cf-pdp-extra>*{align-self:center}
html body .cf-pdp-extra .cf-model{margin:0}
html body .cf-pdp-extra button.cf-guide-btn{margin:0}
.cf-guide-btn{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0;border:0;background:none;color:var(--cf-ink,#000);font:600 14px/1.2 inherit;text-decoration:underline;text-underline-offset:.25em;cursor:pointer}
.cf-guide-btn:hover{color:var(--cf-accent,#c62828)}
.cf-guide-btn:focus-visible{outline:3px solid var(--cf-accent,#c62828);outline-offset:3px}

.cf-guide{width:min(760px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:0;border:0;border-radius:0;background:#fff;color:#1f1f1f;box-shadow:0 24px 80px rgba(0,0,0,.35)}
.cf-guide::backdrop{background:rgba(0,0,0,.6)}
.cf-guide[open]{animation:cf-guide-in .2s ease-out}
@keyframes cf-guide-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.cf-guide[open]{animation:none}}
.cf-guide__head{position:sticky;top:0;z-index:1;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 24px 16px;background:#000;color:#fff}
.cf-guide__title{margin:0;font-family:var(--cf-display);font-weight:900;font-size:30px;line-height:1;text-transform:uppercase}
.cf-guide__title small{display:block;margin-top:6px;font-family:"Archivo",sans-serif;font-weight:500;font-size:14px;text-transform:none;color:#d6d6d6}
.cf-guide__close{flex:0 0 auto;width:44px;height:44px;margin:-8px -10px 0 0;border:0;background:none;color:#fff;font-size:32px;line-height:1;cursor:pointer}
.cf-guide__close:focus-visible{outline:3px solid #e33d3d;outline-offset:-3px}
.cf-guide .cf-guide__body{padding:24px}
.cf-guide__body{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:24px;align-items:start}
.cf-guide__body:not(:has(.cf-guide__img)){grid-template-columns:1fr}
.cf-guide__img{margin:0}
.cf-guide__img img{display:block;width:100%;height:auto;background:#f4f4f4}
.cf-guide__table table{width:100%;margin:0;border-collapse:collapse;font-size:15px;font-variant-numeric:tabular-nums}
.cf-guide__table figure{margin:0}
.cf-guide__table th,.cf-guide__table td{padding:10px 8px;border:0;border-bottom:1px solid var(--cf-line,#d9d9d9);text-align:center;background:none}
.cf-guide__table thead th,.cf-guide__table tr:first-child th{background:#000;color:#fff;font-family:var(--cf-display);font-weight:800;font-size:14px;letter-spacing:.04em;text-transform:uppercase}
.cf-guide__table tbody tr:nth-child(even) td{background:#f5f5f5}
.cf-guide__table td:first-child{font-weight:700}
.cf-guide__table p{margin:12px 0 0;font-size:14px;color:var(--cf-muted,#5c5c5c)}
.cf-guide__model{margin:0;padding:0 24px 8px;font-size:14px;font-weight:600}
.cf-guide-inline .cf-guide__model{padding:12px 0 0}
.cf-guide__help{margin:0;padding:8px 24px 24px;font-size:14px;color:var(--cf-muted,#5c5c5c)}
.cf-guide__help a{color:#000;font-weight:600}
.cf-guide-inline--empty p{margin:0}
@media (max-width:600px){.cf-guide__body{grid-template-columns:1fr}.cf-guide__img{max-width:240px}.cf-guide__table{overflow-x:auto}.cf-guide__table th,.cf-guide__table td{padding:9px 6px;font-size:14px}}

.cf-live,.cf-stock{display:flex;align-items:center;gap:10px;margin:0;font-size:15px;line-height:1.35}
.cf-live[hidden],.cf-stock[hidden]{display:none}
.cf-live__dot{position:relative;flex:0 0 auto;width:10px;height:10px;border-radius:50%;background:var(--cf-muted,#5c5c5c)}
.cf-live.is-now .cf-live__dot{background:#1f9d55}
.cf-live.is-now .cf-live__dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid #1f9d55;opacity:0;animation:cf-pulse 2s ease-out infinite}
@keyframes cf-pulse{0%{transform:scale(.6);opacity:.8}100%{transform:scale(1.4);opacity:0}}
@media (prefers-reduced-motion:reduce){.cf-live.is-now .cf-live__dot::after{animation:none}}
.cf-stock{color:var(--cf-accent,#c62828);font-weight:600}
.cf-stock svg{flex:0 0 auto}

.cf-ship{margin:0;padding:0;list-style:none;border-top:1px solid var(--cf-line,#d9d9d9)}
.cf-ship__row{display:flex;align-items:flex-start;gap:14px;padding:14px 0;border-bottom:1px solid var(--cf-line,#d9d9d9);font-size:15px;line-height:1.45}
.cf-ship__row svg{flex:0 0 auto;margin-top:-1px}
.cf-ship__row>div{flex:1;min-width:0}
.cf-ship__row p{margin:0}
.cf-ship__row a{color:#000;font-weight:600}
.cf-nowrap{white-space:nowrap}
.cf-progress:empty{display:none}
.cf-progress{margin-top:8px}
.cf-progress__text{margin:0 0 6px;font-size:14px;color:#1f1f1f}
.cf-progress__text.is-done{color:#1f7a45;font-weight:700}
.cf-progress__bar{display:block;height:6px;background:#ececec;overflow:hidden}
.cf-progress__bar span{display:block;height:100%;background:#000;transition:width .4s ease}
.cf-progress__text.is-done+.cf-progress__bar span{background:#1f9d55}

.cf-related__title{margin:0 0 24px;font-family:var(--cf-display);font-weight:900;font-size:clamp(34px,4vw,56px);line-height:.9;text-transform:uppercase;color:#000}

.single_add_to_cart_button.is-added{background:#1f7a45!important}
.cf-buybar{display:none}
@media (max-width:767px){
  .cf-buybar{position:fixed;left:0;right:0;bottom:0;z-index:98;display:flex;align-items:center;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #d9d9d9;box-shadow:0 -6px 20px rgba(0,0,0,.08);transform:translateY(110%);transition:transform .25s ease}
  .cf-buybar[hidden]{display:none}
  .cf-buybar.is-visible{transform:none}
  .cf-buybar__img{flex:0 0 auto;width:44px;height:58px;object-fit:cover}
  .cf-buybar__info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
  .cf-buybar__name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600}
  .cf-buybar__price{font-size:14px;font-weight:700}
  .cf-buybar__price del{font-weight:400;color:#5c5c5c}
  .cf-buybar__btn{flex:0 0 auto;min-height:48px;padding:0 16px;border:0;background:#000;color:#fff;font-family:var(--cf-display);font-weight:800;font-size:17px;letter-spacing:.04em;text-transform:uppercase;cursor:pointer}
  .cf-buybar__btn:focus-visible{outline:3px solid #e33d3d;outline-offset:2px}
}
@media (max-width:767px) and (prefers-reduced-motion:reduce){.cf-buybar{transition:none}}
@media (max-width:767px){.cf-has-buybar .cf-toast{bottom:calc(84px + env(safe-area-inset-bottom))}}
/* Botones del componente: más específicos que los estilos globales de botones del Kit de Elementor */
html body button.cf-guide-btn{display:inline-flex;align-items:center;gap:6px;min-height:44px;width:auto;padding:0;border:0;border-radius:0;background:none;box-shadow:none;color:var(--cf-ink,#000);font-family:inherit;font-size:14px;font-weight:600;line-height:1.2;letter-spacing:0;text-transform:none;text-decoration:underline;text-underline-offset:.25em}
html body button.cf-guide-btn:hover,html body button.cf-guide-btn:focus{background:none;color:var(--cf-accent,#c62828)}
html body button.cf-guide__close{width:44px;height:44px;min-height:0;padding:0;border:0;border-radius:0;background:none;color:#fff;font-family:inherit;font-size:32px;line-height:1;text-transform:none}
html body button.cf-guide__close:hover{background:none;color:#e33d3d}
html body button.cf-buybar__btn{width:auto;border-radius:0;border:0;background:#000;color:#fff}
html body button.cf-buybar__btn:hover{background:#c62828;color:#fff}

/* Columna fija al hacer scroll (p. ej. la galería de la ficha): clase cf-sticky en el contenedor. Si es más alta que
   la pantalla, cf-producto.js ajusta --cf-sticky-top para que se fije por abajo y nunca quede cortada. */
@media (min-width:768px){.e-con.cf-sticky,.cf-sticky{position:sticky;top:var(--cf-sticky-top,24px);align-self:flex-start}}
