/* Customer login, register and member panel — website chrome + panel UI */

.site-header .brand{display:flex;align-items:center;max-width:220px;flex-shrink:0}
.site-header .brand img{display:block;width:auto;height:48px;max-width:200px;object-fit:contain}
@media(max-width:600px){.site-header .brand img{height:40px;max-width:160px}}
.footer-logo{display:inline-flex;align-items:center;padding:12px 18px;border-radius:12px;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.18);max-width:230px}
.footer-logo img{display:block;width:auto;max-width:190px;height:45px;object-fit:contain}
.footer-logo-area{max-width:280px}
@media(max-width:650px){.footer-logo img{max-width:140px;height:44px}}

.member-main{background:linear-gradient(180deg,#f4f8ff 0%,#fff 120px);min-height:calc(100vh - 82px)}
.member-shell{width:min(1180px,calc(100% - 32px));margin:0 auto;padding:18px 0 56px}

.site-header,.nav-wrap,.member-nav-wrap,.member-nav{overflow:visible!important}
.site-header{backdrop-filter:none;-webkit-backdrop-filter:none;background:#fff}

.member-nav-wrap{position:relative;z-index:400;background:#fff;border-bottom:1px solid rgba(17,16,78,.08);box-shadow:0 8px 24px rgba(17,16,78,.04)}
.member-nav{width:min(1180px,calc(100% - 32px));margin:0 auto;padding:12px 0 14px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;overflow:visible}
.member-nav a,.member-nav button.member-link{display:inline-flex;align-items:center;padding:8px 13px;border:0;border-radius:12px;background:#f4f8ff;color:#424253;font:600 13px "DM Sans";text-decoration:none;cursor:pointer}
.member-nav form{display:inline-flex;margin:0}
.member-nav a:hover,.member-nav button.member-link:hover{color:#168eea;background:#eaf4ff}
.member-nav a.active,.menu-drop.active .menu-drop-btn{background:#11104e;color:#fff}
.menu-drop,.nav-drop{position:relative;z-index:401}
.member-nav details.menu-drop{display:inline-block}
.menu-drop-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 13px;border:0;border-radius:12px;background:#f4f8ff;color:#424253;font:600 13px "DM Sans";cursor:pointer}
.menu-drop>summary.menu-drop-btn{list-style:none}
.menu-drop>summary.menu-drop-btn::-webkit-details-marker{display:none}
.menu-drop-btn:after{content:"▾";font-size:11px}
.menu-drop-btn:hover{color:#168eea;background:#eaf4ff}
.menu-drop-list,.nav-drop-list{display:none;position:absolute;top:calc(100% + 4px);left:0;z-index:500;min-width:240px;max-height:70vh;overflow:auto;padding:8px;margin:0;background:#fff;border:1px solid rgba(17,16,78,.08);border-radius:16px;box-shadow:0 16px 40px rgba(17,16,78,.16);pointer-events:auto}
.menu-drop.open .menu-drop-list,.menu-drop[open] .menu-drop-list,.menu-drop:focus-within .menu-drop-list,
.nav-drop.open .nav-drop-list,.nav-drop:focus-within .nav-drop-list{display:block}
@media(hover:hover) and (pointer:fine){
  .menu-drop:hover .menu-drop-list,.nav-drop:hover .nav-drop-list{display:block}
}
.member-nav .menu-drop-list a{display:block;width:100%;border-radius:10px;background:transparent;padding:9px 12px;font:600 13px "DM Sans";color:#15162b;pointer-events:auto}
.member-nav .menu-drop-list a:hover,.member-nav .menu-drop-list a.active{background:#edf7ff;color:#168eea}

.svc-scroll-wrap{position:relative;margin:0 0 20px;padding:0 38px}
.svc-scroll{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:4px 2px 10px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.svc-scroll::-webkit-scrollbar{height:6px}
.svc-scroll::-webkit-scrollbar-thumb{background:#c9d6e8;border-radius:99px}
.svc-tab,.quick-pay-item{flex:0 0 auto;scroll-snap-align:start;width:118px;min-height:96px;padding:12px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:1px solid #e8edf5;border-radius:16px;background:#fff;color:#11104e;text-decoration:none;box-shadow:0 6px 16px rgba(17,16,78,.04)}
.svc-tab img,.quick-pay-item img{width:36px;height:36px;object-fit:contain}
.svc-tab span,.quick-pay-item b{font:700 11px/1.25 "DM Sans";text-align:center}
.svc-tab:hover,.quick-pay-item:hover{border-color:rgba(22,142,234,.35);transform:translateY(-2px)}
.svc-tab.active{background:#11104e;border-color:#11104e;color:#fff}
.svc-arrow{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border:0;border-radius:50%;background:#11104e;color:#fff;font-size:22px;line-height:1;cursor:pointer;z-index:20;pointer-events:auto;box-shadow:0 8px 16px rgba(17,16,78,.18)}
.svc-prev{left:0}.svc-next{right:0}
.svc-arrow:hover{background:#168eea}

.dash-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:8px 0 22px}
.dash-hero-actions{display:flex;align-items:center;gap:12px}
.bconnect-mark{display:inline-flex;align-items:center;padding:8px 12px;border-radius:12px;background:#11104e;color:#fff;font:800 12px "Manrope";letter-spacing:.4px}
.quick-pay{display:flex;flex-wrap:nowrap;gap:10px}
.member-nav .wallet-chip{margin-left:auto;background:#11104e;color:#fff;border-radius:999px;padding:8px 14px;font:700 13px "DM Sans"}
.member-nav .member-logout{background:transparent;color:#686a78}

.page-title-box{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:8px 0 18px}
.page-title{margin:0;color:#11104e;font:800 28px/1.2 "Manrope";letter-spacing:-.6px}
.page-title-right,.bconnect-bar{display:flex;align-items:center;gap:12px}
.bconnect-logo{height:38px;width:auto;max-width:180px;object-fit:contain}
.header-title{margin:0 0 12px;color:#11104e;font:800 18px "Manrope"}

.row{display:flex;flex-wrap:wrap;margin-left:-10px;margin-right:-10px}
.row>*{padding-left:10px;padding-right:10px;box-sizing:border-box}
.g-2{margin-left:-6px;margin-right:-6px}
.g-2>*{padding-left:6px;padding-right:6px}
.col-6,.col-12,.col-md-3,.col-md-4,.col-md-6,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-xl-2{width:100%}
.col-6{width:50%}
.col-12{width:100%}
@media(min-width:768px){
  .col-md-3{width:25%}
  .col-md-4{width:33.333%}
  .col-md-6{width:50%}
}
@media(min-width:992px){
  .col-lg-4{width:33.333%}
  .col-lg-5{width:41.666%}
  .col-lg-6{width:50%}
  .col-lg-7{width:58.333%}
  .col-lg-8{width:66.666%}
}
@media(min-width:1200px){
  .col-xl-2{width:16.666%}
}

.card{background:#fff;border:1px solid rgba(17,16,78,.08);border-radius:20px;box-shadow:0 14px 36px rgba(17,16,78,.06);margin-bottom:18px}
.card-body{padding:22px}
.card-header{padding:16px 22px;border-bottom:1px solid rgba(17,16,78,.06)}
.widget-flat h3{margin:8px 0 0;color:#11104e;font:800 26px "Manrope"}
.service-card{cursor:pointer;transition:.15s ease;border:1px solid #eef2f7;border-radius:16px;background:#f7fbff}
.service-card:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(22,142,234,.12)}

.form-label{display:block;margin-bottom:6px;color:#15162b;font-size:13px;font-weight:600}
.form-control,.form-select,select.form-select,input.form-control,textarea.form-control{
  width:100%;padding:11px 14px;border:1px solid rgba(17,16,78,.14);border-radius:12px;background:#f7fbff;color:#15162b;font:500 15px "DM Sans"
}
.form-control:focus,.form-select:focus{outline:none;border-color:#168eea;background:#fff;box-shadow:0 0 0 4px rgba(22,142,234,.12)}
.form-control.is-invalid,.form-select.is-invalid{border-color:#ff735c;background:#fff6f4}
.invalid-feedback{display:none;color:#b42318;font-size:12px;margin-top:4px}
.invalid-feedback.d-block,.is-invalid~.invalid-feedback{display:block}
.form-check{display:flex;align-items:center;gap:8px}
.form-check-input{width:auto}
.input-group{display:flex;gap:8px}
.input-group .form-control{flex:1}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:12px;padding:11px 16px;font:700 14px "DM Sans";cursor:pointer;text-decoration:none;background:#edf2f8;color:#11104e}
.btn-primary{background:linear-gradient(135deg,#249bea,#1676e2);color:#fff;box-shadow:0 10px 22px rgba(22,118,226,.25)}
.btn-success{background:#0f7a45;color:#fff}
.btn-light{background:#edf2f8;color:#11104e}
.btn-outline-primary{background:#fff;color:#168eea;box-shadow:inset 0 0 0 1px #168eea}
.btn-link{background:none;color:#168eea;padding:6px}
.btn-sm{padding:7px 11px;font-size:12px;border-radius:9px}
.btn:disabled{opacity:.6;cursor:not-allowed}
.w-100{width:100%}

.table-responsive{width:100%;overflow:auto}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px 12px;border-bottom:1px solid #eef2f7;text-align:left;font-size:13px;vertical-align:middle}
.table thead th{color:#686a78;font-size:11px;letter-spacing:.4px;text-transform:uppercase}
.table-sm th,.table-sm td{padding:8px 10px}
.table-nowrap td,.table-nowrap th{white-space:normal}
.plan-item{cursor:pointer}
.plan-item:hover{background:#edf7ff}

.alert{margin:0 0 16px;padding:12px 14px;border-radius:12px;font-size:13px;line-height:1.5}
.alert p,.alert li{margin:0}
.alert ul{margin:0;padding-left:16px}
.alert-success{background:#e9f9f1;color:#0f7a45;border:1px solid #b8e6cc}
.alert-danger,.alert-warning{background:#fff1ee;color:#b42318;border:1px solid #ffd4cc}
.alert-info{background:#eaf4ff;color:#0b4d8c;border:1px solid #c5e1fb}
.alert-dismissible{position:relative;padding-right:36px}
.btn-close{position:absolute;right:10px;top:10px;border:0;background:none;font-size:18px;line-height:1;cursor:pointer;color:inherit}
.btn-close:before{content:"×"}
.list-unstyled{margin:0;padding:0;list-style:none}

.badge{display:inline-block;padding:3px 8px;border-radius:999px;font:700 11px "DM Sans"}
.bg-success{background:#e9f9f1;color:#0f7a45}
.bg-danger{background:#fff1ee;color:#b42318}
.bg-warning{background:#fff6e8;color:#9a6700}
.bg-info{background:#eaf4ff;color:#0b4d8c}

.member-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px;padding:0;list-style:none;border-bottom:1px solid #e9edf3}
.member-tabs li{list-style:none}
.member-tabs a{display:inline-block;padding:10px 12px;color:#686a78;text-decoration:none;font:700 13px "DM Sans"}
.member-tabs a.active{color:#168eea;box-shadow:inset 0 -2px 0 #168eea}

.mt-0{margin-top:0}.mt-2{margin-top:8px}.mt-3{margin-top:16px}
.mb-0{margin-bottom:0}.mb-1{margin-bottom:4px}.mb-2{margin-bottom:8px}.mb-3{margin-bottom:16px}
.me-1{margin-right:4px}.p-3{padding:16px}.pb-2{padding-bottom:8px}
.d-flex{display:flex}.d-none{display:none!important}.d-block{display:block}
.justify-content-between{justify-content:space-between}
.align-items-center{align-items:center}.align-items-end{align-items:flex-end}
.text-center{text-align:center}.text-muted{color:#686a78}.text-success{color:#0f7a45}.text-danger{color:#b42318}.text-dark{color:#15162b}
.text-decoration-none{text-decoration:none}.fw-normal{font-weight:500}.fw-semibold{font-weight:700}
.small,.small p{font-size:12px}.border-bottom{border-bottom:1px solid #eef2f7}
.rounded-circle{border-radius:50%}.avatar-lg{width:84px;height:84px;object-fit:cover}
.font-22{font-size:22px}.text-primary{color:#168eea}

/* Login / register / OTP */
.auth-page{min-height:calc(100vh - 280px);padding:48px 0 80px;display:flex;justify-content:center;align-items:flex-start}
.auth-card{width:100%;max-width:440px;padding:36px 32px 32px;border:1px solid rgba(17,16,78,.08);border-radius:24px;background:#fff;box-shadow:0 18px 48px rgba(17,16,78,.08)}
.auth-card-wide{max-width:560px}
.auth-kicker{margin:0 0 8px;color:#168eea;font:700 12px/1 "DM Sans";letter-spacing:.8px;text-transform:uppercase}
.auth-card h1{margin:0 0 8px;color:#11104e;font:800 28px/1.2 "Manrope"}
.auth-lead{margin:0 0 22px;color:#686a78;font-size:14px;line-height:1.55}
.auth-form{display:flex;flex-direction:column;gap:14px}
.auth-form label{display:flex;flex-direction:column;gap:6px;color:#15162b;font-size:13px;font-weight:600}
.auth-form input,.auth-form textarea{width:100%;padding:12px 14px;border:1px solid rgba(17,16,78,.14);border-radius:12px;background:#f7fbff;color:#15162b;font:500 15px "DM Sans"}
.auth-form input:focus,.auth-form textarea:focus{outline:none;border-color:#168eea;background:#fff;box-shadow:0 0 0 4px rgba(22,142,234,.12)}
.auth-form .is-invalid{border-color:#ff735c;background:#fff6f4}
.auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.auth-check{flex-direction:row!important;align-items:center;gap:8px!important;font-weight:500!important;color:#686a78!important}
.auth-check input{width:auto}
.auth-submit{margin-top:6px;border:0;border-radius:14px;padding:14px 18px;background:linear-gradient(135deg,#249bea,#1676e2);color:#fff;font:700 15px "DM Sans";cursor:pointer;box-shadow:0 12px 28px rgba(22,118,226,.28)}
.auth-submit:hover{filter:brightness(1.05)}
.auth-switch{margin:18px 0 0;text-align:center;color:#686a78;font-size:14px}
.auth-switch a{color:#168eea;font-weight:700;text-decoration:none}
.auth-resend{text-align:center;margin-top:10px}
.auth-resend button{border:0;background:none;color:#168eea;font:700 14px "DM Sans";cursor:pointer}
.auth-alert{margin:0 0 16px;padding:12px 14px;border-radius:12px;font-size:13px;line-height:1.5}
.auth-alert p,.auth-alert li{margin:0}
.auth-alert ul{margin:0;padding-left:16px}
.auth-alert-error{background:#fff1ee;color:#b42318;border:1px solid #ffd4cc}
.auth-alert-success{background:#e9f9f1;color:#0f7a45;border:1px solid #b8e6cc}

@media(max-width:600px){
  .member-nav .wallet-chip{margin-left:0;width:100%;text-align:center;justify-content:center}
  .auth-page{padding:28px 0 60px}
  .auth-card{padding:28px 20px}
  .auth-grid{grid-template-columns:1fr}
  .col-6{width:100%}
}

.npci-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;min-height:42px;margin:4px 0 18px}
.npci-logo{height:50px!important;width:auto!important;max-height:50px;max-width:none;object-fit:contain;flex:0 0 auto;display:block}
.bbps-cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin-top:8px}
.bbps-cat-card{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border:1px solid #e8edf5;border-radius:14px;background:#f7fbff;color:#11104e;text-decoration:none;font:700 13px "DM Sans"}
.bbps-cat-card:hover{border-color:rgba(22,142,234,.35);color:#168eea}
.billpay-dash-links{display:flex;flex-wrap:wrap;gap:10px}
.billpay-dash-links a{display:inline-flex;padding:10px 14px;border-radius:12px;background:#edf7ff;color:#0b4d8c;font:700 13px "DM Sans";text-decoration:none}
.billpay-dash-links a:hover{background:#168eea;color:#fff}
.npci-dialog{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;background:rgba(17,16,78,.45);padding:20px}
.npci-dialog[hidden]{display:none!important}
.npci-dialog-card{width:min(520px,100%);background:#fff;border-radius:20px;padding:22px;box-shadow:0 24px 60px rgba(17,16,78,.2)}
.npci-dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.npci-dialog-head h3{margin:0;color:#11104e;font:800 20px "Manrope"}