/* ================================================================
   MILLS FEED CHART — Session 1+ additions.
   Layered ON TOP of styles/pages.css (which holds the original
   .fc-* rules). Only NEW selectors go here.
   ================================================================ */

/* ---- Tank preset pills ---- */
.fc-preset-pills {
  display: inline-flex;
  gap: 0;
  border: var(--stroke-thin) solid var(--ink);
  background: var(--cream);
}
.fc-preset-pill {
  padding: 10px 16px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-xs);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  background: transparent;
  color: var(--ink);
  border: 0;
  border-right: var(--stroke-hair) solid var(--ink-30);
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
  min-width: 56px;
}
.fc-preset-pill:last-child { border-right: 0; }
.fc-preset-pill:hover { background: var(--ink-10); }
.fc-preset-pill[aria-pressed="true"] {
  background: var(--red);
  color: var(--cream);
}
.fc-preset-pill--custom { min-width: 90px; }

/* Custom input wrapper now shows inline next to pills when relevant */
#fc-custom-wrap[hidden] { display: none; }

/* ---- Cost section ---- */
.fc-cost-section {
  padding-block: var(--space-8);
  background: var(--cream-deep);
  border-block: var(--stroke-chunk) solid var(--ink);
}
.fc-cost-head { margin-bottom: var(--space-5); }
.fc-cost-eyebrow {
  display: block;
  font-family: var(--font-display);
  font-size: var(--fs-xs);
  letter-spacing: var(--tracking-ultra);
  text-transform: uppercase;
  color: var(--red);
  margin-bottom: var(--space-2);
}
.fc-cost-title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(var(--fs-xl), 4vw, var(--fs-2xl));
  line-height: var(--lh-tight);
  margin: 0;
  max-width: 24ch;
}
.fc-cost-title em { font-style: normal; color: var(--red); }

.fc-cost-week-select {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-5);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-sm);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
}
.fc-cost-week-select__input {
  padding: 8px 12px;
  border: var(--stroke-thin) solid var(--ink);
  background: var(--cream);
  font-family: var(--font-mono);
  font-size: var(--fs-sm);
  cursor: pointer;
}

.fc-cost-output {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-4);
  padding: var(--space-5);
  background: var(--cream);
  border: var(--stroke-thin) solid var(--ink);
  margin-bottom: var(--space-4);
}
@media (max-width: 760px) { .fc-cost-output { grid-template-columns: 1fr; } }

.fc-cost-metric { display: flex; flex-direction: column; gap: 4px; }
.fc-cost-metric__label {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  text-transform: uppercase;
  letter-spacing: var(--tracking-wide);
  color: var(--ink-60);
}
.fc-cost-metric__value {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(var(--fs-xl), 4vw, var(--fs-3xl));
  color: var(--ink);
  line-height: var(--lh-tight);
}
.fc-cost-metric__sub {
  font-size: var(--fs-xs);
  color: var(--ink-60);
  min-height: 1em;
}

.fc-cost-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: 6px 14px;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  background: var(--ink-10);
  color: var(--ink-80);
  border-radius: var(--r-pill);
  margin: 0 0 var(--space-4);
}
.fc-cost-badge--commercial {
  background: var(--green-soft);
  color: var(--green-live);
}
.fc-cost-badge--commercial::before { content: "✓ "; }

/* ---- Cost inputs (plant count + days) ---- */
.fc-cost-inputs {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  margin-bottom: var(--space-5);
}
.fc-cost-input-row {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  flex-wrap: wrap;
}
.fc-cost-input-row label {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-xs);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--ink-80);
  min-width: 180px;
}

/* ---- Quote source toggle + editable prices ---- */
.fc-quote-toggle {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  flex-wrap: wrap;
  margin-bottom: var(--space-4);
}
.fc-quote-toggle__label {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-xs);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--ink-80);
}

.fc-quote-prices {
  background: var(--cream);
  border: var(--stroke-thin) solid var(--ink);
  padding: var(--space-5);
  margin-bottom: var(--space-4);
}
.fc-quote-prices__hint {
  font-size: var(--fs-sm);
  color: var(--ink-80);
  margin: 0 0 var(--space-4);
}
.fc-quote-prices__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-3);
}
@media (max-width: 760px) { .fc-quote-prices__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .fc-quote-prices__grid { grid-template-columns: 1fr; } }
.fc-quote-prices__grid label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-sm);
}
.fc-quote-prices__unit {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--ink-60);
  font-weight: 500;
}
.fc-quote-prices__grid input {
  padding: 8px 12px;
  font-family: var(--font-mono);
  font-size: var(--fs-sm);
  border: var(--stroke-thin) solid var(--ink);
  background: var(--cream-deep);
}

