/* === GLOBAL RESET & BASE === */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: "Segoe UI", Roboto, Arial, sans-serif; background-color: #eaeded; color: #111; line-height: 1.5; overflow-x: hidden; }
body.no-scroll { overflow: hidden; }
a { text-decoration: none; transition: 0.2s; color: inherit; }
ul { list-style: none; }

/* === NAVIGATION === */
#navbar { background-color: #0071dc; color: white; position: sticky; top: 0; z-index: 1000; }
#nav-belt { display: flex; align-items: center; max-width: 1500px; margin: 0 auto; padding: 10px 20px; height: 60px; gap: 12px; }
.nav-hamburger { display: flex; flex-direction: column; gap: 5px; cursor: pointer; padding: 8px; flex-shrink: 0; }
.nav-hamburger span { display: block; width: 22px; height: 2px; background: white; border-radius: 2px; }
.nav-logo { font-size: 26px; font-weight: bold; color: white; white-space: nowrap; flex-shrink: 0; }
.nav-logo-tagline { font-size: 16px; font-weight: 500; opacity: 0.9; }

#nav-search { flex-grow: 1; display: flex; height: 44px; border-radius: 8px; overflow: hidden; background: white; max-width: 800px; border: 2px solid transparent; }
#nav-search:focus-within { border: 2px solid #ffc220; }
#searchDropdownBox { background-color: #f3f3f3; border: none; border-right: 1px solid #ddd; padding: 0 10px; outline: none; cursor: pointer; font-size: 13px; color: #555; max-width: 150px; }
#twotabsearchtextbox { flex-grow: 1; border: none; padding: 0 15px; outline: none; font-size: 16px; color: #111; width: 100%; }
#nav-search-submit-button { background: #ffc220; border: none; padding: 0 18px; cursor: pointer; font-size: 20px; color: #333; border-radius: 0 8px 8px 0; }

