@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

:root {
  font-family: Manrope, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #171717;
  background: #f5f5f3;
  font-synthesis: none;
  --red: #c91f29;
  --red-dark: #a80f18;
  --red-soft: #fff0f1;
  --ink: #171717;
  --muted: #767676;
  --line: #e4e4e1;
  --paper: #ffffff;
  --page: #f5f5f3;
  --green: #177245;
  --shadow: 0 18px 42px rgba(24, 19, 17, .08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--page); color: var(--ink); }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }

/* Brand */
.brand-mark { display: flex; align-items: center; gap: 9px; min-width: max-content; }
.brand-star { width: 30px; height: 30px; display: grid; place-items: center; color: #fff; background: var(--red); border-radius: 8px; font-size: 18px; line-height: 1; transform: rotate(-7deg); }
.brand-copy { display: flex; flex-direction: column; line-height: 1; }
.brand-mark strong { display: block; letter-spacing: .035em; font-size: 19px; font-weight: 800; }
.brand-mark small { display: block; color: #8c8c8c; font-size: 7px; font-weight: 800; letter-spacing: .15em; margin-top: 5px; }

/* Storefront header */
.store-page { min-height: 100vh; background-color: #faf8f6; background-image: radial-gradient(circle at 0% 18%, rgba(201,31,41,.06), transparent 20%), radial-gradient(circle at 100% 28%, rgba(201,31,41,.05), transparent 20%), linear-gradient(180deg, #ffffff 0%, #faf8f6 100%); }
.utility-bar { background: #1f1f1f; color: #fff; }
.utility-inner { max-width: 1380px; margin: auto; height: 34px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 0 4px; font-size: 10px; font-weight: 700; letter-spacing: .015em; }
.utility-inner span { display: flex; align-items: center; gap: 7px; }
.utility-note { color: #d2d2d2; font-weight: 500 !important; }

.store-header { min-height: 84px; display: grid; grid-template-columns: auto minmax(260px, 1fr) auto auto auto; align-items: center; gap: 22px; padding: 0 max(20px, calc((100vw - 1380px) / 2)); background: #fff; border-bottom: 1px solid #ececea; position: sticky; top: 0; z-index: 30; }
.header-search { height: 46px; display: flex; align-items: center; gap: 10px; background: #f4f4f2; border: 1px solid #e8e8e5; border-radius: 12px; padding: 0 15px; color: #777; transition: border-color .2s ease, box-shadow .2s ease, background .2s ease; }
.header-search input { width: 100%; border: 0; outline: 0; background: transparent; color: #222; font-size: 14px; }
.header-search.active, .header-search:focus-within { border-color: #d6b8ba; box-shadow: 0 0 0 4px #fff0f1; background: #fff; }
.search-clear { width: 28px; height: 28px; border: 0; border-radius: 50%; display: grid; place-items: center; background: #ececeb; color: #666; flex: 0 0 auto; }
.search-clear:hover { background: #e2e2e0; color: #222; }
.header-location { display: flex; align-items: center; gap: 10px; min-width: 175px; }
.header-location > svg { color: var(--red); }
.header-location > div { display: grid; gap: 1px; }
.header-location span { font-size: 9px; text-transform: uppercase; color: #999; font-weight: 800; letter-spacing: .1em; }
.header-location strong { font-size: 13px; }
.header-location small { color: #808080; font-size: 10px; }
.language-switch { display: flex; gap: 2px; padding: 3px; border: 1px solid #e5e5e2; border-radius: 9px; background: #f7f7f5; }
.language-switch button { border: 0; background: transparent; color: #858585; border-radius: 6px; padding: 5px 6px; font-size: 9px; font-weight: 900; }
.language-switch button.active { background: #fff; color: var(--red); box-shadow: 0 1px 3px rgba(0,0,0,.09); }
.cart-button { border: 0; background: var(--red); color: #fff; min-height: 44px; border-radius: 12px; padding: 0 16px; display: flex; align-items: center; gap: 9px; font-size: 12px; font-weight: 800; box-shadow: 0 8px 18px rgba(201,31,41,.18); }
.cart-button:hover { background: var(--red-dark); }
.cart-button b { background: #fff; color: var(--red); min-width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; font-size: 10px; }

.main-nav { background: #fff; border-bottom: 1px solid #e9e9e6; }
.main-nav-inner { max-width: 1380px; min-height: 52px; margin: auto; display: flex; align-items: center; gap: 16px; padding: 0 2px; }
.main-nav a, .main-nav button { border: 0; background: transparent; padding: 0 10px; min-height: 36px; border-radius: 10px; font-size: 13px; font-weight: 800; color: #555; }
.main-nav a:hover, .main-nav button:hover { color: var(--red); background: #faf6f6; }
.main-nav .nav-primary { color: #fff; background: var(--red); align-self: center; min-height: 38px; padding: 0 18px; display: grid; place-items: center; }

/* Hero */
.hero { max-width: 1380px; margin: 18px auto 0; border-radius: 24px; overflow: hidden; }
.hero-content { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; }
.hero-kicker { display: inline-flex; align-items: center; gap: 8px; font-size: 10px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; color: rgba(255,255,255,.82); }
.pulse-dot { width: 7px; height: 7px; background: #73e0a2; border-radius: 50%; box-shadow: 0 0 0 5px rgba(115,224,162,.14); }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 18px; }
.hero-primary { border: 0; background: #fff; color: #a41019; min-height: 42px; border-radius: 12px; padding: 0 15px 0 16px; display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; box-shadow: 0 10px 24px rgba(0,0,0,.09); }
.hero-secondary { min-height: 42px; display: inline-flex; align-items: center; border: 1px solid rgba(255,255,255,.28); border-radius: 12px; padding: 0 15px; color: #fff; font-size: 12px; font-weight: 700; background: transparent; }

/* Delivery hero v7 */
.hero-v7 { min-height: 332px; background: linear-gradient(118deg, #94111a 0%, #c91f29 52%, #e23843 100%); color: #fff; padding: 32px 42px; display: grid; grid-template-columns: minmax(0, 1fr) 440px; gap: 24px; align-items: center; position: relative; }
.hero-v7:before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 83% 22%, rgba(255,255,255,.16), transparent 22%), radial-gradient(circle at 72% 96%, rgba(255,255,255,.11), transparent 32%); pointer-events: none; }
.hero-v7:after { content: ""; position: absolute; right: -82px; bottom: -152px; width: 370px; height: 370px; border: 52px solid rgba(255,255,255,.09); border-radius: 50%; pointer-events: none; }
.hero-v7 .hero-content { position: relative; z-index: 2; }
.hero-v7 h1 { max-width: 650px; margin: 11px 0 13px; font-size: clamp(38px, 4.1vw, 56px); line-height: .98; letter-spacing: -.06em; }
.hero-v7 h1 span { color: #fff4ca; }
.hero-v7 p { max-width: 570px; margin: 0; color: rgba(255,255,255,.91); font-size: 15px; line-height: 1.58; }
.hero-proof { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 19px; color: rgba(255,255,255,.94); }
.hero-proof span { display: inline-flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 700; }
.hero-visual { height: 270px; position: relative; z-index: 2; isolation: isolate; }
.hero-visual:before { content: ""; position: absolute; width: 266px; height: 266px; right: 48px; top: 0; border-radius: 50%; background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.2); }
.hero-product { position: absolute; object-fit: contain; mix-blend-mode: multiply; filter: drop-shadow(0 18px 18px rgba(68, 5, 8, .26)); }
.hero-product-main { width: 230px; height: 260px; right: 92px; top: 11px; z-index: 3; transform: rotate(3deg); }
.hero-product-left { width: 154px; height: 174px; left: 16px; bottom: -4px; z-index: 2; transform: rotate(-12deg); }
.hero-product-right { width: 138px; height: 154px; right: 2px; bottom: 1px; z-index: 4; transform: rotate(12deg); }
.hero-radius { position: absolute; top: 10px; right: 7px; width: 80px; height: 80px; border: 1px solid rgba(255,255,255,.43); border-radius: 50%; background: rgba(134, 12, 20, .37); display: grid; place-content: center; text-align: center; line-height: 1; z-index: 5; backdrop-filter: blur(5px); }
.hero-radius span, .hero-radius small { font-size: 8px; font-weight: 700; opacity: .83; }
.hero-radius strong { font-size: 17px; letter-spacing: -.05em; margin: 3px 0 2px; }
.hero-visual-label { position: absolute; left: 20px; top: 12px; display: grid; gap: 2px; z-index: 5; text-transform: uppercase; letter-spacing: .1em; }
.hero-visual-label span { font-size: 8px; font-weight: 800; color: rgba(255,255,255,.72); }
.hero-visual-label strong { font-size: 12px; letter-spacing: -.02em; text-transform: none; }
/* Delivery explainer */
.delivery-strip { max-width: 1380px; margin: 10px auto 0; display: grid; grid-template-columns: repeat(4, 1fr); background: #fff; border: 1px solid #e6e6e3; border-radius: 18px; overflow: hidden; }
.delivery-strip article { display: flex; align-items: center; gap: 12px; min-height: 76px; padding: 14px 18px; border-right: 1px solid #ededeb; }
.delivery-strip article:last-child { border-right: 0; }
.delivery-strip article > span { width: 30px; height: 30px; border-radius: 9px; background: var(--red-soft); color: var(--red); display: grid; place-items: center; font-size: 10px; font-weight: 800; }
.delivery-strip article div { display: grid; gap: 3px; }
.delivery-strip strong { font-size: 12px; }
.delivery-strip small { color: #858585; font-size: 9px; line-height: 1.45; }

/* Catalog */
.catalog-section { max-width: 1380px; margin: 24px auto 0; padding-bottom: 80px; }
.catalog-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.eyebrow { text-transform: uppercase; letter-spacing: .13em; font-size: 9px; font-weight: 800; color: var(--red); }
.catalog-head h2, .drawer-head h2, .checkout-top h2 { margin: 5px 0 0; font-size: 36px; letter-spacing: -.045em; }
.catalog-head p { margin: 6px 0 0; color: #8a8a8a; font-size: 12px; }
.catalog-layout { display: grid; grid-template-columns: 245px minmax(0, 1fr); gap: 18px; align-items: start; }
.category-sidebar { background: #fff; border: 1px solid #e6e6e3; border-radius: 16px; overflow: hidden; position: sticky; top: 108px; }
.category-title { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 16px; background: var(--red); color: #fff; }
.category-title span { font-size: 13px; font-weight: 800; }
.category-title small { font-size: 10px; opacity: .82; }
.category-sidebar > button { width: 100%; min-height: 62px; border: 0; border-bottom: 1px solid #ededeb; background: #fff; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px 10px 16px; text-align: left; }
.category-sidebar > button:hover { background: #fafafa; }
.category-sidebar > button.active { background: #fff5f5; box-shadow: inset 3px 0 0 var(--red); }
.category-sidebar > button span { display: grid; gap: 2px; }
.category-sidebar > button b { font-size: 12px; }
.category-sidebar > button small { color: #999; font-size: 10px; }
.category-sidebar > button em { font-style: normal; min-width: 24px; height: 24px; display: grid; place-items: center; border-radius: 8px; background: #f2f2f0; color: #797979; font-size: 10px; font-weight: 800; }
.category-sidebar > button.active em { background: var(--red); color: #fff; }
.sidebar-delivery-card { margin: 13px; padding: 15px; background: #f5f5f3; border-radius: 12px; display: grid; gap: 5px; }
.sidebar-delivery-card svg { color: var(--red); }
.sidebar-delivery-card strong { font-size: 12px; margin-top: 3px; }
.sidebar-delivery-card span { color: #8c8c8c; font-size: 10px; line-height: 1.5; }

.catalog-main { min-width: 0; }
.products-toolbar { min-height: 58px; padding: 0 4px 0 2px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.products-toolbar > div { display: flex; align-items: baseline; gap: 9px; }
.products-toolbar strong { font-size: 18px; }
.products-toolbar span { color: #999; font-size: 11px; }
.products-toolbar button { border: 0; background: transparent; color: var(--red); font-size: 11px; font-weight: 800; }
.mobile-categories { display: none; }
.category-row { display: flex; gap: 8px; overflow: auto; scrollbar-width: none; }
.category-row button { white-space: nowrap; border: 1px solid #dededb; background: #fff; border-radius: 999px; padding: 10px 14px; font-size: 11px; font-weight: 700; }
.category-row button.active { background: #222; color: #fff; border-color: #222; }

.product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.product-card { background: #fff; border: 1px solid #e6e6e3; border-radius: 16px; overflow: hidden; min-width: 0; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.product-card:hover { transform: translateY(-3px); border-color: #d8d8d5; box-shadow: var(--shadow); }
.product-image-shell { height: 235px; position: relative; display: flex; align-items: center; justify-content: center; background: linear-gradient(#fafafa, #f4f4f2); overflow: hidden; }
.product-image { width: 88%; height: 88%; object-fit: contain; mix-blend-mode: multiply; transition: transform .25s ease; }
.product-card:hover .product-image { transform: scale(1.035); }
.product-badge { position: absolute; top: 12px; left: 12px; z-index: 2; border-radius: 7px; padding: 6px 8px; background: var(--red); color: #fff; font-size: 7px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.product-copy { padding: 15px; }
.product-brand { text-transform: uppercase; letter-spacing: .085em; font-size: 8px; color: #999; font-weight: 800; }
.product-copy h3 { font-size: 16px; line-height: 1.32; margin: 7px 0 6px; min-height: 42px; }
.product-unit { color: #8b8b8b; font-size: 11px; }
.product-footer { display: flex; align-items: end; justify-content: space-between; gap: 10px; margin-top: 16px; }
.product-price { font-size: 19px; font-weight: 800; letter-spacing: -.02em; }
.product-price small { font-size: 10px; font-weight: 700; }
.icon-add { width: 38px; height: 38px; border: 0; border-radius: 10px; background: var(--red); color: #fff; display: grid; place-items: center; }
.icon-add:hover { background: var(--red-dark); }
.qty-control { display: flex; align-items: center; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; }
.qty-control button { width: 31px; height: 31px; border: 0; background: transparent; display: grid; place-items: center; }
.qty-control span { min-width: 23px; text-align: center; font-weight: 800; font-size: 11px; }
.qty-control.compact { background: #f7f7f5; }
.catalog-empty { min-height: 300px; border: 1px dashed #d7d7d3; border-radius: 16px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #929292; gap: 7px; text-align: center; }
.catalog-empty strong { color: #333; }
.catalog-empty span { font-size: 10px; }

.store-footer { border-top: 1px solid #e6e6e3; background: #fff; min-height: 100px; padding: 0 max(20px, calc((100vw - 1380px) / 2)); display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.store-footer > div { display: flex; align-items: center; gap: 18px; }
.store-footer > div > span, .store-footer > small { color: #8b8b8b; font-size: 9px; }

/* Cart */
.drawer-backdrop { position: fixed; inset: 0; background: rgba(12,10,8,.42); z-index: 39; opacity: 0; pointer-events: none; transition: .25s; }
.drawer-backdrop.show { opacity: 1; pointer-events: auto; }
.cart-drawer { position: fixed; right: 0; top: 0; bottom: 0; width: min(440px, 100vw); background: #fff; z-index: 40; transform: translateX(100%); transition: .28s ease; display: flex; flex-direction: column; box-shadow: -20px 0 70px rgba(0,0,0,.15); }
.cart-drawer.open { transform: none; }
.drawer-head { padding: 25px 23px 18px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; align-items: start; }
.ghost-icon { border: 1px solid var(--line); background: #fff; width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; }
.cart-lines { padding: 10px 23px; overflow: auto; flex: 1; }
.cart-line { display: grid; grid-template-columns: 64px 1fr auto; gap: 13px; align-items: center; padding: 14px 0; border-bottom: 1px solid #ececea; }
.cart-thumb { width: 64px; height: 64px; border-radius: 12px; background: #f5f5f3; display: grid; place-items: center; }
.cart-thumb img { width: 88%; height: 88%; object-fit: contain; mix-blend-mode: multiply; }
.cart-info { display: flex; flex-direction: column; gap: 3px; }
.cart-info strong { font-size: 11px; }
.cart-info span { font-size: 9px; color: var(--muted); }
.cart-info b { font-size: 10px; margin-top: 3px; }
.drawer-foot { padding: 19px 23px 24px; border-top: 1px solid var(--line); }
.total-row { display: flex; justify-content: space-between; align-items: center; }
.total-row strong { font-size: 20px; }
.delivery-note { font-size: 9px; line-height: 1.55; color: var(--muted); margin: 9px 0 13px; }
.primary-btn { width: 100%; border: 0; border-radius: 11px; background: var(--red); color: #fff; padding: 13px 17px; font-weight: 800; font-size: 11px; transition: .2s; }
.primary-btn:hover { background: var(--red-dark); }
.primary-btn:disabled { opacity: .45; cursor: not-allowed; }
.empty-state, .admin-empty { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: var(--muted); gap: 7px; min-height: 260px; }
.empty-state strong, .admin-empty strong { color: var(--ink); }
.empty-state span, .admin-empty span { font-size: 10px; }

/* Checkout */
.modal-backdrop { position: fixed; inset: 0; background: rgba(12,10,8,.56); z-index: 60; display: grid; place-items: center; padding: 20px; }
.checkout-modal { background: #fff; width: min(940px, 100%); max-height: 94vh; overflow: auto; border-radius: 20px; box-shadow: 0 30px 80px rgba(0,0,0,.25); }
.checkout-top { padding: 22px 25px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; }
.mobile-back { display: none; }
.checkout-grid { display: grid; grid-template-columns: 1.2fr .8fr; }
.checkout-form { padding: 25px; display: grid; gap: 15px; }
.checkout-form label, .login-panel label { font-size: 10px; font-weight: 800; display: grid; gap: 7px; }
.checkout-form input, .checkout-form textarea, .checkout-form select, .login-panel input { border: 1px solid var(--line); background: #fff; border-radius: 10px; padding: 12px 13px; outline: 0; }
.checkout-form input:focus, .checkout-form textarea:focus, .checkout-form select:focus, .login-panel input:focus { border-color: #c7a3a5; box-shadow: 0 0 0 3px #fff0f1; }
.field-label { font-size: 10px; font-weight: 800; }
.address-field { display: grid; gap: 7px; }
.address-groups { display: grid; gap: 13px; }
.address-group { display: grid; gap: 7px; }
.address-group-title { color: #68615b; font-size: 9px; font-weight: 900; letter-spacing: .055em; text-transform: uppercase; padding: 1px 2px 0; }
.address-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.address-option {
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #fff;
  padding: 0 11px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ink);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.address-option > svg:first-child { color: #8d8780; flex: 0 0 auto; }
.address-option span { flex: 1; font-size: 11px; font-weight: 800; white-space: nowrap; }
.address-option > svg:last-child { color: var(--red); flex: 0 0 auto; }
.address-option:hover { border-color: #c7a3a5; background: #fffafa; }
.address-option.selected { border-color: var(--red); background: #fff0f1; box-shadow: 0 0 0 2px #fff4f4; }
.address-option.selected > svg:first-child { color: var(--red); }
.payment-picker { position: relative; }
.payment-trigger { width: 100%; min-height: 50px; border: 1px solid var(--line); border-radius: 12px; padding: 0 14px; background: #fff; display: flex; align-items: center; gap: 10px; color: var(--ink); font: inherit; text-align: left; }
.payment-trigger span { flex: 1; font-size: 12px; font-weight: 700; }
.payment-trigger > svg:first-child { color: var(--red); }
.payment-trigger > svg:last-child { color: var(--muted); transition: transform .18s ease; }
.payment-picker.open .payment-trigger { border-color: var(--red); box-shadow: 0 0 0 3px #fff0f1; }
.payment-picker.open .payment-trigger > svg:last-child { transform: rotate(180deg); }
.payment-menu { position: absolute; z-index: 5; left: 0; right: 0; bottom: calc(100% + 7px); padding: 6px; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 12px 28px rgba(23,23,22,.16); display: grid; gap: 3px; }
.payment-menu button { border: 0; background: transparent; border-radius: 8px; min-height: 43px; padding: 0 10px; display: flex; align-items: center; gap: 10px; color: var(--ink); font: inherit; text-align: left; }
.payment-menu button span { flex: 1; font-size: 12px; font-weight: 700; }
.payment-menu button:hover, .payment-menu button.selected { background: #fff0f1; color: var(--red); }
.checkout-summary { background: #f5f5f3; padding: 25px; display: flex; flex-direction: column; }
.summary-line { display: flex; justify-content: space-between; gap: 16px; font-size: 10px; border-bottom: 1px solid #dededb; padding: 12px 0; }
.summary-line b { white-space: nowrap; }
.summary-total { display: flex; justify-content: space-between; align-items: end; margin-top: auto; padding-top: 28px; }
.summary-total strong { font-size: 21px; }
.form-error { background: #fbe9e9; color: #961b22; border-radius: 9px; padding: 10px 12px; font-size: 10px; }
.success-card { width: min(390px,100%); background: #fff; border-radius: 20px; padding: 35px; text-align: center; }
.success-icon { width: 58px; height: 58px; border-radius: 50%; background: #e8f5ee; color: var(--green); display: grid; place-items: center; margin: 0 auto 20px; }
.success-card h2 { font-size: 38px; margin: 5px 0; }
.success-card p { font-size: 11px; color: var(--muted); line-height: 1.6; margin-bottom: 22px; }
.mobile-cart-bar { display: none; }

/* Admin */
.admin-login { min-height: 100vh; display: grid; place-items: center; padding: 20px; background: #1d1d1d; }
.login-panel { width: min(420px,100%); background: #fff; border-radius: 20px; padding: 35px; }
.login-panel .eyebrow { display: block; margin-top: 38px; }
.login-panel h1 { font-size: 32px; letter-spacing: -.04em; margin: 6px 0 8px; }
.login-panel > p { font-size: 11px; line-height: 1.65; color: var(--muted); margin-bottom: 25px; }
.login-panel form { display: grid; gap: 14px; }
.login-panel .remember-login { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; font-size: 11px; line-height: 1.35; }
.remember-login input { width: 18px; height: 18px; margin: 0; accent-color: var(--red); flex: 0 0 auto; }
.remember-login span { display: grid; gap: 2px; }
.remember-login b { color: var(--ink); }
.remember-login small { color: var(--muted); font-size: 9px; font-weight: 500; }
.demo-hint { display: block; color: var(--muted); font-size: 8px; text-align: center; margin-top: 13px; }
.admin-page { min-height: 100vh; display: grid; grid-template-columns: 220px 1fr; background: #f1f1ef; }
.admin-sidebar { background: #1d1d1d; color: #fff; padding: 24px 18px; position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; }
.admin-sidebar .brand-mark small { display: none; }
.admin-sidebar .brand-star { background: var(--red); }
.admin-sidebar nav { display: grid; gap: 6px; margin-top: 45px; }
.admin-sidebar nav button, .sidebar-logout { border: 0; background: transparent; color: #aaa39b; border-radius: 10px; padding: 11px 12px; display: flex; align-items: center; gap: 10px; text-align: left; font-size: 10px; font-weight: 700; }
.admin-sidebar nav button svg, .sidebar-logout svg { width: 17px; }
.admin-sidebar nav button.active { background: #303030; color: #fff; }
.sidebar-logout { margin-top: auto; }
.admin-main { padding: 34px 38px; max-width: 1400px; width: 100%; }
.admin-top { display: flex; justify-content: space-between; align-items: end; gap: 20px; }
.admin-top h1 { font-size: 34px; letter-spacing: -.04em; margin: 5px 0 0; }
.admin-actions { display: flex; gap: 8px; }
.alert-btn, .ghost-btn { border: 1px solid #d9d9d5; background: #fff; border-radius: 10px; padding: 10px 13px; display: flex; gap: 8px; align-items: center; font-size: 9px; font-weight: 800; }
.alert-btn.enabled { background: #e9f5ee; color: var(--green); border-color: #c6e2d2; }
.new-order-alert { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 22px; background: rgba(24, 13, 13, .58); backdrop-filter: blur(5px); }
.new-order-alert-card { position: relative; width: min(100%, 440px); padding: 42px 30px 30px; border-radius: 22px; background: #d72431; color: #fff; text-align: center; box-shadow: 0 28px 70px rgba(0,0,0,.38); animation: new-order-pop .26s ease-out; }
.new-order-alert-card > svg { margin-bottom: 14px; animation: new-order-bell .65s ease-in-out infinite alternate; }
.new-order-alert-card > span { display: block; font-size: 14px; font-weight: 900; letter-spacing: .12em; }
.new-order-alert-card > strong { display: block; margin-top: 11px; font-size: 34px; letter-spacing: -.04em; }
.new-order-alert-card p { margin: 9px 0 25px; font-size: 15px; font-weight: 700; }
.new-order-alert-card .primary-btn { width: 100%; justify-content: center; background: #fff; color: #bb1b28; }
.new-order-alert-close { position: absolute; top: 12px; right: 12px; display: grid; place-items: center; width: 38px; height: 38px; border: 0; border-radius: 50%; background: rgba(255,255,255,.18); color: #fff; }
@keyframes new-order-pop { from { transform: scale(.9); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes new-order-bell { to { transform: rotate(11deg) scale(1.07); } }
.admin-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin: 28px 0; }
.admin-stats > div { background: #fff; border: 1px solid #dfdfdb; border-radius: 14px; padding: 18px; display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; }
.admin-stats span { font-size: 9px; color: var(--muted); }
.admin-stats strong { font-size: 27px; }
.history-stats strong { font-size: 24px; }
.history-stats strong small { font-size: 11px; font-weight: 800; }
.admin-stats svg { grid-row: 1/3; grid-column: 2; align-self: center; color: #b8afa5; }
.orders-list { display: grid; gap: 12px; }
.history-orders-list { grid-template-columns: minmax(0, 1fr); align-items: start; }
.history-orders-list .order-card { display: grid; grid-template-columns: minmax(0, 1fr) 210px; column-gap: 30px; padding: 20px 22px; background: #fff; color: var(--ink); }
.history-orders-list .order-card.status-completed { border-left: 4px solid #4a956a; }
.history-orders-list .order-head { grid-column: 1 / -1; padding-bottom: 14px; }
.history-orders-list .order-body { grid-column: 1; grid-template-columns: 240px minmax(0, 1fr); gap: 32px; padding: 17px 0 0; }
.history-orders-list .order-items { border-left: 1px solid #eee; padding-left: 28px; }
.history-orders-list .order-foot { grid-column: 2; grid-row: 2; align-self: stretch; border-top: 0; border-left: 1px solid #eee; padding: 17px 0 0 25px; display: flex; align-items: flex-start; }
.order-card { background: #fff; border: 1px solid #dfdfdb; border-radius: 15px; padding: 18px 20px; }
.order-card.status-accepted { border-left: 4px solid var(--red); }
.order-head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 15px; border-bottom: 1px solid #eee; }
.order-head > div { display: flex; align-items: center; gap: 10px; }
.order-number { font-size: 15px; font-weight: 900; }
.status-pill { font-size: 8px; text-transform: uppercase; letter-spacing: .07em; padding: 6px 8px; border-radius: 999px; background: #eee; }
.status-pill.status-accepted { background: #fdebed; color: #a2141d; }
.status-pill.status-completed { background: #e7f4ec; color: #347054; }
.order-head time { font-size: 9px; color: var(--muted); }
.order-body { display: grid; grid-template-columns: .75fr 1.25fr; gap: 28px; padding: 17px 0; }
.customer-block, .order-items { display: flex; flex-direction: column; gap: 5px; }
.customer-block > span, .order-items > span, .order-foot span { font-size: 8px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 800; }
.customer-block strong { font-size: 14px; }
.customer-block a { font-size: 12px; color: var(--red); text-decoration: none; }
.customer-block p { font-size: 11px; margin: 5px 0; }
.customer-block small { font-size: 10px; color: var(--muted); }
.order-items > div { display: flex; justify-content: space-between; gap: 12px; font-size: 11px; padding: 5px 0; }
.order-foot { display: flex; align-items: end; justify-content: space-between; border-top: 1px solid #eee; padding-top: 14px; }
.order-foot > div { display: flex; flex-direction: column; gap: 2px; }
.order-foot strong { font-size: 22px; }
.order-foot small { font-size: 10px; color: var(--muted); }
.primary-btn.small { width: auto; padding: 10px 14px; display: flex; gap: 7px; align-items: center; font-size: 9px; }
.admin-empty { background: #fff; border: 1px dashed #d7d7d3; border-radius: 15px; padding: 50px; }
.spin { animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Operations admin */
.report-panel, .catalog-admin { margin-top: 28px; background: #fff; border: 1px solid #dfdfdb; border-radius: 16px; padding: 22px; }
.report-filters { display: flex; gap: 30px; align-items: flex-end; padding-bottom: 20px; border-bottom: 1px solid #ececea; }
.report-filters > div { display: grid; gap: 8px; }
.report-filters > div > span { font-size: 9px; color: var(--muted); font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.filter-pills { display: flex; flex-wrap: wrap; gap: 7px; }
.filter-pills button { border: 1px solid #dededb; background: #fff; border-radius: 9px; padding: 9px 11px; font-size: 10px; font-weight: 800; color: #666; }
.filter-pills button.active { border-color: #c91f29; background: #fff0f1; color: #a80f18; }
.report-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 20px 0; }
.report-cards > div { background: #f6f6f4; border: 1px solid #ececea; border-radius: 12px; padding: 16px; display: grid; gap: 5px; }
.report-cards span { color: var(--muted); font-size: 9px; }
.report-cards strong { font-size: 22px; letter-spacing: -.04em; }
.report-cards small { font-size: 10px; }
.report-cards .report-total { background: #1d1d1d; border-color: #1d1d1d; color: #fff; }
.report-cards .report-total span { color: #d6d6d2; }
.catalog-admin { max-width: 840px; display: grid; gap: 17px; }
.catalog-admin-intro { display: flex; gap: 13px; align-items: flex-start; }
.catalog-admin-intro svg { color: var(--red); flex: 0 0 auto; }
.catalog-admin-intro strong { font-size: 15px; }
.catalog-admin-intro p { color: var(--muted); font-size: 11px; line-height: 1.6; margin: 5px 0 0; }
.excel-upload { width: max-content; display: flex; align-items: center; gap: 9px; border: 1px dashed #c91f29; border-radius: 11px; color: #aa151e; padding: 11px 13px; font-size: 10px; font-weight: 800; cursor: pointer; }
.excel-upload input { display: none; }
.import-preview { border: 1px solid #d9e8de; background: #f2faf5; border-radius: 12px; padding: 15px; display: grid; gap: 11px; }
.import-preview > div:first-child { display: grid; gap: 4px; }
.import-preview strong { font-size: 12px; color: #1b6d42; }
.import-preview span { font-size: 10px; color: #4d6d5a; }
.import-preview-actions { display: flex; gap: 8px; align-items: center; }
.import-preview-actions .primary-btn { width: auto; }
.import-sample { display: grid; gap: 5px; padding-top: 8px; border-top: 1px solid #dce9e0; }
.import-success { background: #e9f6ee; border: 1px solid #c8e5d3; color: #1b7044; border-radius: 10px; padding: 12px; font-size: 10px; font-weight: 700; }
.catalog-admin-note { border-top: 1px solid #ececea; padding-top: 15px; display: grid; gap: 4px; }
.catalog-admin-note strong { font-size: 11px; }
.catalog-admin-note span { color: var(--muted); font-size: 10px; line-height: 1.5; }

@media (max-width: 1000px) {
  .utility-inner { padding: 0 18px; }
  .store-header { grid-template-columns: auto 1fr auto auto; gap: 14px; padding: 0 18px; }
  .header-location { display: none; }
  .main-nav-inner { padding: 0 18px; }
  .hero, .delivery-strip, .catalog-section { margin-left: 18px; margin-right: 18px; }
  .catalog-layout { grid-template-columns: 215px minmax(0, 1fr); }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 780px) {
  .utility-note { display: none !important; }
  .store-header { min-height: 72px; grid-template-columns: 1fr auto auto; }
  .header-search { grid-column: 1 / -1; grid-row: 2; margin-bottom: 12px; }
  .store-header { padding-top: 12px; padding-bottom: 0; }
  .main-nav { display: none; }
  .delivery-strip { grid-template-columns: 1fr 1fr; }
  .delivery-strip article:nth-child(2) { border-right: 0; }
  .delivery-strip article:nth-child(-n+2) { border-bottom: 1px solid #ededeb; }
  .catalog-head { align-items: stretch; flex-direction: column; }
  .category-sidebar { display: none; }
  .catalog-layout { display: block; }
  .mobile-categories { display: flex; margin-bottom: 8px; padding-bottom: 4px; }
  .products-toolbar { min-height: 48px; height: auto; padding-top: 6px; padding-bottom: 6px; }
  .store-footer { padding: 20px; min-height: 90px; }
  .admin-page { grid-template-columns: 1fr; }
  .admin-sidebar { height: auto; position: sticky; top: 0; z-index: 50; flex-direction: row; align-items: center; padding: max(12px, calc(env(safe-area-inset-top) + 10px)) 16px 12px; box-shadow: 0 3px 14px rgba(0,0,0,.18); }
  .admin-sidebar nav { margin: 0 0 0 auto; display: flex; gap: 5px; }
  .admin-sidebar nav button { font-size: 10px; padding: 10px 11px; min-height: 42px; white-space: nowrap; }
  .admin-sidebar .sidebar-logout { display: none; }
  .admin-main { padding: 23px 16px; }
  .admin-top { align-items: flex-start; flex-direction: column; }
  .admin-actions { width: 100%; }
  .admin-actions button { flex: 1; justify-content: center; }
  .report-filters { display: grid; gap: 16px; }
  .report-cards { grid-template-columns: repeat(2, 1fr); }
  .order-body { grid-template-columns: 1fr; }
  .admin-stats { gap: 7px; }
  .admin-stats > div { padding: 13px; }
  .admin-stats strong { font-size: 22px; }
}

@media (max-width: 560px) {
  .utility-inner { height: 30px; padding: 0 13px; font-size: 8px; }
  .store-header { padding-left: 13px; padding-right: 13px; gap: 12px; }
  .brand-mark small { display: none; }
  .brand-mark strong { font-size: 16px; }
  .brand-star { width: 27px; height: 27px; border-radius: 7px; }
  .cart-button > span { display: none; }
  .cart-button { padding: 0 12px; min-width: 44px; justify-content: center; }
  .hero, .delivery-strip, .catalog-section { margin-left: 10px; margin-right: 10px; }
  .hero-actions { display: grid; }
  .hero-primary, .hero-secondary { justify-content: center; width: 100%; }
  .hero-meta { gap: 10px; }
  .hero-meta span { font-size: 8px; }
  .delivery-strip { border-radius: 14px; }
  .delivery-strip article { padding: 12px; gap: 9px; min-height: 75px; }
  .delivery-strip article > span { width: 25px; height: 25px; }
  .delivery-strip strong { font-size: 9px; }
  .delivery-strip small { font-size: 7px; }
  .catalog-section { margin-top: 38px; padding-bottom: 92px; }
  .catalog-head h2, .drawer-head h2, .checkout-top h2 { font-size: 27px; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .product-image-shell { height: 165px; }
  .product-copy { padding: 12px; }
  .product-brand { font-size: 9px; }
  .product-copy h3 { font-size: 13px; min-height: 34px; }
  .product-unit { font-size: 10px; }
  .product-price { font-size: 15px; }
  .icon-add { width: 34px; height: 34px; }
  .products-toolbar { padding: 0 2px; }
  .mobile-cart-bar { position: fixed; bottom: max(10px, env(safe-area-inset-bottom)); left: 10px; right: 10px; z-index: 30; border: 0; border-radius: 12px; padding: 13px 16px; background: var(--red); color: #fff; display: flex; align-items: center; justify-content: space-between; box-shadow: 0 12px 30px rgba(100,0,0,.25); }
  .mobile-cart-bar span { display: flex; gap: 7px; align-items: center; }
  .store-footer { flex-direction: column; align-items: flex-start; justify-content: center; }
  .modal-backdrop { padding: 0; align-items: end; }
  .checkout-modal { border-radius: 20px 20px 0 0; max-height: 96vh; }
  .checkout-top { padding: 16px; }
  .desktop-close { display: none; }
  .mobile-back { display: grid; }
  .checkout-grid { grid-template-columns: 1fr; }
  .checkout-form { padding: 18px; }
  .address-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .address-option { min-height: 46px; padding: 0 9px; }
  .address-option span { font-size: 10px; }
  .checkout-summary { padding: 18px; }
  .summary-total { margin-top: 10px; }
  .success-wrap { align-items: center; padding: 18px; }
  .success-card { border-radius: 20px; }
  .admin-top h1 { font-size: 29px; }
  .admin-stats { grid-template-columns: repeat(3,1fr); }
  .admin-stats svg { display: none; }
  .history-orders-list { grid-template-columns: 1fr; }
  .history-orders-list .order-card { display: block; padding: 16px; }
  .history-orders-list .order-body { display: grid; grid-template-columns: 1fr; gap: 15px; padding: 15px 0; }
  .history-orders-list .order-items { border-left: 0; border-top: 1px solid #eee; padding: 14px 0 0; }
  .history-orders-list .order-foot { display: flex; border-left: 0; border-top: 1px solid #eee; padding: 14px 0 0; }
  .order-card { padding: 15px; }
  .order-foot { gap: 12px; }
  .primary-btn.small { font-size: 8px; }
  .admin-sidebar nav button { padding: 9px 8px; font-size: 0; }
  .admin-sidebar nav button svg { margin: 0; }
  .report-panel, .catalog-admin { margin-top: 20px; padding: 14px; }
  .report-cards > div { padding: 12px; }
  .report-cards strong { font-size: 18px; }
  .import-preview-actions { display: grid; grid-template-columns: 1fr 1.5fr; }
  .import-preview-actions .ghost-btn, .import-preview-actions .primary-btn { width: 100%; justify-content: center; }
  .admin-sidebar .brand-mark strong { font-size: 14px; }
}

@media (max-width: 1100px) {
  .hero-v7 { grid-template-columns: minmax(0, 1fr) 360px; padding-left: 32px; padding-right: 30px; }
  .hero-v7 h1 { font-size: clamp(36px, 4.7vw, 50px); }
  .hero-product-main { right: 54px; }
  .hero-product-left { left: 0; }
}

@media (max-width: 780px) {
  .header-search input { font-size: 16px; }
  .hero-v7 { min-height: 0; grid-template-columns: 1fr; gap: 10px; padding: 26px 20px 12px; border-radius: 18px; }
  .hero-v7 h1 { font-size: clamp(34px, 10vw, 43px); }
  .hero-v7 p { font-size: 14px; }
  .hero-v7 .hero-actions { margin-top: 17px; }
  .hero-v7 .hero-proof { gap: 8px 13px; margin-top: 17px; }
  .hero-v7 .hero-proof span { font-size: 10px; }
  .hero-visual { height: 230px; margin: 0 -4px; }
  .hero-visual:before { width: 225px; height: 225px; right: calc(50% - 112px); }
  .hero-product-main { width: 196px; height: 220px; right: calc(50% - 98px); top: 4px; }
  .hero-product-left { width: 132px; height: 145px; left: calc(50% - 180px); bottom: 1px; }
  .hero-product-right { width: 120px; height: 132px; right: calc(50% - 179px); bottom: 2px; }
  .hero-radius { top: 8px; right: calc(50% - 170px); }
  .hero-visual-label { left: calc(50% - 177px); top: 9px; }
}

/* Admin reports v2 */
.report-dashboard { margin-top: 28px; display: grid; gap: 18px; }
.report-toolbar { background: #fff; border: 1px solid #dededa; border-radius: 18px; padding: 20px 22px; box-shadow: 0 8px 28px rgba(25,25,25,.035); }
.report-toolbar-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 18px; padding-bottom: 16px; border-bottom: 1px solid #efefec; }
.report-toolbar-head > div { display: grid; gap: 4px; }
.report-toolbar-head > svg { color: #aaa39b; }
.report-kicker { color: var(--muted); font-size: 8px; line-height: 1; font-weight: 900; text-transform: uppercase; letter-spacing: .11em; }
.report-toolbar-head strong { font-size: 15px; letter-spacing: -.02em; }
.report-control-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 18px; }
.report-control { display: grid; gap: 8px; }
.report-control > span { color: #77716b; font-size: 9px; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }
.segmented-control { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 4px; padding: 4px; background: #f2f2ef; border: 1px solid #e8e8e4; border-radius: 12px; }
.segmented-control button { min-height: 38px; padding: 8px 14px; border: 0; border-radius: 9px; background: transparent; color: #77716b; font-size: 10px; font-weight: 850; white-space: nowrap; cursor: pointer; transition: .16s ease; }
.segmented-control button:hover { color: #1d1d1d; }
.segmented-control button.active { background: #fff; color: #1d1d1d; box-shadow: 0 2px 8px rgba(25,25,25,.09); }
.payment-control button.active { color: #a4141d; }
.report-summary-grid { display: grid; grid-template-columns: 1.45fr repeat(3, minmax(0, 1fr)); gap: 12px; }
.report-summary-card { min-height: 118px; padding: 18px; background: #fff; border: 1px solid #dfdfdb; border-radius: 16px; display: flex; align-items: center; gap: 13px; position: relative; overflow: hidden; }
.report-summary-card > div:not(.report-card-icon) { min-width: 0; display: grid; gap: 6px; }
.report-summary-card span { color: var(--muted); font-size: 9px; font-weight: 800; }
.report-summary-card strong { font-size: 21px; line-height: 1.05; letter-spacing: -.045em; white-space: nowrap; }
.report-summary-card strong em { font-size: 9px; font-style: normal; letter-spacing: 0; color: #807b75; }
.report-card-icon { width: 39px; height: 39px; border-radius: 11px; display: grid; place-items: center; flex: 0 0 auto; }
.report-card-icon.cash { background: #ecf5ee; color: #377555; }
.report-card-icon.transfer { background: #eef1f7; color: #556b93; }
.report-card-icon.orders { background: #f7efed; color: #a24d44; }
.report-revenue { min-height: 132px; display: grid; grid-template-columns: 1fr auto; align-content: center; background: #1f1f1f; border-color: #1f1f1f; color: #fff; padding: 22px; }
.report-revenue > div { grid-column: 1; display: grid; gap: 3px; }
.report-revenue span { color: #fff; font-size: 11px; }
.report-revenue small { color: #aaa6a1; font-size: 9px; }
.report-revenue > strong { grid-column: 1; margin-top: 10px; font-size: clamp(25px, 2.4vw, 34px); color: #fff; }
.report-revenue > strong em { color: #a9a5a0; }
.report-revenue > svg { grid-column: 2; grid-row: 1 / 3; align-self: center; color: #77736f; }
.report-orders { background: #fff; border: 1px solid #dfdfdb; border-radius: 18px; padding: 20px 22px 22px; }
.report-orders-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding-bottom: 15px; border-bottom: 1px solid #efefec; margin-bottom: 12px; }
.report-orders-head > div { display: grid; gap: 4px; }
.report-orders-head span { font-size: 9px; color: var(--muted); font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.report-orders-head strong { font-size: 15px; }
.report-orders-head > small { color: #918a83; font-size: 9px; }
.report-orders-list { gap: 8px; }
.report-orders-list .order-card { display: grid; grid-template-columns: 120px minmax(0, 1fr) 170px; align-items: center; gap: 18px; padding: 14px 16px; border-radius: 12px; border-color: #e7e7e3; box-shadow: none; }
.report-orders-list .order-card.status-completed { border-left: 3px solid #75a287; }
.report-orders-list .order-head { display: grid; gap: 6px; align-items: start; padding: 0; border: 0; }
.report-orders-list .order-head > div { gap: 7px; }
.report-orders-list .order-head time { display: block; }
.report-orders-list .order-body { display: block; padding: 0; }
.report-orders-list .customer-block { gap: 3px; }
.report-orders-list .customer-block > span { display: none; }
.report-orders-list .customer-block strong { font-size: 12px; }
.report-orders-list .customer-block a { display: none; }
.report-orders-list .customer-block p { margin: 0; color: #67615b; font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.report-orders-list .customer-block small { display: none; }
.report-orders-list .order-foot { display: flex; justify-content: flex-end; align-items: center; padding: 0; border: 0; }
.report-orders-list .order-foot > div { align-items: flex-end; }
.report-orders-list .order-foot span { display: none; }
.report-orders-list .order-foot strong { font-size: 16px; white-space: nowrap; }
.report-orders-list .order-foot small { font-size: 9px; }

@media (max-width: 950px) {
  .report-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .report-revenue { grid-column: 1 / -1; }
}

@media (max-width: 780px) {
  .report-dashboard { margin-top: 20px; gap: 12px; }
  .report-toolbar { padding: 16px; border-radius: 15px; }
  .report-toolbar-head { margin-bottom: 14px; padding-bottom: 13px; }
  .report-control-grid { grid-template-columns: 1fr; gap: 14px; }
  .segmented-control button { min-height: 40px; padding-left: 9px; padding-right: 9px; }
  .report-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .report-revenue { grid-column: 1 / -1; min-height: 114px; }
  .report-summary-card { min-height: 100px; padding: 14px; align-items: flex-start; flex-direction: column; gap: 10px; }
  .report-summary-card strong { font-size: 17px; }
  .report-card-icon { width: 34px; height: 34px; }
  .report-orders { padding: 15px; border-radius: 15px; }
  .report-orders-list .order-card { grid-template-columns: 95px minmax(0, 1fr) 135px; gap: 12px; padding: 12px; }
}

@media (max-width: 560px) {
  .report-summary-grid { grid-template-columns: 1fr 1fr; }
  .report-revenue { grid-column: 1 / -1; }
  .report-summary-card:last-child { grid-column: 1 / -1; min-height: 78px; flex-direction: row; align-items: center; }
  .report-orders-head { align-items: flex-start; flex-direction: column; gap: 5px; }
  .report-orders-list .order-card { grid-template-columns: 1fr auto; gap: 10px 14px; }
  .report-orders-list .order-head { grid-column: 1; }
  .report-orders-list .order-body { grid-column: 1 / -1; grid-row: 2; }
  .report-orders-list .order-foot { grid-column: 2; grid-row: 1; align-self: center; }
  .report-orders-list .status-pill { display: none; }
  .report-orders-list .customer-block p { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
}

/* Admin reports v3 — exact dates, months, daily breakdown and export */
.report-toolbar-head .report-export-btn {
  border: 1px solid #deded9;
  background: #1f1f1f;
  color: #fff;
  min-height: 38px;
  border-radius: 10px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-size: 10px;
  font-weight: 850;
  cursor: pointer;
}
.report-toolbar-head .report-export-btn:hover { background: #292929; }
.report-toolbar-head .report-export-btn:disabled { opacity: .45; cursor: default; }
.period-control { grid-auto-flow: initial; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.report-date-picker {
  margin-top: 2px;
  min-height: 44px;
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  border: 1px solid #e2e2de;
  background: #fafaf8;
  border-radius: 11px;
  padding: 5px 7px 5px 11px;
  color: #7b756e;
}
.report-date-picker > span { font-size: 9px; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.report-date-picker input {
  min-width: 0;
  width: 100%;
  height: 32px;
  border: 0;
  background: #fff;
  border-radius: 8px;
  padding: 0 10px;
  color: #1f1f1f;
  font: inherit;
  font-size: 11px;
  font-weight: 750;
  outline: 1px solid #ecece8;
}
.report-breakdown {
  background: #fff;
  border: 1px solid #dfdfdb;
  border-radius: 18px;
  padding: 20px 22px 22px;
}
.report-breakdown-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 15px;
  border-bottom: 1px solid #efefec;
}
.report-breakdown-head > div { display: grid; gap: 4px; }
.report-breakdown-head span { color: var(--muted); font-size: 9px; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.report-breakdown-head strong { font-size: 15px; text-transform: capitalize; }
.report-breakdown-head small { color: #918a83; font-size: 9px; }
.report-table-wrap { overflow-x: auto; }
.report-table { width: 100%; border-collapse: collapse; min-width: 650px; }
.report-table th,
.report-table td { padding: 12px 10px; border-bottom: 1px solid #f0f0ed; text-align: right; font-size: 10px; }
.report-table th { color: #8c857e; font-size: 8px; text-transform: uppercase; letter-spacing: .07em; font-weight: 900; }
.report-table th:first-child,
.report-table td:first-child { text-align: left; padding-left: 0; }
.report-table th:last-child,
.report-table td:last-child { padding-right: 0; }
.report-table td { color: #514c47; }
.report-table td:first-child { color: #1e1e1e; font-weight: 800; }
.report-table td strong { color: #111; font-size: 11px; }
.report-table tr.empty-day td { color: #bbb5ae; }
.report-table tr.empty-day td strong { color: #bbb5ae; font-weight: 700; }
.report-table tbody tr:last-child td { border-bottom: 0; }

@media (max-width: 780px) {
  .period-control { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-toolbar-head { align-items: flex-start; }
  .report-toolbar-head .report-export-btn { flex: 0 0 auto; }
  .report-breakdown { padding: 15px; border-radius: 15px; }
  .report-breakdown-head { align-items: flex-start; flex-direction: column; gap: 5px; }
}

@media (max-width: 480px) {
  .report-toolbar-head { display: grid; grid-template-columns: 1fr; }
  .report-toolbar-head .report-export-btn { width: 100%; }
  .report-date-picker { grid-template-columns: auto minmax(0, 1fr); }
  .report-date-picker > span { display: none; }
}

/* v13 — compact two-level address selector */
.address-area-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.address-area-option { min-height: 62px; border: 1px solid var(--line); border-radius: 12px; background: #fff; padding: 10px 12px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; color: var(--ink); text-align: left; cursor: pointer; transition: .18s ease; }
.address-area-option > svg:first-child { color: #8d8780; }
.address-area-option > svg:last-child { color: #aaa39b; transition: transform .18s ease; }
.address-area-option > span { min-width: 0; display: grid; gap: 3px; }
.address-area-option strong { font-size: 11px; line-height: 1.15; }
.address-area-option small { color: var(--muted); font-size: 9px; font-weight: 650; }
.address-area-option:hover { border-color: #c7a3a5; background: #fffafa; }
.address-area-option.selected { border-color: var(--red); background: #fff3f4; box-shadow: 0 0 0 2px #fff7f7; }
.address-area-option.selected > svg:first-child { color: var(--red); }
.address-area-option.selected > svg:last-child { color: var(--red); transform: rotate(180deg); }
.address-house-panel { display: grid; gap: 9px; padding: 11px; border: 1px solid #e7e4e1; border-radius: 12px; background: #fafaf8; animation: address-panel-in .16s ease-out; }
.address-house-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 2px; }
.address-house-head strong { font-size: 10px; }
.address-house-head span { color: var(--muted); font-size: 9px; }
@keyframes address-panel-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }

/* v13 — history filters, pagination and collapsible rows */
.history-panel { margin-top: 18px; display: grid; gap: 12px; }
.history-toolbar { display: grid; grid-template-columns: minmax(260px, 1fr) 190px minmax(285px, auto) auto; gap: 9px; align-items: center; padding: 13px; background: #fff; border: 1px solid #dfdfdb; border-radius: 15px; }
.history-search, .history-date-filter { min-height: 42px; border: 1px solid #e2e2de; background: #fafaf8; border-radius: 10px; display: flex; align-items: center; gap: 8px; padding: 0 11px; color: #807a74; }
.history-search:focus-within, .history-date-filter:focus-within { border-color: #c7a3a5; box-shadow: 0 0 0 3px #fff0f1; background: #fff; }
.history-search input, .history-date-filter input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; color: var(--ink); font: inherit; font-size: 10px; }
.history-search input::placeholder { color: #9b958f; }
.history-date-filter span { font-size: 9px; font-weight: 850; color: #77716b; }
.history-date-filter input { width: 118px; }
.history-payment-filter { min-width: 285px; }
.history-payment-filter button.active { color: #a4141d; }
.history-reset { min-height: 40px; border: 0; background: transparent; color: var(--red); padding: 0 8px; font-size: 9px; font-weight: 850; cursor: pointer; }
.history-result-bar { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 1px 3px; color: #716b65; font-size: 9px; }
.history-result-bar small { color: #9a948e; font-size: 9px; }
.history-compact-list { display: grid; gap: 8px; }
.history-compact-card { overflow: hidden; background: #fff; border: 1px solid #dfdfdb; border-left: 3px solid #75a287; border-radius: 13px; transition: border-color .16s ease, box-shadow .16s ease; }
.history-compact-card.open { border-color: #d4d4cf; border-left-color: #4a956a; box-shadow: 0 6px 20px rgba(20,20,20,.035); }
.history-compact-summary { width: 100%; min-height: 72px; border: 0; background: transparent; padding: 12px 14px; display: grid; grid-template-columns: 105px minmax(150px, .75fr) minmax(250px, 1.5fr) 155px 24px; align-items: center; gap: 14px; color: var(--ink); text-align: left; cursor: pointer; }
.history-compact-summary:hover { background: #fbfbfa; }
.history-order-ref, .history-customer, .history-payment { display: grid; gap: 4px; min-width: 0; }
.history-order-ref strong { font-size: 13px; }
.history-order-ref time, .history-customer span, .history-payment span { color: var(--muted); font-size: 9px; }
.history-customer strong { font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.history-address { color: #5e5954; font-size: 10px; line-height: 1.4; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.history-payment { justify-items: end; text-align: right; }
.history-payment strong { font-size: 14px; white-space: nowrap; }
.history-expand-icon { color: #96908a; transition: transform .16s ease; }
.history-compact-card.open .history-expand-icon { transform: rotate(180deg); }
.history-compact-details { display: grid; grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr); gap: 24px; padding: 15px 48px 17px 14px; border-top: 1px solid #efefec; background: #fcfcfb; }
.history-detail-block, .history-detail-items { display: grid; align-content: start; gap: 6px; }
.history-detail-block > span, .history-detail-items > span { color: var(--muted); font-size: 8px; text-transform: uppercase; letter-spacing: .08em; font-weight: 850; }
.history-detail-block a { color: var(--red); font-size: 11px; text-decoration: none; font-weight: 700; }
.history-detail-block p { margin: 0; font-size: 10px; line-height: 1.45; }
.history-detail-block small { color: var(--muted); font-size: 9px; }
.history-detail-items > div { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 5px 0; border-bottom: 1px solid #f0f0ed; font-size: 10px; }
.history-detail-items > div:last-child { border-bottom: 0; }
.history-detail-items b { white-space: nowrap; }
.history-detail-items small { color: var(--muted); font-size: 9px; }
.history-empty { min-height: 190px; }
.history-pagination { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 3px; }
.history-pagination > button, .history-pagination > div button { min-height: 36px; border: 1px solid #deded9; background: #fff; border-radius: 9px; color: #625d58; font-size: 9px; font-weight: 800; cursor: pointer; }
.history-pagination > button { padding: 0 12px; display: inline-flex; align-items: center; gap: 6px; }
.history-pagination > button:disabled { opacity: .35; cursor: default; }
.history-pagination > div { display: flex; align-items: center; gap: 5px; }
.history-pagination > div button { min-width: 36px; padding: 0 9px; }
.history-pagination > div button.active { border-color: #c91f29; background: #fff0f1; color: #a80f18; }
.history-pagination > div > span { width: 26px; text-align: center; color: #9a948e; }

@media (max-width: 1120px) {
  .history-toolbar { grid-template-columns: minmax(220px, 1fr) 180px; }
  .history-payment-filter { min-width: 0; }
  .history-reset { justify-self: start; }
  .history-compact-summary { grid-template-columns: 92px minmax(130px, .8fr) minmax(180px, 1.2fr) 140px 22px; gap: 10px; }
}

@media (max-width: 780px) {
  .address-area-grid { grid-template-columns: 1fr 1fr; }
  .address-area-option { min-height: 58px; padding: 9px; gap: 8px; }
  .address-area-option strong { font-size: 10px; }
  .address-area-option small { font-size: 8px; }
  .address-house-panel { padding: 9px; }
  .history-panel { margin-top: 12px; }
  .history-toolbar { grid-template-columns: 1fr; padding: 11px; }
  .history-payment-filter { width: 100%; }
  .history-reset { min-height: 32px; padding: 0; }
  .history-compact-summary { grid-template-columns: 78px minmax(0, 1fr) auto 20px; gap: 9px; min-height: 74px; padding: 11px; }
  .history-address { grid-column: 1 / -1; grid-row: 2; white-space: normal; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
  .history-payment { grid-column: 3; grid-row: 1; }
  .history-expand-icon { grid-column: 4; grid-row: 1; }
  .history-customer span { display: none; }
  .history-compact-details { grid-template-columns: 1fr; gap: 14px; padding: 13px 11px 15px; }
  .history-pagination > button span { display: none; }
}

@media (max-width: 480px) {
  .address-area-grid { grid-template-columns: 1fr; }
  .address-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .history-result-bar small { display: none; }
  .history-payment strong { font-size: 12px; }
  .history-pagination > div button { min-width: 32px; min-height: 34px; padding: 0 7px; }
}