/*
 * Sathi Food mobile PWA interface
 * Loaded everywhere, activated only for installed Android/iOS/iPadOS PWAs.
 * The normal desktop site and normal mobile browser remain unchanged.
 */

.sathi-native-appbar,
.sathi-native-home,
.sathi-native-pull-indicator,
.sathi-native-splash {
    display: none;
}

html.sathi-mobile-pwa {
    --app-primary: #f04414;
    --app-primary-strong: #d93608;
    --app-primary-soft: #fff0e9;
    --app-ink: #171927;
    --app-muted: #777b8d;
    --app-surface: #ffffff;
    --app-surface-2: #f6f7fb;
    --app-line: rgba(30, 32, 48, .08);
    --app-green: #148a5b;
    --app-purple: #7657e7;
    --app-pink: #e84f84;
    --app-blue: #2a73df;
    --app-top-safe: env(safe-area-inset-top, 0px);
    --app-bottom-safe: env(safe-area-inset-bottom, 0px);
    --app-nav-height: 78px;
    --app-shadow: 0 16px 42px rgba(32, 24, 42, .10);
    --app-shadow-soft: 0 8px 24px rgba(32, 24, 42, .07);
    background: var(--app-surface-2);
    color-scheme: light;
    overscroll-behavior-y: none;
}

html.sathi-mobile-pwa body {
    min-height: 100vh;
    min-height: 100dvh;
    margin: 0;
    padding: 0 0 calc(var(--app-nav-height) + var(--app-bottom-safe) + 14px) !important;
    overflow-x: hidden;
    background:
        radial-gradient(circle at 100% -10%, rgba(255, 128, 74, .14), transparent 34%),
        linear-gradient(180deg, #fffaf7 0, #f6f7fb 250px, #f6f7fb 100%);
    color: var(--app-ink);
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
}

html.sathi-mobile-pwa body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    background: #f6f7fb;
}

html.sathi-mobile-pwa a,
html.sathi-mobile-pwa button,
html.sathi-mobile-pwa input,
html.sathi-mobile-pwa select,
html.sathi-mobile-pwa textarea {
    -webkit-tap-highlight-color: transparent;
}

html.sathi-mobile-pwa button,
html.sathi-mobile-pwa a {
    touch-action: manipulation;
}

html.sathi-mobile-pwa .ck-header,
html.sathi-mobile-pwa .site-footer,
html.sathi-mobile-pwa .customer-quick-nav,
html.sathi-mobile-pwa .dashboard-topbar,
html.sathi-mobile-pwa .panel-footer,
html.sathi-mobile-pwa .sathi-pwa-header-action,
html.sathi-mobile-pwa [data-pwa-install] {
    display: none !important;
}

