/* =========================================================
   Fantastico: product panels and order page.
   Loaded on wine and oil pages and on the order page, after catalog.css.
   ========================================================= */
:root{
  --fc-olive: #44542c;
  --fc-olive-mid: #5f6f3a;
}
.fc-wine,
.fc-card{ --fc-tone: var(--wp--preset--color--wine); }
.fc-wine--oil,
.fc-card--oil{ --fc-tone: var(--fc-olive); }

.fc-wine--oil .fc-wine-title,
.fc-wine--oil .fc-wine-h,
.fc-card--oil h3{ color: var(--fc-olive); }
.fc-wine--oil .fc-eyebrow{ color: var(--fc-olive-mid); }

/* ---- Shared ---- */
.fc-line-icon{ flex: none; color: var(--fc-tone, var(--wp--preset--color--wine)); }
.fc-panel-h{
  margin: 0 0 10px;
  font-family: var(--wp--preset--font-family--jost);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--wp--preset--color--muted);
}
.fc-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 24px;
  border: 1px solid var(--fc-tone, var(--wp--preset--color--wine));
  background: var(--fc-tone, var(--wp--preset--color--wine));
  color: var(--wp--preset--color--cream);
  font-family: var(--wp--preset--font-family--jost);
  font-size: .8rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: filter .2s;
}
.fc-btn:hover{ filter: brightness(1.15); color: var(--wp--preset--color--cream); }
.fc-btn:focus-visible{ outline: 2px solid var(--wp--preset--color--gold); outline-offset: 2px; }
.fc-btn[disabled]{ opacity: .6; cursor: default; }
.fc-btn--sm{ min-height: 40px; padding: 0 14px; font-size: .7rem; white-space: nowrap; }
.fc-linklike{
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  color: inherit;
  text-decoration: underline;
  cursor: pointer;
}

