/* Tata Mall — My Page VIP redesign V4
 * Visual-only overrides for the existing /#/mine component.
 * No API, navigation, wallet, claim, payment or game logic is changed.
 */
.mine[data-v-ecfa0006]{
  --vip-ink:#173b36;
  --vip-muted:#71827f;
  --vip-line:rgba(19,124,112,.12);
  --vip-green:#00a88f;
  --vip-green-2:#00c6a5;
  --vip-gold:#f6c85f;
  min-height:100vh;
  padding:0 0 82px!important;
  background:
    radial-gradient(circle at 12% 3%,rgba(0,198,165,.11),transparent 26%),
    radial-gradient(circle at 95% 18%,rgba(246,200,95,.10),transparent 24%),
    linear-gradient(180deg,#f8fffd 0%,#f2f8f7 44%,#eef5f4 100%)!important;
}

/* Premium account header */
.mine[data-v-ecfa0006] .mine_top[data-v-ecfa0006]{
  overflow:hidden;
  background:transparent!important;
  box-shadow:none!important;
}
.mine[data-v-ecfa0006] .mine_top .mine_info[data-v-ecfa0006]{
  position:relative;
  margin:0;
  padding:22px 18px 18px!important;
  border-radius:0 0 34px 34px!important;
  background:
    radial-gradient(circle at 82% 18%,rgba(255,255,255,.18),transparent 24%),
    radial-gradient(circle at 12% 100%,rgba(255,255,255,.09),transparent 34%),
    linear-gradient(135deg,#008f82 0%,#00ae96 44%,#00c4a4 100%)!important;
  box-shadow:0 16px 34px rgba(0,137,120,.18)!important;
}
.mine[data-v-ecfa0006] .mine_top .mine_info[data-v-ecfa0006]:before{
  content:"";
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(120deg,transparent 18%,rgba(255,255,255,.10) 44%,transparent 64%);
  transform:translateX(-80%);
  animation:mineVipSweep 6s ease-in-out infinite;
}
@keyframes mineVipSweep{0%,45%{transform:translateX(-80%)}75%,100%{transform:translateX(110%)}}

.mine[data-v-ecfa0006] .mine_info_top[data-v-ecfa0006]{
  position:relative;z-index:1;
  align-items:center;
  padding:2px 2px 18px;
}
.mine[data-v-ecfa0006] .info_left img[data-v-ecfa0006]{
  width:58px!important;height:58px!important;
  margin:0 13px 0 3px!important;
  border:3px solid rgba(255,255,255,.78)!important;
  box-shadow:0 8px 24px rgba(0,63,57,.28)!important;
}
.mine[data-v-ecfa0006] .info_left ul[data-v-ecfa0006]{
  margin-left:0!important;
  font-size:14px!important;
  line-height:1.7!important;
  font-weight:600;
  text-shadow:0 1px 2px rgba(0,55,50,.18);
}
.mine[data-v-ecfa0006] .info_left ul li[data-v-ecfa0006]:first-child{font-size:17px;font-weight:800}
.mine[data-v-ecfa0006] .info_left ul li[data-v-ecfa0006]:last-child{opacity:.88;font-size:13px}
.mine[data-v-ecfa0006] .info_right .notice[data-v-ecfa0006]{
  width:48px!important;height:48px!important;
  border:1px solid rgba(255,255,255,.6);
  box-shadow:0 8px 24px rgba(0,70,63,.20)!important;
}
.mine[data-v-ecfa0006] .info_right .notice img[data-v-ecfa0006]{width:23px!important;height:23px!important}

/* Three finance cards */
.mine[data-v-ecfa0006] .mine_top_items[data-v-ecfa0006]{
  position:relative;z-index:1;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  padding:0!important;
  align-items:stretch!important;
}
.mine[data-v-ecfa0006] .mine_top_items .top_item[data-v-ecfa0006]{
  min-width:0;
  min-height:144px;
  padding:14px 9px 10px;
  box-sizing:border-box;
  justify-content:space-between!important;
  border:1px solid rgba(255,255,255,.28);
  border-radius:21px;
  background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.055));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 24px rgba(0,74,67,.10);
  backdrop-filter:blur(10px);
}
.mine[data-v-ecfa0006] .mine_top_items .top_item[data-v-ecfa0006]>div{
  margin:0!important;
  width:100%;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;
  font-size:clamp(16px,4.3vw,22px)!important;
  font-weight:900!important;
  letter-spacing:-.3px;
  text-shadow:0 2px 5px rgba(0,67,61,.18);
}
.mine[data-v-ecfa0006] .mine_top_items .top_item[data-v-ecfa0006]:nth-child(2)>div{font-size:clamp(15px,4vw,21px)!important}
.mine[data-v-ecfa0006] .mine_top_items .top_item[data-v-ecfa0006]>span,
.mine[data-v-ecfa0006] .mine_top_items .top_item[data-v-ecfa0006]{color:#fff!important}
.mine[data-v-ecfa0006] .mine_top_items .top_item[data-v-ecfa0006]:after{
  content:"";
  display:block;
  width:28px;height:3px;margin:6px auto 0;border-radius:9px;
  background:linear-gradient(90deg,transparent,#fff,transparent);
  opacity:.9;
}
.mine[data-v-ecfa0006] .mine_top_items .top_item[data-v-ecfa0006]>button[data-v-ecfa0006]{
  width:100%!important;
  height:43px!important;
  min-height:43px;
  margin-top:9px!important;
  padding:0 7px!important;
  border:0!important;
  border-radius:14px!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:800!important;
  box-shadow:0 7px 16px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.20)!important;
}
.mine[data-v-ecfa0006] .mine_top_items .top_item[data-v-ecfa0006]:nth-child(1)>button[data-v-ecfa0006]{background:linear-gradient(135deg,#00a88f,#00c6a5)!important}
.mine[data-v-ecfa0006] .mine_top_items .top_item[data-v-ecfa0006]:nth-child(2)>button[data-v-ecfa0006]{background:linear-gradient(135deg,#eaa72c,#ffd35f)!important}
.mine[data-v-ecfa0006] .mine_top_items .top_item[data-v-ecfa0006]:nth-child(3)>button[data-v-ecfa0006]{background:linear-gradient(135deg,#1687ef,#38b7ff)!important}
.mine[data-v-ecfa0006] .mine_top_items .top_item[data-v-ecfa0006]>button[data-v-ecfa0006]:active{transform:translateY(1px) scale(.985)}

/* Menu area */
.mine[data-v-ecfa0006] .mine_nav[data-v-ecfa0006]{
  margin-top:18px!important;
  padding:0 14px 10px!important;
  background:transparent!important;
}
.mine[data-v-ecfa0006] .mine_nav>ul[data-v-ecfa0006]{
  display:flex;flex-direction:column;gap:10px;
}
.mine[data-v-ecfa0006] .mine_nav>ul>li[data-v-ecfa0006]{
  min-height:78px;
  padding:0!important;
  border:1px solid rgba(18,111,101,.075);
  border-radius:22px;
  background:rgba(255,255,255,.93);
  box-shadow:0 8px 24px rgba(35,76,72,.075),inset 0 1px 0 rgba(255,255,255,.95);
  overflow:hidden;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.mine[data-v-ecfa0006] .mine_nav>ul>li:active{
  transform:scale(.992);
  box-shadow:0 5px 16px rgba(35,76,72,.09);
}
.mine[data-v-ecfa0006] .mine_nav>ul>li>ol,
.mine[data-v-ecfa0006] .mine_nav>ul>li>.van-collapse-item>.van-cell{
  min-height:78px;
  box-sizing:border-box;
  padding:0 18px!important;
}
.mine[data-v-ecfa0006] .mine_nav>ul>li>ol img,
.mine[data-v-ecfa0006] .mine_nav .van-collapse-item img[data-v-ecfa0006]{
  width:46px!important;height:46px!important;
  padding:10px;
  box-sizing:border-box;
  margin-right:15px!important;
  border-radius:16px;
  background:linear-gradient(145deg,#eefcf8,#dff6ef);
  box-shadow:inset 0 1px 0 #fff,0 5px 12px rgba(27,115,104,.08);
}
.mine[data-v-ecfa0006] .mine_nav .nav_name[data-v-ecfa0006],
.mine[data-v-ecfa0006] .mine_nav>ul>li>ol span[data-v-ecfa0006]{
  color:var(--vip-ink)!important;
  font-size:16px!important;
  font-weight:800!important;
  letter-spacing:.05px;
}
.mine[data-v-ecfa0006] .mine_nav .van-icon[data-v-ecfa0006]{
  color:#00a68f!important;
  font-size:21px!important;
  font-weight:900;
}
.mine[data-v-ecfa0006] .mine_nav .van-collapse-item__wrapper{background:linear-gradient(180deg,#f8fffd,#eff8f6)}
.mine[data-v-ecfa0006] .mine_nav .nav_content[data-v-ecfa0006]{
  color:#47635f!important;
  border-top:1px solid var(--vip-line);
  padding:12px 18px 12px 78px!important;
  font-size:14px!important;
  font-weight:650;
}

/* Keep legacy collapsible items visually connected without changing their behavior. */
.mine[data-v-ecfa0006] .mine_nav .van-collapse-item{
  width:100%;
  background:transparent!important;
}
.mine[data-v-ecfa0006] .mine_nav .van-collapse-item .van-cell__title{align-items:center}

/* Logout / utility area */
.mine[data-v-ecfa0006] .goout_box[data-v-ecfa0006]{
  background:transparent!important;
  padding:8px 14px 18px!important;
}
.mine[data-v-ecfa0006] .goout_box button[data-v-ecfa0006]{
  width:100%!important;height:48px!important;
  border-radius:16px!important;
  background:#fff!important;
  color:#d65d62!important;
  border:1px solid rgba(214,93,98,.14)!important;
  font-weight:800;
  box-shadow:0 7px 18px rgba(100,52,52,.06)!important;
}

/* Bottom navigation: match the VIP visual language while retaining its links. */
.mine[data-v-ecfa0006] .footer[data-v-405e9a63]{
  height:68px!important;
  background:rgba(255,255,255,.94)!important;
  border-top:1px solid rgba(0,143,130,.12);
  box-shadow:0 -10px 28px rgba(28,74,69,.09)!important;
  backdrop-filter:blur(16px);
  z-index:1000;
}
.mine[data-v-ecfa0006] .nav_foot[data-v-405e9a63]{height:100%;align-items:center}
.mine[data-v-ecfa0006] .nav_foot li[data-v-405e9a63]{height:100%;gap:1px}
.mine[data-v-ecfa0006] .nav_foot li img[data-v-405e9a63]{width:21px!important;height:21px!important}
.mine[data-v-ecfa0006] .nav_foot li span[data-v-405e9a63]{font-size:11px!important;font-weight:750}
.mine[data-v-ecfa0006] .nav_foot .active span[data-v-405e9a63]{font-weight:900!important}

@media (max-width:380px){
  .mine[data-v-ecfa0006] .mine_top .mine_info[data-v-ecfa0006]{padding-left:13px!important;padding-right:13px!important}
  .mine[data-v-ecfa0006] .mine_top_items{gap:7px}
  .mine[data-v-ecfa0006] .mine_top_items .top_item{padding-left:6px;padding-right:6px}
  .mine[data-v-ecfa0006] .mine_top_items .top_item>button{font-size:13px!important}
  .mine[data-v-ecfa0006] .mine_nav{padding-left:10px!important;padding-right:10px!important}
}
@media (min-width:700px){
  .mine[data-v-ecfa0006] .mine_nav{max-width:680px;margin-left:auto;margin-right:auto}
  .mine[data-v-ecfa0006] .mine_top .mine_info{padding-left:24px!important;padding-right:24px!important}
}
@media (prefers-reduced-motion:reduce){
  .mine[data-v-ecfa0006] .mine_top .mine_info:before{animation:none!important}
  .mine[data-v-ecfa0006] .mine_nav>ul>li{transition:none!important}
}

/* Tata Mall — My Page V4: Recharge button dark-pink VIP accent
 * Visual-only override. Navigation and recharge logic remain unchanged. */
.mine[data-v-ecfa0006] .mine_info_btn .btn .one_btn[data-v-b74b9dc6],
.mine[data-v-ecfa0006] .mine_info_btn .one_btn[data-v-b74b9dc6]{
  color:#fff!important;
  background:linear-gradient(135deg,#d61f68 0%,#b51258 52%,#8d0c45 100%)!important;
  border:1px solid rgba(255,255,255,.20)!important;
  box-shadow:0 9px 20px rgba(141,12,69,.30),inset 0 1px 0 rgba(255,255,255,.24)!important;
  text-shadow:0 1px 3px rgba(73,0,35,.20);
}
.mine[data-v-ecfa0006] .mine_info_btn .btn .one_btn[data-v-b74b9dc6]:active,
.mine[data-v-ecfa0006] .mine_info_btn .one_btn[data-v-b74b9dc6]:active{
  transform:translateY(1px) scale(.985);
  box-shadow:0 6px 14px rgba(141,12,69,.25),inset 0 1px 0 rgba(255,255,255,.18)!important;
}