.fc-cost-cta {
  background: var(--ink);
  color: var(--cream);
  padding: var(--space-6);
  text-align: center;
  margin-top: var(--space-4);
}
.fc-cost-cta p {
  color: rgba(246, 241, 230, 0.8);
  max-width: 56ch;
  margin: 0 auto var(--space-4);
}
.fc-cost-cta em { font-style: normal; color: var(--red); }

/* ================================================================
   DISCLAIMER BANNER — sticky top, only visible when body.has-edits
   ================================================================ */
.fc-disclaimer-banner {
  display: none;
  position: sticky;
  top: 0;
  z-index: 50;
  padding: var(--space-3) var(--space-4);
  background: #fff5cc;
  color: var(--ink);
  border-bottom: var(--stroke-chunk) solid #d97706;
  font-size: var(--fs-sm);
  line-height: var(--lh-relaxed);
}
body.has-edits .fc-disclaimer-banner { display: flex; gap: var(--space-3); align-items: flex-start; }
.fc-disclaimer-banner__icon { font-size: 1.4em; line-height: 1; flex-shrink: 0; }
.fc-disclaimer-banner__text { flex: 1; }
.fc-disclaimer-banner__text strong { font-weight: 800; text-transform: uppercase; }
.fc-disclaimer-banner__reset {
  margin-left: var(--space-3);
  padding: var(--space-2) var(--space-3);
  background: var(--red);
  color: var(--cream);
  border: none;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.fc-disclaimer-banner__reset:hover { background: var(--red-deep); }
.fc-disclaimer-banner__close {
  margin-left: var(--space-2);
  padding: 0 var(--space-2);
  background: transparent;
  color: var(--ink-60);
  border: none;
  font-size: 1.2em;
  cursor: pointer;
}

/* ================================================================
   FIRST-EDIT MODAL — covers viewport, brand-styled, one-time
   ================================================================ */
.fc-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(19, 31, 55, 0.7);
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4);
}
.fc-modal-backdrop[hidden] { display: none; }
.fc-modal {
  background: var(--cream);
  border: var(--stroke-chunk) solid var(--ink);
  max-width: 480px;
  padding: var(--space-5);
}
.fc-modal__title {
  font-family: var(--font-display);
  font-size: var(--fs-lg);
  text-transform: uppercase;
  margin: 0 0 var(--space-3);
  color: var(--red);
}
.fc-modal__body { margin: 0 0 var(--space-4); line-height: var(--lh-relaxed); color: var(--ink-80); }
.fc-modal__actions { display: flex; gap: var(--space-3); justify-content: flex-end; }
.fc-modal__btn {
  padding: var(--space-3) var(--space-4);
  font-weight: 700;
  cursor: pointer;
  border: var(--stroke-chunk) solid var(--ink);
  background: var(--cream);
  color: var(--ink);
}
.fc-modal__btn--primary { background: var(--ink); color: var(--cream); }

/* ================================================================
   EDIT MODE — toolbar button + editable cell + edited badge
   ================================================================ */
