/* FJN System — E1-02a „Opcje dodatkowe” (D172, SPEC 1.149): „Dodatkowe prace” as added works and
   „+” buttons, „Dla lakiernika”, „Do oferty”. Loaded after fjn-quotes-quick.css. */
.fjn-quick__opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--fjn-sp-5) var(--fjn-sp-4); align-items: start; }
.fjn-quick__sec { display: flex; flex-direction: column; gap: var(--fjn-sp-2); min-width: 0; }
.fjn-quick__sec--works { grid-column: 1 / -1; }
.fjn-quick__caption { margin: 0; color: var(--fjn-text-2); font-size: 13px; font-weight: var(--fjn-fw-bold); letter-spacing: .06em; text-transform: uppercase; }

/* Added works: a row with the price, „Zmień”, „×”; the open one with its settings and „Gotowe” */
.fjn-quick__work { gap: 0; padding: 10px var(--fjn-sp-4); }
.fjn-quick__work.is-open { gap: var(--fjn-sp-3); padding: var(--fjn-sp-4); border-color: var(--fjn-brand-600); }
.fjn-quick__work-head { display: flex; align-items: center; gap: var(--fjn-sp-3); min-height: 44px; }
.fjn-quick__work-head > .fjn-quick__row-text { flex: 1; }
.fjn-quick__work-head b { font-size: 16px; }
.fjn-quick__work.is-open .fjn-quick__work-head b { font-size: 17px; }
.fjn-quick__work-head .fjn-small { color: var(--fjn-text-2); }
.fjn-quick__work-price { font-weight: 700; white-space: nowrap; }
.fjn-quick__work-body { display: flex; flex-direction: column; gap: 10px; }
.fjn-quick__work-body[hidden] { display: none; }
.fjn-quick__link { padding: 8px 4px; border: 0; background: none; color: var(--fjn-brand-600); font-size: 16px; font-weight: var(--fjn-fw-bold); cursor: pointer; }
.fjn-quick__link:focus-visible { outline: none; box-shadow: var(--fjn-focus-btn); border-radius: 4px; }
.fjn-quick__done { width: 100%; height: 56px; font-size: 16px; }
.fjn-quick__addgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--fjn-sp-2); }
.fjn-quick__addwork {
  display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 0 var(--fjn-sp-4); min-width: 0;
  border: 1px solid var(--fjn-border-strong); border-radius: var(--fjn-r-lg); background: var(--fjn-surface);
  color: var(--fjn-brand-600); font-size: 15px; font-weight: var(--fjn-fw-bold); text-align: left; cursor: pointer;
}
.fjn-quick__addwork .fjn-icon { flex: none; color: var(--fjn-text); }
.fjn-quick__addwork:hover { background: var(--fjn-brand-50); }
.fjn-quick__addwork:focus-visible { outline: none; box-shadow: var(--fjn-focus-btn); }
.fjn-quick__addwork--wide { grid-column: span 2; }

/* Straightening per rim: „F2 … 120,00” over three grades */
.fjn-quick__rim { display: flex; flex-direction: column; gap: 6px; }
.fjn-quick__rim-head { display: flex; align-items: baseline; gap: 6px; margin: 4px 0 0; font-size: 16px; }
.fjn-quick__rim-head .fjn-mono { margin-left: auto; font-weight: 700; }
.fjn-quick__rim .fjn-quick__tile > span { padding: 0 4px; font-size: 14px; font-weight: var(--fjn-fw-regular); }
.fjn-quick__rim .fjn-quick__tile input:checked + span { font-weight: var(--fjn-fw-bold); }
.fjn-quick__work .fjn-quick__tiles .fjn-quick__tile > span { min-height: 56px; }

/* Tyres */
.fjn-quick__aside { align-items: flex-start; min-height: 44px; gap: 12px; }

/* Photos + comment, document + client */
.fjn-quick__add { height: 56px; }
.fjn-quick__photos .fjn-quick__thumb { width: 56px; height: 56px; }
.fjn-quick__client-row { display: flex; align-items: center; justify-content: space-between; gap: var(--fjn-sp-3); list-style: none; cursor: pointer; }
.fjn-quick__client-row::-webkit-details-marker { display: none; }
.fjn-quick__client-row:focus-visible { outline: none; box-shadow: var(--fjn-focus-btn); border-radius: 8px; }
.fjn-quick__client[open] > .fjn-quick__client-row { margin-bottom: var(--fjn-sp-3); }
.fjn-quick__client { display: flex; flex-direction: column; gap: 10px; }
.fjn-quick__client-add { flex: none; height: 56px; }