.nav-tools { display: flex; gap: 18px; align-items: center; font-size: 12px; white-space: nowrap; margin-left: auto; }
.nav-tools b { font-size: 14px; display: block; }
.nav-signin-link { display: flex; align-items: center; gap: 6px; color: white; cursor: pointer; }
.nav-signin-link .signin-text { font-size: 14px; font-weight: 600; }
.nav-signin-link .signin-icon { font-size: 28px; }
.nav-profile-link { display: flex; align-items: center; color: white; font-size: 26px; cursor: pointer; padding: 4px 6px; border-radius: 50%; transition: background 0.2s; }
.nav-profile-link:hover { background: rgba(255,255,255,0.15); }
.nav-profile-link .profile-icon { font-size: 26px; }
.nav-cart-link { display: flex; align-items: center; gap: 2px; color: white; font-size: 28px; position: relative; }
.nav-cart-link .cart-badge { position: absolute; top: -4px; right: -8px; font-size: 12px; background: #ffc220; color: #111; padding: 1px 5px; border-radius: 50%; font-weight: bold; min-width: 18px; text-align: center; }

/* Desktop Header Override */
#nav-belt.desktop-header-v2 { gap: 10px; min-height: 68px; height: auto; padding: 8px 16px; }
#nav-belt.desktop-header-v2 .nav-logo-link { display: flex; align-items: center; border: 1px solid transparent; border-radius: 4px; padding: 8px 10px; font-weight: 800; font-size: 24px; letter-spacing: 0.2px; }
#nav-belt.desktop-header-v2 .nav-logo-link:hover { border-color: rgba(255,255,255,0.85); }
#nav-belt.desktop-header-v2 .desktop-header-location { display: flex; align-items: center; gap: 6px; border: 1px solid transparent; border-radius: 4px; padding: 8px; min-width: 182px; }
#nav-belt.desktop-header-v2 .desktop-header-location:hover { border-color: rgba(255,255,255,0.85); }
#nav-belt.desktop-header-v2 .desktop-header-location-icon { font-size: 20px; line-height: 1; }
#nav-belt.desktop-header-v2 .nav-line-1 { display: block; font-size: 12px; line-height: 1.2; opacity: 0.95; }
#nav-belt.desktop-header-v2 .nav-line-2 { display: block; font-size: 14px; line-height: 1.2; font-weight: 700; }
#nav-belt.desktop-header-v2 #nav-search { flex: 1 1 auto; max-width: none; min-width: 300px; }
#nav-belt.desktop-header-v2 #searchDropdownBox { max-width: 200px; font-size: 12px; }
#nav-belt.desktop-header-v2 .desktop-header-reorder { color: #fff; padding: 8px 10px; border: 1px solid transparent; border-radius: 4px; line-height: 1.1; font-size: 12px; white-space: nowrap; }
#nav-belt.desktop-header-v2 .desktop-header-reorder:hover { border-color: rgba(255,255,255,0.85); }
#nav-belt.desktop-header-v2 .desktop-header-account-trigger { display: flex; align-items: center; gap: 8px; border: 1px solid transparent; padding: 6px 10px; white-space: nowrap; }
#nav-belt.desktop-header-v2 .desktop-header-account-trigger:hover { border-color: rgba(255,255,255,0.85); background: rgba(255,255,255,0.12); }
#nav-belt.desktop-header-v2 .cart-button-redesigned { color: #fff; border: 1px solid transparent; padding: 6px 10px; min-width: 96px; }
#nav-belt.desktop-header-v2 .cart-button-redesigned:hover { border-color: rgba(255,255,255,0.85); background: rgba(255,255,255,0.12); }
#nav-belt.desktop-header-v2 .cart-badge-redesigned { top: -2px; right: 10px; font-size: 12px; background: #ffc220; color: #0f1111; border-radius: 10px; min-width: 18px; text-align: center; font-weight: 700; }
#nav-belt.desktop-header-v2 .redesigned-cart-total { font-size: 13px; font-weight: 700; line-height: 1; margin-top: 2px; }

/* Mobile Search */
.mobile-search-container { display: none; background: #005bb5; padding: 8px 16px 10px; }
.mobile-search-bar { display: flex; height: 44px; border-radius: 8px; overflow: hidden; background: white; border: 2px solid transparent; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.mobile-search-bar:focus-within { border: 2px solid #ffc220; }
.mobile-search-bar input { flex: 1; border: none; padding: 0 14px; font-size: 16px; outline: none; }
.mobile-search-bar button { background: #ffc220; border: none; padding: 0 16px; cursor: pointer; font-size: 18px; }

/* DEPARTMENTS BAR */
#nav-main { background-color: #005bb5; height: 40px; display: flex; align-items: center; padding: 0 20px; overflow: hidden; }
#nav-all-button { cursor: pointer; font-weight: bold; font-size: 14px; color: white; margin-right: 20px; display: flex; align-items: center; gap: 5px; flex-shrink: 0; }
.nav-main-hamburger { display: none; align-items: center; gap: 8px; border: 0; background: transparent; color: #fff; font-size: 14px; font-weight: 700; cursor: pointer; padding: 5px 8px; border-radius: 4px; }
.nav-main-hamburger:hover { background-color: rgba(255,255,255,0.15); }
.nav-main-hamburger-icon { display: flex; flex-direction: column; gap: 3px; }
.nav-main-hamburger-icon span { display: block; width: 16px; height: 2px; background: #fff; border-radius: 2px; }
.nav-ul { display: flex; align-items: center; gap: 5px; overflow-x: auto; scrollbar-width: none; }
.nav-ul::-webkit-scrollbar { display: none; }
.nav-ul-desktop { flex: 1; min-width: 0; }
.nav-ul-mobile-preserved { display: flex; }
.nav-a { color: white; font-size: 13px; white-space: nowrap; padding: 5px 8px; border-radius: 4px; }
.nav-a:hover { background-color: rgba(255,255,255,0.15); }

/* === OVERLAY === */
#overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); display: none; z-index: 1500; }
#overlay.active { display: block; }

/* === SIDEBARS === */
#sidebar, #login-sidebar { position: fixed; top: 0; width: 320px; height: 100%; background: white; z-index: 2000; transition: 0.3s; overflow-y: auto; box-shadow: 0 0 15px rgba(0,0,0,0.3); }
#sidebar { left: -320px; }
#sidebar.active { left: 0; }
#login-sidebar { right: -380px; width: 380px; }
#login-sidebar.active { right: 0; }

.sidebar-header { background: #0071dc; color: white; padding: 20px; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.sidebar-profile-icon { display: none; font-size: 28px; color: white; text-decoration: none; flex-shrink: 0; border-radius: 50%; padding: 2px 6px; transition: background 0.2s; }
.sidebar-profile-icon:hover { background: rgba(255,255,255,0.2); }
.sidebar-section { padding: 0; }
.sidebar-section-title { font-weight: 700; font-size: 15px; padding: 14px 20px 8px; color: #111; }
.sidebar-link { display: flex; align-items: center; justify-content: space-between; padding: 10px 20px; font-size: 14px; color: #333; transition: background 0.15s; cursor: pointer; }
.sidebar-link:hover { background: #f0f0f0; }
.sidebar-link-arrow { color: #999; font-size: 12px; }
.sidebar-divider { border: none; border-top: 1px solid #eee; margin: 8px 0; }
.sidebar-compact-menu { background: #0071dc; color: #fff; min-height: 100%; padding: 16px 18px 22px; }
.sidebar-compact-signin { display: inline-block; background: #ffd814; color: #0f1111; padding: 8px 18px; border-radius: 999px; font-size: 14px; font-weight: 700; margin-bottom: 16px; }
.sidebar-compact-signin:hover { background: #f7ca00; }
.sidebar-compact-title { font-size: 12px; text-transform: uppercase; letter-spacing: 0.8px; color: rgba(255,255,255,0.68); margin: 10px 0 10px; }
.sidebar-compact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 18px; row-gap: 10px; margin-bottom: 14px; }
.sidebar-compact-grid-tight { row-gap: 8px; }
.sidebar-compact-link { color: #f2f5f8; font-size: 16px; line-height: 1.18; padding: 2px 0; }
.sidebar-compact-link:hover { text-decoration: underline; color: #fff; }

/* === AUTH WORKFLOW (Login Sidebar) === */
.auth-workflow { padding: 25px; font-size: 13px; }
.a-box { border: 1px solid #ddd; border-radius: 4px; padding: 20px; margin-top: 15px; background: white; }
.nav-action-signin-button {
    background: #0071dc; border: none; border-radius: 20px; padding: 10px;
    display: block; text-align: center; font-weight: 600; color: white; margin: 15px 0; cursor: pointer;
}
.nav-action-signin-button:hover { background: #005bb5; }
#ap_login_form input { width: 100%; padding: 10px; border: 1px solid #a6a6a6; border-radius: 3px; margin-top: 5px; outline: none; }
#ap_login_form input:focus { border-color: #0071dc; box-shadow: 0 0 3px 2px rgba(0,113,220,0.5); }

/* === DELIVERY BAR === */
.delivery-bar { background: #f2f2f2; color: #333; padding: 0; border-bottom: 1px solid #ddd; position: relative; z-index: 900; }
.delivery-bar-inner { max-width: 1500px; margin: 0 auto; display: flex; align-items: center; padding: 0 20px; height: 48px; gap: 8px; font-size: 14px; flex-wrap: nowrap; }
.delivery-toggle { display: flex; background: #e0e0e0; border-radius: 24px; overflow: hidden; flex-shrink: 0; }
.delivery-toggle-btn { padding: 6px 16px; border: none; background: transparent; cursor: pointer; font-size: 13px; font-weight: 600; color: #555; border-radius: 24px; transition: all 0.2s; white-space: nowrap; }
.delivery-toggle-btn.active { background: #0071dc; color: white; }
.delivery-speed { display: flex; gap: 6px; margin-left: 12px; flex-shrink: 0; }
.speed-pill { padding: 4px 12px; border-radius: 16px; font-size: 12px; border: 1px solid #ccc; background: white; cursor: pointer; transition: all 0.2s; white-space: nowrap; user-select: none; }
.speed-pill.active { border-color: #0071dc; background: #e6f0ff; color: #0071dc; font-weight: 600; }
.speed-pill:hover { border-color: #0071dc; }
.delivery-address { margin-left: auto; display: flex; align-items: center; gap: 6px; cursor: pointer; padding: 6px 12px; border-radius: 20px; transition: background 0.2s; flex-shrink: 0; }
.delivery-address:hover { background: #e0e0e0; }
.delivery-address-icon { font-size: 18px; }
.delivery-address-text { font-size: 13px; white-space: nowrap; }
.delivery-address-text span { font-weight: 700; text-decoration: underline; }
.delivery-time-est { font-size: 12px; color: #0071dc; font-weight: 600; margin-left: 12px; white-space: nowrap; flex-shrink: 0; }

/* Delivery window button */
.delivery-window-btn { display: flex; align-items: center; gap: 6px; padding: 6px 16px; border-radius: 20px; font-size: 13px; font-weight: 600; border: 1px solid #0071dc; background: #e6f0ff; color: #0071dc; cursor: pointer; transition: all 0.2s; white-space: nowrap; flex-shrink: 0; margin-left: 8px; }
.delivery-window-btn:hover { background: #0071dc; color: white; }
.delivery-window-icon { font-size: 15px; }
.delivery-window-arrow { font-size: 10px; }

/* Store button in delivery bar */
.delivery-store-btn { display: flex; align-items: center; gap: 4px; padding: 4px 12px; border-radius: 16px; font-size: 12px; border: 1px solid #ccc; background: white; cursor: pointer; transition: all 0.2s; white-space: nowrap; flex-shrink: 0; }
.delivery-store-btn:hover { border-color: #0071dc; background: #e6f0ff; }
.delivery-store-name { font-weight: 600; max-width: 140px; overflow: hidden; text-overflow: ellipsis; }

/* === TIMESLOT PANEL === */
.delivery-timeslot-panel { display: none; position: absolute; top: 100%; left: 0; right: 0; background: white; border-bottom: 2px solid #0071dc; box-shadow: 0 8px 24px rgba(0,0,0,0.15); z-index: 901; }
.delivery-timeslot-panel.active { display: block; }
.timeslot-panel-inner { max-width: 1500px; margin: 0 auto; padding: 20px; }
.timeslot-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.timeslot-header h3 { font-size: 18px; color: #0f1111; }
.timeslot-close { font-size: 20px; cursor: pointer; color: #666; padding: 4px 8px; border-radius: 50%; transition: background 0.2s; }
.timeslot-close:hover { background: #f0f0f0; }

/* Day tabs */
.timeslot-days { display: flex; gap: 4px; overflow-x: auto; padding-bottom: 12px; border-bottom: 1px solid #eee; margin-bottom: 16px; scrollbar-width: none; }
.timeslot-days::-webkit-scrollbar { display: none; }
.timeslot-day-tab { padding: 10px 16px; border: 2px solid #e0e0e0; border-radius: 12px; cursor: pointer; text-align: center; min-width: 90px; flex-shrink: 0; transition: all 0.2s; }
.timeslot-day-tab:hover { border-color: #0071dc; }
.timeslot-day-tab.active { border-color: #0071dc; background: #e6f0ff; }
.timeslot-day-name { font-weight: 700; font-size: 14px; color: #0f1111; }
.timeslot-day-date { font-size: 11px; color: #666; margin-top: 2px; }

/* Slot grid */
.timeslot-grid { display: none; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; }
.timeslot-grid.active { display: grid; }
.timeslot-slot { padding: 12px; border: 2px solid #e0e0e0; border-radius: 10px; text-align: center; cursor: pointer; transition: all 0.2s; }
.timeslot-slot:hover { border-color: #0071dc; background: #f8fbff; }
.timeslot-slot.selected { border-color: #0071dc; background: #e6f0ff; }
.timeslot-slot.unavailable { opacity: 0.5; cursor: not-allowed; background: #f8f8f8; }
.timeslot-slot.unavailable:hover { border-color: #e0e0e0; background: #f8f8f8; }
.timeslot-slot-time { font-weight: 600; font-size: 14px; color: #0f1111; }
.timeslot-slot-price { font-size: 12px; color: #2a8703; margin-top: 4px; }
.timeslot-slot-full { font-size: 11px; color: #cc0000; margin-top: 4px; font-weight: 600; }
.timeslot-empty { padding: 30px; text-align: center; color: #666; font-size: 14px; }

/* === STORE SELECTOR PANEL === */
.delivery-store-panel { display: none; position: absolute; top: 100%; left: 0; right: 0; background: white; border-bottom: 2px solid #0071dc; box-shadow: 0 8px 24px rgba(0,0,0,0.15); z-index: 901; }
.delivery-store-panel.active { display: block; }
.store-panel-inner { max-width: 1500px; margin: 0 auto; padding: 20px; }
.store-panel-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.store-panel-header h3 { font-size: 18px; color: #0f1111; }
.store-panel-close { font-size: 20px; cursor: pointer; color: #666; padding: 4px 8px; border-radius: 50%; transition: background 0.2s; }
.store-panel-close:hover { background: #f0f0f0; }

/* Store search */
.store-search { display: flex; gap: 8px; margin-bottom: 16px; }
.store-search input { flex: 1; padding: 10px 14px; border: 1px solid #ccc; border-radius: 8px; font-size: 14px; outline: none; max-width: 400px; }
.store-search input:focus { border-color: #0071dc; box-shadow: 0 0 0 2px rgba(0,113,220,0.2); }
.store-search button { padding: 10px 20px; background: #0071dc; color: white; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; font-size: 14px; }
.store-search button:hover { background: #005bb5; }

/* Store list */
.store-list { display: flex; flex-direction: column; gap: 8px; max-height: 360px; overflow-y: auto; }
.store-item { display: flex; align-items: center; gap: 14px; padding: 14px; border: 2px solid #eee; border-radius: 12px; cursor: pointer; transition: all 0.2s; }
.store-item:hover { border-color: #0071dc; background: #fafafa; }
.store-item.selected { border-color: #0071dc; background: #e6f0ff; }
.store-item-icon { font-size: 28px; flex-shrink: 0; }
.store-item-info { flex: 1; min-width: 0; }
.store-item-name { font-weight: 700; font-size: 15px; color: #0f1111; }
.store-item-address { font-size: 13px; color: #555; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.store-item-meta { display: flex; gap: 12px; margin-top: 4px; font-size: 12px; color: #666; }
.store-item-distance { color: #0071dc; font-weight: 600; }
.store-item-type { text-transform: capitalize; background: #f0f0f0; padding: 1px 8px; border-radius: 10px; }
.store-item-action { flex-shrink: 0; }
.store-select-btn { padding: 8px 18px; border: 2px solid #0071dc; background: white; color: #0071dc; border-radius: 20px; font-weight: 600; cursor: pointer; font-size: 13px; transition: all 0.2s; }
.store-select-btn:hover { background: #0071dc; color: white; }
.store-selected-check { color: #2a8703; font-weight: 700; font-size: 13px; }

/* Address Modal - Amazon/Walmart style */
#address-modal { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: white; padding: 0; z-index: 3000; border-radius: 12px; width: 420px; max-width: 90vw; max-height: 90vh; overflow-y: auto; box-shadow: 0 4px 24px rgba(0,0,0,0.3); }
#address-modal.active { display: block; }
.address-modal-header { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px 0; }
.address-modal-header h3 { font-size: 20px; font-weight: 700; color: #0f1111; margin: 0; }
.address-modal-close { font-size: 22px; cursor: pointer; color: #666; padding: 4px 8px; border-radius: 50%; transition: background 0.2s; }
.address-modal-close:hover { background: #f0f0f0; }
.address-modal-subtitle { font-size: 13px; color: #666; padding: 4px 24px 16px; margin: 0; }
.address-modal-divider { height: 1px; background: #e0e0e0; margin: 0; }
.address-signin-section { padding: 16px 24px; }
.address-signin-btn { width: 100%; padding: 14px; background: #ffc220; color: #0f1111; border: none; border-radius: 25px; font-size: 15px; font-weight: 600; cursor: pointer; transition: background 0.2s; }
.address-signin-btn:hover { background: #e0aa00; }

/* Location options list */
.address-location-options { padding: 8px 0; }
.address-option { display: flex; align-items: center; gap: 12px; padding: 14px 24px; cursor: pointer; transition: background 0.15s; }
.address-option:hover { background: #f5f5f5; }
.address-option-icon { font-size: 18px; flex-shrink: 0; width: 24px; text-align: center; }
.address-option-text { flex: 1; font-size: 15px; color: #0071dc; font-weight: 500; }
.address-option-arrow { font-size: 20px; color: #999; }

/* GPS loading spinner */
.gps-loading-section { display: flex; flex-direction: column; align-items: center; padding: 30px 24px; gap: 12px; }
.gps-spinner { width: 36px; height: 36px; border: 3px solid #e0e0e0; border-top-color: #0071dc; border-radius: 50%; animation: spin 0.8s linear infinite; }

/* GPS result */
.gps-result-section { display: flex; align-items: center; gap: 12px; padding: 16px 24px; background: #f0f9f0; border: 1px solid #2a8703; border-radius: 8px; margin: 12px 24px; }
.gps-result-icon { font-size: 24px; flex-shrink: 0; }
.gps-result-info { flex: 1; min-width: 0; }
.gps-result-address { font-size: 14px; font-weight: 600; color: #0f1111; word-break: break-word; }
.gps-result-coords { font-size: 11px; color: #666; margin-top: 2px; }
.gps-result-use-btn { padding: 8px 18px; background: #0071dc; color: white; border: none; border-radius: 20px; font-weight: 600; font-size: 13px; cursor: pointer; flex-shrink: 0; }
.gps-result-use-btn:hover { background: #005bb5; }

/* ZIP code entry */
.zip-entry-section { padding: 16px 24px; }
.zip-entry-back { color: #0071dc; font-size: 14px; cursor: pointer; margin-bottom: 12px; font-weight: 500; }
.zip-entry-back:hover { text-decoration: underline; }
.zip-entry-label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 8px; color: #0f1111; }
.zip-entry-row { display: flex; gap: 8px; }
.zip-entry-input { flex: 1; padding: 10px 14px; border: 1px solid #ccc; border-radius: 8px; font-size: 16px; outline: none; }
.zip-entry-input:focus { border-color: #0071dc; box-shadow: 0 0 0 2px rgba(0,113,220,0.2); }
.zip-entry-apply-btn { padding: 10px 20px; background: #0071dc; color: white; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; font-size: 14px; }
.zip-entry-apply-btn:hover { background: #005bb5; }
.zip-result-info { margin-top: 10px; font-size: 14px; }

/* Full address form panel */
.full-address-section { padding: 16px 24px; }
.address-input-group { display: flex; gap: 8px; margin-bottom: 12px; }
.address-input-group input { flex: 1; padding: 10px 14px; border: 1px solid #ccc; border-radius: 8px; font-size: 14px; outline: none; }
.address-input-group input:focus { border-color: #0071dc; box-shadow: 0 0 0 2px rgba(0,113,220,0.2); }
.address-input-group button { padding: 10px 20px; background: #0071dc; color: white; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; }
.saved-addresses { margin-top: 16px; }
.saved-addresses h4 { font-size: 13px; color: #666; margin-bottom: 8px; }
.saved-address-item { display: flex; align-items: center; gap: 10px; padding: 10px; border: 1px solid #eee; border-radius: 8px; margin-bottom: 8px; cursor: pointer; transition: background 0.2s; }
.saved-address-item:hover { background: #f5f5f5; }
.saved-address-item.selected { border-color: #0071dc; background: #e6f0ff; }

/* === MAIN & PRODUCTS === */
main { max-width: 1500px; margin: 0 auto; padding: 0 20px; }
section { background: white; margin-bottom: 20px; padding: 20px; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.product-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px; }
.product-card { border: 1px solid #eee; padding: 15px; border-radius: 8px; text-align: center; transition: 0.2s; cursor: pointer; }
.product-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.12); transform: translateY(-2px); }
.product-card img { max-width: 100%; height: 180px; object-fit: contain; margin-bottom: 10px; }
.price { font-weight: bold; font-size: 20px; color: #0071dc; }
.add-btn { background: #ffc220; color: #0f1111; border: none; padding: 10px 15px; border-radius: 20px; cursor: pointer; width: 100%; margin-top: 10px; font-weight: bold; }
.add-btn:hover { background: #e0aa00; }

/* === AMAZON-STYLE MOBILE GROCERY SECTION === */
.amz-grocery { background: #fff; margin-bottom: 20px; border-radius: 0; overflow: hidden; }
.amz-grocery-topbar { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid #e7e7e7; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.amz-grocery-topbar::-webkit-scrollbar { display: none; }
.amz-filter-icon { background: none; border: 1px solid #d5d9d9; border-radius: 8px; padding: 6px 10px; font-size: 16px; color: #0f1111; cursor: pointer; flex-shrink: 0; }
.amz-prime-badge { color: #007185; font-weight: 700; font-size: 14px; flex-shrink: 0; white-space: nowrap; }
.amz-filter-pills { display: flex; gap: 8px; flex-shrink: 0; }
.amz-pill { background: #fff; border: 1px solid #d5d9d9; border-radius: 20px; padding: 7px 16px; font-size: 13px; font-weight: 500; white-space: nowrap; cursor: pointer; color: #0f1111; transition: all 0.15s; }
.amz-pill:hover { background: #f0f0f0; }
.amz-pill-active { background: #0f1111; color: #fff; border-color: #0f1111; }

/* Amazon Product Feed List */
.amz-product-feed { padding: 0; }
.amz-product-item { display: flex; align-items: flex-start; padding: 16px 12px; border-bottom: 1px solid #e7e7e7; cursor: pointer; gap: 0; transition: background 0.15s; }
.amz-product-item:hover { background: #f7fafa; }
.amz-product-item:last-child { border-bottom: none; }

.amz-item-actions-left,
.amz-item-actions-right { flex-shrink: 0; padding-top: 2px; width: 28px; }
.amz-save-btn { background: none; border: none; font-size: 18px; color: #565959; cursor: pointer; padding: 4px; }

.amz-item-img { flex-shrink: 0; width: 120px; height: 120px; display: flex; align-items: center; justify-content: center; margin-right: 12px; }
.amz-item-img img { max-width: 100%; max-height: 100%; object-fit: contain; }

.amz-item-details { flex: 1; min-width: 0; }

.amz-badges { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 4px; }
.amz-badge { padding: 2px 6px; border-radius: 3px; font-size: 11px; font-weight: 500; display: inline-block; }
.amz-badge-sponsored { background: #f0f0f0; color: #565959; }
.amz-badge-bestseller { background: #e47911; color: #fff; font-weight: 700; }
.amz-badge-toprated { background: #e47911; color: #fff; font-weight: 700; }

.amz-item-name { font-size: 14px; line-height: 1.35; color: #0f1111; margin-bottom: 2px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.amz-item-size { font-size: 12px; color: #565959; margin-bottom: 2px; }

.amz-item-rating { display: flex; align-items: center; gap: 3px; margin-bottom: 2px; }
.amz-rating-val { font-size: 12px; color: #0f1111; }
.amz-stars { color: #e77600; font-size: 13px; letter-spacing: -1px; }
.amz-review-count { font-size: 12px; color: #007185; }

.amz-bought-text { font-size: 12px; color: #565959; margin-bottom: 2px; }

.amz-price-row { display: flex; align-items: flex-start; gap: 0; margin-bottom: 2px; }
.amz-price-symbol { font-size: 12px; position: relative; top: 2px; color: #0f1111; }
.amz-price-dollars { font-size: 22px; font-weight: 400; line-height: 1; color: #0f1111; }
.amz-price-cents { font-size: 12px; position: relative; top: 2px; color: #0f1111; }
.amz-price-unit { font-size: 12px; color: #565959; margin-left: 4px; align-self: center; }

.amz-snap { font-size: 12px; color: #565959; margin-bottom: 2px; }
.amz-delivery { font-size: 12px; color: #565959; margin-bottom: 8px; line-height: 1.3; }
.amz-delivery b, .amz-delivery strong { color: #0f1111; }

.amz-add-cart-btn { background: #ffd814; color: #0f1111; border: 1px solid #fcd200; border-radius: 20px; padding: 8px 0; font-size: 13px; font-weight: 500; cursor: pointer; width: 100%; max-width: 260px; transition: background 0.15s; }
.amz-add-cart-btn:hover { background: #f7ca00; }

/* Grocery Image Feed */
.grocery-image-feed { padding: 0; }
.grocery-image-card { border-bottom: 1px solid #e7e7e7; }
.grocery-image-card:last-child { border-bottom: none; }
.grocery-image-card img { width: 100%; display: block; }

@media (min-width: 769px) {
  .grocery-image-feed { max-width: 700px; margin: 0 auto; }
}
@media (max-width: 480px) {
  .amz-item-img { width: 100px; height: 100px; }
  .amz-item-actions-left, .amz-item-actions-right { width: 24px; }
  .amz-product-item { padding: 12px 8px; }
}

/* Legacy grocery styles kept for category page */
.grocery-section-amazon { background: white; margin-bottom: 20px; padding: 0; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); overflow: hidden; }
.grocery-list { padding: 0 16px 16px; }
.grocery-list .product-list { grid-template-columns: 1fr !important; gap: 0 !important; }
.grocery-list .product-card,
.grocery-card { display: flex !important; flex-direction: row !important; align-items: flex-start !important; text-align: left !important; padding: 16px 0 !important; border: none !important; border-bottom: 1px solid #e7e7e7 !important; border-radius: 0 !important; gap: 12px; }
.grocery-card img { width: 120px !important; height: 120px !important; object-fit: contain !important; margin-bottom: 0 !important; flex-shrink: 0; }
.grocery-card .price { justify-content: flex-start !important; }
.grocery-card:hover { box-shadow: none !important; transform: none !important; background: #f7fafa; }

.smithmarts-add-btn { background: #ffd814 !important; color: #0f1111 !important; border: 1px solid #fcd200 !important; border-radius: 20px !important; padding: 8px 20px !important; font-size: 13px !important; font-weight: 500 !important; cursor: pointer; width: auto !important; margin-top: 8px !important; }
.smithmarts-add-btn:hover { background: #f7ca00 !important; }

@media (min-width: 769px) {
  .grocery-list .product-list { grid-template-columns: 1fr !important; max-width: 800px; margin: 0 auto; }
  .grocery-card img { width: 140px !important; height: 140px !important; }
}

@media (max-width: 768px) {
  .grocery-card img { width: 100px !important; height: 100px !important; }
}

/* Grocery delivery badges */
.grocery-card .delivery-plus-tag {
  display: inline-flex; align-items: center; gap: 4px;
  background: #0071dc; color: white; padding: 2px 8px;
  border-radius: 3px; font-size: 11px; font-weight: 700;
}
.grocery-card .delivery-sameday-tag {
  font-size: 12px; color: #1a8a1a; font-weight: 600;
}


/* PLUS HERO SECTION */
.plus-hero-container { background: #0071dc; color: white; display: flex; flex-direction: column; align-items: flex-start; padding: 40px; border-radius: 8px; margin-bottom: 20px; cursor: pointer; position: relative; overflow: hidden; transition: transform 0.2s; }
.plus-hero-container:hover { transform: scale(1.005); box-shadow: 0 4px 20px rgba(0,113,220,0.4); }
.plus-hero-link { color: white; text-decoration: none; display: block; }
.btn-join-plus { background: #ffc220; color: #111; padding: 12px 24px; border-radius: 25px; font-weight: bold; display: inline-block; margin: 15px 0; }
.hero-click-hint { position: absolute; top: 15px; right: 20px; background: rgba(255,255,255,0.2); padding: 4px 12px; border-radius: 12px; font-size: 12px; }

/* Category quick links */
.category-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; padding: 10px 0; }
.category-card { display: flex; flex-direction: column; align-items: center; padding: 18px 10px; border-radius: 10px; background: #f8f8f8; text-align: center; font-size: 13px; font-weight: 600; transition: all 0.2s; cursor: pointer; text-decoration: none; color: #111; }
.category-card:hover { background: #e6f0ff; transform: translateY(-2px); }
.category-card-icon { font-size: 28px; margin-bottom: 8px; }

/* === FOOTER === */
footer { background: #0071dc; color: white; margin-top: 40px; }

/* Back to top */
.navFooterBackToTop { background: #005bb5; text-align: center; padding: 14px; cursor: pointer; font-size: 13px; color: white; font-weight: 600; line-height: 1.4; }
.navFooterBackToTop:hover { background: #004f9a; }

/* Mobile two-column nav links (Amazon-style) */
.footer-nav-links { background: #005bb5; padding: 24px 20px; }
.footer-nav-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; max-width: 600px; margin: 0 auto; }
.footer-nav-grid a { display: block; color: white; font-size: 15px; font-weight: 400; text-decoration: none; padding: 12px 4px; border-bottom: 1px solid rgba(255,255,255,0.1); }
.footer-nav-grid a:hover { text-decoration: underline; }

/* Desktop 4-column footer */
.footer-desktop-columns { display: none; max-width: 1000px; margin: 0 auto; padding: 40px 20px; }
.footer-desktop-columns > div { min-width: 0; }
.footer-col-heading { font-weight: 700; font-size: 16px; margin-bottom: 12px; color: white; }
.footer-desktop-columns a { display: block; color: #ddd; font-size: 13px; text-decoration: none; margin-bottom: 7px; line-height: 1.4; }
.footer-desktop-columns a:hover { text-decoration: underline; }

/* Footer locale/sign-in area */
.footer-middle { background: #0071dc; padding: 20px; text-align: center; border-top: 1px solid rgba(255,255,255,0.15); }
.footer-middle-inner { max-width: 600px; margin: 0 auto; display: flex; align-items: center; justify-content: center; gap: 20px; flex-wrap: wrap; }
.footer-locale-btn { display: inline-flex; align-items: center; gap: 6px; color: white; font-size: 14px; text-decoration: none; border: 1px solid rgba(255,255,255,0.35); border-radius: 4px; padding: 8px 14px; }
.footer-locale-btn:hover { border-color: white; }
.footer-signin-row { text-align: center; padding: 20px; }
.footer-signin-row a { color: #0071dc; font-size: 16px; font-weight: 600; text-decoration: none; }
.footer-signin-row a:hover { text-decoration: underline; }

/* Footer legal links */
.footer-legal { text-align: center; padding: 12px 20px 8px; border-top: 1px solid rgba(255,255,255,0.1); }
.footer-legal a { color: rgba(255,255,255,0.7); font-size: 12px; text-decoration: none; margin: 0 8px; display: inline-block; padding: 4px 0; }
.footer-legal a:hover { text-decoration: underline; color: white; }

/* Footer copyright */
.footer-copy { text-align: center; font-size: 12px; color: rgba(255,255,255,0.6); padding: 8px 20px 12px; }

/* Footer brand pill */
.footer-brand-pill { text-align: center; padding: 16px 20px 24px; }
.footer-brand-pill { display: inline-block; background: white; color: #0f1111; padding: 10px 28px; border-radius: 30px; font-size: 14px; font-weight: 700; margin: 0 auto; }
.page-footer .footer-brand-pill { display: block; text-align: center; background: transparent; }
.page-footer .footer-brand-pill::after { content: 'Smithmarts.com'; display: inline-block; background: white; color: #0f1111; padding: 10px 28px; border-radius: 30px; font-size: 14px; font-weight: 700; }

/* Service footer grid (desktop only) */
.navFooterMoreOnAmazon { border-top: 1px solid #2D7FCC; margin-top: 14px; padding-top: 14px; text-align: center; }
.navFooterMoreOnAmazon ul { display: flex; justify-content: center; gap: 18px; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; }
.navFooterDescItem { min-width: 180px; max-width: 260px; text-align: left; }
.navFooterDescItem a { display: block; color: #ddd; font-size: 13px; text-decoration: none; }
.navFooterDescItem a:hover { text-decoration: underline; }
.navFooterDescItem_heading { margin: 0 0 4px; font-size: 14px; font-weight: 700; color: #fff; }
.navFooterDescText { font-size: 12px; color: rgba(255,255,255,0.8); line-height: 1.35; }
.navFooterDescSpacer { display: none; }
.navFooterLine { padding: 20px 0; }
.navFooterMoreOnsmithsWrapper { max-width: 1200px; margin: 0 auto; }
.navFooterMoreOnsmithsWrapper ul { margin-bottom: 16px; }
.navFooterDescLine { display: none; }

/* Desktop: show columns, hide mobile grid, show service footer */
@media (min-width: 769px) {
  .footer-nav-links { display: none; }
  .footer-desktop-columns { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
  .navFooterDescLine { display: block; }
  .footer-brand-pill { display: none; }
}

/* Mobile: hide columns, show mobile grid */
@media (max-width: 768px) {
  .footer-nav-links { display: block; }
  .footer-desktop-columns { display: none; }
  .navFooterDescLine { display: none; }
}

/* Legacy compat */
.footer-bottom { border-top: 1px solid rgba(255,255,255,0.15); padding: 20px 20px 30px; text-align: center; font-size: 12px; color: rgba(255,255,255,0.7); background: #004a9e; }
.footer-bottom-links { display: flex; justify-content: center; gap: 20px; flex-wrap: wrap; margin-bottom: 12px; }
.footer-bottom-links a { color: rgba(255,255,255,0.7); font-size: 12px; }
.footer-bottom-links a:hover { text-decoration: underline; color: white; }
.mobile-footer-legal-bottom { width: 100%; }
.back-to-top { background: #0071dc; text-align: center; padding: 15px; cursor: pointer; font-weight: bold; }
.back-to-top:hover { background: #005bb5; }

.rhf-sign-in-button {
  display: none;
  background: #ffffff;
  color: #0f1111;
  text-align: center;
  padding: 24px 16px;
}
.rhf-sign-in-title {
  margin: 0 0 12px;
  font-size: 22px;
  font-weight: 700;
}
.rhf-sign-in-button .a-button {
  display: inline-block;
  border-radius: 100px;
  border: 1px solid #fcd200;
  background: #ffd814;
  min-width: 180px;
}
.rhf-sign-in-button .a-button:hover {
  background: #f7ca00;
}
.rhf-sign-in-button .a-button-inner {
  display: block;
}
.rhf-sign-in-button .a-button-text {
  display: block;
  padding: 10px 18px;
  color: #0f1111;
  text-decoration: none;
  font-weight: 600;
}
.rhf-sign-in-tooltip-new-customer {
  margin-top: 10px;
  font-size: 13px;
}
.rhf-sign-in-tooltip-new-customer a {
  color: #007185;
  text-decoration: none;
}
.rhf-sign-in-tooltip-new-customer a:hover {
  text-decoration: underline;
}
@media (min-width: 769px) {
  .rhf-sign-in-button { display: block; }
}

/* Footer links legacy */
.footer-links { text-align: center; padding: 10px 20px; }
.footer-links a { color: rgba(255,255,255,0.8); font-size: 13px; text-decoration: none; margin: 0 10px; }
.footer-links a:hover { text-decoration: underline; }
.footer-vertical-cols { max-width: 1000px; margin: 0 auto; display: flex; justify-content: space-between; padding: 40px 20px; flex-wrap: wrap; gap: 20px; }
.footer-vertical-cols div { min-width: 180px; }
.footer-vertical-cols li { padding: 4px 0; font-size: 13px; color: #ddd; }
.footer-vertical-cols a { color: #ddd; font-size: 13px; }
.footer-vertical-cols a:hover { text-decoration: underline; }
.footer-locale-picker { display: inline-flex; align-items: center; gap: 8px; color: #ddd; font-size: 13px; }
.footer-locale-picker select { border: 1px solid rgba(255,255,255,0.35); border-radius: 6px; background: rgba(255,255,255,0.12); color: #fff; padding: 3px 8px; font-size: 12px; }
.footer-locale-picker select option { color: #111; }

/* ERROR MESSAGE STYLE */
#error-msg { color: red; font-weight: bold; margin-top: 10px; display: none; text-align: center; }

/* === SEARCH DROPDOWN (React-powered) === */
.search-dropdown { position: absolute; top: 4px; left: 150px; right: 150px; background: white; border: 1px solid #ddd; border-radius: 8px; box-shadow: 0 8px 30px rgba(0,0,0,0.15); z-index: 2001; max-height: 400px; overflow-y: auto; }
.search-suggestions { padding: 8px 0; border-bottom: 1px solid #eee; }
.search-suggestion-item { padding: 8px 16px; font-size: 14px; color: #333; cursor: pointer; }
.search-suggestion-item:hover { background: #f0f2f2; }
.search-results-dropdown { padding: 8px 0; }
.search-result-item { display: flex; align-items: center; gap: 12px; padding: 8px 16px; cursor: pointer; }
.search-result-item:hover { background: #f0f2f2; }
.search-result-item img { border-radius: 4px; object-fit: contain; }

/* === LOADING SPINNER === */
.loading-spinner { width: 40px; height: 40px; border: 4px solid #e0e0e0; border-top-color: #0071dc; border-radius: 50%; animation: spin 0.8s linear infinite; margin: 0 auto; }
@keyframes spin { to { transform: rotate(360deg); } }

/* === PRODUCT DETAIL PAGE (PDP) === */
.pdp-container { padding: 0; }
.pdp-breadcrumbs { font-size: 13px; color: #666; padding: 12px 0; background: none; box-shadow: none; margin-bottom: 0; }
.pdp-breadcrumbs a { color: #0071dc; }
.pdp-breadcrumbs a:hover { text-decoration: underline; }
.pdp-breadcrumb-current { color: #333; }

.pdp-main { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; background: white; padding: 24px; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); margin-bottom: 20px; }
.pdp-images { display: flex; gap: 12px; }
.pdp-image-thumbs { display: flex; flex-direction: column; gap: 8px; }
.pdp-thumb { width: 60px; height: 60px; border: 2px solid #eee; border-radius: 6px; cursor: pointer; overflow: hidden; transition: border-color 0.2s; }
.pdp-thumb.active, .pdp-thumb:hover { border-color: #0071dc; }
.pdp-thumb img { width: 100%; height: 100%; object-fit: contain; }
.pdp-hero-image { flex: 1; display: flex; align-items: center; justify-content: center; background: #fafafa; border-radius: 8px; padding: 20px; min-height: 400px; }
.pdp-hero-image img { max-width: 100%; max-height: 500px; object-fit: contain; }

.pdp-info { display: flex; flex-direction: column; gap: 16px; }
.pdp-title { font-size: 24px; font-weight: 700; line-height: 1.3; color: #0f1111; }
.pdp-rating { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.pdp-stars { color: #e77600; font-size: 18px; }
.pdp-rating-num { color: #e77600; font-weight: 600; }
.pdp-reviews-link { color: #0071dc; }
.pdp-reviews-link:hover { text-decoration: underline; }

.pdp-price-block { display: flex; align-items: baseline; gap: 12px; }
.pdp-price { font-size: 32px; font-weight: 700; color: #0071dc; }
.pdp-low-stock { font-size: 13px; color: #cc0000; font-weight: 600; }

.pdp-colors { }
.pdp-colors label { font-size: 14px; color: #333; display: block; margin-bottom: 8px; }
.pdp-color-swatches { display: flex; gap: 8px; flex-wrap: wrap; }
.pdp-swatch { width: 36px; height: 36px; border-radius: 50%; border: 2px solid #ddd; cursor: pointer; transition: all 0.2s; padding: 0; }
.pdp-swatch.active { border-color: #0071dc; box-shadow: 0 0 0 2px #0071dc; }
.pdp-swatch:hover { transform: scale(1.1); }

.pdp-sizes label { font-size: 14px; color: #333; display: block; margin-bottom: 8px; }
.pdp-size-grid { display: flex; gap: 8px; flex-wrap: wrap; }
.pdp-size-btn { padding: 8px 16px; border: 1px solid #ccc; border-radius: 8px; background: white; cursor: pointer; font-size: 13px; font-weight: 500; transition: all 0.2s; }
.pdp-size-btn.active { border-color: #0071dc; background: #e6f0ff; color: #0071dc; font-weight: 600; }
.pdp-size-btn:hover { border-color: #0071dc; }

.pdp-quantity { display: flex; align-items: center; gap: 12px; }
.pdp-quantity label { font-size: 14px; font-weight: 600; }
.pdp-quantity select { padding: 8px 16px; border: 1px solid #ccc; border-radius: 8px; font-size: 14px; }

.pdp-actions { display: flex; gap: 12px; align-items: center; }
.pdp-add-to-cart { flex: 1; padding: 14px 24px; background: #ffc220; color: #0f1111; border: none; border-radius: 24px; font-size: 16px; font-weight: 700; cursor: pointer; transition: all 0.2s; }
.pdp-add-to-cart:hover { background: #e0aa00; }
.pdp-add-to-cart.added { background: #2a8703; color: white; }
.pdp-buy-now { flex: 1; padding: 14px 24px; background: #ff9900; color: white; border: none; border-radius: 24px; font-size: 16px; font-weight: 700; cursor: pointer; transition: all 0.2s; }
.pdp-buy-now:hover { background: #e68a00; }
.pdp-wishlist { width: 50px; height: 50px; border: 1px solid #ddd; border-radius: 50%; background: white; font-size: 24px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.2s; }
.pdp-wishlist:hover { border-color: #cc0000; }
.pdp-wishlist.active { color: #cc0000; border-color: #cc0000; background: #fff0f0; }

.pdp-delivery-info { background: #f7f7f7; border-radius: 8px; padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.pdp-delivery-row { display: flex; align-items: center; gap: 10px; font-size: 14px; }
.pdp-delivery-row span:first-child { font-size: 20px; }

/* Bundle Section */
.pdp-bundle-section { background: white; padding: 24px; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); margin-bottom: 20px; }
.pdp-bundle-section h2 { font-size: 22px; margin-bottom: 4px; }
.pdp-bundle-subtitle { color: #666; font-size: 14px; margin-bottom: 20px; }
.pdp-bundle-grid { display: flex; align-items: center; gap: 16px; overflow-x: auto; padding: 12px 0; }
.pdp-bundle-item { border: 2px solid #eee; border-radius: 12px; padding: 16px; text-align: center; min-width: 160px; max-width: 180px; cursor: pointer; transition: all 0.2s; flex-shrink: 0; }
.pdp-bundle-item.main { border-color: #0071dc; background: #f0f7ff; cursor: default; }
.pdp-bundle-item.selected { border-color: #0071dc; }
.pdp-bundle-item:hover { border-color: #0071dc; }
.pdp-bundle-item img { width: 100px; height: 100px; object-fit: contain; margin-bottom: 8px; }
.pdp-bundle-item-name { font-size: 12px; color: #333; margin-bottom: 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pdp-bundle-item-price { font-weight: 700; color: #0071dc; font-size: 15px; display: block; margin-bottom: 6px; }
.pdp-bundle-check { font-size: 11px; color: #0071dc; font-weight: 600; }
.pdp-bundle-checkbox { font-size: 12px; color: #333; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 4px; }
.pdp-bundle-checkbox input { cursor: pointer; }
.pdp-bundle-plus { font-size: 28px; color: #999; font-weight: 300; flex-shrink: 0; }
.pdp-bundle-total { display: flex; align-items: center; justify-content: space-between; margin-top: 20px; padding-top: 16px; border-top: 1px solid #eee; flex-wrap: wrap; gap: 12px; }
.pdp-bundle-price { font-size: 24px; color: #0071dc; }
.pdp-bundle-add-btn { padding: 12px 28px; background: #0071dc; color: white; border: none; border-radius: 24px; font-size: 15px; font-weight: 700; cursor: pointer; transition: all 0.2s; }
.pdp-bundle-add-btn:hover { background: #005bb5; }

/* Related Products */
.pdp-related-section { background: white; padding: 24px; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); margin-bottom: 20px; }
.pdp-related-section h2 { font-size: 22px; margin-bottom: 4px; }
.pdp-related-subtitle { color: #666; font-size: 14px; margin-bottom: 20px; }
.pdp-related-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 16px; }
.pdp-related-card { border: 1px solid #eee; border-radius: 10px; padding: 16px; text-align: center; text-decoration: none; color: inherit; transition: all 0.2s; display: block; }
.pdp-related-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.12); transform: translateY(-2px); }
.pdp-related-card img { width: 100%; height: 150px; object-fit: contain; margin-bottom: 10px; }
.pdp-related-card p { font-size: 13px; color: #333; margin-bottom: 4px; }
.pdp-related-price { font-weight: 700; color: #0071dc; font-size: 16px; }
.pdp-related-rating { font-size: 12px; color: #e77600; margin-top: 4px; }

/* Accordions */
.pdp-details-section { background: white; padding: 24px; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); margin-bottom: 20px; }
.pdp-accordion { border-bottom: 1px solid #eee; }
.pdp-accordion:last-child { border-bottom: none; }
.pdp-accordion-header { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 16px 0; background: none; border: none; cursor: pointer; font-size: 16px; font-weight: 600; color: #0f1111; }
.pdp-accordion-header:hover { color: #0071dc; }
.pdp-accordion-header.active { color: #0071dc; }
.pdp-accordion-icon { font-size: 22px; color: #666; }
.pdp-accordion-body { padding: 0 0 16px; font-size: 14px; line-height: 1.7; color: #333; }
.pdp-accordion-body h4 { font-size: 14px; font-weight: 600; margin-bottom: 6px; color: #0f1111; }

/* Collection section on PDP */
.pdp-collection-section { background: white; padding: 24px; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); margin-bottom: 20px; }
.pdp-collection-section h2 { font-size: 22px; margin-bottom: 8px; }
.pdp-collection-link { color: #0071dc; font-size: 14px; font-weight: 600; }
.pdp-collection-link:hover { text-decoration: underline; }

/* Not Found */
.pdp-not-found { text-align: center; padding: 80px 20px; background: white; border-radius: 8px; margin: 20px 0; }
.pdp-not-found h2 { font-size: 24px; margin-bottom: 12px; }
.pdp-not-found p { color: #666; margin-bottom: 20px; }
.pdp-back-btn { display: inline-block; padding: 12px 24px; background: #0071dc; color: white; border-radius: 24px; font-weight: 600; }
.pdp-back-btn:hover { background: #005bb5; }

/* Product card as link */
a.product-card { display: block; }

/* === TRACK BUTTON IN DELIVERY BAR === */
.delivery-track-btn { display: flex; align-items: center; gap: 4px; padding: 4px 12px; border-radius: 16px; font-size: 12px; border: 1px solid #2a8703; background: white; cursor: pointer; transition: all 0.2s; white-space: nowrap; flex-shrink: 0; color: #2a8703; font-weight: 600; }
.delivery-track-btn:hover { background: #2a8703; color: white; }

/* === GPS TRACKING PANEL === */
.delivery-tracking-panel { display: none; position: absolute; top: 100%; left: 0; right: 0; background: white; border-bottom: 2px solid #2a8703; box-shadow: 0 8px 24px rgba(0,0,0,0.15); z-index: 901; }
.delivery-tracking-panel.active { display: block; }
.tracking-panel-inner { max-width: 1500px; margin: 0 auto; padding: 20px; }
.tracking-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.tracking-header h3 { font-size: 18px; color: #0f1111; }
.tracking-close { font-size: 20px; cursor: pointer; color: #666; padding: 4px 8px; border-radius: 50%; transition: background 0.2s; }
.tracking-close:hover { background: #f0f0f0; }

.tracking-map-container { display: flex; gap: 24px; flex-wrap: wrap; }
.tracking-map { flex: 1; min-width: 280px; background: #f0f4f8; border-radius: 12px; padding: 16px; min-height: 200px; }
.tracking-svg { width: 100%; height: auto; }
.tracking-info { flex: 1; min-width: 280px; }

/* Tracking status steps */
.tracking-status-bar { display: flex; justify-content: space-between; margin-bottom: 20px; position: relative; }
.tracking-status-bar::before { content: ''; position: absolute; top: 10px; left: 30px; right: 30px; height: 3px; background: #e0e0e0; z-index: 0; }
.tracking-step { text-align: center; position: relative; z-index: 1; flex: 1; }
.tracking-step-dot { width: 22px; height: 22px; border-radius: 50%; background: #e0e0e0; margin: 0 auto 6px; border: 3px solid white; box-shadow: 0 0 0 2px #e0e0e0; }
.tracking-step.active .tracking-step-dot { background: #2a8703; box-shadow: 0 0 0 2px #2a8703; }
.tracking-step.current .tracking-step-dot { background: #2a8703; box-shadow: 0 0 0 2px #2a8703, 0 0 0 6px rgba(42,135,3,0.2); animation: pulse-dot 2s infinite; }
@keyframes pulse-dot { 0%, 100% { box-shadow: 0 0 0 2px #2a8703, 0 0 0 6px rgba(42,135,3,0.2); } 50% { box-shadow: 0 0 0 2px #2a8703, 0 0 0 10px rgba(42,135,3,0.1); } }
.tracking-step-label { font-size: 11px; color: #666; font-weight: 500; }
.tracking-step.active .tracking-step-label { color: #2a8703; font-weight: 600; }

/* ETA */
.tracking-eta { text-align: center; background: #f0f9f0; border-radius: 12px; padding: 16px; margin-bottom: 16px; }
.tracking-eta-time { font-size: 32px; font-weight: 700; color: #2a8703; }
.tracking-eta-label { font-size: 13px; color: #666; }
.tracking-coords { font-size: 12px; color: #666; margin-bottom: 12px; }

/* Driver info */
.tracking-driver { display: flex; align-items: center; gap: 12px; padding: 12px; background: #f8f8f8; border-radius: 10px; }
.tracking-driver-avatar { font-size: 28px; }
.tracking-driver-info { flex: 1; }
.tracking-driver-name { font-weight: 600; font-size: 14px; }
.tracking-driver-vehicle { font-size: 12px; color: #666; }
.tracking-driver-call { padding: 8px 16px; background: #2a8703; color: white; border-radius: 20px; font-size: 13px; font-weight: 600; text-decoration: none; }
.tracking-driver-call:hover { background: #1f6a02; }

.tracking-empty { text-align: center; padding: 40px 20px; color: #666; }

/* Store GPS locate button */
.store-gps-locate-btn { padding: 10px 16px; background: #2a8703; color: white; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; font-size: 13px; white-space: nowrap; }
.store-gps-locate-btn:hover { background: #1f6a02; }

/* Timeslot day available count */
.timeslot-day-avail { font-size: 10px; color: #2a8703; margin-top: 2px; font-weight: 500; }

/* === RESPONSIVE === */
@media (min-width: 769px) {
    .nav-hamburger { display: flex; }
    #nav-main .nav-main-hamburger { display: inline-flex; }
    #nav-main .nav-ul-desktop { display: flex; }
    #nav-main .nav-ul-mobile-preserved { display: none; }
    .delivery-bar { display: none; }
    .nav-search-row { display: none; }
}
@media (max-width: 768px) {
    #nav-belt { padding: 8px 12px; height: 56px; gap: 8px; }
    #nav-search { display: none; }
    #nav-belt.desktop-header-v2 .desktop-header-location,
    #nav-belt.desktop-header-v2 .desktop-header-reorder,
    #nav-belt.desktop-header-v2 .desktop-header-account-trigger .b,
    #nav-belt.desktop-header-v2 .desktop-header-account-trigger .signin-text,
    #nav-belt.desktop-header-v2 .redesigned-cart-total { display: none; }
    #nav-belt.desktop-header-v2 .desktop-header-account-trigger { padding: 4px 8px; min-width: auto; }
    #nav-belt.desktop-header-v2 .cart-button-redesigned { min-width: auto; padding: 0 8px; height: 44px !important; }
    #nav-belt.desktop-header-v2 .nav-logo-link { font-size: 20px; }
    .mobile-search-container { display: block; }
    .nav-tools { gap: 14px; font-size: 11px; }
    .nav-tools > a:first-child { display: none; }
    .nav-logo { font-size: 22px; }
    .nav-logo-tagline { display: none; }
    #nav-main { padding: 0 12px; overflow-x: auto; }
    #nav-main.nav-generated { display: none; }
    #nav-main .nav-main-hamburger { display: none; }
    #nav-main .nav-ul-desktop { display: none; }
    #nav-main .nav-ul-mobile-preserved { display: flex; }
    .delivery-bar-inner { flex-wrap: wrap; height: auto; padding: 8px 12px; gap: 6px; }
    .delivery-toggle { display: none; }
    .delivery-window-btn { display: none; }
    .delivery-store-btn { display: none; }
    .delivery-timeslot-panel { display: none !important; }
    .delivery-store-panel { display: none !important; }
    .delivery-address { margin-left: 0; margin-top: 0; }
    .delivery-address-icon { display: none; }
    .delivery-address-text { font-size: 14px; font-weight: 600; }
    .mobile-footer-legal-bottom { margin-top: 56px !important; padding-top: 24px; border-top: 1px solid #2a3543; }
    .mobile-footer-legal-bottom ul { row-gap: 10px; }
    .delivery-track-btn { display: none; }
    .tracking-map-container { flex-direction: column; }
    .tracking-map { min-width: auto; }
    .tracking-info { min-width: auto; }
    .tracking-status-bar { gap: 2px; }
    .tracking-step-label { font-size: 10px; }
    .delivery-window-btn { margin-left: 0; }
    .gps-result-section { flex-direction: column; text-align: center; margin: 12px 16px; }
    .timeslot-grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
    .timeslot-day-tab { min-width: 75px; padding: 8px 10px; }
    .store-item-address { white-space: normal; }
    .store-item-meta { flex-wrap: wrap; gap: 6px; }
    .plus-hero-container { padding: 24px 20px; }
    .category-cards { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; }
    .footer-vertical-cols { flex-direction: column; gap: 20px; }
    #login-sidebar { width: 300px; right: -300px; }
    .sidebar-profile-icon { display: inline-block; }
    /* PDP Responsive */
    .pdp-main { grid-template-columns: 1fr; gap: 20px; padding: 16px; }
    .pdp-images { flex-direction: column-reverse; }
    .pdp-image-thumbs { flex-direction: row; }
    .pdp-hero-image { min-height: 280px; }
    .pdp-title { font-size: 20px; }
    .pdp-price { font-size: 26px; }
    .pdp-bundle-grid { flex-direction: column; align-items: stretch; }
    .pdp-bundle-item { max-width: 100%; min-width: auto; }
    .pdp-bundle-plus { text-align: center; }
    .pdp-related-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
}
@media (max-width: 480px) {
    .delivery-toggle-btn { padding: 5px 10px; font-size: 12px; }
    .delivery-window-btn { padding: 4px 10px; font-size: 11px; }
    .sidebar-compact-grid { column-gap: 14px; }
    .sidebar-compact-link { font-size: 15px; }
}

/* === CART PAGE === */
.cart-section { padding: 24px; }
.cart-page-header { display: flex; align-items: baseline; gap: 12px; margin-bottom: 20px; border-bottom: 1px solid #eee; padding-bottom: 16px; }
.cart-page-header h1 { font-size: 28px; color: #0f1111; }

.cart-empty { text-align: center; padding: 60px 20px; }
.cart-empty h2 { font-size: 22px; color: #0f1111; margin-bottom: 8px; }
.cart-continue-btn { display: inline-block; padding: 12px 28px; background: #ffc220; color: #0f1111; border-radius: 24px; font-weight: 700; font-size: 15px; text-decoration: none; transition: background 0.2s; }
.cart-continue-btn:hover { background: #e0aa00; }

.cart-layout { display: grid; grid-template-columns: 1fr 300px; gap: 24px; align-items: start; }

.cart-item { display: flex; gap: 16px; padding: 20px 0; border-bottom: 1px solid #eee; }
.cart-item:first-child { padding-top: 0; }
.cart-item-image { flex-shrink: 0; width: 120px; height: 120px; }
.cart-item-image img { width: 100%; height: 100%; object-fit: contain; border-radius: 8px; background: #fafafa; }
.cart-item-details { flex: 1; min-width: 0; }
.cart-item-name { font-size: 16px; font-weight: 600; color: #0f1111; margin-bottom: 4px; word-break: break-word; }
.cart-item-price { font-size: 18px; font-weight: 700; color: #0071dc; margin-bottom: 4px; }
.cart-item-actions { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
.cart-qty-control { display: flex; align-items: center; border: 1px solid #ddd; border-radius: 8px; overflow: hidden; }
.cart-qty-btn { width: 36px; height: 36px; border: none; background: #f3f3f3; cursor: pointer; font-size: 18px; display: flex; align-items: center; justify-content: center; transition: background 0.2s; }
.cart-qty-btn:hover { background: #e0e0e0; }
.cart-qty-value { width: 40px; text-align: center; font-size: 15px; font-weight: 600; border-left: 1px solid #ddd; border-right: 1px solid #ddd; height: 36px; line-height: 36px; }
.cart-remove-btn { background: none; border: none; color: #0071dc; font-size: 13px; cursor: pointer; padding: 4px 0; }
.cart-remove-btn:hover { text-decoration: underline; color: #cc0000; }
.cart-item-divider { color: #ddd; }
.cart-item-line-total { font-size: 18px; font-weight: 700; color: #0f1111; flex-shrink: 0; text-align: right; }

.cart-summary { position: sticky; top: 80px; }
.cart-summary-box { background: #f7f7f7; border: 1px solid #ddd; border-radius: 12px; padding: 20px; }
.cart-subtotal { font-size: 18px; color: #0f1111; margin-bottom: 16px; }
.cart-subtotal strong { font-size: 20px; }
.cart-checkout-btn { width: 100%; padding: 14px; background: #ffc220; color: #0f1111; border: none; border-radius: 24px; font-size: 16px; font-weight: 700; cursor: pointer; transition: background 0.2s; margin-bottom: 10px; }
.cart-checkout-btn:hover { background: #e0aa00; }
.cart-keep-shopping { display: block; text-align: center; color: #0071dc; font-size: 14px; font-weight: 600; text-decoration: none; padding: 8px 0; }
.cart-keep-shopping:hover { text-decoration: underline; }

@media (max-width: 768px) {
    .cart-layout { grid-template-columns: 1fr; }
    .cart-summary { position: static; }
    .cart-item-image { width: 90px; height: 90px; }
    .cart-item-name { font-size: 14px; }
    .cart-item-line-total { display: none; }
    .cart-page-header h1 { font-size: 22px; }
}

/* === CHECKOUT PAGE === */
.checkout-progress-bar { background: white; border-bottom: 1px solid #ddd; padding: 16px 20px; }
.checkout-progress-inner { display: flex; align-items: center; justify-content: center; gap: 0; max-width: 500px; margin: 0 auto; }
.checkout-step { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #999; font-weight: 600; }
.checkout-step.active { color: #0071dc; }
.checkout-step-num { width: 24px; height: 24px; border-radius: 50%; background: #e0e0e0; color: white; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; }
.checkout-step.active .checkout-step-num { background: #0071dc; }
.checkout-step-line { flex: 1; height: 2px; background: #e0e0e0; margin: 0 8px; min-width: 30px; }

.checkout-layout { display: grid; grid-template-columns: 1fr 320px; gap: 24px; align-items: start; padding: 20px 0; }

.checkout-card { background: white; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); padding: 24px; margin-bottom: 16px; }
.checkout-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.checkout-card-header h2 { font-size: 18px; color: #0f1111; }
.checkout-change-btn { background: none; border: 1px solid #0071dc; color: #0071dc; padding: 6px 16px; border-radius: 20px; font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.2s; }
.checkout-change-btn:hover { background: #0071dc; color: white; }

.checkout-saved-info { display: flex; align-items: center; gap: 8px; font-size: 15px; color: #0f1111; padding: 8px 0; }

.checkout-saved-list { margin-bottom: 12px; }
.checkout-saved-item { display: flex; align-items: center; gap: 12px; padding: 12px; border: 2px solid #eee; border-radius: 10px; cursor: pointer; transition: all 0.2s; margin-bottom: 8px; }
.checkout-saved-item:hover { border-color: #0071dc; background: #fafafa; }
.checkout-saved-item.selected { border-color: #0071dc; background: #e6f0ff; }
.checkout-saved-radio { font-size: 16px; color: #0071dc; flex-shrink: 0; width: 20px; text-align: center; }

.checkout-form-divider { text-align: center; position: relative; margin: 16px 0; }
.checkout-form-divider::before { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: #ddd; }
.checkout-form-divider span { position: relative; background: white; padding: 0 12px; font-size: 13px; color: #666; }

.checkout-input { width: 100%; padding: 12px 14px; border: 1px solid #ccc; border-radius: 8px; font-size: 14px; outline: none; margin-bottom: 10px; box-sizing: border-box; }
.checkout-input:focus { border-color: #0071dc; box-shadow: 0 0 0 2px rgba(0,113,220,0.2); }
.checkout-input-row { display: flex; gap: 10px; }
.checkout-input-row .checkout-input { flex: 1; }

.checkout-use-btn { width: 100%; padding: 12px; background: #ffc220; color: #0f1111; border: none; border-radius: 24px; font-size: 15px; font-weight: 700; cursor: pointer; transition: background 0.2s; margin-top: 6px; }
.checkout-use-btn:hover { background: #e0aa00; }

/* Payment types */
.checkout-payment-types { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.checkout-pay-type { padding: 10px 16px; border: 2px solid #eee; border-radius: 10px; cursor: pointer; font-size: 13px; font-weight: 600; transition: all 0.2s; white-space: nowrap; }
.checkout-pay-type:hover { border-color: #0071dc; }
.checkout-pay-type.active { border-color: #0071dc; background: #e6f0ff; color: #0071dc; }
.checkout-payment-fields { margin-bottom: 8px; }
.checkout-bnpl-info { padding: 16px; background: #f7f7f7; border-radius: 8px; margin-bottom: 8px; }

/* Shipping options */
.checkout-shipping-options { display: flex; flex-direction: column; gap: 8px; }
.checkout-ship-option { display: flex; align-items: center; gap: 12px; padding: 14px; border: 2px solid #eee; border-radius: 10px; cursor: pointer; transition: all 0.2s; }
.checkout-ship-option:hover { border-color: #0071dc; }
.checkout-ship-option.selected { border-color: #0071dc; background: #e6f0ff; }
.checkout-ship-option input[type="radio"] { accent-color: #0071dc; width: 18px; height: 18px; cursor: pointer; }
.checkout-ship-details { flex: 1; }
.checkout-ship-details strong { display: block; font-size: 14px; color: #0f1111; }
.checkout-ship-date { font-size: 13px; color: #2a8703; }
.checkout-ship-price { font-size: 15px; font-weight: 700; color: #0f1111; flex-shrink: 0; }
.checkout-ship-free { color: #2a8703; }
.checkout-plus-note { margin-top: 10px; padding: 10px 14px; background: #e6f0ff; border-radius: 8px; font-size: 13px; color: #0071dc; font-weight: 600; }

/* Review items in checkout */
.checkout-items-list { display: flex; flex-direction: column; gap: 12px; }
.checkout-review-item { display: flex; gap: 14px; align-items: center; padding: 10px 0; border-bottom: 1px solid #f0f0f0; }
.checkout-review-item:last-child { border-bottom: none; }
.checkout-review-item img { width: 70px; height: 70px; object-fit: contain; border-radius: 6px; background: #fafafa; flex-shrink: 0; }
.checkout-review-info { flex: 1; min-width: 0; }
.checkout-review-name { font-size: 14px; font-weight: 600; color: #0f1111; margin-bottom: 2px; }
.checkout-review-price { font-size: 15px; font-weight: 700; color: #0071dc; }
.checkout-review-qty { font-size: 12px; color: #666; }

/* Order summary sidebar */
.checkout-right { position: sticky; top: 80px; }
.checkout-summary-box { background: white; border: 1px solid #ddd; border-radius: 12px; padding: 20px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.checkout-place-order-btn { width: 100%; padding: 14px; background: #ffc220; color: #0f1111; border: none; border-radius: 24px; font-size: 16px; font-weight: 700; cursor: pointer; transition: background 0.2s; margin-bottom: 8px; }
.checkout-place-order-btn:hover { background: #e0aa00; }
.checkout-place-order-btn:disabled { background: #ddd; color: #999; cursor: not-allowed; }
.checkout-legal-text { font-size: 12px; color: #666; margin-bottom: 12px; }
.checkout-legal-text a { color: #0071dc; }
.checkout-summary-box h3 { font-size: 18px; color: #0f1111; margin-bottom: 12px; }
.checkout-summary-row { display: flex; justify-content: space-between; font-size: 14px; color: #0f1111; margin-bottom: 8px; }
.checkout-summary-total { font-size: 18px; margin-top: 4px; }
.checkout-summary-divider { height: 1px; background: #eee; margin: 12px 0; }

/* Order confirmation */
.checkout-confirmation { max-width: 700px; margin: 0 auto; }
.checkout-confirm-details { background: #f7f7f7; border-radius: 10px; padding: 20px; margin: 24px auto; max-width: 400px; text-align: left; }
.checkout-confirm-row { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid #eee; font-size: 14px; }
.checkout-confirm-row:last-child { border-bottom: none; }
.checkout-confirm-btn { display: inline-block; padding: 12px 28px; background: #ffc220; color: #0f1111; border-radius: 24px; font-weight: 700; font-size: 15px; text-decoration: none; transition: background 0.2s; }
.checkout-confirm-btn:hover { background: #e0aa00; }
.checkout-confirm-btn-secondary { background: white; border: 2px solid #0071dc; color: #0071dc; }
.checkout-confirm-btn-secondary:hover { background: #e6f0ff; }

@media (max-width: 768px) {
    .checkout-layout { grid-template-columns: 1fr; }
    .checkout-right { position: static; order: -1; }
    .checkout-payment-types { flex-direction: column; }
    .checkout-input-row { flex-direction: column; }
    .checkout-input-row .checkout-input { max-width: 100% !important; }
    .checkout-card { padding: 16px; }
    .checkout-card-header h2 { font-size: 16px; }
    .checkout-progress-inner { gap: 0; }
    .checkout-step span { display: none; }
}

/* === GROCERY PRODUCT CARDS (Walmart mobile style) === */
.grocery-card {
    background: white;
    border-radius: 12px;
    padding: 12px;
    border: 1px solid #e7e7e7;
    transition: box-shadow 0.2s, transform 0.15s;
}
.grocery-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
    transform: translateY(-2px);
}
.grocery-card img {
    border-radius: 8px;
    width: 100%;
    height: auto;
    max-height: 240px;
    object-fit: cover;
}

/* Grocery filter pills (Walmart style) */
.amz-pill {
    padding: 8px 16px;
    border: 1.5px solid #d1d1d1;
    border-radius: 24px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    background: white;
    color: #333;
    white-space: nowrap;
    transition: all 0.2s;
}
.amz-pill:hover {
    border-color: #0071dc;
    color: #0071dc;
    background: #f0f6ff;
}
.amz-pill-active {
    background: #0071dc !important;
    color: white !important;
    border-color: #0071dc !important;
}

/* Product list grid layout */
.product-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px;
}
@media (max-width: 768px) {
    .product-list {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
}
@media (max-width: 480px) {
    .product-list {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }
}

/* Product card link to detail page */
.product-card {
    display: block;
    background: white;
    border-radius: 12px;
    padding: 12px;
    border: 1px solid #e7e7e7;
    transition: box-shadow 0.2s, transform 0.15s;
    cursor: pointer;
}
.product-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
    transform: translateY(-2px);
}
.product-card img {
    width: 100%;
    height: 200px;
    object-fit: contain;
    border-radius: 8px;
    margin-bottom: 8px;
}

/* Add to cart button */
.add-btn {
    width: 100%;
    padding: 10px;
    background: #0071dc;
    color: white;
    border: none;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    margin-top: 8px;
}
.add-btn:hover {
    background: #005bb5;
}
.smithmarts-add-btn {
    background: #0071dc;
    border-radius: 20px;
}

/* Loading spinner */
.loading-spinner {
    width: 40px;
    height: 40px;
    border: 4px solid #e7e7e7;
    border-top: 4px solid #0071dc;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    margin: 0 auto;
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* === PRODUCT DETAIL PAGE (PDP) === */
.pdp-container { max-width: 1200px; margin: 0 auto; padding: 16px; }
.pdp-breadcrumbs { font-size: 13px; color: #565959; margin-bottom: 16px; padding: 8px 0; }
.pdp-breadcrumbs a { color: #0071dc; }
.pdp-breadcrumbs a:hover { text-decoration: underline; }
.pdp-breadcrumb-current { color: #111; }

.pdp-main { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-bottom: 32px; }
@media (max-width: 768px) { .pdp-main { grid-template-columns: 1fr; gap: 16px; } }

.pdp-images { position: relative; }
.pdp-image-thumbs { display: flex; gap: 8px; margin-bottom: 12px; }
.pdp-thumb { width: 60px; height: 60px; border: 2px solid transparent; border-radius: 8px; cursor: pointer; overflow: hidden; }
.pdp-thumb.active { border-color: #0071dc; }
.pdp-thumb img { width: 100%; height: 100%; object-fit: contain; }
.pdp-hero-image { background: white; border-radius: 12px; padding: 16px; text-align: center; }
.pdp-hero-image img { max-width: 100%; max-height: 400px; object-fit: contain; }

.pdp-info { }
.pdp-title { font-size: 20px; font-weight: 600; line-height: 1.3; margin-bottom: 8px; color: #0f1111; }
.pdp-rating { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
.pdp-stars { color: #e77600; font-size: 16px; }
.pdp-rating-num { font-size: 14px; color: #565959; }
.pdp-reviews-link { font-size: 14px; color: #007185; }
.pdp-reviews-link:hover { text-decoration: underline; color: #c7511f; }

.pdp-price-block { margin-bottom: 16px; padding: 12px 0; border-bottom: 1px solid #eee; }
.pdp-price { font-size: 28px; font-weight: 700; color: #0f1111; }
.pdp-low-stock { display: block; margin-top: 6px; color: #cc0000; font-size: 14px; font-weight: 600; }

.pdp-colors { margin-bottom: 16px; }
.pdp-colors label { font-size: 14px; color: #0f1111; display: block; margin-bottom: 8px; }
.pdp-color-swatches { display: flex; gap: 8px; }
.pdp-swatch { width: 36px; height: 36px; border: 2px solid #ddd; border-radius: 50%; cursor: pointer; }
.pdp-swatch.active { border-color: #0071dc; box-shadow: 0 0 0 2px #0071dc; }

.pdp-sizes { margin-bottom: 16px; }
.pdp-sizes label { font-size: 14px; color: #0f1111; display: block; margin-bottom: 8px; }
.pdp-size-grid { display: flex; gap: 8px; flex-wrap: wrap; }
.pdp-size-btn { padding: 8px 16px; border: 1px solid #ddd; border-radius: 8px; background: white; cursor: pointer; font-size: 14px; }
.pdp-size-btn.active { border-color: #0071dc; color: #0071dc; background: #e6f0ff; }

.pdp-quantity { margin-bottom: 16px; }
.pdp-quantity label { font-size: 14px; color: #0f1111; margin-right: 8px; }
.pdp-quantity select { padding: 8px 12px; border: 1px solid #ddd; border-radius: 8px; font-size: 14px; }

.pdp-actions { display: flex; gap: 10px; margin-bottom: 20px; }
.pdp-add-to-cart { flex: 1; padding: 12px 24px; background: #0071dc; color: white; border: none; border-radius: 24px; font-size: 15px; font-weight: 700; cursor: pointer; transition: background 0.2s; }
.pdp-add-to-cart:hover { background: #005bb5; }
.pdp-add-to-cart.added { background: #2a8703; }
.pdp-buy-now { flex: 1; }
.pdp-wishlist { width: 48px; height: 48px; border: 1px solid #ddd; border-radius: 50%; background: white; font-size: 22px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.pdp-wishlist.active { color: #cc0000; border-color: #cc0000; }

.pdp-delivery-info { background: #f7f7f7; border-radius: 12px; padding: 16px; margin-bottom: 20px; }
.pdp-delivery-row { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 10px; }
.pdp-delivery-row:last-child { margin-bottom: 0; }
.pdp-delivery-row span:first-child { font-size: 20px; flex-shrink: 0; }

/* PDP Bundle Section */
.pdp-bundle-section { background: white; border: 1px solid #e7e7e7; border-radius: 12px; padding: 20px; margin-bottom: 24px; }
.pdp-bundle-section h2 { font-size: 18px; margin-bottom: 4px; }
.pdp-bundle-subtitle { font-size: 14px; color: #666; margin-bottom: 16px; }
.pdp-bundle-grid { display: flex; gap: 12px; align-items: center; overflow-x: auto; padding-bottom: 12px; }
.pdp-bundle-item { background: #f7f7f7; border-radius: 10px; padding: 12px; min-width: 140px; text-align: center; cursor: pointer; border: 2px solid transparent; }
.pdp-bundle-item.main { border-color: #0071dc; }
.pdp-bundle-item.selected { border-color: #0071dc; }
.pdp-bundle-item img { width: 80px; height: 80px; object-fit: contain; margin-bottom: 6px; }
.pdp-bundle-item-name { font-size: 12px; color: #333; margin-bottom: 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pdp-bundle-item-price { font-size: 14px; font-weight: 700; color: #0071dc; }
.pdp-bundle-check { color: #2a8703; font-weight: 700; }
.pdp-bundle-checkbox { font-size: 13px; color: #565959; }
.pdp-bundle-plus { font-size: 24px; color: #999; }
.pdp-bundle-total { display: flex; justify-content: space-between; align-items: center; padding-top: 16px; border-top: 1px solid #eee; }
.pdp-bundle-price { font-size: 20px; color: #0071dc; }
.pdp-bundle-add-btn { padding: 10px 24px; background: #ffc220; color: #0f1111; border: none; border-radius: 20px; font-size: 14px; font-weight: 700; cursor: pointer; }

/* PDP Related Products */
.pdp-related-section { margin-bottom: 24px; }
.pdp-related-section h2 { font-size: 18px; margin-bottom: 4px; }
.pdp-related-subtitle { font-size: 14px; color: #666; margin-bottom: 16px; }
.pdp-related-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; }
.pdp-related-card { background: white; border: 1px solid #e7e7e7; border-radius: 12px; padding: 12px; text-align: center; }
.pdp-related-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.pdp-related-card img { width: 100%; height: 120px; object-fit: contain; margin-bottom: 8px; }
.pdp-related-card p { font-size: 13px; color: #333; margin-bottom: 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pdp-related-price { font-size: 15px; font-weight: 700; color: #0071dc; }
.pdp-related-rating { font-size: 13px; color: #e77600; }

/* PDP Accordion */
.pdp-details-section { margin-bottom: 24px; }
.pdp-accordion { border: 1px solid #e7e7e7; border-radius: 8px; margin-bottom: 8px; overflow: hidden; }
.pdp-accordion-header { width: 100%; padding: 14px 16px; background: white; border: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; font-size: 15px; font-weight: 600; color: #0f1111; }
.pdp-accordion-header:hover { background: #f7f7f7; }
.pdp-accordion-icon { font-size: 18px; color: #666; }
.pdp-accordion-body { padding: 0 16px 16px; font-size: 14px; color: #333; line-height: 1.6; }

/* PDP Collection */
.pdp-collection-section { margin-bottom: 24px; }
.pdp-collection-section h2 { font-size: 18px; margin-bottom: 8px; }
.pdp-collection-link { color: #0071dc; font-size: 14px; font-weight: 600; }

.pdp-not-found { text-align: center; padding: 80px 20px; }
.pdp-back-btn { display: inline-block; padding: 12px 24px; background: #ffc220; color: #0f1111; border-radius: 24px; font-weight: 700; margin-top: 16px; }

/* === DESKTOP RIGHT SIDEBAR (Sign-In + Sponsored Ads) === */
.desktop-right-sidebar {
    display: none;
    width: 300px;
    flex-shrink: 0;
    position: sticky;
    top: 80px;
    align-self: flex-start;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
}
.page-with-sidebar {
    display: flex;
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px 20px;
    gap: 24px;
}
.page-with-sidebar .page-main-content {
    flex: 1;
    min-width: 0;
}

/* Sign-In Widget */
.sidebar-signin-widget {
    background: white;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    padding: 20px;
    margin-bottom: 16px;
}
.sidebar-signin-widget h3 {
    font-size: 18px;
    font-weight: 700;
    color: #0f1111;
    margin-bottom: 4px;
}
.sidebar-signin-widget p {
    font-size: 13px;
    color: #565959;
    margin-bottom: 14px;
    line-height: 1.4;
}
.sidebar-signin-widget .sidebar-signin-btn {
    display: block;
    width: 100%;
    text-align: center;
    background: #0071dc;
    color: white;
    padding: 10px 16px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    border: none;
    transition: background 0.2s;
    text-decoration: none;
}
.sidebar-signin-widget .sidebar-signin-btn:hover {
    background: #005bb5;
    color: white;
}
.sidebar-signin-widget .sidebar-signin-create {
    display: block;
    text-align: center;
    margin-top: 10px;
    font-size: 12px;
    color: #565959;
}
.sidebar-signin-widget .sidebar-signin-create a {
    color: #0071dc;
    text-decoration: underline;
}
.sidebar-signin-widget .sidebar-signin-benefits {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #eee;
}
.sidebar-signin-widget .sidebar-signin-benefits li {
    font-size: 12px;
    color: #333;
    padding: 4px 0;
    display: flex;
    align-items: center;
    gap: 6px;
}
.sidebar-signin-widget .sidebar-signin-benefits li::before {
    content: "\2713";
    color: #2a8703;
    font-weight: 700;
    font-size: 13px;
}

/* Sponsored Ad Widget */
.sidebar-sponsored-widget {
    background: white;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    overflow: hidden;
}
.sidebar-sponsored-widget .sponsored-label {
    font-size: 11px;
    color: #888;
    padding: 10px 14px 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.sidebar-sponsored-widget img {
    width: 100%;
    display: block;
    padding: 8px 14px 14px;
}

@media (min-width: 1024px) {
    .desktop-right-sidebar { display: block; }
}
@media (max-width: 1023px) {
    .page-with-sidebar { display: block; padding: 0; }
    .page-with-sidebar .page-main-content { padding: 24px 20px; }
    .desktop-right-sidebar { display: none; }
}

/* === PERSONALIZED RAILS (Pick up where you left off / Recommended for you) === */
.sm-rail-wrap { max-width: 1400px; margin: 24px auto 0; padding: 0 20px; }
.sm-rail { background: #fff; border-radius: 12px; padding: 20px; box-shadow: 0 1px 4px rgba(0,0,0,0.08); margin-bottom: 20px; }
.sm-rail-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.sm-rail-title { font-size: 22px; font-weight: 800; color: #0f1111; margin: 0; }
.sm-rail-sub { font-size: 13px; color: #565959; margin: 4px 0 0; }
.sm-rail-cta { color: #0071dc; font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.sm-rail-cta:hover { text-decoration: underline; }
.sm-rail-scroll { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(180px, 200px); gap: 14px; overflow-x: auto; padding-bottom: 6px; scrollbar-width: thin; scroll-snap-type: x proximity; }
.sm-rail-scroll::-webkit-scrollbar { height: 8px; }
.sm-rail-scroll::-webkit-scrollbar-thumb { background: #d5d9d9; border-radius: 4px; }
.sm-rail-card { display: flex; flex-direction: column; background: #fafafa; border: 1px solid #eaeaea; border-radius: 10px; padding: 10px; color: #0f1111; text-decoration: none; scroll-snap-align: start; transition: box-shadow 0.15s, transform 0.15s; }
.sm-rail-card:hover { box-shadow: 0 4px 14px rgba(0,0,0,0.10); transform: translateY(-2px); }
.sm-rail-imgwrap { aspect-ratio: 1 / 1; background: #fff; border-radius: 8px; overflow: hidden; display: flex; align-items: center; justify-content: center; margin-bottom: 10px; }
.sm-rail-imgwrap img { width: 100%; height: 100%; object-fit: contain; }
.sm-rail-body { display: flex; flex-direction: column; gap: 4px; }
.sm-rail-name { font-size: 13px; line-height: 1.3; font-weight: 500; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 34px; }
.sm-rail-rating { color: #ffa41c; font-size: 13px; letter-spacing: 1px; }
.sm-rail-price { font-size: 16px; font-weight: 700; color: #0f1111; }
.sm-rail-badges { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 4px; }
.sm-badge { display: inline-block; font-size: 10px; font-weight: 800; padding: 2px 6px; border-radius: 4px; text-transform: uppercase; letter-spacing: 0.3px; }
.sm-badge-plus { background: #0071dc; color: #fff; }
.sm-badge-pickup { background: #e6f4ea; color: #0a7a2d; border: 1px solid #b8e3c4; }
.sm-badge-free-ship { background: #fff4d6; color: #8a5a00; border: 1px solid #f0dd9c; }
.sm-badge-sale { background: #ffeaea; color: #a80000; border: 1px solid #f1b8b8; }
@media (max-width: 768px) {
    .sm-rail { padding: 16px; }
    .sm-rail-title { font-size: 18px; }
    .sm-rail-scroll { grid-auto-columns: minmax(150px, 170px); }
}

/* === DEPARTMENT VISUAL SHORTCUTS (home) === */
.sm-dept-shortcuts { max-width: 1400px; margin: 24px auto 0; padding: 0 20px; }
.sm-dept-shortcuts h2 { font-size: 20px; font-weight: 800; color: #0f1111; margin-bottom: 14px; }
.sm-dept-rail { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; }
.sm-dept-chip { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 18px 10px; background: linear-gradient(180deg, #ffffff, #f6f8fa); border: 1px solid #eaeaea; border-radius: 14px; color: #0f1111; text-decoration: none; transition: transform 0.15s, box-shadow 0.15s; }
.sm-dept-chip:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,0.10); }
.sm-dept-chip .sm-dept-ico { width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 26px; background: #eaf3ff; }
.sm-dept-chip .sm-dept-label { font-size: 13px; font-weight: 700; text-align: center; }

/* === PLP: FILTER SIDEBAR + GRID/LIST TOGGLE === */
.plp-layout { display: grid; grid-template-columns: 260px 1fr; gap: 20px; max-width: 1400px; margin: 16px auto; padding: 0 20px; align-items: flex-start; }
.plp-filters { background: #fff; border-radius: 12px; padding: 18px; box-shadow: 0 1px 3px rgba(0,0,0,0.08); position: sticky; top: 110px; max-height: calc(100vh - 130px); overflow-y: auto; }
.plp-filters h3 { font-size: 16px; font-weight: 800; margin-bottom: 12px; color: #0f1111; }
.plp-filter-group { border-top: 1px solid #eee; padding: 14px 0; }
.plp-filter-group:first-of-type { border-top: 0; padding-top: 4px; }
.plp-filter-group > .plp-filter-label { font-size: 13px; font-weight: 700; margin-bottom: 8px; color: #0f1111; text-transform: uppercase; letter-spacing: 0.4px; }
.plp-filter-group label { display: flex; align-items: center; gap: 8px; font-size: 14px; padding: 4px 0; color: #222; cursor: pointer; }
.plp-filter-group label input[type="checkbox"], .plp-filter-group label input[type="radio"] { accent-color: #0071dc; }
.plp-filter-stars { color: #ffa41c; letter-spacing: 1px; font-size: 13px; }
.plp-price-range { display: flex; gap: 8px; align-items: center; }
.plp-price-range input { width: 80px; padding: 6px 8px; border: 1px solid #d0d0d0; border-radius: 4px; font-size: 13px; }
.plp-apply-btn { margin-top: 10px; background: #ffc220; color: #111; border: none; padding: 8px 14px; border-radius: 6px; font-weight: 700; font-size: 13px; cursor: pointer; width: 100%; }
.plp-apply-btn:hover { background: #ffb200; }
.plp-clear-btn { margin-top: 6px; background: transparent; color: #0071dc; border: none; padding: 6px; cursor: pointer; font-size: 13px; text-decoration: underline; width: 100%; }
.plp-main { min-width: 0; }
.plp-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #fff; padding: 12px 16px; border-radius: 12px; box-shadow: 0 1px 3px rgba(0,0,0,0.08); margin-bottom: 16px; flex-wrap: wrap; }
.plp-toolbar-left { font-size: 14px; color: #444; }
.plp-toolbar-right { display: flex; gap: 8px; align-items: center; }
.plp-view-toggle { display: inline-flex; border: 1px solid #d0d0d0; border-radius: 6px; overflow: hidden; }
.plp-view-toggle button { background: #fff; border: 0; padding: 6px 10px; font-size: 13px; cursor: pointer; color: #555; }
.plp-view-toggle button.active { background: #0071dc; color: #fff; }
.plp-sort-select { padding: 8px 10px; border: 1px solid #d0d0d0; border-radius: 6px; font-size: 13px; background: #fff; }
.plp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.plp-grid .plp-card { background: #fff; border: 1px solid #ececec; border-radius: 12px; padding: 14px; display: flex; flex-direction: column; gap: 8px; text-decoration: none; color: #0f1111; transition: transform 0.15s, box-shadow 0.15s; }
.plp-grid .plp-card:hover { transform: translateY(-3px); box-shadow: 0 6px 18px rgba(0,0,0,0.10); }
.plp-card-img { aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; background: #fafafa; border-radius: 8px; overflow: hidden; }
.plp-card-img img { width: 100%; height: 100%; object-fit: contain; }
.plp-card-title { font-size: 14px; font-weight: 500; min-height: 38px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.plp-card-rating { color: #ffa41c; font-size: 13px; letter-spacing: 1px; }
.plp-card-price { font-size: 18px; font-weight: 800; }
.plp-card-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.plp-list .plp-card { display: grid; grid-template-columns: 160px 1fr auto; gap: 16px; align-items: start; }
.plp-list .plp-card-img { width: 160px; height: 160px; aspect-ratio: auto; }
.plp-list .plp-card-title { font-size: 16px; min-height: auto; -webkit-line-clamp: unset; }
.plp-list .plp-card-price { font-size: 20px; }
.plp-list .plp-card-desc { font-size: 13px; color: #565959; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.plp-empty { background: #fff; padding: 40px; text-align: center; border-radius: 12px; color: #565959; }
.plp-pagination { display: flex; gap: 8px; justify-content: center; align-items: center; padding: 24px 0; flex-wrap: wrap; }
.plp-pagination button, .plp-pagination span { min-width: 38px; height: 38px; padding: 0 10px; background: #fff; border: 1px solid #d0d0d0; border-radius: 6px; font-size: 14px; font-weight: 600; cursor: pointer; color: #0f1111; }
.plp-pagination button:hover:not(:disabled) { border-color: #0071dc; color: #0071dc; }
.plp-pagination button.active { background: #0071dc; color: #fff; border-color: #0071dc; }
.plp-pagination button:disabled { opacity: 0.5; cursor: not-allowed; }
.plp-loadmore { display: flex; justify-content: center; padding: 20px 0; }
.plp-loadmore button { background: #ffc220; color: #111; border: none; padding: 12px 26px; border-radius: 8px; font-weight: 700; font-size: 14px; cursor: pointer; }
.plp-loadmore button:hover { background: #ffb200; }
.plp-mobile-filter-btn { display: none; background: #0071dc; color: #fff; padding: 10px 14px; border: none; border-radius: 8px; font-weight: 700; font-size: 14px; cursor: pointer; }
.plp-filter-drawer-close { display: none; }
.plp-brand-count { color: #888; font-size: 12px; margin-left: auto; }
.plp-pager-ellipsis { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; color: #888; }
.plp-card-brand { font-size: 12px; color: #565959; margin-top: -4px; }
.plp-card-reviews { color: #565959; font-size: 12px; margin-left: 4px; }
/* Hide the long description in grid view; list view re-shows it */
.plp-grid .plp-card-desc { display: none; }
body.plp-drawer-open { overflow: hidden; }
body.plp-drawer-open::before { content: ''; position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 2900; }
@media (max-width: 900px) {
    .plp-layout { grid-template-columns: 1fr; }
    .plp-filters { position: fixed; top: 0; left: -100%; height: 100vh; width: 86vw; max-width: 340px; z-index: 3000; transition: left 0.25s; border-radius: 0; max-height: 100vh; padding-top: 56px; }
    .plp-filters.open { left: 0; box-shadow: 4px 0 16px rgba(0,0,0,0.25); }
    .plp-mobile-filter-btn { display: inline-flex; align-items: center; gap: 6px; }
    .plp-filter-drawer-close { display: block; position: absolute; top: 10px; right: 14px; background: none; border: 0; font-size: 24px; cursor: pointer; }
    .plp-list .plp-card { grid-template-columns: 110px 1fr; }
    .plp-list .plp-card-img { width: 110px; height: 110px; }
    .plp-list .plp-card-price { grid-column: 1 / -1; }
}

/* === CART: SAVE FOR LATER === */
.save-for-later { background: #fff; border-radius: 12px; padding: 18px 20px; margin-top: 20px; box-shadow: 0 1px 3px rgba(0,0,0,0.08); }
.save-for-later-header { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; border-bottom: 1px solid #eee; padding-bottom: 10px; }
.save-for-later-header h2 { font-size: 20px; font-weight: 800; }
.save-for-later-header span { color: #565959; font-size: 14px; }
.save-for-later-empty { color: #565959; font-size: 14px; padding: 12px 0; }
.save-for-later-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.sfl-card { display: flex; gap: 10px; padding: 10px; border: 1px solid #ececec; border-radius: 10px; }
.sfl-card img { width: 80px; height: 80px; object-fit: contain; background: #fafafa; border-radius: 6px; flex-shrink: 0; }
.sfl-info { flex: 1; min-width: 0; }
.sfl-name { font-size: 13px; font-weight: 600; line-height: 1.3; margin-bottom: 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sfl-price { font-size: 15px; font-weight: 700; margin-bottom: 6px; }
.sfl-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.sfl-btn { background: #ffc220; color: #111; border: none; padding: 5px 10px; border-radius: 6px; font-size: 12px; font-weight: 700; cursor: pointer; }
.sfl-btn:hover { background: #ffb200; }
.sfl-btn-link { background: none; color: #0071dc; border: none; padding: 5px 4px; font-size: 12px; cursor: pointer; text-decoration: underline; }
.cart-item-save-btn { background: none; border: none; color: #0071dc; cursor: pointer; font-size: 13px; padding: 4px 8px; text-decoration: underline; }
.cart-item-save-btn:hover { color: #004a8d; }

/* ===== Hide product images across all product renders (desktop + mobile) ===== */
.product-card img,
.grocery-card img,
.plp-card-img,
.sm-rail-imgwrap,
.cart-item-image,
.sfl-card img,
.checkout-review-item img,
.pdp-images,
.pdp-image-thumbs,
.pdp-hero-image,
.pdp-bundle-item img,
.pdp-related-card img,
.search-result-item img {
    display: none !important;
}

/* Let the PDP info column fill the row now that the image column is hidden */
.pdp-main { display: block !important; }
.pdp-info { width: 100% !important; max-width: 100% !important; }