.fc-toolbar { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.fc-toolbar__btn {
  padding: var(--space-2) var(--space-3);
  background: var(--cream);
  border: var(--stroke-chunk) solid var(--ink);
  font-weight: 700;
  cursor: pointer;
}
.fc-toolbar__btn[aria-pressed="true"] { background: var(--ink); color: var(--cream); }

body.fc-edit-on .fc-chart__dose:not(.fc-chart__dose--flush) { cursor: pointer; outline: 1px dashed var(--ink-40); outline-offset: -2px; }
body.fc-edit-on .fc-chart__dose:hover:not(.fc-chart__dose--flush) { background: #fff5cc; }
.fc-chart__dose[data-edited="true"] { position: relative; }
.fc-chart__dose[data-edited="true"]::after {
  content: '';
  position: absolute;
  top: 4px;
  right: 4px;
  width: 6px;
  height: 6px;
  background: var(--red);
  border-radius: 50%;
}
.fc-edit-input {
  /* Fill the dose cell so 3-char values like "1.2" or "120" stay visible */
  width: 100%;
  box-sizing: border-box;
  min-width: 0;
  padding: 2px;
  font: inherit;
  text-align: center;
  border: 1px solid var(--ink);
}

/* ================================================================
   MOBILE SWIPE — week-zoom view, viewport ≤ 760px
   ================================================================ */
.fc-mobile-toggle { display: none; }
@media (max-width: 760px) {
  .fc-mobile-toggle { display: flex; gap: var(--space-2); margin-bottom: var(--space-3); }
  body.fc-mode-zoom .fc-chart__table { display: none; }
  body.fc-mode-full .fc-week-card { display: none; }
}
.fc-week-card {
  display: none;
  padding: var(--space-4);
  background: var(--cream-deep);
  border: var(--stroke-chunk) solid var(--ink);
}
@media (max-width: 760px) {
  body.fc-mode-zoom .fc-week-card { display: block; }
}
.fc-week-card__nav { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--space-3); }
.fc-week-card__pager { display: flex; gap: 4px; flex: 1; justify-content: center; }
.fc-week-card__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ink-20); cursor: pointer; }
.fc-week-card__dot[data-phase="veg"] { background: var(--blue); }
.fc-week-card__dot[data-phase="bloom"] { background: var(--red); }
.fc-week-card__dot[aria-current="true"] { transform: scale(1.5); }
.fc-week-card__title { font-family: var(--font-display); text-transform: uppercase; font-size: var(--fs-lg); margin: 0 0 var(--space-2); }
.fc-week-card__targets { font-family: var(--font-mono); font-size: var(--fs-sm); color: var(--ink-60); margin-bottom: var(--space-3); }
.fc-week-card__doses { list-style: none; padding: 0; margin: 0 0 var(--space-3); }
.fc-week-card__doses li { display: flex; justify-content: space-between; padding: var(--space-2) 0; border-bottom: 1px solid var(--ink-20); }
.fc-week-card__total { padding-top: var(--space-3); border-top: var(--stroke-chunk) solid var(--ink); font-family: var(--font-mono); font-size: var(--fs-sm); }

/* ================================================================
   PRINT — driven by body.print-quick or body.print-station
   ================================================================ */
.fc-print-disclaimer {
  display: none;
  padding: 8pt 12pt;
  border: 2pt solid #c00;
  background: #fee;
  color: #000;
  font-size: 10pt;
  line-height: 1.4;
  margin-bottom: 8pt;
}

#fc-print-station-pages { display: none; }

@media print {
  /* Hide site chrome on every print layout */
  body > header.site-header,
  body > footer.site-footer,
  .site-header, .site-footer,
  .fc-toolbar,
  .fc-disclaimer-banner,
  .fc-modal-backdrop,
  .fc-week-card,
  .fc-mobile-toggle { display: none !important; }

  body { background: #fff; color: #000; font-size: 10pt; }

  /* Quick-reference disclaimer — one copy at top of page */
  body.print-quick.has-edits .fc-print-disclaimer { display: block; }
  body.print-quick #fc-print-station-pages { display: none; }

  /* Quick reference: A4 landscape, single page */
  body.print-quick @page { size: A4 landscape; margin: 12mm; }
  body.print-quick .fc-chart { page-break-inside: avoid; }
  /* Force the table visible even if mobile-zoom mode was active */
  body.print-quick .fc-chart__table { display: table !important; width: 100%; font-size: 8.5pt; }
  body.print-quick .fc-chart__table th,
  body.print-quick .fc-chart__table td { padding: 3pt 4pt; border: 0.5pt solid #999; }

  /* Mixing-station: A4 portrait, hide everything except station-pages */
  body.print-station @page { size: A4 portrait; margin: 14mm; }
  body.print-station > * { display: none !important; }
  body.print-station #fc-print-station-pages { display: block !important; }
  body.print-station .fc-print-page {
    page-break-after: always;
    page-break-inside: avoid;
    min-height: 245mm;
    display: flex;
    flex-direction: column;
  }
  body.print-station .fc-print-page:last-child { page-break-after: auto; }
  /* Disclaimer prints at top of every station page if edits exist */
  body.print-station.has-edits .fc-print-page .fc-print-disclaimer { display: block; }
  body.print-station .fc-print-page__header h2 {
    font-size: 18pt;
    margin: 8pt 0 4pt;
    text-transform: uppercase;
  }
  body.print-station .fc-print-page__tank { font-size: 11pt; margin: 0 0 8pt; }
  body.print-station .fc-print-page__doses { width: 100%; border-collapse: collapse; margin-bottom: 12pt; }
  body.print-station .fc-print-page__doses th,
  body.print-station .fc-print-page__doses td { padding: 6pt 10pt; border-bottom: 0.5pt solid #999; text-align: left; font-size: 12pt; }
  body.print-station .fc-print-page__signoff { margin-top: auto; padding: 12pt 0; border-top: 1pt dashed #999; font-size: 10pt; }
  body.print-station .fc-print-page__footer { padding-top: 6pt; font-size: 8pt; color: #666; text-align: center; }
}
