/* v0.10 — usability & accessibility layer, loaded last. Tokens first, then component fixes.
   Contrast targets WCAG AA (4.5:1 for text), touch targets 44 px on phones, 16 px inputs (no iOS zoom). */
:root{
  --muted:#5f665d;          /* was #798076 (3.8–4.0:1) → 5.5–5.9:1 on the light backgrounds */
  --accent-text:#a8432a;    /* orange for text on light backgrounds: 5.5–6.0:1 (brand #dd6b42 stays for decoration) */
  --accent-action:#b44a2b;  /* orange buttons with white text: 5.3:1 (was 3.4–3.7:1) */
  --danger:#a52d1c;
  --tap:44px;
}

/* ---------- utilities ---------- */
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:12px;top:-60px;z-index:100;background:var(--green);color:#fff;padding:12px 18px;border-radius:10px;font-weight:700}
.skip-link:focus{top:12px}
main:focus{outline:none}
.h3{font-size:20px}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
  .btn:hover,.dish-card:hover .dish-cover img{transform:none!important}
}

/* ---------- typography: nothing below 12 px ---------- */
.topnote{font-size:11px;line-height:1.5}
.eyebrow,.overline,.report-heading .overline,.security-card .overline{font-size:12px;letter-spacing:.12em}
.hero-meta,.hero-meta div{font-size:13px}
.hero-bubble small,.dish-cover-tag{font-size:11px}
.dish-category,.dish-by small,.dish-footer small,.category-overline,.cart-items-top>span,.cart-item small,.cart-item p,
.detail-stats span,.detail-fact small,.timeline-step small,.chat-bubble time,.chat-compose-foot span,.report-hint span,.notification-card small,
.document-line small,.footer p,.footer-right,.foot-legal,.small-muted,.schedule-help{font-size:13px}
.flash{font-size:15px}
.text-button,.nav-links a,.nav-user a,.btn{font-size:14px}
.detail-info p,.detail-desc,.dish-desc{font-size:14px}

/* ---------- contrast ---------- */
.overline,.eyebrow,.category-overline,.dish-category,.cart-item .text-button,.schedule-panel .overline,
.report-heading .overline,.security-card .overline{color:var(--accent-text)}

