/* Batch and Bite rows D and G (cards #3 and #6 on its board): the request
   form, a request's page for the Customer and for the baker, and the
   Dashboard's requests. Colours, cards, fields and buttons are shop.css's and
   checkout.css's; only the layout is here. */

.request-page { max-width: var(--sf-content, 46rem); }
.request-form fieldset { min-width: 0; }
.request-sent h2 { margin: 0 0 var(--space-2); }
.request-words { white-space: pre-wrap; overflow-wrap: anywhere; margin: 0 0 var(--space-3); }

.dashboard-request-list { list-style: none; margin: 0 0 var(--space-3); padding: 0; }
.dashboard-request-list li { border-top: 1px solid var(--line); padding: var(--space-2) 0; overflow-wrap: anywhere; }
.dashboard-request-list li:first-child { border-top: 0; padding-top: 0; }
.dashboard-request-list a { display: inline-flex; align-items: center; min-height: var(--control-h); margin-right: var(--space-2); font-weight: var(--weight-label); }

.request-messages { list-style: none; margin: 0; padding: 0; }
.request-message { border-top: 1px solid var(--line); padding: var(--space-3) 0; min-width: 0; }
.request-message:first-child { border-top: 0; padding-top: 0; }
.request-message-mine { padding-left: var(--space-3); box-shadow: inset 3px 0 0 var(--brand); }
.request-message-meta { margin: 0 0 var(--space-1); overflow-wrap: anywhere; }
.request-picture { margin: var(--space-2) 0 0; }
.request-picture a { display: inline-block; max-width: 100%; }
.request-picture img { display: block; max-width: min(100%, 24rem); height: auto; border-radius: var(--radius-control); border: 1px solid var(--line); }
.request-reply .hint { display: block; }
/* Batch and Bite row E (card #4): the weeks with room, above the request form's date. */
.request-weeks p { margin: 0 0 var(--space-2); }
.request-week-list { margin: 0 0 var(--space-3); padding-left: var(--space-4); columns: 2 16rem; column-gap: var(--space-4); }
.request-week-list li { break-inside: avoid; overflow-wrap: anywhere; }
/* Batch and Bite row F (card #5): the quote, the booking, and their pictures. */
.quote-mockup img, .order-booking-pictures img { display: block; max-width: min(100%, 24rem); height: auto; border-radius: var(--radius-control); border: 1px solid var(--line); }
.quote-terms li, .quote-form-terms li { overflow-wrap: anywhere; margin: 0 0 var(--space-1); }
.quote-money { margin: var(--space-3) 0 0; }
.quote-form-line { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr); gap: var(--space-2); }
@media (max-width: 900px) { .quote-form-line { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); } .quote-form-line > .field:nth-child(4) { grid-column: span 2; } }
@media (max-width: 600px) { .quote-form-line { grid-template-columns: minmax(0, 1fr); border-top: 1px solid var(--line); padding-top: var(--space-2); } .quote-form-line > .field:nth-child(4) { grid-column: auto; } }
.quote-form-total { font-weight: var(--weight-label); min-height: 1.5em; }
.quote-decline, .quote-history, .quote-cancel, .quote-recipes { margin-top: var(--space-3); }
.request-quote-line { margin: 0 0 var(--space-2); overflow-wrap: anywhere; }
.request-quote-line a { margin-left: var(--space-2); }
.order-booking-pictures { list-style: none; margin: var(--space-3) 0 0; padding: 0; display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fill, minmax(min(100%, 12rem), 1fr)); }
.order-booking-pictures a, .quote-mockup a { display: block; max-width: 100%; }
.order-booking-pictures form { margin-top: var(--space-2); }
/* Batch and Bite row H (card #7): the upcoming orders board on the Dashboard. */
.dashboard-upcoming-list { list-style: none; margin: 0; padding: 0; }
.dashboard-upcoming-item { display: grid; grid-template-columns: minmax(0, 5rem) minmax(0, 1fr); gap: var(--space-3); border-top: 1px solid var(--line); padding: var(--space-3) 0; }
.dashboard-upcoming-item:first-child { border-top: 0; padding-top: 0; }
.dashboard-upcoming-item:not(:has(.dashboard-upcoming-design)) { grid-template-columns: minmax(0, 1fr); }
.dashboard-upcoming-design img { display: block; width: 100%; height: auto; border-radius: var(--radius-control); border: 1px solid var(--line); }
.dashboard-upcoming-words p { margin: 0 0 var(--space-1); overflow-wrap: anywhere; }
/* Batch and Bite row I (card #8): Products › Recipes, and Orders › Grocery List of a week's booked orders. */
.recipe-starter { display: inline-block; padding: 0 var(--space-2); border: 1px solid var(--line); border-radius: var(--radius-control); font-size: var(--text-s); font-weight: var(--weight-label); }
.recipe-lines { display: grid; gap: var(--space-2); }
.recipe-line { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 1fr) minmax(0, 2fr); gap: var(--space-2); }
.recipe-line > .field-error { grid-column: 1 / -1; margin: 0; }
@media (max-width: 600px) { .recipe-line { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-top: 1px solid var(--line); padding-top: var(--space-2); } .recipe-line > .field:first-child { grid-column: 1 / -1; } }
.recipe-delete { margin-top: var(--space-4); }
.week-grocery-pick { display: flex; flex-wrap: wrap; align-items: end; gap: var(--space-2) var(--space-3); }
.week-grocery-pick label { margin: 0; }
.week-grocery-step { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-2) var(--space-3); margin: var(--space-3) 0 0; }
.week-grocery-items td.amount { white-space: nowrap; font-weight: var(--weight-label); font-variant-numeric: tabular-nums; }
.week-grocery-items td.exact { white-space: nowrap; color: var(--muted); font-variant-numeric: tabular-nums; }
.week-grocery-orders li, .week-grocery-missing li { margin: 0 0 var(--space-2); overflow-wrap: anywhere; }
.week-grocery-note { display: block; color: var(--muted); font-size: var(--text-s); }
.week-grocery-export { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-3); margin: var(--space-3) 0 0; }
.print-family { margin: 0 0 var(--space-4); break-inside: avoid-page; }
.print-family h2 { margin: 0 0 var(--space-2); font-size: var(--text-l); }
.print-family .print-table td.tick { width: 2rem; text-align: center; font-size: var(--text-l); }
.print-family .print-table td.amount { white-space: nowrap; font-weight: var(--weight-label); }
/* A booking's Recipes, its Cancel and a recipe's Delete open with a press: each summary is a finger's 44 px (docs/THEMES.md). */
.quote-recipes > summary, .quote-cancel > summary, .recipe-delete > summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; }