@media (max-width: 767px) {
  .fjn-quick__opts { grid-template-columns: minmax(0, 1fr); }
  .fjn-quick__addgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fjn-quick__addwork--wide { grid-column: 1 / -1; }
}
@media (min-width: 768px) {
  /* tablet / computer: „+” buttons above the works, under the caption */
  .fjn-quick__sec--works .fjn-quick__addgrid { order: -1; }
  .fjn-quick__sec--works .fjn-quick__caption { order: -2; }
}
.fjn-quick__bar-sum--d172 span { font-size: 13px; }
.fjn-quick__bar-sum--d172 b { font-size: 22px; }

/* Right column of „Opcje dodatkowe” (tablet, computer): lines grouped by work (SPEC 1.151) */
.fjn-quick__sum--works { min-height: calc(100vh - 120px); }
.fjn-quick__sum--works .fjn-quick__sum-line { padding-bottom: var(--fjn-sp-3); border-bottom: 1px solid var(--fjn-surface-2); }
.fjn-quick__sum-dl { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px var(--fjn-sp-4); margin: auto 0 0; font-size: 14px; }
.fjn-quick__sum-dl dt { color: var(--fjn-text-2); }
.fjn-quick__sum-dl dd { margin: 0; text-align: right; white-space: nowrap; }
.fjn-quick__sum-dl .fjn-quick__sum-gross { margin-top: 4px; color: var(--fjn-text); font-size: 18px; font-weight: 700; }

/* List with search and an arrow (fjn-pick.js): tyre width, profile, diameter, index */
.fjn-tpick { position: relative; }
.fjn-tpick__input { padding-right: 40px; cursor: pointer; }
.fjn-tpick__input--prefix { padding-left: 23px; }
.fjn-tpick__input--prefix:placeholder-shown + .fjn-tpick__prefix { display: none; }
.fjn-tpick__prefix { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); font-family: var(--fjn-font-mono); pointer-events: none; }
.fjn-tpick__toggle { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); display: flex; padding: 8px; border: 0; background: none; color: var(--fjn-text); cursor: pointer; }
.fjn-tpick__panel {
  position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 20; min-width: 220px; overflow: hidden;
  border: 1px solid var(--fjn-border); border-radius: 8px; background: var(--fjn-surface); box-shadow: var(--fjn-shadow-2, 0 6px 18px rgba(0, 0, 0, .14));
}
.fjn-tpick__panel[hidden] { display: none; }
.fjn-tpick__search { display: flex; align-items: center; gap: 8px; padding: 0 12px; border-bottom: 1px solid var(--fjn-surface-2); color: var(--fjn-text-2); }
.fjn-tpick__q { flex: 1; min-width: 0; height: 44px; border: 0; background: none; font: 15px var(--fjn-font-mono); color: var(--fjn-text); }
.fjn-tpick__q:focus, .fjn-tpick__q:focus-visible { outline: none; border: 0; box-shadow: none; }
.fjn-tpick__list { max-height: 240px; margin: 0; padding: 0; overflow-y: auto; list-style: none; }
.fjn-tpick__option { display: flex; align-items: baseline; gap: 10px; min-height: 44px; padding: 12px; cursor: pointer; }
.fjn-tpick__option b { font: 700 15px var(--fjn-font-mono); }
.fjn-tpick__option span { font: 13px var(--fjn-font-mono); color: var(--fjn-text-2); }
.fjn-tpick__option.is-active, .fjn-tpick__option:hover { background: var(--fjn-brand-50); }
.fjn-quick__work .fjn-tpick__panel { min-width: 240px; }
.fjn-quick__fields--tyre > :nth-child(3) .fjn-tpick__panel, .fjn-quick__fields--tyre > :nth-child(4) .fjn-tpick__panel { left: auto; right: 0; }