.topnote-sep{color:#c9d6cc}
.timeline-step small,.timeline-step strong{color:#5f665d}
.timeline-step.is-active strong{color:var(--ink)}
.foot-legal,.footer p,.footer-right span{color:#555d53}
.small-muted,.muted,.dish-desc,.dish-by small,.cart-items-top>span,.cart-item small,.report-hint span,.schedule-help,.listing-head p,.section-head p,.title-panel p,.report-heading p,
.checkout-step p,.checkout-protection small,.schedule-table thead th,.intro-line,.report-context small,.detail-card-top .small-muted,.notification-card small{color:var(--muted)}
.hero-art-caption{text-transform:uppercase;letter-spacing:.45em}
.hero-side-note,.intro-line>span:last-child{text-transform:uppercase}
.search-wrap button,.btn-accent{background:var(--accent-action)!important;color:#fff!important}
.cart-badge,.unread-badge{background:var(--accent-action)!important;color:#fff!important}
.text-link,.map-link,.report-dish-link a,.report-link-card a,.flash-link,.auth-switch a,.auth-helper a{color:var(--accent-text)}

/* ---------- touch targets ---------- */
.check-row input[type=checkbox]{width:22px;height:22px;flex:0 0 22px;margin-top:1px}
@media (max-width:780px){
  input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=file]),select,textarea{font-size:16px!important}
  .text-button,.back-link,.text-link,.text-link-button,.map-link,.report-dish-link a,.report-link-card a,.report-dish-inline,
  .action-cell a,.document-line a,.footer-right a,.flash-link,.security-bottom-link,.auth-switch a,.auth-helper a,
  .report-notification-link,.breadcrumb a,.cat-chip,.dish-card h3 a,.cart-item>div>a,.dish-by{
    display:inline-flex;align-items:center;min-height:var(--tap)
  }
  .nav-cart,.nav-favorites,.mobile-account-menu summary{min-width:var(--tap);min-height:var(--tap);justify-content:center}
  .mobile-account-menu summary{width:var(--tap);height:var(--tap)}
  .mobile-menu-pop a,.mobile-menu-pop .text-button{display:flex;align-items:center;min-height:var(--tap)}
  .footer-right{gap:0}
}

/* ---------- header, flash, menus ---------- */
.flash-link{font-weight:700;text-decoration:underline;margin-left:6px}
.flash.error{border-left:4px solid var(--danger)}
.mobile-account-menu summary{position:relative}
.menu-dot{position:absolute;top:6px;right:6px;width:9px;height:9px;border-radius:50%;background:var(--accent-action);border:2px solid #fff}
.menu-count,.nav-count{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:99px;background:var(--accent-action);color:#fff;font-size:12px;font-style:normal;margin-left:6px}

/* ---------- home ---------- */
@media (max-width:640px){
  .hero-visual{display:none!important}           /* the illustration pushed the first dish ~1.8 screens down */
  .hero-grid{padding:26px 0 22px!important}
  .hero h1{font-size:40px}
  .intro-line{display:none}
}
.catalog-pager{display:flex;justify-content:center;gap:12px;margin:34px 0 0;flex-wrap:wrap}
.empty-secondary{margin-top:14px;font-size:14px;color:var(--muted)}
.empty-secondary a{color:var(--accent-text);font-weight:700}

/* ---------- dish page: photo, then name/price/cart, then the long ingredient list ---------- */
.dish-detail-grid{grid-template-areas:"image side" "info side";align-items:start}
.dish-area-image{grid-area:image}.dish-area-side{grid-area:side}.dish-area-info{grid-area:info;margin-top:0}
.detail-info-title{font-size:17px;margin:22px 0 8px;letter-spacing:-.02em}
.allergen-callout{margin:18px 0 0;padding:12px 14px;border-radius:12px;background:#fff4e6;border-left:4px solid var(--accent-action);font-size:14px;color:var(--ink)}
@media (max-width:780px){
  .dish-detail-grid{grid-template-columns:1fr!important;grid-template-areas:"image" "side" "info"}
  .detail-side h1{font-size:34px;margin:8px 0}
}

/* ---------- cart ---------- */
.cart-item.is-unavailable{opacity:.75}
.cart-item.is-unavailable strong{text-decoration:line-through}
.unavailable-note{color:var(--danger)!important;font-weight:700}
.remove-button{color:var(--accent-text)!important;font-size:14px!important}

/* ---------- order page: actions and pickup first on phones ---------- */
@media (min-width:921px){
  .detail-layout>.detail-aside{grid-column:2;grid-row:1 / span 2}
  .detail-layout>.detail-main{grid-column:1;grid-row:1}
}
.order-actions{display:grid;gap:12px}
.cancel-order summary{cursor:pointer;color:var(--danger);font-weight:700;font-size:14px;min-height:var(--tap);display:flex;align-items:center;justify-content:center;border:1px solid #e9c9c1;border-radius:12px;list-style:none}
.cancel-order summary::-webkit-details-marker{display:none}
.cancel-order[open] summary{margin-bottom:12px}
.cancel-form textarea{width:100%}
.btn-danger{background:var(--danger);color:#fff!important}
.btn-danger:hover{background:#86200f}
.audit-note{display:block;width:100%;font-size:13px;color:var(--muted);margin-top:2px}
.detail-audit p{flex-wrap:wrap}
.buyer-note-fact{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.report-link-card a{display:flex;align-items:center;min-height:36px}
.report-dish-inline{font-size:14px;font-weight:600}

/* ---------- cook dashboard ---------- */
.dashboard-nav{display:flex;gap:8px;overflow-x:auto;position:sticky;top:0;z-index:4;background:var(--paper);padding:10px 0;margin:8px 0 18px;border-bottom:1px solid var(--line);scrollbar-width:none}
.dashboard-nav a{flex:0 0 auto;display:inline-flex;align-items:center;min-height:var(--tap);padding:0 16px;border:1px solid var(--line);border-radius:99px;background:#fff;font-weight:700;font-size:14px}
.dashboard-nav a:hover{border-color:#b9c4b5}
.dashboard-block{scroll-margin-top:78px;margin-bottom:34px}
.past-orders{margin-top:16px}
.past-orders summary{cursor:pointer;font-weight:700;min-height:var(--tap);display:flex;align-items:center;gap:8px}
.past-orders summary small{color:var(--muted);font-weight:600}
.field-warning{font-size:14px;color:#7a3b12;background:#fff4e6;border-radius:10px;padding:10px 12px;margin:4px 0 12px}
@media (max-width:520px){
  .schedule-table{min-width:0}                    /* 17:00 and 19:00 were hidden behind a scroll */
  .schedule-table th,.schedule-table td{padding:4px 1px}
  .schedule-table th:first-child{padding-left:4px}
  .schedule-table thead th{font-size:12px}
  .slot-check{width:38px;height:40px}
}

.section-title-row{flex-wrap:wrap;gap:12px}

/* ---------- notifications, reports, account ---------- */
.notify-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:0 0 16px}
.notification-open{margin-top:6px}
.text-link-button{border:0;background:none;padding:0;color:var(--accent-text);font-weight:700;font-size:14px;cursor:pointer}
.report-target-line a{color:var(--accent-text);font-weight:700}
.sub-label{display:block;font-weight:500;font-size:13px;color:var(--muted);margin:2px 0 4px}
.account-block{margin-bottom:22px}
.account-block h2{margin-bottom:6px}
.danger-zone{border-color:#efd0c8}

/* ---------- second pass: remaining small / low-contrast text found by the automated audit ---------- */
.table-scroll,.table-card{position:relative}               /* keeps visually-hidden labels inside the scroll box */
a:has(> .visually-hidden),button:has(> .visually-hidden){position:relative}
.topnote{font-size:12px}
.search-wrap button{font-size:14px}
.hero-check{font-size:12px;color:#2f5a43}
.hero-meta div{color:#4f5a52}
.cat-chip{font-size:13px}
.district-select label,.radius-picker label{font-size:13px;color:var(--muted)}
.dish-cover-tag{font-size:12px}
.dish-by span,.dish-by>span{font-size:13px;color:var(--accent-text)}
.dish-by small{font-size:13px;color:var(--muted)}
.dish-footer small{color:var(--muted)}
.feature-icon{font-size:12px;color:var(--accent-text)}
.feature p,.feature-section p{color:var(--muted)}
.nearby-copy small{color:var(--muted)}
.dish-seller span,.dish-seller div>span{font-size:13px}
.verified-pill,.verified-pill span{font-size:12px!important}
.detail-side .detail-stats span{font-size:13px}
.order-panel small.muted,.order-panel .muted{font-size:13px}
.breadcrumb,.breadcrumb span{color:var(--muted)}
.review-card strong,.review-card div>span{font-size:13px}
.review-card div>span{color:var(--muted)}
.cook-hero p,.cook-location{color:#4f5a52}
.rating-stat{color:#3f5c4a}
.stars{color:#b4622a}
.hero-bubble small{font-size:12px;color:#5f665d}
.intro-line,.intro-line span{font-size:12px}
.cart-badge,.unread-badge{font-size:12px!important;min-width:20px;height:20px}
.checkout-protection small,.checkout-summary .muted,.checkout-summary p.muted{font-size:13px}
.checkout-summary-item small{color:var(--muted)}
.status{font-size:12px}
.detail-audit small{font-size:12px;color:var(--muted)}
.report-link-card p{color:var(--muted)}
.timeline-marker{color:#5f665d}
.chat-bubble time{color:#4f5a52}
.chat-line.mine .chat-bubble time{color:#3f5c4a}
.chat-compose-foot span{color:var(--muted)}
.group-order-value small{font-size:13px}
.tiny-btn{font-size:13px}
.report-private{font-size:12px}
.report-safety p{color:#5c4626}
.verification-panel p.muted,.pickup-manage-panel p.muted,.schedule-panel p.muted,.schedule-exceptions p.muted{font-size:14px}
.picker-heading small,.pickup-picker small.muted{font-size:13px}
td small,.table-card td small{font-size:13px}
.past-orders summary small{font-size:13px}
.schedule-table thead th{color:var(--muted)}
.schedule-table tbody th,.table-card th{color:#3f463d}
.section-title-row h2 small{color:var(--muted)}


.check-row input[type=checkbox]{width:24px;height:24px;flex-basis:24px}

/* desktop: text links and small buttons get at least a 24 px hit area (WCAG 2.5.8) */
@media (min-width:781px){
  .dish-body h3 a,.nav-links a,.nav-user>a,.footer-right a,.action-cell a,.action-cell .text-button,.text-link-button,.nav-user .text-button{display:inline-flex;align-items:center;min-height:28px}
}
.stars{color:#9c4f1f}
.account-block p.muted{font-size:14px}

.search-wrap input{min-height:44px}
@media (min-width:781px){
  .back-link,.breadcrumb a,.report-dish-link a,.auth-helper a,.auth-switch a,.cart-item>div>a,.text-button,
  .report-notification-link,.document-line a,.report-link-card a{display:inline-flex;align-items:center;min-height:28px}
}
@media (min-width:781px){.map-link{display:inline-flex;align-items:center;min-height:28px}}

/* ---------- third pass (v0.10): clipping, dish page on phones ---------- */
/* "1fr" is minmax(auto,1fr): the search input's intrinsic width stretched the hero column to 420 px on a 390 px phone,
   and .hero{overflow:hidden} silently cut off the subtitle and the "Знайти" button. */
@media (max-width:780px){.hero-grid{grid-template-columns:minmax(0,1fr)!important}}
.search-wrap input{width:0;flex:1 1 auto}
.order-price{align-items:flex-end;gap:12px;flex-wrap:wrap}
.order-price>div>span{display:block;margin-bottom:2px}
.order-panel{margin-top:18px}
.detail-side .detail-desc{margin-top:22px}
.dish-seller{align-items:center;flex-wrap:wrap}
.dish-seller .seller-avatar{flex:0 0 40px;width:40px;height:40px}
.dish-seller-text{flex:1 1 160px;min-width:0}
.dish-seller strong span,.dish-seller .verified-pill span{display:inline}
.dish-seller .verified-pill{margin-left:0}
@media (max-width:780px){
  .page-section{padding-top:24px}
  .detail-image{min-height:0!important;aspect-ratio:16/10!important}
  .dish-detail-grid{gap:18px!important}
  .detail-side h1{font-size:30px}
  .inline-fav-control{margin:4px 0 0}
  .order-panel{padding:18px}
}
.rating-done{font-size:14px}
.chat-empty p{color:var(--muted)}
