/* Shared commerce design: K7 blue/orange, clear cards and mobile bottom sheets. */
:root { --k7-blue:#1554a6; --k7-orange:#e84908; --k7-border:#dfe5ed; --k7-muted:#606b7b; --tg-safe-top:0px; --tg-safe-bottom:0px; }
body { font-size:16px; line-height:1.5; }
button,input,textarea,select { font:inherit; }
button,a,input,textarea { -webkit-tap-highlight-color:transparent; }
button,a { touch-action:manipulation; }
button { cursor:pointer; }
button:disabled { opacity:.5; cursor:not-allowed; }
a { color:var(--k7-blue); }
:focus-visible { outline:3px solid #ff914d; outline-offset:3px; }
[hidden] { display:none !important; }
.app { padding-top:calc(20px + var(--tg-safe-top)); padding-bottom:calc(104px + max(env(safe-area-inset-bottom),var(--tg-safe-bottom))); }
.category-header { gap:12px; margin-bottom:24px; }
.category-header h1 { font-size:24px; line-height:1.3; margin:0; letter-spacing:-.6px; }
.back-button { flex:0 0 42px; }
.category-header > div { min-width:0; }
.brand-wordmark { margin-left:auto; font-weight:900; font-size:25px; color:var(--k7-blue); }
.language-label { font-size:12px; color:var(--k7-muted); margin-left:auto; white-space:nowrap; }
.bottom-nav { height:calc(70px + max(env(safe-area-inset-bottom),var(--tg-safe-bottom))); padding-bottom:max(env(safe-area-inset-bottom),var(--tg-safe-bottom)); }
.bottom-nav a { color:#626d7b; }
.address-box,.search-box { display:block; text-decoration:none; }
.checkout-button { display:block; text-align:center; text-decoration:none; }
.commerce-page h2,.panel h2 { font-size:19px; margin:0 0 14px; }
.commerce-page h3 { font-size:17px; margin:8px 0; }
.commerce-page p { margin:6px 0; }
.muted,.storage-note { color:var(--k7-muted); font-size:14px; }
.storage-note { text-align:center; padding:10px 4px; }
.fulfillment-switch { display:grid; grid-template-columns:1fr 1fr; gap:5px; padding:5px; background:#edf2f8; border-radius:16px; margin:0 0 24px; }
.fulfillment-switch button { border:0; background:transparent; padding:12px 8px; color:#4d5d72; border-radius:12px; font-weight:700; min-height:60px; }
.fulfillment-switch small { display:block; font-weight:400; font-size:13px; margin-top:2px; }
.fulfillment-switch button.active { color:var(--k7-blue); background:#fff; box-shadow:0 2px 8px #15345d14; }
.section-heading { display:flex; gap:12px; justify-content:space-between; align-items:center; margin:16px 0; }
.section-heading h2,.section-heading h3 { margin:0; }
.section-heading p { margin:3px 0 0; }
.primary-button,.secondary-button,.compact-primary,.danger-button { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:46px; border-radius:12px; padding:12px 16px; text-decoration:none; font-weight:700; border:1px solid transparent; text-align:center; }
.primary-button { width:100%; color:#fff; background:var(--k7-blue); }
.compact-primary { color:#fff; background:var(--k7-blue); font-size:14px; white-space:nowrap; }
.secondary-button { color:var(--k7-blue); border-color:var(--k7-border); background:#fff; }
.danger-button { background:#b52828; color:#fff; }
.full-width { width:100%; margin-top:14px; }
.text-button { border:0; padding:8px 0; background:transparent; color:var(--k7-blue); text-decoration:none; font-size:14px; min-height:40px; }
.danger { color:#b52828; }
.push-right { margin-left:auto; }
.saved-address-card,.panel { border:1px solid var(--k7-border); border-radius:18px; padding:18px; margin-bottom:14px; background:#fff; overflow-wrap:anywhere; }
.saved-address-card.selected { border-color:var(--k7-blue); box-shadow:0 0 0 1px var(--k7-blue); }
.saved-address-card h3 { color:#1e2c40; margin:8px 0; line-height:1.5; font-size:18px; }
.saved-address-card p { margin:5px 0; font-size:14px; }
.card-top { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.address-label { font-size:14px; font-weight:700; background:#f1f5fa; border-radius:7px; padding:4px 10px; }
.default-badge { display:inline-block; font-size:12px; color:var(--k7-blue); background:#eaf2fe; padding:4px 8px; border-radius:6px; }
.person { color:#34445a; }
.person span { margin-left:10px; }
.card-actions { display:flex; gap:18px; border-top:1px solid #edf0f5; margin-top:14px; padding-top:6px; flex-wrap:wrap; }
.empty-state { text-align:center; padding:36px 18px; border:1px dashed #d5dfed; border-radius:18px; background:#f8fafd; margin-bottom:18px; }
.empty-state p { color:var(--k7-muted); font-size:14px; max-width:300px; margin:8px auto 14px; }
.empty-state small { color:var(--k7-muted); }
.empty-symbol { font-size:44px; color:var(--k7-blue); }
.empty-state .primary-button { margin-top:14px; }
.notice { border:1px solid #efdbbf; background:#fff8eb; border-radius:14px; padding:14px 16px; margin-bottom:20px; color:#754610; font-size:14px; }
.notice p { margin:4px 0; }
.store-card { display:flex; gap:12px; border:1px solid var(--k7-border); padding:18px; border-radius:14px; margin-bottom:12px; }
.store-card span span,.store-card small { display:block; margin-top:5px; }
.modal-open { overflow:hidden; }
dialog { color:#1f2937; border:0; padding:0; }
dialog::backdrop { background:#12223b8c; backdrop-filter:blur(3px); }
.address-dialog { width:min(580px,100%); max-width:100%; max-height:90dvh; border-radius:24px; box-shadow:0 24px 80px #001a3b38; }
.dialog-header { position:sticky; top:0; z-index:2; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:20px 22px; background:#fff; border-bottom:1px solid var(--k7-border); }
.dialog-header h2 { margin:0; font-size:22px; }
.dialog-header small { color:var(--k7-muted); }
.icon-button { border:0; background:#eef2f7; border-radius:50%; min-width:40px; height:40px; font-size:26px; color:#42516a; }
.form-section,.map-section { padding:4px 22px 20px; border-bottom:1px solid #edf0f5; }
.form-section h3 { margin:18px 0; font-size:18px; }
.field { display:flex; flex-direction:column; gap:7px; margin:14px 0; font-size:14px; color:#34445a; font-weight:600; }
.field input,.field textarea,.field select,.map-search-row input { width:100%; border:1px solid #cdd7e3; background:#fff; border-radius:10px; padding:12px; font-size:16px; min-height:46px; color:#1f2937; font-weight:400; }
.field textarea { resize:vertical; }
.field-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.field-grid > * { min-width:0; }
.preset-row { display:flex; gap:8px; }
.preset-row button { border:1px solid var(--k7-border); background:#f7f9fc; padding:8px 18px; border-radius:20px; color:#34445a; font-size:14px; }
.check-row { display:flex; align-items:center; gap:12px; padding:14px 0; font-size:14px; }
.check-row input,.store-card input { width:20px; height:20px; flex-shrink:0; accent-color:var(--k7-blue); }
.check-row small { display:block; margin-top:4px; color:var(--k7-muted); }
.dialog-footer { padding:12px 22px 22px; background:#fff; }
.error-message { color:#ad2525; font-size:14px; margin:10px 0; }
.error-message:empty { display:none; }
.confirm-dialog { max-width:calc(100% - 32px); width:380px; padding:24px; border-radius:20px; }
.confirm-dialog h2 { font-size:21px; }
.button-row { display:flex; gap:12px; margin-top:20px; }
.button-row > * { flex:1; }
.map-search-row { display:flex; gap:8px; }
.map-search-row input { min-width:0; }
.map-search-row button { flex-shrink:0; }
.map-placeholder { height:180px; margin-top:14px; border-radius:14px; background:#eef3f9; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:20px; }
.map-placeholder span { font-size:36px; color:var(--k7-blue); }
.map-placeholder p { font-size:14px; color:var(--k7-muted); margin:6px 0; }
#yandex-map { height:260px; margin-top:14px; overflow:hidden; border-radius:14px; }
.location-button { width:100%; margin-top:12px; }
.map-result { display:block; width:100%; border:0; border-bottom:1px solid var(--k7-border); padding:12px; text-align:left; background:#f5f8fc; font-size:14px; }
.order-line { display:flex; justify-content:space-between; gap:16px; padding:11px 0; border-bottom:1px solid #edf0f5; }
.order-line strong { white-space:nowrap; }
.order-line small { color:var(--k7-muted); }
.order-line.total { border-bottom:0; color:var(--k7-blue); font-size:20px; font-weight:700; }
.account-banner { padding:22px; background:#f0f5fc; border-radius:18px; margin-bottom:24px; }
.account-banner img { width:90px; }
.account-banner h2 { margin-top:16px; }
.account-banner p { font-size:14px; color:var(--k7-muted); }
.account-row { display:flex; align-items:center; justify-content:space-between; padding:20px 4px; border-bottom:1px solid var(--k7-border); text-decoration:none; }
.account-row small { display:block; color:var(--k7-muted); font-size:14px; margin-top:4px; }
.account-row + .notice { margin-top:24px; }
@media (max-width:600px) { .address-dialog { margin:auto 0 0; max-height:94dvh; border-radius:24px 24px 0 0; padding-bottom:env(safe-area-inset-bottom); } }
@media (max-width:360px) { .card-actions { gap:12px; } .field-grid { grid-template-columns:1fr; gap:0; } .section-heading { flex-wrap:wrap; } .dialog-header,.form-section,.map-section,.dialog-footer { padding-left:16px; padding-right:16px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition:none !important; } }