/* D174: welding tiles F1-F4 (M 2 x 2, T/K 4 in a row) */
.fjn-quick__welds { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--fjn-sp-2); }
.fjn-quick__weld { position: relative; cursor: pointer; }
.fjn-quick__weld input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.fjn-quick__weld-box {
  display: grid; grid-template-columns: 1fr auto; align-content: space-between; gap: 2px 8px; min-height: 88px; padding: 10px 12px;
  border: 1px solid var(--fjn-border-strong); border-radius: var(--fjn-r-lg); background: var(--fjn-surface);
}
.fjn-quick__weld-box > .fjn-small, .fjn-quick__weld-sum { grid-column: 1 / -1; }
.fjn-quick__weld-box > .fjn-small { color: var(--fjn-text-2); }
.fjn-quick__weld-pos { font-size: 17px; }
.fjn-quick__weld-check { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border: 1.5px solid var(--fjn-border-strong); border-radius: 4px; color: transparent; }
.fjn-quick__weld-sum { font-size: 15px; color: var(--fjn-text-2); }
.fjn-quick__weld input:checked + .fjn-quick__weld-box { border: 2px solid var(--fjn-brand-600); padding: 9px 11px; background: var(--fjn-brand-50); }
.fjn-quick__weld input:checked + .fjn-quick__weld-box .fjn-quick__weld-pos { color: var(--fjn-brand-600); }
.fjn-quick__weld input:checked + .fjn-quick__weld-box .fjn-quick__weld-check { border-color: var(--fjn-brand-600); background: var(--fjn-brand-600); color: var(--fjn-text-inverse); }
.fjn-quick__weld input:checked + .fjn-quick__weld-box .fjn-quick__weld-sum { color: var(--fjn-text); }
.fjn-quick__weld input:focus-visible + .fjn-quick__weld-box { box-shadow: var(--fjn-focus-btn); }
@media (max-width: 767px) { .fjn-quick__welds { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* D174: tyres card — fitting box, type / valve lists with a price on the right, separators */
.fjn-quick__fitbox { display: flex; align-items: center; justify-content: space-between; gap: var(--fjn-sp-3); padding: 12px 14px; border-radius: 8px; background: var(--fjn-surface-2); }
.fjn-quick__fitbox .fjn-small { color: var(--fjn-text-2); }
.fjn-quick__sep { width: 100%; margin: 4px 0; border: 0; border-top: 1px solid var(--fjn-surface-2); }
.fjn-quick__fields--names { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fjn-quick__fields--tyre { grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.5fr); }
.fjn-tpick--search .fjn-tpick__input { padding-left: 40px; }
.fjn-tpick__lead { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); display: flex; color: var(--fjn-text-2); pointer-events: none; }
.fjn-tpick--side .fjn-tpick__input { padding-right: 150px; }
.fjn-tpick__side { position: absolute; right: 40px; top: 50%; transform: translateY(-50%); font-weight: 700; pointer-events: none; white-space: nowrap; }
@media (max-width: 767px) {
  .fjn-quick__fields--names { grid-template-columns: minmax(0, 1fr); }
  .fjn-quick__fields--tyre { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fjn-quick__fields--tyre > :nth-child(4) { grid-column: 1 / -1; }
}
.fjn-tpick__none { padding: 10px 12px 4px; font-size: 13px; color: var(--fjn-text-2); }
.fjn-tpick__use b { color: var(--fjn-brand-600); }
.fjn-tpick__use kbd { margin-left: auto; padding: 1px 6px; border: 1px solid var(--fjn-border-strong); border-radius: 4px; font: 12px var(--fjn-font-mono); }
.fjn-tpick__option[aria-selected="true"] b { color: var(--fjn-brand-600); }
.fjn-tpick__option[aria-selected="true"]::after { content: "\2713"; margin-left: auto; color: var(--fjn-brand-600); }
.fjn-tpick__foot { margin: 0; padding: 8px 12px 10px; border-top: 1px solid var(--fjn-surface-2); font-size: 12px; line-height: 17px; color: var(--fjn-text-2); }
.fjn-tpick__foot:empty { display: none; }
/* D175: „← Szybka wycena” before the title (K, T); no „Gotowe” in the cards on K and T */
.fjn-quick__backbtn { height: 48px; }
.fjn-quick__headsep { align-self: stretch; width: 1px; background: var(--fjn-border); }
@media (min-width: 768px) { .fjn-quick__work .fjn-quick__done { display: none; } }
.fjn-quick--options .fjn-quick__head { align-items: center; }
.fjn-tpick--search .fjn-tpick__option b { font-family: var(--fjn-font-sans, inherit); font-weight: 400; }
.fjn-tpick--search .fjn-tpick__option[aria-selected="true"] b { font-weight: 700; }
.fjn-tpick--search .fjn-tpick__option span { margin-left: auto; font-weight: 700; }
.fjn-quick__work-none { font-size: 14px; color: var(--fjn-text-2); white-space: nowrap; }
