/*
 * BDX Unlocker — Full Site Quality & White VIP Colour Restoration
 * 2026-07-19
 * Loaded last so it repairs overly broad legacy white-mode overrides without
 * changing business logic, Auto Delivery, security rules or dark-mode layout.
 */

/* ---------- Global stability and accessibility ---------- */
html{scroll-behavior:smooth;scroll-padding-top:150px}
body{overflow-x:clip}
#app,main,.container,.content-grid,.product-grid,.vip-package-grid,.admin-grid,.admin-main,.admin-section{min-width:0}
:is(img,svg,video,canvas){max-width:100%}
:is(.product-card,.vip-membership-card,.panel,.card,.order-card,.ticket-card,.wallet-card,.admin-section){min-width:0}
:is(h1,h2,h3,h4,h5,h6,p,li,td,th,small,strong,a,button,label,.description,.subtitle,.note){overflow-wrap:anywhere}
:is(button,[role="button"],a,input,select,textarea){touch-action:manipulation}
:is(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid rgba(15,193,221,.5);outline-offset:3px}
.modal-card,.admin-modal-card{max-width:min(96vw,980px);max-height:92dvh;overflow:auto;overscroll-behavior:contain}
.side-drawer,.orders-menu{overscroll-behavior:contain}

/* ---------- Semantic top-bar colours restored in White Mode ---------- */
html[data-theme="light"] body:not(.admin-body) .announcement-bar:not(.hidden){
  background:linear-gradient(90deg,#eaf8ff,#d9f5ff)!important;
  color:#064a63!important;border-color:#82d8eb!important
}
html[data-theme="light"] body:not(.admin-body) .maintenance-bar:not(.hidden){
  background:linear-gradient(90deg,#fff8dc,#ffedb1)!important;
  color:#694500!important;border-color:#e9bd3c!important
}
html[data-theme="light"] body:not(.admin-body) .flash-sale-bar:not(.hidden){
  background:linear-gradient(90deg,#fff0f2,#ffe1e7)!important;
  color:#8b1530!important;border-color:#f29ab0!important
}
html[data-theme="light"] body:not(.admin-body) :is(.announcement-bar,.maintenance-bar,.flash-sale-bar) :is(a,button,strong,span){color:inherit!important;-webkit-text-fill-color:currentColor!important}

/* ---------- VIP page: premium colourful cards in White Mode ---------- */
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"]{
  background:
    radial-gradient(circle at 10% 10%,rgba(31,205,232,.11),transparent 31%),
    radial-gradient(circle at 88% 16%,rgba(167,94,255,.10),transparent 30%),
    linear-gradient(180deg,#f7fcff 0%,#ffffff 38%,#f9fbff 100%)!important;
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-package-page,
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-package-grid{
  background:transparent!important;background-image:none!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-package-grid{align-items:stretch}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-membership-card{
  isolation:isolate;
  background:
    linear-gradient(145deg,color-mix(in srgb,var(--vip-color,#18cbea) 26%,#101b2c 74%) 0%,#0a1422 47%,#050b14 100%)!important;
  background-color:#0a1422!important;
  color:#f7fbff!important;
  border:1px solid color-mix(in srgb,var(--vip-color,#18cbea) 62%,#ffffff 38%)!important;
  box-shadow:
    0 2px 0 rgba(255,255,255,.16) inset,
    0 -1px 0 rgba(0,0,0,.55) inset,
    0 22px 50px rgba(12,27,48,.20),
    0 10px 30px color-mix(in srgb,var(--vip-color,#18cbea) 18%,transparent)!important;
  backdrop-filter:none!important;
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-membership-card::before{
  display:block!important;content:""!important;opacity:1!important;
  background:
    radial-gradient(circle at 50% -12%,color-mix(in srgb,var(--vip-color,#18cbea) 42%,transparent),transparent 43%),
    linear-gradient(125deg,rgba(255,255,255,.13),transparent 33%,rgba(255,255,255,.03) 68%,transparent)!important;
  pointer-events:none
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-membership-card::after{
  content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;
  box-shadow:inset 0 0 48px color-mix(in srgb,var(--vip-color,#18cbea) 8%,transparent)
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-membership-card:hover{
  transform:translateY(-7px);
  border-color:color-mix(in srgb,var(--vip-color,#18cbea) 82%,#fff 18%)!important;
  box-shadow:0 28px 62px rgba(12,27,48,.24),0 18px 42px color-mix(in srgb,var(--vip-color,#18cbea) 28%,transparent)!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-membership-card.featured{
  box-shadow:0 0 0 2px color-mix(in srgb,var(--vip-color,#f6c500) 68%,#fff 32%),0 28px 65px rgba(12,27,48,.26),0 18px 48px color-mix(in srgb,var(--vip-color,#f6c500) 30%,transparent)!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-membership-card.featured .vip-plan-title::before{
  content:"★ POPULAR";display:block;width:max-content;max-width:100%;margin:0 auto 12px;padding:6px 12px;border-radius:999px;
  background:color-mix(in srgb,var(--vip-color,#f6c500) 86%,#fff 14%)!important;color:#07111d!important;-webkit-text-fill-color:#07111d!important;
  font-size:11px;font-weight:1000;letter-spacing:.12em;text-decoration:none!important;box-shadow:0 7px 18px color-mix(in srgb,var(--vip-color,#f6c500) 24%,transparent)
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-card-glow{
  display:block!important;opacity:1!important;
  background:color-mix(in srgb,var(--vip-color,#18cbea) 30%,transparent)!important;
  filter:blur(42px)!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-plan-title{
  color:var(--vip-color,#18cbea)!important;-webkit-text-fill-color:var(--vip-color,#18cbea)!important;
  text-shadow:0 0 24px color-mix(in srgb,var(--vip-color,#18cbea) 48%,transparent),0 2px 0 rgba(0,0,0,.8)!important;
  text-decoration-color:color-mix(in srgb,var(--vip-color,#18cbea) 76%,#fff 24%)!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-membership-list{
  background:transparent!important;color:#edf6ff!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-membership-list p{
  margin:0;padding:10px 12px;border-radius:14px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--vip-color,#18cbea) 13%,transparent),rgba(255,255,255,.025))!important;
  color:#edf6ff!important;-webkit-text-fill-color:#edf6ff!important;
  border:1px solid color-mix(in srgb,var(--vip-color,#18cbea) 18%,rgba(255,255,255,.10))!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-membership-list span{
  color:var(--vip-color,#18cbea)!important;-webkit-text-fill-color:var(--vip-color,#18cbea)!important;
  text-shadow:0 0 14px color-mix(in srgb,var(--vip-color,#18cbea) 60%,transparent)!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-payment-section{
  background:linear-gradient(90deg,rgba(255,255,255,.035),color-mix(in srgb,var(--vip-color,#18cbea) 10%,transparent),rgba(255,255,255,.035))!important;
  border-color:color-mix(in srgb,var(--vip-color,#18cbea) 24%,rgba(255,255,255,.10))!important;color:#fff!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-payment-section h3{
  color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:0 2px 12px rgba(0,0,0,.5)!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-payment-section h3 i{
  background:var(--vip-color,#18cbea)!important;box-shadow:0 0 16px color-mix(in srgb,var(--vip-color,#18cbea) 54%,transparent)
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-payments{background:transparent!important}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-pay-badge{
  color:#fff!important;-webkit-text-fill-color:#fff!important;border:1px solid rgba(255,255,255,.20)!important;
  background:linear-gradient(145deg,#203348,#0b1522)!important;box-shadow:0 7px 17px rgba(0,0,0,.24)!important;font-weight:900!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-pay-badge.visa{background:linear-gradient(145deg,#ff9b32,#e75b00)!important}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-pay-badge.master-card{background:linear-gradient(135deg,#ea001b 0 48%,#ff8a00 52% 100%)!important}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-pay-badge.nagad{background:linear-gradient(145deg,#ff7b19,#d94a00)!important}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-pay-badge.bkash{background:linear-gradient(145deg,#e91e63,#b40b48)!important}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-pay-badge.rocket{background:linear-gradient(145deg,#8b4bc7,#51218a)!important}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-price-section{
  background:transparent!important;color:#fff!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-price-section strong{
  color:var(--vip-price,var(--vip-color,#18cbea))!important;-webkit-text-fill-color:var(--vip-price,var(--vip-color,#18cbea))!important;
  font-weight:900!important;text-shadow:0 0 22px color-mix(in srgb,var(--vip-price,var(--vip-color,#18cbea)) 44%,transparent)!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-price-section small{
  color:#b8c8d9!important;-webkit-text-fill-color:#b8c8d9!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-deposit-btn{
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--vip-button,var(--vip-color,#18cbea)) 88%,#fff 12%),color-mix(in srgb,var(--vip-button,var(--vip-color,#18cbea)) 73%,#07111d 27%))!important;
  background-color:var(--vip-button,var(--vip-color,#18cbea))!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;
  border-color:color-mix(in srgb,var(--vip-button,var(--vip-color,#18cbea)) 64%,#07111d 36%)!important;
  text-shadow:0 2px 2px rgba(0,0,0,.55)!important;
  box-shadow:0 7px 0 color-mix(in srgb,var(--vip-button,var(--vip-color,#18cbea)) 40%,#02070d 60%),0 18px 38px color-mix(in srgb,var(--vip-button,var(--vip-color,#18cbea)) 28%,transparent),inset 0 2px 0 rgba(255,255,255,.35)!important
}
html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-deposit-btn:hover{
  color:#fff!important;-webkit-text-fill-color:#fff!important;filter:saturate(1.12) brightness(1.04)!important;transform:translateY(-3px)
}

/* Plain-list layout remains colourful, with reduced lift for a cleaner list view. */
html[data-theme="light"] body:not(.admin-body) .vip-layout-plain-list .vip-membership-card:hover{transform:translateY(-3px)}

/* ---------- Other light-mode semantic components ---------- */
html[data-theme="light"] body :is(.visibility.live,.status-badge.success,.success-badge,.badge.success){background:#e4f8ec!important;color:#08713a!important;-webkit-text-fill-color:#08713a!important;border-color:#8bd7ac!important}
html[data-theme="light"] body :is(.visibility.hidden,.status-badge.failed,.status-badge.rejected,.badge.danger,.error-badge){background:#fff0f1!important;color:#a51d2d!important;-webkit-text-fill-color:#a51d2d!important;border-color:#ef9ca6!important}
html[data-theme="light"] body :is(.status-badge.pending,.status-badge.processing,.badge.warning,.warning-badge){background:#fff7df!important;color:#825600!important;-webkit-text-fill-color:#825600!important;border-color:#e6c163!important}
html[data-theme="light"] body .secure-delivery-head{background:linear-gradient(135deg,#eafaf1,#eaf4ff)!important;border-color:#91d8aa!important}
html[data-theme="light"] body .secure-credential-card{background:linear-gradient(145deg,#fff,#f7fbff)!important;border-color:#b9d5ee!important}
html[data-theme="light"] body .secure-credential-card.revoked{background:#fff5f5!important;border-color:#e5a0a0!important}

/* ---------- Admin quality fixes ---------- */
html[data-theme="light"] body.admin-body .vip-admin-section{
  background:radial-gradient(circle at 0 0,rgba(255,111,0,.12),transparent 32%),linear-gradient(145deg,#fff,#fff8f1)!important;
  border-color:#efb782!important
}
html[data-theme="light"] body.admin-body .vip-price-panel{background:linear-gradient(145deg,#fff,#fff7ef)!important}
body.admin-body input[type="color"]{min-height:44px;padding:4px;cursor:pointer}
.security-group-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.security-secure-note{padding:13px 14px;border-radius:14px;border:1px dashed rgba(15,193,221,.38);background:rgba(15,193,221,.07);line-height:1.55}
.security-secure-note pre{white-space:pre-wrap;word-break:break-word;margin:10px 0 0}

/* ---------- ADD% profit control repaired ---------- */
.add-percent-summary{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;margin:0 0 12px;padding:12px 14px;border:1px solid rgba(15,193,221,.28);border-radius:14px;background:rgba(15,193,221,.07)}
.add-percent-summary span{font-weight:800;color:#0aa4c1}
.add-percent-check{display:inline-grid;place-items:center;width:42px;height:34px;cursor:pointer}
.add-percent-check input{position:absolute;opacity:0;pointer-events:none}
.add-percent-check span{width:24px;height:24px;border:2px solid rgba(120,143,164,.7);border-radius:8px;background:rgba(255,255,255,.75);box-shadow:inset 0 1px 2px rgba(0,0,0,.08)}
.add-percent-check input:checked+span{border-color:#0fc1dd;background:linear-gradient(145deg,#25dbef,#078cab);box-shadow:0 0 0 4px rgba(15,193,221,.13)}
.add-percent-check input:checked+span::after{content:"✓";display:grid;place-items:center;color:#fff;font-weight:1000;line-height:20px}
.add-percent-table td{vertical-align:middle}
html[data-theme="light"] body.admin-body [data-panel="add-percent"] .panel{background:linear-gradient(145deg,#fff,#f3fcff)!important;border-color:#9edbea!important}

/* ---------- Responsive repairs ---------- */
@media(max-width:980px){
  html{scroll-padding-top:118px}
  .head-main,.head-actions,.nav,.nav-links,.content-grid,.admin-grid{min-width:0}
  .vip-package-grid>*{min-width:0}
}
@media(max-width:760px){
  html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-membership-card{padding:22px 14px!important;border-radius:22px!important}
  html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-plan-title{font-size:clamp(34px,11vw,44px)!important}
  html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-membership-list{font-size:17px!important}
  html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-membership-list p{padding:9px 8px!important}
  html[data-theme="light"] body:not(.admin-body) main[class*="vip-layout-"] .vip-deposit-btn{width:min(100%,280px);min-width:0!important}
  .security-group-actions>*{width:100%}
  .modal-card,.admin-modal-card{max-width:calc(100vw - 20px);max-height:90dvh}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}