/* Food delivery — «заказ к двери»: тёплая кремовая карточка, маршрут как главное блюдо. */
.fd-app {
  --fd-bg: #fff7ee;
  --fd-card: #ffffff;
  --fd-ink: #2b2018;
  --fd-muted: #8a7563;
  --fd-line: #eeddc9;
  --fd-tomato: #d9482f;
  --fd-tomato-deep: #b23a24;
  --fd-basil: #2e7d46;
  --fd-basil-bg: #e6f3e9;
  --fd-peach: #ffe9d6;
  --fd-focus: #2e7d46;
  background: var(--fd-bg);
  border: 1px solid var(--fd-line);
  border-radius: 28px;
  color: var(--fd-ink);
  padding: clamp(16px, 3vw, 30px);
  display: grid;
  gap: 16px;
  justify-items: center;
  font-variant-numeric: tabular-nums;
}
html[data-theme="dark"] .fd-app {
  --fd-bg: #1f1410;
  --fd-card: #2a1d16;
  --fd-ink: #f7ece0;
  --fd-muted: #b99f88;
  --fd-line: #4a3628;
  --fd-tomato: #ff7a5c;
  --fd-tomato-deep: #ff7a5c;
  --fd-basil: #7fd79a;
  --fd-basil-bg: #1c3324;
  --fd-peach: #3a2718;
  --fd-focus: #7fd79a;
}
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) .fd-app {
    --fd-bg: #1f1410;
    --fd-card: #2a1d16;
    --fd-ink: #f7ece0;
    --fd-muted: #b99f88;
    --fd-line: #4a3628;
    --fd-tomato: #ff7a5c;
    --fd-tomato-deep: #ff7a5c;
    --fd-basil: #7fd79a;
    --fd-basil-bg: #1c3324;
    --fd-peach: #3a2718;
    --fd-focus: #7fd79a;
  }
}
.fd-role { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; width: min(520px, 100%); background: var(--fd-peach); border-radius: 999px; padding: 6px; }
.fd-role label { cursor: pointer; }
.fd-role input { position: absolute; opacity: 0; pointer-events: none; }
.fd-role span { color: var(--fd-ink); display: flex; align-items: center; justify-content: center; min-height: 48px; border-radius: 999px; font-weight: 850; font-size: 1rem; }
.fd-role input:checked + span { background: var(--fd-card); color: var(--fd-ink); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12); }
.fd-role input:focus-visible + span { outline: 3px solid var(--fd-focus); outline-offset: 2px; }
.fd-panel { width: min(640px, 100%); display: grid; gap: 14px; }
.fd-panel[hidden] { display: none; }
.fd-card { background: var(--fd-card); border: 1px solid var(--fd-line); border-radius: 22px; padding: clamp(16px, 3vw, 24px); display: grid; gap: 14px; }
.fd-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.fd-field { display: grid; gap: 6px; font-size: 0.86rem; font-weight: 700; color: var(--fd-muted); }
.fd-field input, .fd-field select { min-height: 48px; width: 100%; padding: 10px 14px; border: 2px solid var(--fd-line); border-radius: 14px; background: var(--fd-bg); color: var(--fd-ink); font: inherit; font-size: 1.05rem; font-weight: 800; }
.fd-field input[aria-invalid="true"] { border-color: var(--fd-tomato); }
.fd-sub { font-size: 0.8rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--fd-muted); }
.fd-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.fd-pills label { cursor: pointer; }
.fd-pills input { position: absolute; opacity: 0; pointer-events: none; }
.fd-pills span { color: var(--fd-ink); display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border: 2px solid var(--fd-line); border-radius: 999px; font-weight: 800; font-size: 0.92rem; }
.fd-pills input:checked + span { border-color: var(--fd-tomato); background: var(--fd-peach); }
.fd-pills input:focus-visible + span { outline: 3px solid var(--fd-focus); outline-offset: 2px; }
.fd-hint { margin: 0; font-size: 0.86rem; color: var(--fd-muted); }
.fd-error { margin: 0; padding: 12px 16px; border-radius: 14px; background: var(--fd-peach); color: var(--fd-tomato-deep); font-weight: 800; font-size: 0.94rem; }
.fd-outcome { display: grid; gap: 12px; }
.fd-hero { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 12px; }
.fd-hero-price, .fd-hero-time { border-radius: 22px; padding: 18px; display: grid; gap: 2px; align-content: start; }
.fd-hero-price { background: var(--fd-tomato); color: #fff; }
html[data-theme="dark"] .fd-hero-price { background: #a33a26; color: #fff5ec; }
.fd-hero--pay .fd-hero-price { background: var(--fd-basil); }
html[data-theme="dark"] .fd-hero--pay .fd-hero-price { background: #236135; color: #eefbef; }
.fd-hero-time { background: var(--fd-card); border: 1px solid var(--fd-line); }
.fd-hero-label { font-size: 0.78rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; opacity: 0.85; }
.fd-hero-num { font-size: clamp(2rem, 7vw, 2.8rem); font-weight: 900; letter-spacing: -0.03em; line-height: 1.05; }
.fd-hero-num--time { color: var(--fd-tomato); }
.fd-hero--pay .fd-hero-num--time { color: var(--fd-basil); }
.fd-hero-sub { font-weight: 700; font-size: 0.92rem; opacity: 0.92; }
.fd-journey { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.fd-stage { background: var(--fd-card); border: 1px solid var(--fd-line); border-radius: 16px; padding: 10px 8px; text-align: center; display: grid; gap: 2px; }
.fd-stage b { font-size: 1.05rem; }
.fd-stage span { font-size: 0.76rem; font-weight: 700; color: var(--fd-muted); }
.fd-stage--go { border-color: var(--fd-tomato); }
.fd-stage--go b { color: var(--fd-tomato); }
.fd-progress { background: var(--fd-card); border: 1px solid var(--fd-line); border-radius: 16px; padding: 14px 16px; display: grid; gap: 8px; font-weight: 700; font-size: 0.94rem; }
.fd-progress-bar { height: 12px; border-radius: 999px; background: var(--fd-peach); overflow: hidden; }
.fd-progress-bar i { display: block; height: 100%; border-radius: 999px; background: var(--fd-basil); }
.fd-progress--free { border-color: var(--fd-basil); background: var(--fd-basil-bg); }
.fd-lines { list-style: none; margin: 0; padding: 6px 18px 12px; background: var(--fd-card); border: 1px solid var(--fd-line); border-radius: 16px; display: grid; }
.fd-lines li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px dashed var(--fd-line); font-weight: 600; }
.fd-lines li:last-child { border-bottom: 0; }
.fd-lines b { white-space: nowrap; }
.fd-empty { border: 2px dashed var(--fd-line); border-radius: 22px; padding: 30px 22px; text-align: center; display: grid; gap: 14px; justify-items: center; color: var(--fd-muted); }
.fd-empty p { margin: 0; max-width: 440px; }
.fd-btn { min-height: 48px; padding: 10px 22px; border-radius: 999px; border: 2px solid var(--fd-line); background: var(--fd-card); color: var(--fd-ink); font: inherit; font-weight: 850; cursor: pointer; }
.fd-btn--primary { background: var(--fd-ink); color: var(--fd-bg); border-color: var(--fd-ink); }
.fd-method { margin: 0; width: min(640px, 100%); font-size: 0.82rem; color: var(--fd-muted); }
.fd-field input:focus-visible, .fd-field select:focus-visible, .fd-btn:focus-visible { outline: 3px solid var(--fd-focus); outline-offset: 2px; }

@media (max-width: 560px) {
  .fd-grid { grid-template-columns: 1fr 1fr; }
  .fd-hero { grid-template-columns: 1fr; }
  .fd-journey { grid-template-columns: repeat(4, 1fr); gap: 6px; }
  .fd-stage { padding: 8px 4px; }
  .fd-stage b { font-size: 0.95rem; }
  .fd-stage span { font-size: 0.68rem; }
}

#js-tool-container-food-delivery-cost-calculator [hidden]{display:none!important}

/* ===== ToolBoss site adapter: integration only, the app design above is shipped as built ===== */
#js-tool-container-food-delivery-cost-calculator:not(.tb-focus-mode){background:transparent!important;border:none!important;box-shadow:none!important;padding:0!important;border-radius:0!important;}
#js-tool-container-food-delivery-cost-calculator .js-premium-app-html-content{background:transparent!important;}
#js-tool-container-food-delivery-cost-calculator:has(.tb-presets-drawer) .fd-app{margin-top:20px;}
#js-tool-container-food-delivery-cost-calculator [hidden]{display:none!important;}
#js-tool-container-food-delivery-cost-calculator .fd-app{border-bottom-left-radius:0;border-bottom-right-radius:0;}
#js-tool-container-food-delivery-cost-calculator .fd-field select{min-height:48px;width:100%;padding:10px 14px!important;border:2px solid var(--fd-line)!important;border-radius:14px!important;background:var(--fd-bg)!important;color:var(--fd-ink)!important;font-size:1.05rem!important;font-weight:800!important;}
#js-tool-container-food-delivery-cost-calculator .fd-app input[aria-invalid="true"]{border-color:var(--fd-tomato)!important;}