/*! Fancy Labs 2 © Flavio Iantomasi. Tutti i diritti riservati: vietati copia e riuso senza permesso scritto. */
/* Tools that help the customer choose and order (inc/fl-tools.php and its modules, assets/js/fl-tools.js).
   Loaded on shop, product, cart, account and quick-order pages, after fl-base.css (its colours and buttons). */

/* ---------- Shared: text buttons, tool buttons, window, short messages ---------- */
.fl-link-btn { display: inline; padding: 0; border: 0; background: none; font: inherit; font-weight: 700; color: var(--fl-link); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.fl-link-btn:hover { color: var(--fl-link-hover); }
.fl-link-btn[hidden] { display: none; }
.fl-tool-row { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 14px 0 0; }
.fl-tool-btn { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 0; border: 0; background: none; font: inherit; font-size: 14px; font-weight: 700; color: var(--fl-ink); cursor: pointer; }
.fl-tool-btn .fl-icon { flex: none; color: var(--fl-muted); }
.fl-tool-btn:hover, .fl-tool-btn:hover .fl-icon { color: var(--fl-link); }
.fl-tool-btn.is-on, .fl-tool-btn.is-on .fl-icon { color: var(--fl-green-dark); }
.fl-card-tools { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px 14px; margin-top: 6px; }
.fl-card-tools .fl-tool-btn { min-height: 36px; font-size: 13px; font-weight: 600; color: var(--fl-muted); }
:is(.fl-ship-est, .fl-calc, .fl-qa-form, .fl-list-new, .fl-list-cart, .fl-list, .fl-qo-form) :is(input[type="text"], input[type="email"], input[type="number"], textarea) { min-height: 46px; padding: 8px 12px; border: 1px solid var(--fl-line-strong); border-radius: var(--fl-radius-sm); background: #fff; color: var(--fl-ink); font: inherit; font-size: 16px; }
:is(.fl-ship-est, .fl-calc, .fl-qa-form, .fl-list-new, .fl-list-cart, .fl-list, .fl-qo-form) :is(input, textarea):focus-visible { outline: 3px solid var(--fl-orange-dark); outline-offset: 1px; }

.fl-tool-dialog { width: min(480px, calc(100vw - 24px)); max-height: calc(100vh - 32px); padding: 0; border: 0; border-radius: var(--fl-radius); background: #fff; color: var(--fl-ink); box-shadow: var(--fl-shadow-lg); overflow: hidden; }
.fl-tool-dialog[open] { display: flex; flex-direction: column; }
.fl-tool-dialog.is-wide { width: min(1100px, calc(100vw - 24px)); }
.fl-tool-dialog::backdrop { background: rgba(42, 33, 29, 0.55); }
.fl-tool-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 16px 14px 22px; border-bottom: 1px solid var(--fl-line); }
.fl-tool-dialog-head strong { font-family: var(--fl-display); font-size: 22px; line-height: 1.15; }
.fl-tool-dialog-close { flex: none; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--fl-soft); font-size: 26px; line-height: 1; color: var(--fl-ink); cursor: pointer; }
.fl-tool-dialog-close:hover { background: var(--fl-soft-hover); }
.fl-tool-dialog-body { padding: 18px 22px 22px; overflow: auto; overscroll-behavior: contain; }
.fl-tool-dialog-body > :first-child { margin-top: 0; }
.fl-tool-dialog-body > :last-child { margin-bottom: 0; }
.fl-tool-toast { position: fixed; left: 50%; bottom: 84px; z-index: 300; transform: translateX(-50%); max-width: calc(100vw - 24px); padding: 12px 18px; border-radius: var(--fl-radius-sm); background: var(--fl-action); color: #fff; font-size: 15px; font-weight: 600; box-shadow: var(--fl-shadow-lg); }
.fl-tool-toast[hidden] { display: none; }

/* ---------- "La mia arnia" ---------- */
.fl-hive { margin: 0 0 14px; padding: 10px 14px; border-left: 4px solid var(--fl-line-strong); border-radius: var(--fl-radius-sm); background: var(--fl-soft); font-size: 15px; }
.fl-hive-text { margin: 0; }
.fl-hive.is-ok { border-left-color: var(--fl-green); background: var(--fl-green-soft); color: var(--fl-green-dark); font-weight: 600; }
.fl-hive.is-ok [data-fl-hive-text]::before { content: "✓ "; }
.fl-hive.is-warn { border-left-color: var(--fl-red); background: var(--fl-red-soft); color: var(--fl-red); font-weight: 600; }
.fl-hive-tag { display: inline-block; margin: 4px 0 0; padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; line-height: 1.5; }
.fl-hive-tag.is-ok { background: var(--fl-green-soft); color: var(--fl-green-dark); }
.fl-hive-tag.is-ok::before { content: "✓ "; }
.fl-hive-tag.is-no { background: var(--fl-soft); color: var(--fl-muted); }
.fl-hive-bar { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; margin: 0 0 18px; padding: 12px 16px; border-left: 5px solid var(--fl-orange); border-radius: var(--fl-radius-sm); background: #fff; box-shadow: 0 0 0 1px var(--fl-line) inset; font-size: 15px; }
.fl-hive-bar-filter { font-weight: 700; }
.fl-hive-bar-filter[hidden] { display: none; }
.fl-hive-bar-on { flex-basis: 100%; color: var(--fl-muted); }
.fl-hive-form { display: grid; gap: 8px; }
.fl-hive-form p { margin: 0 0 6px; color: var(--fl-muted); }
.fl-hive-option { display: flex; align-items: center; gap: 12px; min-height: 48px; margin: 0; padding: 8px 14px; border: 1px solid var(--fl-line-strong); border-radius: var(--fl-radius-sm); font-weight: 600; cursor: pointer; }
.fl-hive-option:has(input:checked) { border-color: var(--fl-action); box-shadow: 0 0 0 1px var(--fl-action) inset; background: var(--fl-soft); }
.fl-hive-option input { width: 18px; height: 18px; margin: 0; accent-color: var(--fl-action); }
.fl-hive-form .fl-btn { margin-top: 8px; min-height: 48px; }
.fl-hive-cart { margin: 4px 0 0; font-size: 13px; font-weight: 600; color: var(--fl-red); }

/* ---------- Shipping cost by postcode ---------- */
.fl-ship-est { display: grid; gap: 8px; margin: 14px 0 0; padding: 14px 16px; border: 1px solid var(--fl-line); border-radius: var(--fl-radius); background: #fff; }
.fl-ship-est-title { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 15px; font-weight: 700; }
.fl-ship-est-title label { margin: 0; }
.fl-ship-est-title .fl-icon { flex: none; color: var(--fl-green); }
.fl-ship-est-row { display: grid; grid-template-columns: minmax(0, 170px) auto; justify-content: start; gap: 8px; }
.fl-ship-est-row .fl-btn { min-height: 46px; }
.fl-ship-est-out { font-size: 15px; }
.fl-ship-est-out:empty { display: none; }
.fl-ship-est-out p { margin: 0 0 4px; }
.fl-ship-est-head { font-size: 16px; }
.fl-ship-est-head strong { color: var(--fl-green-dark); }
.fl-ship-est-head span, .fl-ship-est-note { font-size: 13px; color: var(--fl-muted); }
.fl-ship-est-list { display: grid; gap: 2px; max-width: 360px; margin: 6px 0 8px; padding: 0; list-style: none; }
.fl-ship-est-list li { display: flex; justify-content: space-between; gap: 16px; padding: 5px 0; border-bottom: 1px solid var(--fl-line); font-size: 14px; }
.fl-ship-est.is-error .fl-ship-est-out { font-weight: 600; color: var(--fl-red); }

/* ---------- Calculators ---------- */
.fl-calc { display: grid; gap: 8px; margin: 0 0 16px; padding: 14px 16px; border: 1px solid #f6d9bd; border-radius: var(--fl-radius); background: var(--fl-orange-soft); }
.fl-calc-title { margin: 0; font-size: 15px; font-weight: 700; }
.fl-calc-title label { margin: 0; }
.fl-calc-row { display: flex; flex-wrap: wrap; gap: 8px; }
.fl-calc-row input { width: 170px; }
.fl-calc-row .fl-btn { min-height: 46px; }
.fl-calc-row .fl-btn[hidden], .fl-calc-pair[hidden] { display: none; }
.fl-calc-out { margin: 0; font-size: 15px; font-weight: 600; color: var(--fl-green-dark); }
.fl-calc-out:empty { display: none; }
.fl-calc-pair { margin: 0; font-size: 14px; }
.fl-calc-pair a { font-weight: 700; }
.fl-calc-note { margin: 0; font-size: 13px; color: var(--fl-muted); }

/* ---------- Comparison ---------- */
.fl-compare-bar { position: fixed; left: 50%; bottom: 14px; z-index: 110; transform: translateX(-50%); display: flex; align-items: center; gap: 14px; max-width: calc(100vw - 24px); padding: 8px 16px 8px 8px; border-radius: 999px; background: #fff; box-shadow: 0 0 0 1px var(--fl-line), var(--fl-shadow-lg); }
.fl-compare-bar .fl-btn { min-height: 44px; border-radius: 999px; white-space: nowrap; }
.fl-compare-bar .fl-btn:disabled { background: var(--fl-soft); color: var(--fl-muted); cursor: default; }
.fl-has-sticky-buy .fl-compare-bar { bottom: 84px; }
.fl-compare-scroll { overflow-x: auto; }
.fl-compare-table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 15px; }
.fl-compare-table :is(th, td) { padding: 10px 12px; border-bottom: 1px solid var(--fl-line); text-align: left; vertical-align: top; }
.fl-compare-table thead th { width: 22%; font-weight: 400; }
.fl-compare-table tbody th { width: 150px; font-size: 13px; font-weight: 700; color: var(--fl-muted); }
.fl-compare-product { display: grid; gap: 8px; margin-bottom: 6px; font-weight: 700; line-height: 1.3; color: var(--fl-ink) !important; text-decoration: none; }
.fl-compare-product:hover span { text-decoration: underline; }
.fl-compare-product img { width: 120px; height: 120px; object-fit: contain; border-radius: var(--fl-radius-sm); }
.fl-compare-table tr.is-diff td { font-weight: 700; background: var(--fl-orange-soft); }
.fl-compare-table .fl-compare-buy td { border-bottom: 0; padding-top: 14px; }
.fl-compare-legend { margin: 12px 0 0; font-size: 13px; color: var(--fl-muted); }

/* ---------- Questions and answers ---------- */
.fl-qa { clear: both; margin: 36px 0; }
.fl-qa-list { display: grid; gap: 16px; margin: 0 0 20px; padding: 0; list-style: none; }
.fl-qa-list li { padding: 16px 18px; border: 1px solid var(--fl-line); border-radius: var(--fl-radius); background: #fff; }
.fl-qa-q { margin: 0 0 10px; font-size: 16px; }
.fl-qa-q strong { display: block; }
.fl-qa-list small { display: block; margin-top: 4px; font-size: 13px; font-weight: 400; color: var(--fl-muted); }
.fl-qa-a { padding: 10px 14px; border-left: 4px solid var(--fl-green); border-radius: var(--fl-radius-sm); background: var(--fl-green-soft); }
.fl-qa-a p { margin: 0 0 6px; }
.fl-qa-empty { color: var(--fl-muted); }
.fl-qa-ask > summary { display: inline-flex; list-style: none; cursor: pointer; }
.fl-qa-ask > summary::-webkit-details-marker { display: none; }
.fl-qa-form { display: grid; gap: 12px; max-width: 720px; margin-top: 16px; padding: 18px; border: 1px solid var(--fl-line); border-radius: var(--fl-radius); background: #fff; }
.fl-qa-form p { display: grid; gap: 4px; margin: 0; }
.fl-qa-form label { margin: 0; font-size: 14px; font-weight: 700; }
.fl-qa-fields { display: grid; grid-template-columns: 1fr 2fr; gap: 12px; }
.fl-qa-form .fl-qa-consent { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; font-weight: 400; color: var(--fl-muted); }
.fl-qa-consent input { margin-top: 3px; }
.fl-qa-form .fl-btn { justify-self: start; min-height: 48px; }
.fl-qa-status { font-weight: 600; color: var(--fl-green-dark); }
.fl-qa-status:empty { display: none; }
.fl-qa-form.is-error .fl-qa-status { color: var(--fl-red); }
.fl-qa-form.is-done > :not(.fl-qa-status) { display: none; }

/* ---------- Saved lists ---------- */
.fl-list-picks { display: grid; gap: 8px; margin: 12px 0; }
.fl-list-pick { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 8px 14px; border: 1px solid var(--fl-line-strong); border-radius: var(--fl-radius-sm); background: #fff; font: inherit; color: var(--fl-ink); text-align: left; cursor: pointer; }
.fl-list-pick:hover { border-color: var(--fl-action); }
.fl-list-pick small { font-size: 13px; color: var(--fl-muted); white-space: nowrap; }
.fl-list-pick.is-in { border-color: var(--fl-green); background: var(--fl-green-soft); }
.fl-list-pick.is-in small { font-weight: 700; color: var(--fl-green-dark); }
.fl-list-new { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; margin: 0 0 10px; }
.fl-list-new .fl-btn { min-height: 46px; }
.fl-list-status { margin: 0 0 10px; font-weight: 600; color: var(--fl-green-dark); }
.fl-list-status:empty { display: none; }
.fl-list-cart { margin: 18px 0; padding: 14px 16px; border: 1px solid var(--fl-line); border-radius: var(--fl-radius); background: #fff; font-size: 15px; }
.fl-list-cart p { margin: 0; }
.fl-list-cart label { display: block; margin: 0 0 8px; font-weight: 700; }
.fl-list-cart-row { display: grid; grid-template-columns: minmax(0, 320px) auto; justify-content: start; gap: 8px; }
.fl-list-cart-row .fl-btn { min-height: 46px; }
.fl-list { margin: 0 0 28px; padding: 18px; border: 1px solid var(--fl-line); border-radius: var(--fl-radius); background: #fff; }
.fl-list-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-bottom: 12px; }
.fl-list-head h3 { margin: 0; font-size: 22px; }
.fl-list-head small { margin-left: 6px; font-family: var(--fl-font); font-size: 14px; font-weight: 400; color: var(--fl-muted); }
.fl-list-items { margin: 0 0 12px; padding: 0; list-style: none; }
.fl-list-items li { display: grid; grid-template-columns: 56px minmax(0, 1fr) 84px auto; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid var(--fl-line); }
.fl-list-img img { display: block; width: 56px; height: 56px; object-fit: contain; border-radius: var(--fl-radius-sm); }
.fl-list-name { display: grid; gap: 2px; min-width: 0; }
.fl-list-name a { font-weight: 700; color: var(--fl-ink); text-decoration: none; }
.fl-list-name a:hover { color: var(--fl-link); text-decoration: underline; }
.fl-list-name small { font-size: 13px; color: var(--fl-muted); }
.fl-list-items .is-out .fl-list-name small { color: var(--fl-red); }
.fl-list-items .is-gone { color: var(--fl-muted); }
.fl-list-qty { margin: 0; }
.fl-list-qty input { width: 84px; text-align: center; }
.fl-list-more > summary { font-size: 14px; font-weight: 700; color: var(--fl-link); cursor: pointer; }
.fl-list-more-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 12px; }
.fl-list-more-row label { display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 700; }
.fl-list-delete { color: var(--fl-red); }

/* ---------- Quick order by code ---------- */
.fl-qo { max-width: 760px; }
.fl-qo-form { display: grid; gap: 10px; }
.fl-qo-form label { margin: 0; font-weight: 700; }
.fl-qo-form textarea { width: 100%; font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace; font-size: 16px; line-height: 1.5; }
.fl-qo-help { margin: 0; font-size: 14px; color: var(--fl-muted); }
.fl-qo-form .fl-btn { justify-self: start; min-height: 50px; }
.fl-qo-msg { margin: 0 0 18px; padding: 14px 16px; border-left: 5px solid var(--fl-green); border-radius: var(--fl-radius-sm); background: var(--fl-green-soft); }
.fl-qo-msg.is-error { border-left-color: var(--fl-red); background: var(--fl-red-soft); }
.fl-qo-msg p { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: 0 0 8px; }
.fl-qo-msg ul { margin: 0; padding-left: 20px; }
.fl-qo-msg code { padding: 1px 6px; border-radius: 4px; background: #fff; color: var(--fl-ink); }

/* ---------- BeeNectar feeding scheme ---------- */
.fl-feed { max-width: 860px; margin: 0 auto 36px; }
.fl-feed-title { margin: 0 0 10px; }
.fl-feed-intro { margin: 0 0 6px; font-size: 18px; }
.fl-feed-note { margin: 0 0 22px; font-size: 14px; color: var(--fl-muted); }
.fl-feed-form { display: grid; gap: 18px; }
.fl-feed-step { display: grid; gap: 8px; min-width: 0; margin: 0; padding: 0; border: 0; }
.fl-feed-step[hidden], .fl-feed-option[hidden] { display: none; }
.fl-feed-step legend { margin: 0 0 4px; padding: 0; font-family: var(--fl-display); font-size: 20px; font-weight: 700; color: var(--fl-ink); }
.fl-feed-option { display: flex; align-items: flex-start; gap: 12px; min-height: 48px; margin: 0; padding: 12px 14px; border: 1px solid var(--fl-line-strong); border-radius: var(--fl-radius-sm); background: #fff; font-size: 15px; line-height: 1.4; cursor: pointer; }
.fl-feed-option:hover { border-color: var(--fl-action); }
.fl-feed-option:has(input:checked) { border-color: var(--fl-action); box-shadow: 0 0 0 1px var(--fl-action) inset; background: var(--fl-orange-soft); font-weight: 600; }
.fl-feed-option input { flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--fl-action); }
.fl-feed-actions { margin: 0; }
.fl-feed-actions [hidden] { display: none; }
.fl-feed-out { scroll-margin-top: calc(var(--fl-header-h, 150px) + 12px); margin-top: 22px; }
.fl-feed-out:empty { display: none; }
.fl-feed-error { padding: 12px 14px; border-left: 4px solid var(--fl-red); border-radius: var(--fl-radius-sm); background: var(--fl-red-soft); font-weight: 600; }
.fl-feed-result { padding: 22px; border: 1px solid var(--fl-line); border-top: 4px solid var(--fl-green); border-radius: var(--fl-radius); background: #fff; }
.fl-feed-lead { margin: 0 0 14px; font-weight: 600; }
.fl-feed-scheme ul { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.fl-feed-scheme li { padding: 12px 14px; border-left: 4px solid var(--fl-orange); border-radius: var(--fl-radius-sm); background: var(--fl-soft); line-height: 1.55; }
.fl-feed-scheme a { font-weight: 700; }
.fl-feed-notes { margin: 18px 0 0; padding: 12px 14px; border: 1px solid #f6d9bd; border-radius: var(--fl-radius-sm); background: var(--fl-orange-soft); font-size: 14px; }
.fl-feed-notes p { margin: 6px 0 0; }
.fl-feed-products-title { margin: 24px 0 10px; font-size: 22px; }
.fl-feed-products { margin: 0; padding: 0; list-style: none; }
.fl-feed-products li { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 12px 0; border-top: 1px solid var(--fl-line); }
.fl-feed-img img { display: block; width: 72px; height: 72px; object-fit: contain; border-radius: var(--fl-radius-sm); }
.fl-feed-info { display: grid; gap: 4px; min-width: 0; }
.fl-feed-info > a { font-weight: 700; line-height: 1.3; color: var(--fl-ink) !important; text-decoration: none; }
.fl-feed-info > a:hover { text-decoration: underline; }
.fl-feed-price { font-size: 15px; }
.fl-feed-buy { display: grid; gap: 6px; justify-items: end; text-align: right; }
.fl-feed-buy .added_to_cart { font-size: 14px; font-weight: 700; }
.fl-feed-hint { margin: 10px 0 0; font-size: 13px; color: var(--fl-muted); }
/* Under the price of feeds and syrups. */
.fl-feed-tip { margin: 0 0 14px; padding: 8px 12px; border-left: 4px solid var(--fl-orange); border-radius: var(--fl-radius-sm); background: var(--fl-orange-soft); font-size: 14px; }
.fl-feed-tip a { font-weight: 700; }
/* Line above the products of "Nutrizione". */
.fl-feed-line { margin: 0 0 18px; padding: 12px 16px; border-left: 5px solid var(--fl-orange); border-radius: var(--fl-radius-sm); background: #fff; box-shadow: 0 0 0 1px var(--fl-line) inset; font-size: 15px; }
.fl-feed-line p { margin: 0; }
.fl-feed-line a { font-weight: 700; white-space: nowrap; }

@media (max-width: 600px) {
  .fl-feed-result { padding: 16px; }
  .fl-feed-products li { grid-template-columns: 56px minmax(0, 1fr); }
  .fl-feed-img img { width: 56px; height: 56px; }
  .fl-feed-buy { grid-column: 1 / -1; justify-items: stretch; text-align: left; }
  .fl-qa-fields { grid-template-columns: 1fr; }
  .fl-list-items li { grid-template-columns: 48px minmax(0, 1fr) 72px; }
  .fl-list-items li > .fl-link-btn { grid-column: 2 / -1; justify-self: start; }
  .fl-list-img img { width: 48px; height: 48px; }
  .fl-list-qty input { width: 72px; }
  .fl-compare-bar { gap: 10px; }
  .fl-compare-product img { width: 88px; height: 88px; }
  .fl-tool-dialog-body { padding: 16px; }
}
@media (prefers-reduced-motion: no-preference) {
  .fl-tool-dialog[open] { animation: fl-drop 0.16s ease-out; }
}