/* ---- Levels: drops and glasses ---- */
.fc-level{ display: inline-flex; align-items: center; gap: 10px; color: var(--fc-tone, var(--wp--preset--color--wine)); }
.fc-drops,
.fc-glasses{ display: inline-flex; gap: 3px; }
.fc-drops{ color: var(--fc-olive-mid); }
.fc-level-label{
  font-family: var(--wp--preset--font-family--jost);
  font-size: .8rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* ---- Catalogue card ---- */
.fc-card-shop{ display: flex; flex-direction: column; align-items: center; gap: 14px; width: 100%; margin-top: 14px; flex-grow: 1; }
.fc-card-foot{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid var(--fc-line, rgba(92,34,53,.15));
  text-align: left;
}
.fc-card-price{ display: flex; flex-direction: column; min-width: 0; font-family: var(--wp--preset--font-family--jost); }
.fc-card-price s,
.fc-card-price small{ font-size: .8rem; color: var(--wp--preset--color--muted); }
.fc-card-price strong{ font-size: 1.1rem; font-weight: 500; color: var(--wp--preset--color--ink); }

/* ---- Product page: facts ---- */
.fc-wine-info{ display: flex; flex-direction: column; gap: 22px; }
.fc-wine-info > *{ margin-top: 0; }
.fc-wine-info .fc-wine-title{ margin-top: -14px; }
.fc-wine-info .fc-wine-eyebrow{ margin-bottom: 0; }
.fc-wine-info .fc-wine-meta{ margin-top: -10px; }
.fc-wine-info .fc-wine-disclaimer{ margin-top: -8px; }

.fc-oil-facts{
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px 0;
  border-block: 1px solid var(--fc-line, rgba(92,34,53,.15));
}
.fc-oil-fact{ display: grid; grid-template-columns: 120px 1fr; gap: 12px; align-items: center; }
.fc-oil-fact > span:first-child{ font-size: .9rem; color: var(--wp--preset--color--muted); }
.fc-oil-fact .fc-drops svg{ width: 24px; height: 30px; }
.fc-oil-size{ display: inline-flex; align-items: center; gap: 8px; font-weight: 500; }

.fc-iconfacts{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
  gap: 12px;
  padding: 16px 0;
  border-block: 1px solid var(--fc-line, rgba(92,34,53,.15));
}
.fc-iconfact{ display: flex; flex-direction: column; align-items: center; gap: 3px; text-align: center; font-size: .82rem; color: var(--wp--preset--color--muted); }
.fc-iconfact strong{ font-size: .95rem; font-weight: 500; color: var(--wp--preset--color--ink); }

/* ---- Taste bars ---- */
.fc-bars{ display: flex; flex-direction: column; gap: 16px; max-width: 480px; }
.fc-bar{
  display: grid;
  grid-template-columns: 64px 1fr 64px;
  gap: 12px;
  align-items: center;
  font-size: .88rem;
  color: var(--wp--preset--color--muted);
}
.fc-bar > span:last-child{ text-align: right; }
.fc-bar-line{ position: relative; height: 4px; background: #e3cfc9; }
.fc-bar-line i{
  position: absolute;
  top: -6px;
  width: 16px;
  height: 16px;
  margin-left: -8px;
  border-radius: 50%;
  background: var(--wp--preset--color--wine);
}

/* ---- Aromas and food ---- */
.fc-icons ul{ list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 14px; }
.fc-icons--aroma li{ width: 72px; display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; font-size: .82rem; line-height: 1.25; color: var(--fc-tone); }
.fc-icons--food{ margin-bottom: 22px; }
.fc-icons--food ul{ display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); }
.fc-icons--food li{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 16px 8px;
  border: 1px solid #e8dfcc;
  text-align: center;
  font-size: .9rem;
}

/* ---- Sizes ---- */
.fc-sizes-grid{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.fc-size{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  padding: 14px 6px;
  border: 1px solid #d9d2b8;
  background: #fff;
  color: var(--wp--preset--color--ink);
  text-decoration: none;
}
.fc-size strong{ font-weight: 500; }
.fc-size span{ font-size: .88rem; color: var(--wp--preset--color--muted); }
.fc-size:hover{ color: var(--wp--preset--color--ink); border-color: var(--fc-olive); }
.fc-size.is-current{ border: 2px solid var(--fc-olive); background: var(--wp--preset--color--header-cream); }

/* ---- Buy box ---- */
.fc-buy{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  padding: 18px;
  background: var(--wp--preset--color--header-cream);
}
.fc-buy-price{ flex: 1 1 160px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.fc-buy-was{ margin: 0; font-size: .95rem; color: var(--wp--preset--color--muted); }
.fc-buy-from{ font-size: .75rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.fc-buy-now{ margin: 0; font-size: 1.7rem; font-weight: 500; line-height: 1.2; }
.fc-buy-now small{ font-size: .88rem; font-weight: 400; color: var(--wp--preset--color--muted); }
.fc-offer{
  margin-left: 6px;
  padding: 1px 8px;
  background: var(--fc-tone);
  color: var(--wp--preset--color--cream);
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.fc-qty{ display: inline-flex; align-items: center; border: 1px solid var(--fc-tone, var(--fc-olive)); }
.fc-qty button{ width: 44px; height: 44px; border: 0; background: none; color: var(--fc-tone, var(--fc-olive)); font-size: 1.2rem; cursor: pointer; }
.fc-qty output{ width: 36px; text-align: center; font-weight: 500; }
.fc-qty--sm{ margin-top: 4px; }
.fc-qty--sm button{ height: 36px; }

/* ---- LINE and WhatsApp ---- */
.fc-tiles{ display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
.fc-tile{
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 64px;
  padding: 10px 14px;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid;
  border-radius: 12px;
  color: var(--wp--preset--color--ink);
  text-decoration: none;
  transition: box-shadow .2s, transform .2s;
}
.fc-tile:hover{ color: var(--wp--preset--color--ink); box-shadow: 0 8px 20px rgba(40,15,20,.12); transform: translateY(-1px); }
.fc-tile:focus-visible{ outline: 2px solid var(--wp--preset--color--gold); outline-offset: 2px; }
.fc-tile--line{ border-color: #06c755; }
.fc-tile--wa{ border-color: #25d366; }
.fc-tile-icon{ flex: none; width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; color: #fff; }
.fc-tile-icon svg{ width: 26px; height: 26px; }
.fc-tile--line .fc-tile-icon{ border-radius: 11px; background: #06c755; }
.fc-tile--wa .fc-tile-icon{ border-radius: 50%; background: #25d366; }
.fc-tile-text{ display: flex; flex-direction: column; min-width: 0; }
.fc-tile-text strong{ font-weight: 500; }
.fc-tile-text small{ font-size: .82rem; color: var(--wp--preset--color--muted); }

/* ---- Bar to the order page ---- */
.fc-order-bar{
  position: fixed;
  right: 18px;
  bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  z-index: 50;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 50px;
  padding: 0 20px;
  background: var(--fc-olive);
  color: var(--wp--preset--color--cream);
  font-family: var(--wp--preset--font-family--jost);
  font-size: .85rem;
  font-weight: 500;
  text-decoration: none;
  box-shadow: 0 12px 30px rgba(20,8,12,.3);
}
.fc-order-bar[hidden]{ display: none; }
.fc-order-bar:hover{ color: var(--wp--preset--color--cream); filter: brightness(1.15); }
#fc-order-bar-count{
  min-width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--wp--preset--color--cream);
  color: var(--fc-olive);
  text-align: center;
  line-height: 24px;
}

/* ---- Order page ---- */
.fc-order{
  --fc-tone: var(--wp--preset--color--wine);
  max-width: 1180px;
  margin-inline: auto;
  padding: clamp(40px, 6vw, 72px) 26px clamp(56px, 8vw, 96px);
}
.fc-order [hidden]{ display: none !important; }
.fc-order-title{
  margin: 0 0 32px;
  font-family: var(--wp--preset--font-family--cormorant);
  font-weight: 500;
  font-size: clamp(2.4rem, 5vw, 3.2rem);
  line-height: 1.1;
  color: var(--wp--preset--color--wine);
}
.fc-order-empty{ display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.fc-order-empty p{ margin: 0; font-size: 1.1rem; }
.fc-order-done{ display: flex; flex-direction: column; gap: 16px; max-width: 640px; }
.fc-order-done h2{ margin: 0; font-family: var(--wp--preset--font-family--cormorant); font-weight: 500; font-size: 2rem; color: var(--wp--preset--color--wine); }
.fc-order-done p{ margin: 0; }
.fc-order-back{ text-decoration: underline; }

.fc-order-grid{ display: flex; flex-wrap: wrap; gap: 40px; align-items: flex-start; }
.fc-order-form{ flex: 999 1 520px; min-width: 0; display: flex; flex-direction: column; gap: 32px; }
.fc-order-summary{ flex: 1 1 340px; min-width: 0; display: flex; flex-direction: column; gap: 18px; padding: 24px; box-sizing: border-box; background: var(--wp--preset--color--header-cream); }
.fc-order-form fieldset{ margin: 0; padding: 0; border: 0; min-width: 0; }
.fc-order-form legend,
.fc-order-summary h2{
  padding: 0;
  margin: 0 0 14px;
  font-family: var(--wp--preset--font-family--cormorant);
  font-weight: 500;
  font-size: 1.75rem;
  color: var(--wp--preset--color--wine);
}
.fc-order-summary h2{ margin: 0; }
.fc-order-fields{ display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.fc-order-field{ display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.fc-order-field--wide{ grid-column: 1 / -1; }
.fc-order-field label{ font-size: .9rem; color: var(--wp--preset--color--muted); }
.fc-order-field input,
.fc-order-field textarea{
  box-sizing: border-box;
  width: 100%;
  padding: 11px 12px;
  border: 1px solid #cdbfae;
  background: #fff;
  font: inherit;
}
.fc-order-field input:focus,
.fc-order-field textarea:focus{ outline: none; border-color: var(--wp--preset--color--gold); box-shadow: 0 0 0 3px rgba(184,147,58,.3); }
.fc-order-hp{ position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.fc-order-pay{ display: flex; flex-direction: column; gap: 12px; }
.fc-order-method{
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 16px;
  border: 1px solid #cdbfae;
  background: #fff;
  cursor: pointer;
}
.fc-order-method:has(input:checked){ border-color: var(--wp--preset--color--wine); background: var(--wp--preset--color--header-cream); }
.fc-order-method input{ width: 18px; height: 18px; margin: 3px 0 0; accent-color: var(--wp--preset--color--wine); }
.fc-order-method span{ display: flex; flex-direction: column; gap: 2px; }
.fc-order-method strong{ font-weight: 500; }
.fc-order-method small{ font-size: .88rem; color: var(--wp--preset--color--muted); }

.fc-order-lines{ list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.fc-order-line{ display: grid; grid-template-columns: 56px 1fr auto; gap: 12px; align-items: start; }
.fc-order-line img{ width: 56px; height: 72px; object-fit: contain; background: var(--wp--preset--color--cream); }
.fc-order-line-name{ margin: 0; font-weight: 500; line-height: 1.3; }
.fc-order-line-right{ display: flex; flex-direction: column; align-items: flex-end; gap: 4px; font-size: .95rem; }
.fc-order-line-right p{ margin: 0; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fc-order-line-right .fc-linklike{ font-size: .8rem; color: var(--wp--preset--color--muted); }
.fc-order-totals{ margin: 0; display: flex; flex-direction: column; gap: 8px; padding-top: 14px; border-top: 1px solid #d9cfbc; }
.fc-order-totals > div{ display: flex; justify-content: space-between; gap: 12px; }
.fc-order-totals dt{ font-weight: 400; }
.fc-order-totals dd{ margin: 0; font-variant-numeric: tabular-nums; }
.fc-order-total{ font-size: 1.35rem; font-weight: 500; }
.fc-order-total dt{ font-weight: 500; }
.fc-order-vat,
.fc-order-note{ margin: -8px 0 0; font-size: .85rem; color: var(--wp--preset--color--muted); }
.fc-order-note{ margin: 0; }
.fc-order-progress{ display: flex; flex-direction: column; gap: 6px; padding: 12px; background: var(--wp--preset--color--cream); }
.fc-order-progress p{ margin: 0; font-size: .88rem; font-weight: 500; color: var(--fc-olive); }
.fc-order-track{ height: 6px; background: #e8dfcc; }
.fc-order-track i{ display: block; height: 6px; background: var(--fc-olive-mid); }
.fc-order-error{ margin: 0; padding: 12px; background: #fbe9e7; color: #8a1f11; font-size: .92rem; }
.fc-order-send{ width: 100%; min-height: 50px; }

@media (max-width: 560px){
  .fc-order-bar{ right: 12px; left: 12px; justify-content: center; }
  .fc-oil-fact{ grid-template-columns: 96px 1fr; }
  .fc-bar{ grid-template-columns: 56px 1fr 56px; }
}