:root {
    --customer-primary: #c2410c;
    --customer-primary-dark: #9a3412;
    --customer-primary-soft: #fff1e8;
    --customer-ink: #29201d;
    --customer-muted: #756761;
    --customer-line: #eadfd9;
    --customer-canvas: #fffaf6;
    --customer-surface: #fff;
    --customer-success: #0a7a5a;
    --customer-danger: #b4232c;
    --bs-primary: var(--customer-primary);
    --bs-primary-rgb: 194, 65, 12;
    --bs-link-color: var(--customer-primary-dark);
    --bs-link-hover-color: #7c2d12;
}

html { scroll-behavior: smooth; }
body.customer-body { min-height: 100vh; margin: 0; color: var(--customer-ink); background: radial-gradient(circle at 8% 0, #fff0e4, transparent 26rem), var(--customer-canvas); display: flex; flex-direction: column; font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
a, button, input, select, textarea { transition: color .18s ease, border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(194,65,12,.22); outline-offset: 2px; }

/* Consumer shell */
.customer-header { position: sticky; z-index: 100; top: 0; border-bottom: 1px solid rgba(234,223,217,.9); background: rgba(255,255,255,.9); backdrop-filter: blur(14px); }
.customer-navbar { min-height: 76px; display: flex; align-items: center; gap: 34px; }
.customer-brand { display: inline-flex; align-items: center; gap: 11px; color: var(--customer-ink); text-decoration: none; }
.customer-brand img { width: 44px; height: 44px; object-fit: contain; }
.customer-brand span { display: grid; gap: 1px; }
.customer-brand strong { font-size: 17px; letter-spacing: -.02em; }
.customer-brand small { color: var(--customer-muted); font-size: 10px; }
.customer-nav-links { display: none !important; }
.customer-account { margin-left: auto; display: flex; align-items: center; gap: 11px; }
.customer-account form { margin: 0; }
.customer-user { max-width: 210px; overflow: hidden; color: var(--customer-muted); display: flex; align-items: center; gap: 7px; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.customer-user-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--customer-success); box-shadow: 0 0 0 4px rgba(10,122,90,.1); }
.customer-logout, .customer-login-link { min-height: 42px; padding: 0 13px; border: 0; border-radius: 11px; color: var(--customer-muted); background: transparent; display: inline-flex; align-items: center; text-decoration: none; font-size: 13px; font-weight: 650; }
.customer-logout:hover, .customer-login-link:hover { color: var(--customer-primary-dark); background: var(--customer-primary-soft); }
.customer-register-link { min-height: 42px; padding-inline: 17px; display: inline-flex; align-items: center; }
.customer-user-menu { position: relative; }
.customer-user-menu-trigger { min-height: 58px; padding: 7px 10px; border: 0; border-radius: 14px; color: var(--customer-ink); background: transparent; display: flex; align-items: center; gap: 10px; cursor: pointer; }
.customer-user-menu-trigger:hover, .customer-user-menu.is-open .customer-user-menu-trigger { background: var(--customer-primary-soft); }
.customer-user-menu-avatar { width: 42px; height: 42px; flex: 0 0 auto; border: 1px solid #e9c7b5; border-radius: 50%; color: var(--customer-primary-dark); background: var(--customer-primary-soft); display: grid; place-items: center; font-size: 12px; font-weight: 800; }
.customer-user-menu-copy { min-width: 118px; display: grid; gap: 2px; text-align: left; }
.customer-user-menu-copy strong { max-width: 190px; overflow: hidden; color: var(--customer-ink); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.customer-user-menu-copy small { color: var(--customer-muted); font-size: 10px; }
.customer-user-menu-chevron { width: 17px; height: 17px; color: #9c8c84; stroke-width: 1.8; transition: transform .16s ease; }
.customer-user-menu.is-open .customer-user-menu-chevron { transform: rotate(180deg); }
.customer-user-menu-dropdown { position: absolute; z-index: 130; top: calc(100% + 8px); right: 0; width: min(330px, calc(100vw - 28px)); overflow: hidden; border: 1px solid var(--customer-line); border-radius: 15px; background: #fff; box-shadow: 0 20px 52px rgba(89,45,24,.17); }
.customer-user-menu-dropdown[hidden] { display: none; }
.customer-user-menu-header { padding: 17px 18px 14px; display: grid; gap: 3px; }
.customer-user-menu-header > span { color: var(--customer-primary); font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.customer-user-menu-header strong { margin-top: 4px; color: var(--customer-ink); font-size: 13px; }
.customer-user-menu-header small { color: var(--customer-muted); font-size: 10px; }
.customer-user-menu-item { width: 100%; min-height: 47px; padding: 0 18px; border: 0; color: #5e5049; background: #fff; display: flex; align-items: center; gap: 11px; text-decoration: none; font-size: 11px; font-weight: 700; cursor: pointer; }
.customer-user-menu-item:hover { color: var(--customer-primary-dark); background: #fff8f3; }
.customer-user-menu-item svg { width: 19px; height: 19px; flex: 0 0 auto; stroke-width: 1.8; }
.customer-user-menu-divider { height: 1px; background: var(--customer-line); }
.customer-user-menu-dropdown form { margin: 0; }
.customer-user-menu-logout { color: var(--customer-danger); }
.customer-user-menu-logout:hover { color: #8f1821; background: #fff5f5; }
.customer-page { flex: 1; }
.customer-footer { margin-top: auto; border-top: 1px solid var(--customer-line); background: rgba(255,255,255,.72); }
.customer-footer .container { min-height: 76px; color: var(--customer-muted); display: flex; align-items: center; justify-content: space-between; gap: 18px; font-size: 12px; }
.customer-mobile-nav { display: none; }

/* Bootstrap identity */
.btn { min-height: 42px; border-radius: 11px; font-weight: 700; }
.btn-sm { min-height: 36px; }
.btn-lg { min-height: 52px; border-radius: 13px; }
.btn-primary { --bs-btn-bg: var(--customer-primary); --bs-btn-border-color: var(--customer-primary); --bs-btn-hover-bg: var(--customer-primary-dark); --bs-btn-hover-border-color: var(--customer-primary-dark); --bs-btn-active-bg: var(--customer-primary-dark); --bs-btn-active-border-color: var(--customer-primary-dark); --bs-btn-disabled-bg: var(--customer-primary); --bs-btn-disabled-border-color: var(--customer-primary); box-shadow: 0 9px 22px rgba(194,65,12,.16); }
.btn-outline-primary { --bs-btn-color: var(--customer-primary-dark); --bs-btn-border-color: #e0ad94; --bs-btn-hover-bg: var(--customer-primary); --bs-btn-hover-border-color: var(--customer-primary); --bs-btn-active-bg: var(--customer-primary-dark); --bs-btn-active-border-color: var(--customer-primary-dark); }
.btn-link { color: var(--customer-primary-dark); font-weight: 700; text-decoration: none; }
.form-control, .form-select { min-height: 46px; border-color: var(--customer-line); border-radius: 11px; background-color: #fff; }
.form-control:focus, .form-select:focus, .form-check-input:focus { border-color: var(--customer-primary); box-shadow: 0 0 0 4px rgba(194,65,12,.11); }
.form-check-input:checked { border-color: var(--customer-primary); background-color: var(--customer-primary); }
.alert { border-radius: 13px; }

/* Auth */
.auth-shell { min-height: calc(100vh - 153px); padding: clamp(34px,6vw,72px) 16px; }
.auth-card { position: relative; width: min(100%, 480px); padding: clamp(26px,5vw,42px); overflow: hidden; border-color: var(--customer-line); border-radius: 24px; box-shadow: 0 24px 60px rgba(89,45,24,.09); }
.auth-card::before { content: ""; position: absolute; width: 170px; height: 170px; right: -88px; top: -92px; border-radius: 50%; background: var(--customer-primary-soft); }
.auth-card > * { position: relative; z-index: 1; }
.auth-card .brand-mark { width: 56px; height: 56px; margin-bottom: 18px; }
.eyebrow { color: var(--customer-primary); }
.auth-card h1 { margin-bottom: 10px; color: var(--customer-ink); font-size: clamp(28px,5vw,38px); letter-spacing: -.04em; }
.auth-card .btn-primary { background: var(--customer-primary); border-color: var(--customer-primary); }
.auth-card .btn-primary:hover { background: var(--customer-primary-dark); border-color: var(--customer-primary-dark); }
.auth-switch { color: var(--customer-muted); }
.auth-switch a, .back-link { color: var(--customer-primary-dark); }
.development-code { color: var(--customer-primary-dark); background: var(--customer-primary-soft); }
.otp-input { color: var(--customer-primary-dark); }

/* Discovery and business cards */
.welcome-panel { position: relative; margin: 18px 0 14px; padding: 16px 20px; overflow: hidden; border-color: #edd8cb; border-radius: 16px; background: linear-gradient(125deg, #fff 0%, #fff8f3 65%, #ffeadc 100%); box-shadow: 0 8px 22px rgba(89,45,24,.04); }
.welcome-panel::after { content: ""; position: absolute; width: 100px; height: 100px; right: -48px; top: -58px; border: 20px solid rgba(194,65,12,.05); border-radius: 50%; }
.welcome-panel .eyebrow { position: relative; margin-bottom: 3px; font-size: 10px; }
.welcome-panel h1 { position: relative; margin: 0 0 3px; color: var(--customer-ink); font-size: clamp(21px,3vw,27px); letter-spacing: -.03em; }
.welcome-panel .lead { position: relative; font-size: 13px; line-height: 1.4; }
.business-type-section { margin-top: 10px; }
.business-type-controls button { border-color: var(--customer-line); color: var(--customer-primary-dark); }
.business-type-controls button:hover { border-color: var(--customer-primary); background: var(--customer-primary); }
.business-type-pill { border-color: var(--customer-line); color: var(--customer-ink); box-shadow: 0 7px 20px rgba(89,45,24,.035); }
.business-type-pill:hover { color: var(--customer-primary-dark); border-color: #e3b59e; background: #fffaf7; }
.business-type-pill strong, .business-count { color: var(--customer-primary-dark); background: var(--customer-primary-soft); }
.business-type-pill.active { border-color: var(--customer-primary); background: linear-gradient(135deg, var(--customer-primary), var(--customer-primary-dark)); box-shadow: 0 10px 24px rgba(194,65,12,.2); }
.business-type-pill.active strong { color: var(--customer-primary-dark); background: #fff; }
.business-grid { gap: 18px; }
.business-card { border-color: var(--customer-line); box-shadow: 0 12px 32px rgba(89,45,24,.055); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.business-card:hover { border-color: #e5c2b0; transform: translateY(-3px); box-shadow: 0 18px 38px rgba(89,45,24,.09); }
.business-card-header, .business-card-footer { border-color: #f0e8e3; }
.business-card { min-height: 0; }
.business-card-info-group { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--customer-line); display: grid; gap: 9px; }
.business-card-info-group > strong { color: var(--customer-muted); font-size: 11px; }
.business-card-info-group .customer-payment-list { justify-content: flex-start; gap: 6px; }
.business-card-info-group .customer-payment-badge { padding: 6px 9px; font-size: 10px; }
.business-card-info-group .customer-payment-badge i { width: 16px; height: 16px; }
.business-mark, .business-detail-mark { background: linear-gradient(145deg, var(--customer-primary), var(--customer-primary-dark)); box-shadow: 0 9px 20px rgba(194,65,12,.17); }
.business-type, .business-name-link:hover, .business-card-footer a, .detail-back-link:hover, .branch-contact-list a:hover, .branch-map-link { color: var(--customer-primary-dark); }
.business-message { border-color: #e8d4c8; color: var(--customer-muted); background: #fff; }
.business-message strong { color: var(--customer-ink); }

/* Business details and payment */
.business-detail-hero, .customer-branch-card, .customer-payment-methods { border-color: var(--customer-line); box-shadow: 0 14px 38px rgba(89,45,24,.055); }
.business-detail-hero p, .customer-payment-empty { color: var(--customer-muted); }
.customer-branch-card header, .branch-map-link { border-color: #f0e8e3; }
.primary-branch-badge { color: var(--customer-primary-dark); background: var(--customer-primary-soft); }
.customer-working-hours { background: #fff8f3; }
.customer-payment-badge { border-color: #c9e5db; color: #14644b; background: #edf8f4; }
.customer-payment-badge i { background: var(--customer-success); }
.compact-business-detail { margin-top: 18px; }
.compact-detail-card { padding: 20px 22px; align-items: stretch; flex-direction: column; gap: 16px; border-radius: 18px; }
.compact-detail-card .business-detail-identity { gap: 14px; }
.compact-detail-card .business-detail-mark { width: 54px; height: 54px; border-radius: 15px; font-size: 21px; }
.business-detail-copy { min-width: 0; flex: 1; }
.compact-detail-card .business-type { display: block; margin-bottom: 2px; font-size: 10px; }
.business-title-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.compact-detail-card h1 { margin: 0; font-size: clamp(24px, 4vw, 34px); letter-spacing: -.035em; }
.compact-detail-card .detail-status { flex: 0 0 auto; }
.detail-card-group { padding-top: 13px; border-top: 1px solid var(--customer-line); display: grid; gap: 9px; }
.detail-card-group > strong { color: var(--customer-muted); font-size: 11px; }
.detail-card-group .customer-payment-list { justify-content: flex-start; }
.detail-card-group .customer-payment-badge { padding: 7px 10px; font-size: 11px; }

.inline-business-menu { margin-top: 18px; padding: 20px 22px 24px; border: 1px solid var(--customer-line); border-radius: 18px; background: #fff; box-shadow: 0 12px 34px rgba(89,45,24,.05); }
.inline-business-menu > header { margin-bottom: 18px; }
.inline-business-menu > header .eyebrow { margin-bottom: 3px; font-size: 10px; }
.inline-business-menu > header h2 { margin: 0; font-size: clamp(21px,3vw,27px); letter-spacing: -.025em; }
.inline-menu-category + .inline-menu-category { margin-top: 24px; }
.inline-menu-category-head { margin-bottom: 10px; }
.inline-menu-category-head h3 { margin: 0; font-size: 17px; }
.inline-menu-category-head p { margin: 3px 0 0; color: var(--customer-muted); font-size: 12px; }
.inline-menu-products { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.inline-menu-product { min-height: 112px; overflow: hidden; border: 1px solid var(--customer-line); border-radius: 14px; background: #fffaf7; display: grid; grid-template-columns: minmax(0, 1fr) auto; }
.inline-menu-product > div { padding: 14px; }
.inline-menu-product h4 { margin: 0; color: var(--customer-ink); font-size: 14px; }
.inline-menu-product p { margin: 5px 0 0; color: var(--customer-muted); font-size: 11px; line-height: 1.45; }
.inline-menu-product strong { display: block; margin-top: 11px; color: var(--customer-primary-dark); font-size: 14px; }
.inline-menu-product img { width: 108px; height: 100%; object-fit: cover; background: var(--customer-primary-soft); }
.inline-menu-empty { padding: 22px; border: 1px dashed var(--customer-line); border-radius: 13px; color: var(--customer-muted); background: #fffaf7; text-align: center; font-size: 13px; }

/* Profile and address */
.profile-hero, .profile-panel, .address-form-card, .profile-address-card { border-color: var(--customer-line); box-shadow: 0 12px 34px rgba(89,45,24,.05); }
.profile-hero { background: linear-gradient(120deg,#fff,#fff8f3); }
.profile-panel > header, .address-form-card > header, .profile-address-card > header { border-color: #f0e8e3; }
.profile-address-card.is-default { border-color: #e0a486; box-shadow: inset 0 0 0 1px #f1c9b4; }
.default-address-badge { color: var(--customer-primary-dark); background: var(--customer-primary-soft); }
.address-location { color: var(--customer-primary-dark); }
.default-address-choice, .customer-map-picker { border-color: #ebd8cd; background: #fff8f3; }
.customer-map-status { color: var(--customer-primary-dark); }
.customer-map-canvas { border-color: #dfc9bc; background: #f2e9e3; }
.customer-map-provider a { color: var(--customer-primary-dark); }

/* Informational pages */
.customer-info-page { max-width: 820px; margin: 42px auto 64px; }
.customer-info-hero { margin-bottom: 18px; padding: 30px; border: 1px solid var(--customer-line); border-radius: 22px; background: linear-gradient(125deg,#fff,#fff3eb); }
.customer-info-hero h1 { margin: 0 0 10px; font-size: clamp(30px,5vw,44px); letter-spacing: -.04em; }
.customer-info-hero p { margin: 0; color: var(--customer-muted); line-height: 1.7; }
.customer-info-card { padding: 26px; border: 1px solid var(--customer-line); border-radius: 18px; background: #fff; box-shadow: 0 12px 32px rgba(89,45,24,.05); }
.customer-info-list { margin: 0; padding-left: 20px; color: var(--customer-muted); line-height: 1.8; }
.request-code { padding: 4px 8px; border-radius: 7px; color: var(--customer-primary-dark); background: var(--customer-primary-soft); }

@media (max-width: 767px) {
    .customer-navbar { min-height: 66px; }
    .customer-brand img { width: 39px; height: 39px; }
    .customer-brand small, .customer-nav-links, .customer-user { display: none; }
    .customer-account { gap: 4px; }
    .customer-user-menu-copy, .customer-user-menu-chevron { display: none; }
    .customer-user-menu-trigger { min-height: 44px; padding: 2px; }
    .customer-user-menu-avatar { width: 40px; height: 40px; }
    .customer-register-link { padding-inline: 13px; }
    .customer-footer { display: none; }
    .customer-mobile-nav { position: fixed; z-index: 110; left: 12px; right: 12px; bottom: 10px; height: 64px; padding: 6px; border: 1px solid rgba(234,223,217,.92); border-radius: 18px; background: rgba(255,255,255,.94); box-shadow: 0 12px 35px rgba(72,38,22,.17); backdrop-filter: blur(14px); display: grid; grid-template-columns: repeat(2,1fr); }
    .customer-mobile-nav a { border-radius: 13px; color: var(--customer-muted); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; text-decoration: none; font-size: 10px; font-weight: 750; }
    .customer-mobile-nav a.active { color: var(--customer-primary-dark); background: var(--customer-primary-soft); }
    .customer-mobile-nav svg { width: 21px; height: 21px; stroke-width: 1.8; }
    .welcome-panel { margin-top: 12px; padding: 14px 16px; border-radius: 14px; }
    .compact-detail-card, .inline-business-menu { padding: 16px; }
    .inline-menu-products { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
    .customer-brand strong { font-size: 15px; }
    .customer-logout { padding-inline: 8px; font-size: 12px; }
    .auth-shell { padding-inline: 0; }
    .auth-card { border-radius: 20px; }
    .customer-info-page { margin-top: 24px; }
    .compact-detail-card .business-detail-identity { align-items: flex-start; }
    .inline-menu-product img { width: 88px; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