html.sathi-mobile-pwa .app-wrapper,
html.sathi-mobile-pwa .dashboard-shell,
html.sathi-mobile-pwa .dashboard-layout,
html.sathi-mobile-pwa .dashboard-main {
    min-height: 100vh;
    min-height: 100dvh;
    width: 100%;
    max-width: none;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

html.sathi-mobile-pwa .dashboard-layout {
    display: block !important;
}

/* Native app bar */
html.sathi-mobile-pwa .sathi-native-appbar {
    position: sticky;
    top: 0;
    z-index: 9400;
    display: block;
    padding: calc(9px + var(--app-top-safe)) 16px 12px;
    background: rgba(255, 255, 255, .94);
    border-bottom: 1px solid rgba(37, 31, 43, .06);
    box-shadow: 0 8px 26px rgba(24, 19, 31, .045);
    backdrop-filter: blur(22px) saturate(1.25);
    -webkit-backdrop-filter: blur(22px) saturate(1.25);
}

html.sathi-mobile-pwa .sathi-native-appbar--panel {
    padding-bottom: 11px;
}

html.sathi-mobile-pwa .sathi-native-appbar-main {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
}

html.sathi-mobile-pwa .sathi-native-brand-mark {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 15px;
    background: linear-gradient(145deg, #fff5ef, #ffe2d4);
    box-shadow: 0 8px 22px rgba(240, 68, 20, .16);
}

html.sathi-mobile-pwa .sathi-native-brand-mark img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

html.sathi-mobile-pwa .sathi-native-appbar-title {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

html.sathi-mobile-pwa .sathi-native-appbar-title small {
    overflow: hidden;
    color: var(--app-muted);
    font-size: 10px;
    font-weight: 750;
    line-height: 1.2;
    letter-spacing: .02em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html.sathi-mobile-pwa .sathi-native-appbar-title strong {
    overflow: hidden;
    color: var(--app-ink);
    font-family: Manrope, Inter, sans-serif;
    font-size: 18px;
    font-weight: 850;
    line-height: 1.2;
    letter-spacing: -.025em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html.sathi-mobile-pwa .sathi-native-appbar-actions {
    display: flex;
    align-items: center;
    gap: 7px;
}

html.sathi-mobile-pwa .sathi-native-icon-button,
html.sathi-mobile-pwa .sathi-native-avatar-button {
    position: relative;
    width: 41px;
    height: 41px;
    min-width: 41px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(38, 34, 49, .07);
    border-radius: 14px;
    background: #fff;
    color: #252736;
    text-decoration: none;
    box-shadow: 0 7px 18px rgba(31, 25, 40, .07);
}

html.sathi-mobile-pwa .sathi-native-icon-button:active,
html.sathi-mobile-pwa .sathi-native-avatar-button:active {
    transform: scale(.94);
}

html.sathi-mobile-pwa .sathi-native-icon-button svg {
    width: 21px;
    height: 21px;
    fill: currentColor;
}

html.sathi-mobile-pwa .sathi-native-avatar-button {
    border: 0;
    color: #fff;
    background: linear-gradient(145deg, #ff7945, var(--app-primary));
    font-size: 14px;
    font-weight: 900;
    box-shadow: 0 8px 20px rgba(240, 68, 20, .25);
}

html.sathi-mobile-pwa .sathi-native-action-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 18px;
    height: 18px;
    display: grid;
    place-items: center;
    padding: 0 4px;
    border: 2px solid #fff;
    border-radius: 10px;
    background: #e72c43;
    color: #fff;
    font-size: 9px;
    font-weight: 900;
    line-height: 1;
}

html.sathi-mobile-pwa .sathi-native-action-badge.is-hidden {
    display: none;
}

html.sathi-mobile-pwa .sathi-native-discovery-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
    margin-top: 11px;
}

html.sathi-mobile-pwa .sathi-native-location-chip,
html.sathi-mobile-pwa .sathi-native-search-launch {
    min-width: 0;
    min-height: 45px;
    display: flex;
    align-items: center;
    gap: 9px;
    border: 1px solid rgba(240, 68, 20, .10);
    border-radius: 15px;
    background: #fff7f2;
    color: var(--app-ink);
    text-decoration: none;
}

html.sathi-mobile-pwa .sathi-native-location-chip {
    padding: 7px 11px;
}

html.sathi-mobile-pwa .sathi-native-location-chip > svg:first-child {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
    fill: var(--app-primary);
}

html.sathi-mobile-pwa .sathi-native-location-chip span {
    min-width: 0;
    display: flex;
    flex: 1;
    flex-direction: column;
}

html.sathi-mobile-pwa .sathi-native-location-chip small {
    color: #9a7568;
    font-size: 8px;
    font-weight: 700;
    line-height: 1.1;
}

html.sathi-mobile-pwa .sathi-native-location-chip strong {
    overflow: hidden;
    font-size: 11px;
    font-weight: 850;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html.sathi-mobile-pwa .sathi-native-location-chip .chevron {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: #a67b6e;
    stroke-width: 2;
}

html.sathi-mobile-pwa .sathi-native-search-launch {
    width: 45px;
    justify-content: center;
    background: var(--app-primary);
    color: #fff;
    box-shadow: 0 8px 20px rgba(240, 68, 20, .23);
}

html.sathi-mobile-pwa .sathi-native-search-launch svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

html.sathi-mobile-pwa .sathi-native-search-launch span {
    display: none;
}

/* Completely separate customer PWA home */
html.sathi-mobile-pwa .sathi-native-home {
    display: block;
    padding: 14px 14px 24px;
    animation: sathiNativePageIn .28s ease both;
}

html.sathi-mobile-pwa .sf-home-v5 {
    display: none !important;
}

html.sathi-mobile-pwa .sathi-native-welcome-card {
    position: relative;
    overflow: hidden;
    padding: 22px 18px 18px;
    border-radius: 26px;
    background:
        radial-gradient(circle at 92% 10%, rgba(255, 255, 255, .26), transparent 28%),
        linear-gradient(145deg, #f04414 0%, #ff6f38 54%, #ff8f5e 100%);
    color: #fff;
    box-shadow: 0 18px 40px rgba(240, 68, 20, .27);
}

html.sathi-mobile-pwa .sathi-native-welcome-card::after {
    content: "";
    position: absolute;
    right: -45px;
    bottom: -70px;
    width: 170px;
    height: 170px;
    border: 28px solid rgba(255, 255, 255, .09);
    border-radius: 50%;
}

html.sathi-mobile-pwa .sathi-native-eyebrow {
    display: block;
    margin-bottom: 6px;
    color: rgba(255, 255, 255, .78);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .15em;
}

html.sathi-mobile-pwa .sathi-native-welcome-card h1 {
    max-width: 245px;
    margin: 0;
    color: #fff;
    font-family: Manrope, Inter, sans-serif;
    font-size: clamp(25px, 7vw, 31px);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: -.045em;
}

html.sathi-mobile-pwa .sathi-native-welcome-card > div > p {
    max-width: 240px;
    margin: 8px 0 0;
    color: rgba(255, 255, 255, .82);
    font-size: 11px;
    line-height: 1.45;
}

html.sathi-mobile-pwa .sathi-native-welcome-emoji {
    position: absolute;
    top: 20px;
    right: 15px;
    z-index: 1;
    font-size: 45px;
    filter: drop-shadow(0 10px 12px rgba(85, 29, 10, .18));
    transform: rotate(7deg);
}

html.sathi-mobile-pwa .sathi-native-home-search {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-height: 52px;
    margin-top: 19px;
    padding: 5px 5px 5px 14px;
    border-radius: 17px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 12px 28px rgba(83, 30, 12, .16);
}

html.sathi-mobile-pwa .sathi-native-home-search > svg {
    width: 19px;
    height: 19px;
    fill: #a5867b;
}

html.sathi-mobile-pwa .sathi-native-home-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--app-ink);
    font-size: 12px;
    font-weight: 650;
}

html.sathi-mobile-pwa .sathi-native-home-search input::placeholder {
    color: #a8a2aa;
}

html.sathi-mobile-pwa .sathi-native-home-search button {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 13px;
    background: #242636;
    color: #fff;
}

html.sathi-mobile-pwa .sathi-native-home-search button svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
}

html.sathi-mobile-pwa .sathi-native-quick-actions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
    margin: 16px 0 20px;
}

html.sathi-mobile-pwa .sathi-native-quick-actions > a {
    min-width: 0;
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 4px;
    padding: 12px 4px 10px;
    border: 1px solid var(--app-line);
    border-radius: 19px;
    background: #fff;
    color: var(--app-ink);
    text-align: center;
    text-decoration: none;
    box-shadow: var(--app-shadow-soft);
}

html.sathi-mobile-pwa .sathi-native-quick-actions > a:active {
    transform: translateY(1px) scale(.97);
}

html.sathi-mobile-pwa .sathi-native-quick-actions > a > span {
    width: 39px;
    height: 39px;
    display: grid;
    place-items: center;
    margin-bottom: 2px;
    border-radius: 13px;
}

html.sathi-mobile-pwa .sathi-native-quick-actions svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

html.sathi-mobile-pwa .sathi-native-quick-actions .is-orange { background: #fff0e9; color: var(--app-primary); }
html.sathi-mobile-pwa .sathi-native-quick-actions .is-purple { background: #f0edff; color: var(--app-purple); }
html.sathi-mobile-pwa .sathi-native-quick-actions .is-pink { background: #ffedf4; color: var(--app-pink); }
html.sathi-mobile-pwa .sathi-native-quick-actions .is-green { background: #eaf8f2; color: var(--app-green); }

html.sathi-mobile-pwa .sathi-native-quick-actions strong {
    overflow: hidden;
    width: 100%;
    font-size: 10px;
    font-weight: 850;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html.sathi-mobile-pwa .sathi-native-quick-actions small {
    overflow: hidden;
    width: 100%;
    color: var(--app-muted);
    font-size: 8px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html.sathi-mobile-pwa .sathi-native-quick-actions small b {
    color: inherit;
}

html.sathi-mobile-pwa .sathi-native-featured-card {
    position: relative;
    min-height: 205px;
    overflow: hidden;
    margin-bottom: 24px;
    border-radius: 25px;
    background: #282937;
    box-shadow: 0 18px 38px rgba(30, 25, 38, .17);
}

html.sathi-mobile-pwa .sathi-native-featured-card > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

html.sathi-mobile-pwa .sathi-native-featured-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(20, 18, 25, .90) 0%, rgba(20, 18, 25, .58) 55%, rgba(20, 18, 25, .12) 100%);
}

html.sathi-mobile-pwa .sathi-native-featured-copy {
    position: relative;
    z-index: 1;
    width: 68%;
    padding: 25px 20px;
    color: #fff;
}

html.sathi-mobile-pwa .sathi-native-featured-copy > span {
    color: #ffb594;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .13em;
}

html.sathi-mobile-pwa .sathi-native-featured-copy h2 {
    margin: 8px 0 4px;
    color: #fff;
    font-family: Manrope, Inter, sans-serif;
    font-size: 25px;
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: -.035em;
}

html.sathi-mobile-pwa .sathi-native-featured-copy > p {
    overflow: hidden;
    margin: 0;
    color: rgba(255, 255, 255, .72);
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html.sathi-mobile-pwa .sathi-native-featured-copy > div {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-top: 17px;
}

html.sathi-mobile-pwa .sathi-native-featured-copy > div > strong {
    font-size: 16px;
    font-weight: 900;
}

html.sathi-mobile-pwa .sathi-native-featured-copy form button,
html.sathi-mobile-pwa .sathi-native-food-copy form button {
    min-width: 58px;
    min-height: 35px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: 0;
    border-radius: 12px;
    background: var(--app-primary);
    color: #fff;
    font-size: 10px;
    font-weight: 850;
    box-shadow: 0 8px 18px rgba(240, 68, 20, .25);
}

html.sathi-mobile-pwa .sathi-native-featured-copy .add-cart-icon,
html.sathi-mobile-pwa .sathi-native-food-copy .add-cart-icon {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: #fff;
    stroke-width: 2;
}

html.sathi-mobile-pwa .sathi-native-section {
    margin: 0 -14px 22px;
}

html.sathi-mobile-pwa .sathi-native-section-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
    padding: 0 14px 11px;
}

html.sathi-mobile-pwa .sathi-native-section-head small {
    display: block;
    margin-bottom: 2px;
    color: var(--app-primary);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

html.sathi-mobile-pwa .sathi-native-section-head h2 {
    margin: 0;
    color: var(--app-ink);
    font-family: Manrope, Inter, sans-serif;
    font-size: 19px;
    font-weight: 900;
    letter-spacing: -.03em;
}

html.sathi-mobile-pwa .sathi-native-section-head > a {
    padding-bottom: 1px;
    color: var(--app-primary);
    font-size: 10px;
    font-weight: 850;
    text-decoration: none;
}

html.sathi-mobile-pwa .sathi-native-category-rail,
html.sathi-mobile-pwa .sathi-native-food-rail {
    display: flex;
    gap: 11px;
    overflow-x: auto;
    padding: 0 14px 10px;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
}

html.sathi-mobile-pwa .sathi-native-category-rail::-webkit-scrollbar,
html.sathi-mobile-pwa .sathi-native-food-rail::-webkit-scrollbar {
    display: none;
}

html.sathi-mobile-pwa .sathi-native-category-rail > a {
    flex: 0 0 73px;
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 7px;
    color: var(--app-ink);
    text-align: center;
    text-decoration: none;
    scroll-snap-align: start;
}

html.sathi-mobile-pwa .sathi-native-category-rail > a > span {
    width: 65px;
    height: 65px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 4px solid #fff;
    border-radius: 23px;
    background: #fff1ea;
    color: var(--app-primary);
    font-size: 22px;
    box-shadow: 0 8px 21px rgba(38, 31, 48, .09);
}

html.sathi-mobile-pwa .sathi-native-category-rail > a.is-all > span {
    background: linear-gradient(145deg, #ff7945, var(--app-primary));
    color: #fff;
}

html.sathi-mobile-pwa .sathi-native-category-rail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

html.sathi-mobile-pwa .sathi-native-category-rail strong {
    width: 100%;
    overflow: hidden;
    font-size: 9px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html.sathi-mobile-pwa .sathi-native-food-card {
    flex: 0 0 min(72vw, 255px);
    overflow: hidden;
    border: 1px solid var(--app-line);
    border-radius: 23px;
    background: #fff;
    box-shadow: var(--app-shadow-soft);
    scroll-snap-align: start;
}

html.sathi-mobile-pwa .sathi-native-food-media {
    position: relative;
    height: 148px;
    display: block;
    overflow: hidden;
    background: #f1ece9;
}

html.sathi-mobile-pwa .sathi-native-food-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

html.sathi-mobile-pwa .sathi-native-food-media > span {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    font-size: 44px;
}

html.sathi-mobile-pwa .sathi-native-food-media small {
    position: absolute;
    right: 9px;
    bottom: 9px;
    padding: 5px 8px;
    border-radius: 10px;
    background: rgba(255, 255, 255, .92);
    color: #ee9a15;
    font-size: 9px;
    font-weight: 850;
    box-shadow: 0 5px 15px rgba(20, 18, 25, .12);
}

html.sathi-mobile-pwa .sathi-native-food-copy {
    padding: 13px;
}

html.sathi-mobile-pwa .sathi-native-food-copy > small {
    color: var(--app-primary);
    font-size: 8px;
    font-weight: 850;
    text-transform: uppercase;
}

html.sathi-mobile-pwa .sathi-native-food-copy h3 {
    overflow: hidden;
    margin: 4px 0 3px;
    color: var(--app-ink);
    font-size: 14px;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html.sathi-mobile-pwa .sathi-native-food-copy > p {
    overflow: hidden;
    margin: 0;
    color: var(--app-muted);
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html.sathi-mobile-pwa .sathi-native-food-copy > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 12px;
}

html.sathi-mobile-pwa .sathi-native-food-copy > div > strong {
    color: var(--app-ink);
    font-size: 14px;
    font-weight: 900;
}

html.sathi-mobile-pwa .sathi-native-service-strip {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    padding: 13px;
    border: 1px solid rgba(240, 68, 20, .09);
    border-radius: 21px;
    background: #fff7f2;
}

html.sathi-mobile-pwa .sathi-native-service-strip > div {
    min-width: 0;
    text-align: center;
}

html.sathi-mobile-pwa .sathi-native-service-strip > div + div {
    border-left: 1px solid rgba(240, 68, 20, .12);
}

html.sathi-mobile-pwa .sathi-native-service-strip span {
    display: block;
    color: var(--app-primary);
    font-size: 12px;
    font-weight: 900;
}

html.sathi-mobile-pwa .sathi-native-service-strip small {
    display: block;
    margin-top: 2px;
    color: #856f69;
    font-size: 7px;
}

/* Public screens become app screens instead of responsive website pages */
html.sathi-mobile-pwa .food-explore-page-v3,
html.sathi-mobile-pwa .customer-list-page,
html.sathi-mobile-pwa .customer-dashboard,
html.sathi-mobile-pwa .track-order-page,
html.sathi-mobile-pwa .order-details-page,
html.sathi-mobile-pwa .premium-checkout-page,
html.sathi-mobile-pwa .auth-page,
html.sathi-mobile-pwa main:not(.sathi-native-home):not(.dashboard-main) {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 14px 14px 24px !important;
    animation: sathiNativePageIn .28s ease both;
}

html.sathi-mobile-pwa .explore-hero-v3,
html.sathi-mobile-pwa .listing-hero,
html.sathi-mobile-pwa .customer-welcome,
html.sathi-mobile-pwa .order-details-hero,
html.sathi-mobile-pwa .premium-checkout-hero {
    margin: 0 0 14px !important;
    padding: 18px !important;
    border: 0 !important;
    border-radius: 24px !important;
    background: linear-gradient(145deg, #242636, #343748) !important;
    color: #fff !important;
    box-shadow: 0 16px 36px rgba(28, 27, 39, .18) !important;
}

html.sathi-mobile-pwa .explore-hero-v3 h1,
html.sathi-mobile-pwa .listing-hero h1,
html.sathi-mobile-pwa .customer-welcome h1,
html.sathi-mobile-pwa .order-details-hero h1,
html.sathi-mobile-pwa .premium-checkout-hero h1,
html.sathi-mobile-pwa .premium-checkout-hero h2 {
    color: #fff !important;
    font-family: Manrope, Inter, sans-serif !important;
    font-size: 24px !important;
    font-weight: 900 !important;
    line-height: 1.12 !important;
    letter-spacing: -.035em !important;
}

html.sathi-mobile-pwa .explore-hero-v3 p,
html.sathi-mobile-pwa .listing-hero p,
html.sathi-mobile-pwa .customer-welcome p,
html.sathi-mobile-pwa .premium-checkout-hero p,
html.sathi-mobile-pwa .customer-meta {
    color: rgba(255, 255, 255, .72) !important;
    font-size: 10px !important;
}

html.sathi-mobile-pwa .explore-search-v3 {
    min-height: 49px;
    margin-top: 14px !important;
    padding: 4px 4px 4px 13px !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: #fff !important;
}

html.sathi-mobile-pwa .explore-search-v3 input {
    border: 0 !important;
    font-size: 12px !important;
}

html.sathi-mobile-pwa .explore-search-v3 button {
    min-height: 40px !important;
    padding: 0 14px !important;
    border-radius: 12px !important;
    background: var(--app-primary) !important;
    font-size: 10px !important;
}

html.sathi-mobile-pwa .explore-category-filter-v3 {
    position: sticky;
    top: calc(111px + var(--app-top-safe));
    z-index: 100;
    display: flex !important;
    gap: 8px !important;
    overflow-x: auto;
    margin: 0 -14px 14px !important;
    padding: 8px 14px 10px !important;
    background: rgba(246, 247, 251, .94);
    backdrop-filter: blur(18px);
    scrollbar-width: none;
}

html.sathi-mobile-pwa .explore-category-filter-v3::-webkit-scrollbar { display: none; }

html.sathi-mobile-pwa .explore-category-filter-v3 a {
    flex: 0 0 auto;
    min-height: 38px;
    padding: 0 13px !important;
    border: 1px solid var(--app-line) !important;
    border-radius: 13px !important;
    background: #fff !important;
    color: #6f7281 !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    box-shadow: 0 5px 14px rgba(31, 27, 39, .04);
}

html.sathi-mobile-pwa .explore-category-filter-v3 a.active {
    border-color: var(--app-primary) !important;
    background: var(--app-primary) !important;
    color: #fff !important;
    box-shadow: 0 8px 18px rgba(240, 68, 20, .22);
}

html.sathi-mobile-pwa .section-heading-v3,
html.sathi-mobile-pwa .food-listing-head,
html.sathi-mobile-pwa .panel-card-header,
html.sathi-mobile-pwa .row-heading-v3 {
    align-items: end !important;
    margin-bottom: 12px !important;
}

html.sathi-mobile-pwa .section-heading-v3 h2,
html.sathi-mobile-pwa .food-listing-head h2,
html.sathi-mobile-pwa .panel-card-header h2,
html.sathi-mobile-pwa .row-heading-v3 h2 {
    font-family: Manrope, Inter, sans-serif !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    letter-spacing: -.03em !important;
}

html.sathi-mobile-pwa .section-heading-v3 p,
html.sathi-mobile-pwa .food-listing-head p,
html.sathi-mobile-pwa .panel-card-header p,
html.sathi-mobile-pwa .row-heading-v3 p {
    font-size: 9px !important;
}

html.sathi-mobile-pwa .food-product-grid-v3,
html.sathi-mobile-pwa .explore-food-grid-v3,
html.sathi-mobile-pwa .food-listing-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 11px !important;
}

html.sathi-mobile-pwa .food-product-card {
    min-width: 0 !important;
    overflow: hidden !important;
    border: 1px solid var(--app-line) !important;
    border-radius: 21px !important;
    background: #fff !important;
    box-shadow: var(--app-shadow-soft) !important;
}

html.sathi-mobile-pwa .food-product-media {
    height: 125px !important;
    border-radius: 0 !important;
}

html.sathi-mobile-pwa .food-product-content {
    padding: 11px !important;
}

html.sathi-mobile-pwa .food-product-meta {
    gap: 5px !important;
    font-size: 7px !important;
}

html.sathi-mobile-pwa .food-product-content h3 {
    min-height: 33px;
    margin: 5px 0 2px !important;
    display: -webkit-box;
    overflow: hidden;
    font-size: 12px !important;
    font-weight: 850 !important;
    line-height: 1.35 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

html.sathi-mobile-pwa .food-product-content > p,
html.sathi-mobile-pwa .food-kitchen-name {
    display: none !important;
}

html.sathi-mobile-pwa .food-product-bottom {
    align-items: center !important;
    margin-top: 9px !important;
}

html.sathi-mobile-pwa .food-product-price strong {
    font-size: 11px !important;
}

html.sathi-mobile-pwa .food-product-price del {
    font-size: 7px !important;
}

html.sathi-mobile-pwa .food-product-bottom form button {
    width: 35px !important;
    min-width: 35px !important;
    height: 35px !important;
    padding: 0 !important;
    border-radius: 12px !important;
    background: var(--app-primary) !important;
    color: #fff !important;
}

html.sathi-mobile-pwa .food-product-bottom form button [data-cart-button-label] {
    display: none !important;
}

html.sathi-mobile-pwa .food-product-bottom .add-cart-icon {
    width: 17px !important;
    height: 17px !important;
    stroke: #fff !important;
}

html.sathi-mobile-pwa .food-heart-btn {
    width: 34px !important;
    height: 34px !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, .93) !important;
    box-shadow: 0 7px 17px rgba(24, 20, 30, .13) !important;
}

/* Forms and content sheets */
html.sathi-mobile-pwa .checkout-card,
html.sathi-mobile-pwa .track-order-card,
html.sathi-mobile-pwa .order-details-grid > *,
html.sathi-mobile-pwa .premium-checkout-grid > *,
html.sathi-mobile-pwa .customer-dashboard-grid > *,
html.sathi-mobile-pwa .public-empty-state-v3,
html.sathi-mobile-pwa .content-card,
html.sathi-mobile-pwa .panel-card,
html.sathi-mobile-pwa .dashboard-card,
html.sathi-mobile-pwa .chart-card,
html.sathi-mobile-pwa .table-card {
    border: 1px solid var(--app-line) !important;
    border-radius: 23px !important;
    background: #fff !important;
    box-shadow: var(--app-shadow-soft) !important;
}

html.sathi-mobile-pwa .checkout-card,
html.sathi-mobile-pwa .track-order-card,
html.sathi-mobile-pwa .content-card,
html.sathi-mobile-pwa .panel-card,
html.sathi-mobile-pwa .dashboard-card,
html.sathi-mobile-pwa .chart-card,
html.sathi-mobile-pwa .table-card {
    padding: 15px !important;
}

html.sathi-mobile-pwa input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
html.sathi-mobile-pwa select,
html.sathi-mobile-pwa textarea {
    min-height: 47px;
    border: 1px solid rgba(36, 37, 52, .09) !important;
    border-radius: 14px !important;
    background: #f8f8fb !important;
    color: var(--app-ink) !important;
    font-size: 12px !important;
    box-shadow: none !important;
}

html.sathi-mobile-pwa textarea {
    min-height: 100px;
}

html.sathi-mobile-pwa input:focus,
html.sathi-mobile-pwa select:focus,
html.sathi-mobile-pwa textarea:focus {
    border-color: rgba(240, 68, 20, .55) !important;
    background: #fff !important;
    outline: 3px solid rgba(240, 68, 20, .10) !important;
}

html.sathi-mobile-pwa .btn-primary,
html.sathi-mobile-pwa .checkout-btn,
html.sathi-mobile-pwa .header-primary-btn,
html.sathi-mobile-pwa button[type="submit"]:not(.food-heart-btn):not(.notification-bell):not(.sathi-native-icon-button):not(.pwa-compact-submit) {
    min-height: 46px;
    border: 0 !important;
    border-radius: 14px !important;
    background: linear-gradient(145deg, #ff7140, var(--app-primary)) !important;
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    box-shadow: 0 9px 20px rgba(240, 68, 20, .20) !important;
}

html.sathi-mobile-pwa .panel-alert,
html.sathi-mobile-pwa .alert,
html.sathi-mobile-pwa .public-flash-v3 {
    margin: 0 14px 12px !important;
    border: 0 !important;
    border-radius: 16px !important;
    box-shadow: var(--app-shadow-soft);
}

/* Panel app workspace */
html.sathi-mobile-pwa .dashboard-main > .sathi-native-appbar {
    margin: 0;
}

html.sathi-mobile-pwa .dashboard-main > section,
html.sathi-mobile-pwa .dashboard-main > .stats-grid,
html.sathi-mobile-pwa .dashboard-main > .analytics-grid,
html.sathi-mobile-pwa .dashboard-main > .panel-summary-grid,
html.sathi-mobile-pwa .dashboard-main > .content-card,
html.sathi-mobile-pwa .dashboard-main > .panel-card,
html.sathi-mobile-pwa .dashboard-main > .panel-alert,
html.sathi-mobile-pwa .dashboard-main > .alert,
html.sathi-mobile-pwa .dashboard-main > form {
    margin-left: 14px !important;
    margin-right: 14px !important;
}

html.sathi-mobile-pwa .dashboard-main > .stats-grid {
    display: flex !important;
    gap: 10px !important;
    overflow-x: auto;
    margin-top: 14px !important;
    padding: 0 0 9px !important;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
}

html.sathi-mobile-pwa .dashboard-main > .stats-grid::-webkit-scrollbar { display: none; }

html.sathi-mobile-pwa .stats-grid .stat-card {
    flex: 0 0 min(65vw, 230px) !important;
    min-width: 0 !important;
    min-height: 126px;
    padding: 16px !important;
    border: 1px solid var(--app-line) !important;
    border-radius: 22px !important;
    background: #fff !important;
    box-shadow: var(--app-shadow-soft) !important;
    scroll-snap-align: start;
}

html.sathi-mobile-pwa .stats-grid .stat-card:nth-child(4n+1) {
    background: linear-gradient(145deg, #252738, #383b4c) !important;
    color: #fff !important;
}

html.sathi-mobile-pwa .stats-grid .stat-card:nth-child(4n+1) span,
html.sathi-mobile-pwa .stats-grid .stat-card:nth-child(4n+1) p,
html.sathi-mobile-pwa .stats-grid .stat-card:nth-child(4n+1) strong {
    color: #fff !important;
}

html.sathi-mobile-pwa .stats-grid .stat-card span {
    color: var(--app-muted) !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: .07em;
}

html.sathi-mobile-pwa .stats-grid .stat-card strong {
    display: block;
    margin: 9px 0 4px;
    color: var(--app-ink) !important;
    font-family: Manrope, Inter, sans-serif;
    font-size: 27px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -.045em;
}

html.sathi-mobile-pwa .stats-grid .stat-card p {
    margin: 8px 0 0 !important;
    color: var(--app-muted) !important;
    font-size: 8px !important;
    line-height: 1.4 !important;
}

html.sathi-mobile-pwa .panel-summary-grid,
html.sathi-mobile-pwa .analytics-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    margin-top: 12px !important;
}

html.sathi-mobile-pwa .panel-summary-item {
    min-height: 82px;
    padding: 14px !important;
    border: 1px solid var(--app-line) !important;
    border-radius: 20px !important;
    background: #fff !important;
    box-shadow: var(--app-shadow-soft) !important;
}

html.sathi-mobile-pwa .chart-card {
    min-height: 240px !important;
}

html.sathi-mobile-pwa .chart-card canvas {
    max-height: 230px !important;
}

html.sathi-mobile-pwa .table-responsive {
    width: calc(100% + 4px);
    margin: 0 -2px;
    overflow-x: auto !important;
    border-radius: 16px;
    scrollbar-width: thin;
}

html.sathi-mobile-pwa table {
    min-width: 680px;
    font-size: 10px !important;
}

html.sathi-mobile-pwa table th {
    color: #7b7e8d !important;
    font-size: 8px !important;
    font-weight: 850 !important;
    letter-spacing: .04em;
    text-transform: uppercase;
}

html.sathi-mobile-pwa table th,
html.sathi-mobile-pwa table td {
    padding: 11px 10px !important;
}

html.sathi-mobile-pwa .badge-status,
html.sathi-mobile-pwa .status-badge {
    border-radius: 10px !important;
    font-size: 8px !important;
    font-weight: 800 !important;
}

/* App drawer */
html.sathi-mobile-pwa .dashboard-layout > .sidebar,
html.sathi-mobile-pwa .dashboard-layout > .panel-sidebar {
    width: min(86vw, 320px) !important;
    max-width: 320px !important;
    padding-top: var(--app-top-safe) !important;
    border-radius: 0 28px 28px 0 !important;
    background: #202230 !important;
    box-shadow: 20px 0 55px rgba(15, 14, 20, .30) !important;
}

html.sathi-mobile-pwa .sidebar-brand {
    margin: 10px 12px 7px !important;
    padding: 15px !important;
    border: 1px solid rgba(255, 255, 255, .08) !important;
    border-radius: 20px !important;
    background: rgba(255, 255, 255, .06) !important;
}

html.sathi-mobile-pwa .sidebar-brand strong,
html.sathi-mobile-pwa .sidebar-brand small {
    color: #fff !important;
}

html.sathi-mobile-pwa .sidebar-menu,
html.sathi-mobile-pwa .panel-nav {
    padding: 8px 12px calc(25px + var(--app-bottom-safe)) !important;
}

html.sathi-mobile-pwa .sidebar-menu a,
html.sathi-mobile-pwa .panel-nav a {
    min-height: 48px !important;
    margin: 3px 0 !important;
    padding: 0 13px !important;
    border-radius: 14px !important;
    color: rgba(255, 255, 255, .76) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}

html.sathi-mobile-pwa .sidebar-menu a.active,
html.sathi-mobile-pwa .panel-nav a.active,
html.sathi-mobile-pwa .sidebar-menu a:active,
html.sathi-mobile-pwa .panel-nav a:active {
    background: linear-gradient(145deg, #ff7040, var(--app-primary)) !important;
    color: #fff !important;
}

html.sathi-mobile-pwa .sidebar-label {
    color: rgba(255, 255, 255, .38) !important;
    font-size: 8px !important;
}

html.sathi-mobile-pwa .sidebar-close-btn {
    color: #fff !important;
    background: rgba(255, 255, 255, .09) !important;
}

/* Bottom navigation: native tab bar */
html.sathi-mobile-pwa .sathi-app-bottom-nav {
    position: fixed !important;
    z-index: 10000 !important;
    left: 10px !important;
    right: 10px !important;
    bottom: calc(8px + var(--app-bottom-safe)) !important;
    height: var(--app-nav-height) !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: center !important;
    overflow: visible !important;
    padding: 8px 7px 6px !important;
    border: 1px solid rgba(42, 37, 49, .08) !important;
    border-radius: 26px !important;
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 18px 48px rgba(30, 23, 38, .22) !important;
    backdrop-filter: blur(24px) saturate(1.3) !important;
    -webkit-backdrop-filter: blur(24px) saturate(1.3) !important;
}

html.sathi-mobile-pwa .sathi-app-nav-item {
    position: relative;
    min-width: 0;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    border: 0;
    border-radius: 16px;
    background: transparent;
    color: #8b8e9c;
    font-size: 8px;
    font-weight: 780;
    text-decoration: none;
}

html.sathi-mobile-pwa .sathi-app-nav-item:active {
    background: #f5f5f8;
    transform: scale(.96);
}

html.sathi-mobile-pwa .sathi-app-nav-item.is-active {
    color: var(--app-primary);
}

html.sathi-mobile-pwa .sathi-app-nav-item.is-active::before {
    display: none !important;
}

html.sathi-mobile-pwa .sathi-app-nav-icon,
html.sathi-mobile-pwa .sathi-app-nav-icon svg {
    width: 23px;
    height: 23px;
}

html.sathi-mobile-pwa .sathi-app-nav-icon svg {
    fill: currentColor;
}

html.sathi-mobile-pwa .sathi-app-nav-item.is-active:not(.is-cart-action) .sathi-app-nav-icon {
    width: 37px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: var(--app-primary-soft);
}

html.sathi-mobile-pwa .sathi-app-nav-item.is-active:not(.is-cart-action) .sathi-app-nav-icon svg {
    width: 19px;
    height: 19px;
}

html.sathi-mobile-pwa .sathi-app-nav-item.is-cart-action .sathi-app-nav-icon {
    width: 60px !important;
    height: 60px !important;
    display: grid !important;
    place-items: center !important;
    transform: translateY(-17px) !important;
    border: 5px solid #fff !important;
    border-radius: 22px !important;
    background: linear-gradient(145deg, #ff7945 0%, var(--app-primary) 58%, var(--app-primary-strong) 100%) !important;
    color: #fff !important;
    box-shadow: 0 13px 29px rgba(240, 68, 20, .40), inset 0 1px 0 rgba(255, 255, 255, .28) !important;
}

html.sathi-mobile-pwa .sathi-app-nav-item.is-cart-action .sathi-app-nav-icon svg {
    width: 27px !important;
    height: 27px !important;
    fill: #fff !important;
}

html.sathi-mobile-pwa .sathi-app-nav-item.is-cart-action .sathi-app-nav-label {
    position: absolute;
    right: 0;
    bottom: 2px;
    left: 0;
    color: var(--app-primary-strong);
    font-size: 8px;
    font-weight: 900;
}

html.sathi-mobile-pwa .sathi-app-nav-badge {
    right: -7px !important;
    top: -7px !important;
    min-width: 18px !important;
    height: 18px !important;
    border: 2px solid #fff !important;
    border-radius: 10px !important;
    background: #e72c43 !important;
    color: #fff !important;
    font-size: 8px !important;
    line-height: 14px !important;
}

html.sathi-mobile-pwa .sathi-app-nav-item.is-cart-action .sathi-app-nav-badge {
    background: #252736 !important;
}

/* Bottom sheets and transient UI */
html.sathi-mobile-pwa .sathi-pwa-modal {
    align-items: end !important;
    padding: 0 !important;
}

html.sathi-mobile-pwa .sathi-pwa-modal-card {
    width: 100% !important;
    max-width: none !important;
    border-radius: 30px 30px 0 0 !important;
    padding: 27px 20px calc(21px + var(--app-bottom-safe)) !important;
}

html.sathi-mobile-pwa .sathi-pwa-network {
    top: calc(10px + var(--app-top-safe)) !important;
    width: calc(100% - 24px) !important;
    border-radius: 17px !important;
}

html.sathi-mobile-pwa .sathi-pwa-update {
    bottom: calc(var(--app-nav-height) + var(--app-bottom-safe) + 18px) !important;
    width: calc(100% - 24px) !important;
    border-radius: 18px !important;
    font-size: 10px !important;
}

html.sathi-mobile-pwa .app-toast-container {
    bottom: calc(var(--app-nav-height) + var(--app-bottom-safe) + 18px) !important;
}

/* Pull-to-refresh cue and app loading */
html.sathi-mobile-pwa .sathi-native-pull-indicator {
    position: fixed;
    z-index: 9990;
    top: calc(7px + var(--app-top-safe));
    left: 50%;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #fff;
    color: var(--app-primary);
    box-shadow: 0 10px 25px rgba(31, 26, 39, .15);
    opacity: 0;
    transform: translate(-50%, -54px) rotate(0);
    transition: opacity .18s ease, transform .18s ease;
    pointer-events: none;
}

html.sathi-mobile-pwa .sathi-native-pull-indicator svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
}

html.sathi-mobile-pwa .sathi-native-pull-indicator.is-visible {
    opacity: 1;
    transform: translate(-50%, 0) rotate(var(--pull-rotate, 0deg));
}

html.sathi-mobile-pwa .sathi-native-pull-indicator.is-refreshing svg {
    animation: sathiNativeSpin .7s linear infinite;
}

html.sathi-mobile-pwa body.sathi-native-route-leaving {
    opacity: .72;
    transform: scale(.994);
    transition: opacity .12s ease, transform .12s ease;
}

@keyframes sathiNativePageIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: none; }
}

@keyframes sathiNativeSpin {
    to { transform: rotate(360deg); }
}

@media (max-width: 370px) {
    html.sathi-mobile-pwa .sathi-native-appbar { padding-right: 12px; padding-left: 12px; }
    html.sathi-mobile-pwa .sathi-native-home { padding-right: 11px; padding-left: 11px; }
    html.sathi-mobile-pwa .sathi-native-quick-actions { gap: 6px; }
    html.sathi-mobile-pwa .sathi-native-quick-actions > a > span { width: 35px; height: 35px; }
    html.sathi-mobile-pwa .sathi-native-appbar-actions { gap: 4px; }
    html.sathi-mobile-pwa .sathi-native-icon-button,
    html.sathi-mobile-pwa .sathi-native-avatar-button { width: 38px; height: 38px; min-width: 38px; }
    html.sathi-mobile-pwa .food-product-grid-v3,
    html.sathi-mobile-pwa .explore-food-grid-v3,
    html.sathi-mobile-pwa .food-listing-grid { gap: 8px !important; }
}

@media (orientation: landscape) and (max-height: 520px) {
    html.sathi-mobile-pwa .sathi-native-discovery-row { display: none; }
    html.sathi-mobile-pwa .sathi-native-appbar { padding-bottom: 8px; }
    html.sathi-mobile-pwa .sathi-app-bottom-nav { height: 64px !important; }
}

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


html.sathi-mobile-pwa .sathi-native-appbar.is-scrolled {
    box-shadow: 0 12px 30px rgba(27, 22, 35, .09);
}

html.sathi-mobile-pwa body.sathi-keyboard-open .sathi-app-bottom-nav {
    opacity: 0;
    transform: translateY(calc(110% + var(--app-bottom-safe)));
    pointer-events: none;
}


html.sathi-mobile-pwa .sathi-native-splash {
    position: fixed;
    inset: 0;
    z-index: 20000;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
    padding: var(--app-top-safe) 20px var(--app-bottom-safe);
    background:
        radial-gradient(circle at 50% 38%, rgba(255,255,255,.22), transparent 28%),
        linear-gradient(155deg, #ff7541 0%, #f04414 52%, #d93608 100%);
    color: #fff;
    opacity: 1;
    visibility: visible;
    transition: opacity .28s ease, visibility .28s ease;
}

html.sathi-mobile-pwa .sathi-native-splash.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

html.sathi-mobile-pwa .sathi-native-splash-mark {
    width: 86px;
    height: 86px;
    overflow: hidden;
    margin-bottom: 8px;
    padding: 5px;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 27px;
    background: rgba(255,255,255,.18);
    box-shadow: 0 24px 45px rgba(104,31,8,.28);
    backdrop-filter: blur(12px);
}

html.sathi-mobile-pwa .sathi-native-splash-mark img {
    width: 100%;
    height: 100%;
    border-radius: 22px;
}

html.sathi-mobile-pwa .sathi-native-splash > strong {
    font-family: Manrope, Inter, sans-serif;
    font-size: 25px;
    font-weight: 900;
    letter-spacing: -.035em;
}

html.sathi-mobile-pwa .sathi-native-splash > small {
    color: rgba(255,255,255,.72);
    font-size: 10px;
    font-weight: 650;
}

html.sathi-mobile-pwa .sathi-native-splash-loader {
    width: 32px;
    height: 4px;
    overflow: hidden;
    margin-top: 20px;
    border-radius: 4px;
    background: rgba(255,255,255,.22);
}

html.sathi-mobile-pwa .sathi-native-splash-loader::after {
    content: "";
    display: block;
    width: 45%;
    height: 100%;
    border-radius: inherit;
    background: #fff;
    animation: sathiNativeLoader 1s ease-in-out infinite alternate;
}

@keyframes sathiNativeLoader {
    from { transform: translateX(0); }
    to { transform: translateX(125%); }
}


/* Native mobile PWA footer: centre cart is icon-only. Version 20260730-8 */
html.sathi-mobile-pwa .sathi-app-nav-item.is-cart-action {
    justify-content: center !important;
    gap: 0 !important;
}
html.sathi-mobile-pwa .sathi-app-nav-item.is-cart-action .sathi-app-nav-icon {
    transform: translateY(-11px) !important;
    border-radius: 50% !important;
}
html.sathi-mobile-pwa .sathi-app-nav-item.is-cart-action .sathi-app-nav-label {
    display: none !important;
}
html.sathi-mobile-pwa .sathi-app-nav-item.is-cart-action:active {
    background: transparent !important;
}