/* BengalWin77 customer UI — India-first English mobile theme.
   Visual overrides only: no business or transaction behaviour lives here. */
:root {
    --bw-primary: #3157e8;
    --bw-primary-dark: #203eb8;
    --bw-navy: #111a3a;
    --bw-text: #202943;
    --bw-muted: #6f7890;
    --bw-surface: #ffffff;
    --bw-page: #f4f6fb;
    --bw-border: #e4e8f2;
    --bw-saffron: #ff9933;
    --bw-green: #138808;
    --bw-danger: #d92d20;
    --bw-radius: 14px;
    --bw-shadow: 0 8px 28px rgba(32, 51, 112, .09);
    --bw-shadow-premium: 0 18px 45px rgba(15, 26, 72, .18);
    --bw-gold: #f5b941;
}

html, body {
    background: var(--bw-page);
    color: var(--bw-text);
    font-family: Inter, "Noto Sans", "Segoe UI", Roboto, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}

body {
    min-height: 100vh;
}

/* A subtle India-inspired accent, without turning the interface into a flag. */
body::before {
    content: "";
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    pointer-events: none;
    background: linear-gradient(90deg, var(--bw-saffron) 0 33.333%, #fff 33.333% 66.666%, var(--bw-green) 66.666%);
    box-shadow: 0 1px 2px rgba(17, 26, 58, .08);
}

.appHeader {
    background: rgba(255, 255, 255, .96) !important;
    color: var(--bw-navy) !important;
    border-bottom: 1px solid var(--bw-border) !important;
    box-shadow: 0 3px 14px rgba(25, 39, 89, .06) !important;
    backdrop-filter: blur(12px);
}

.appHeader .pageTitle,
.appHeader .headerButton,
.appHeader ion-icon {
    color: var(--bw-navy) !important;
    font-weight: 700;
}

.section,
.listed-detail,
.card,
.listview,
.modal-content,
.popup-container {
    border-radius: var(--bw-radius);
}

.listview,
.card,
.listed-detail {
    border: 1px solid var(--bw-border) !important;
    box-shadow: var(--bw-shadow);
    overflow: hidden;
}

.listview > li,
.listview .item {
    background: var(--bw-surface) !important;
}

.listview .item .in {
    border-color: var(--bw-border) !important;
}

.text-muted,
.text-small,
.text-xsmall {
    color: var(--bw-muted) !important;
}

.btn,
.button,
.layui-btn,
button[type="submit"] {
    min-height: 46px;
    border-radius: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .01em;
    transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}

.btn-primary,
.button,
.layui-btn,
button[type="submit"] {
    color: #fff !important;
    border-color: var(--bw-primary) !important;
    background: linear-gradient(135deg, var(--bw-primary), var(--bw-primary-dark)) !important;
    box-shadow: 0 8px 18px rgba(49, 87, 232, .22) !important;
}

.btn:active,
.button:active,
.layui-btn:active,
button[type="submit"]:active {
    transform: translateY(1px);
    opacity: .92;
}

input,
select,
textarea,
.form-control,
.input-group-text {
    border-color: #d8deeb !important;
    border-radius: 11px !important;
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus {
    border-color: var(--bw-primary) !important;
    box-shadow: 0 0 0 3px rgba(49, 87, 232, .12) !important;
    outline: none !important;
}

.badge-success { background: #e9f8ed !important; color: #08783d !important; }
.badge-warning { background: #fff4e6 !important; color: #a14f00 !important; }
.badge-danger { background: #fff0ef !important; color: var(--bw-danger) !important; }
.badge-primary { background: #edf1ff !important; color: var(--bw-primary-dark) !important; }

/* Login and registration share one calm, trustworthy visual language. */
.app-login .page-login {
    background-color: var(--bw-page) !important;
    background-image:
        radial-gradient(circle at 15% 4%, rgba(255, 153, 51, .12), transparent 26%),
        radial-gradient(circle at 90% 92%, rgba(19, 136, 8, .09), transparent 30%) !important;
}

/* Premium customer dashboard */
.center-wrap.child-view {
    background:
        radial-gradient(circle at 8% 4%, rgba(255, 153, 51, .12), transparent 22%),
        radial-gradient(circle at 92% 30%, rgba(49, 87, 232, .12), transparent 30%),
        linear-gradient(180deg, #f8f9fd 0%, #f3f5fb 100%) !important;
}

.center-wrap > .header {
    min-height: .9rem !important;
    padding: .13rem .22rem !important;
    background: rgba(255, 255, 255, .92) !important;
    border-bottom: 1px solid rgba(222, 227, 240, .9) !important;
    box-shadow: 0 6px 22px rgba(23, 35, 81, .07) !important;
    backdrop-filter: blur(14px);
}

.center-wrap > .header .img {
    width: auto !important;
    height: .38rem !important;
    filter: drop-shadow(0 3px 7px rgba(49, 87, 232, .15));
}

.center-wrap > .header .right_item {
    padding: .08rem .13rem !important;
    color: var(--bw-navy) !important;
    background: #f7f8fc !important;
    border: 1px solid var(--bw-border) !important;
    border-radius: 999px !important;
    font-weight: 700;
}

.center-wrap > .header .cu_img {
    width: .28rem !important;
    height: .2rem !important;
    border-radius: 3px;
    object-fit: cover;
    box-shadow: 0 1px 4px rgba(17, 26, 58, .16);
}

.center-wrap .commen {
    padding: .18rem .16rem 0 !important;
    background: transparent !important;
}

.center-wrap .commen_info {
    position: relative;
    padding: .24rem .22rem !important;
    color: #fff !important;
    background:
        radial-gradient(circle at 90% 0, rgba(245, 185, 65, .26), transparent 28%),
        linear-gradient(145deg, #10183e 0%, #203583 52%, #3157e8 100%) !important;
    border: 1px solid rgba(255, 255, 255, .16) !important;
    border-radius: 20px !important;
    box-shadow: var(--bw-shadow-premium) !important;
    overflow: hidden;
}

.center-wrap .commen_info::after {
    content: "";
    position: absolute;
    width: 2.2rem;
    height: 2.2rem;
    right: -.72rem;
    bottom: -1rem;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 50%;
    box-shadow: 0 0 0 .25rem rgba(255, 255, 255, .035), 0 0 0 .52rem rgba(255, 255, 255, .025);
}

.center-wrap .commen_info .info_item {
    position: relative;
    z-index: 1;
    color: rgba(255, 255, 255, .76) !important;
}

.center-wrap .commen_info .info_item.hasfont {
    margin: .04rem 0 .17rem !important;
    color: #fff !important;
    font-weight: 800 !important;
    letter-spacing: .01em;
    text-shadow: 0 2px 10px rgba(3, 9, 35, .24);
}

.center-wrap .site_switch {
    gap: .1rem;
    margin-top: .18rem !important;
    padding: 0 !important;
    background: transparent !important;
}

.center-wrap .site_switch .switch_item {
    min-height: .58rem;
    display: flex !important;
    align-items: center;
    justify-content: center;
    color: var(--bw-navy) !important;
    background: rgba(255, 255, 255, .96) !important;
    border: 1px solid var(--bw-border) !important;
    border-radius: 12px !important;
    box-shadow: 0 7px 18px rgba(25, 39, 89, .08) !important;
    font-weight: 700;
}

.center-wrap .site_switch .switch_item a {
    color: var(--bw-navy) !important;
}

.center-wrap .site_switch .switch_item.checkin {
    color: #fff !important;
    border-color: transparent !important;
    background: linear-gradient(135deg, #3157e8, #213da8) !important;
    box-shadow: 0 9px 20px rgba(49, 87, 232, .25) !important;
}

.center-wrap .main {
    margin: .18rem .16rem 1.35rem !important;
    padding: 0 !important;
    background: transparent !important;
}

.center-wrap .mian_header {
    margin-bottom: .12rem;
    padding: .16rem .16rem !important;
    background: rgba(255, 255, 255, .95) !important;
    border: 1px solid var(--bw-border) !important;
    border-radius: 14px !important;
    box-shadow: 0 8px 22px rgba(25, 39, 89, .07);
}

.center-wrap .mian_header .active {
    color: var(--bw-primary) !important;
    font-weight: 800 !important;
}

.bengal-market {
    background: rgba(255, 255, 255, .97) !important;
    border: 1px solid var(--bw-border) !important;
    border-radius: 16px !important;
    box-shadow: 0 12px 34px rgba(25, 39, 89, .09) !important;
    overflow: hidden;
}

.bengal-market__header {
    padding: .18rem .2rem !important;
    background: linear-gradient(90deg, #fafbff, #f4f6ff) !important;
    border-bottom: 1px solid var(--bw-border) !important;
}

.bengal-market__header h3 {
    color: var(--bw-navy) !important;
    font-weight: 800 !important;
}

.bengal-market__row {
    min-height: .58rem;
    padding: .12rem .2rem !important;
    border-bottom: 1px solid #edf0f6 !important;
}

.bengal-market__price {
    color: var(--bw-navy) !important;
    font-weight: 800 !important;
}

.support-bot-fab,
.supportBotButton,
.support-bot-button {
    border: 1px solid rgba(255, 255, 255, .34) !important;
    background: linear-gradient(135deg, #3157e8, #6948e8) !important;
    box-shadow: 0 14px 30px rgba(49, 87, 232, .3) !important;
}

.app-login .page-login > header {
    background: transparent !important;
    border: 0 !important;
}

.app-login .page-login > header h3 img {
    height: .42rem !important;
    max-width: 2.2rem;
}

.app-login .tabs,
.app-login .inputs,
.app-login .protocol,
.app-login .remember-login,
.app-login .findback,
.app-login .login-entry {
    max-width: 560px;
    margin-left: auto !important;
    margin-right: auto !important;
}

.app-login .tabs {
    color: var(--bw-navy);
    font-weight: 800;
}

.app-login .inputs {
    padding: .1rem .24rem .18rem;
    background: rgba(255, 255, 255, .94);
    border: 1px solid var(--bw-border);
    border-radius: 18px;
    box-shadow: var(--bw-shadow);
}

.app-login .c-mobile,
.app-login .c-passwd {
    min-height: .76rem;
    margin-top: .16rem !important;
    background: #fbfcff !important;
    border: 1px solid #dce2ef !important;
    border-radius: 12px !important;
}

.app-login .c-mobile input,
.app-login .c-passwd input {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.app-login section.action {
    max-width: 560px;
    margin-left: auto !important;
    margin-right: auto !important;
}

.app-login .register-link,
.app-login .login-entry,
.app-login .protocol a {
    color: var(--bw-primary) !important;
    font-weight: 700;
}

.appBottomMenu,
#appBottomMenu {
    background: rgba(255, 255, 255, .97) !important;
    border-top: 1px solid var(--bw-border) !important;
    box-shadow: 0 -5px 22px rgba(23, 35, 81, .08) !important;
    backdrop-filter: blur(14px);
}

@media (max-width: 767px) {
    .section { margin-left: 12px !important; margin-right: 12px !important; }
    .app-login .inputs { margin-left: 14px !important; margin-right: 14px !important; }
    .app-login .protocol,
    .app-login .remember-login,
    .app-login .findback,
    .app-login .login-entry,
    .app-login section.action { margin-left: 18px !important; margin-right: 18px !important; }
    .btn, .button, .layui-btn, button[type="submit"] { min-height: 48px; }
    .center-wrap .commen { padding: .12rem .1rem 0 !important; }
    .center-wrap .commen_info { padding: .2rem .16rem !important; border-radius: 17px !important; }
    .center-wrap .site_switch { gap: .06rem; }
    .center-wrap .site_switch .switch_item { min-height: .5rem; font-size: .2rem; border-radius: 10px !important; }
    .center-wrap .main { margin: .14rem .1rem 1.2rem !important; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition: none !important; animation: none !important; }
}