
/* ============================================================
   MT.NET.VN PRO6 V19 - TOPBAR ACCOUNT PANEL + SEARCH CENTER
   ============================================================ */

/* -------- Account trigger -------- */
.pro6-account-panel{position:relative!important}
.pro6-account-panel .cpanel-toggle{
  height:46px!important;
  max-width:290px;
  border:1px solid #e3e8f0!important;
  border-radius:13px!important;
  background:#fff!important;
  padding:4px 10px 4px 5px!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  color:#344054!important;
  cursor:pointer!important;
  white-space:nowrap;
}
.pro6-account-panel .cpanel-toggle:hover,
.pro6-account-panel.open .cpanel-toggle{
  border-color:#b8ccff!important;
  box-shadow:0 8px 24px rgba(36,107,253,.08)!important;
}
.pro6-account-panel .cpanel-avatar{
  position:relative;
  flex:0 0 auto;
  width:36px!important;height:36px!important;
  border-radius:10px!important;
  display:grid!important;place-items:center!important;
  background:linear-gradient(135deg,#246bfd,#765bff)!important;
  color:#fff!important;
  font-size:10px!important;font-weight:900!important;
}
.pro6-account-panel .cpanel-avatar.large{width:44px!important;height:44px!important;border-radius:12px!important;font-size:13px!important}
.pro6-account-online{
  position:absolute;right:-1px;bottom:-1px;
  width:10px;height:10px;
  border:2px solid #fff;border-radius:50%;
  background:#17b26a;
}
.pro6-account-panel .cpanel-name{
  display:block!important;
  text-align:left!important;
  min-width:125px!important;
  max-width:190px;
  overflow:hidden;
}
.pro6-account-panel .cpanel-name b,
.pro6-account-panel .cpanel-name small{
  display:block!important;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.pro6-account-panel .cpanel-name b{font-size:10px!important;line-height:1.25;color:#344054!important}
.pro6-account-panel .cpanel-name small{font-size:7.5px!important;color:#98a2b3!important;margin-top:2px}

/* -------- Account dropdown -------- */
.pro6-account-menu{
  position:absolute!important;
  z-index:500!important;
  right:0!important;
  top:calc(100% + 10px)!important;
  width:360px!important;
  max-height:min(720px,calc(100vh - 90px));
  overflow:auto!important;
  padding:10px!important;
  border:1px solid #e3e8f0!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:0 24px 70px rgba(16,24,40,.18)!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(-7px) scale(.985)!important;
  transform-origin:top right!important;
  transition:opacity .16s ease,transform .16s ease,visibility .16s!important;
}
.pro6-account-panel.open>.pro6-account-menu{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:translateY(0) scale(1)!important;
}
.pro6-account-menu .cpanel-head{
  display:grid!important;
  grid-template-columns:44px minmax(0,1fr) auto!important;
  gap:10px!important;
  align-items:center!important;
  padding:8px 7px 10px!important;
}
.pro6-account-menu .cpanel-head>div{min-width:0!important}
.pro6-account-menu .cpanel-head b,
.pro6-account-menu .cpanel-head small{display:block!important}
.pro6-account-menu .cpanel-head b{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:11px!important;color:#182230!important
}
.pro6-account-menu .cpanel-head small{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  margin-top:3px!important;font-size:8px!important;color:#98a2b3!important
}
.pro6-account-menu .member-badge{
  padding:5px 7px!important;border-radius:7px!important;
  background:#eef4ff!important;color:#175cd3!important;
  font-size:7px!important;font-weight:900!important;letter-spacing:.06em!important
}
.pro6-account-menu .cpanel-stats{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  margin:0 2px 8px!important;
  border:1px solid #e8edf4!important;
  border-radius:11px!important;
  background:#f8fafc!important;
  overflow:hidden!important;
}
.pro6-account-menu .cpanel-stats>div{
  min-width:0!important;
  padding:10px 5px!important;
  text-align:center!important;
}
.pro6-account-menu .cpanel-stats>div+div{border-left:1px solid #e7ebf1!important}
.pro6-account-menu .cpanel-stats b,
.pro6-account-menu .cpanel-stats small{display:block!important}
.pro6-account-menu .cpanel-stats b{
  overflow:hidden;text-overflow:ellipsis;
  font-size:10px!important;color:#182230!important
}
.pro6-account-menu .cpanel-stats small{margin-top:3px!important;font-size:7px!important;color:#98a2b3!important}

.pro6-account-menu .cpanel-group{
  display:block!important;
  padding:3px 2px!important;
  border-top:1px solid #f0f2f5!important;
}
.pro6-account-menu .cpanel-group>span{
  display:block!important;
  padding:9px 7px 5px!important;
  color:#98a2b3!important;
  font-size:7px!important;font-weight:900!important;
  letter-spacing:.12em!important;
}
.pro6-account-menu .cpanel-group>a{
  display:grid!important;
  grid-template-columns:34px minmax(0,1fr) 14px!important;
  align-items:center!important;
  gap:9px!important;
  min-height:48px!important;
  padding:7px!important;
  border-radius:10px!important;
  color:#475467!important;
  text-decoration:none!important;
}
.pro6-account-menu .cpanel-group>a:hover{
  background:#f6f8fc!important;color:#175cd3!important
}
.pro6-account-menu .cpanel-group>a>i:first-child{
  width:32px!important;height:32px!important;
  display:grid!important;place-items:center!important;
  border-radius:9px!important;
  background:#f3f6fb!important;color:#667085!important;
  font-size:13px!important
}
.pro6-account-menu .cpanel-group>a:hover>i:first-child{
  background:#eef4ff!important;color:#175cd3!important
}
.pro6-account-menu .cpanel-group>a>span{
  display:block!important;min-width:0!important
}
.pro6-account-menu .cpanel-group>a b,
.pro6-account-menu .cpanel-group>a small{
  display:block!important;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.pro6-account-menu .cpanel-group>a b{font-size:9.5px!important;color:inherit!important}
.pro6-account-menu .cpanel-group>a small{font-size:7.5px!important;color:#98a2b3!important;margin-top:2px!important}
.pro6-account-menu .cpanel-group>a>i:last-child{font-size:7px!important;color:#b5beca!important}

.pro6-account-menu .cpanel-logout{
  margin-top:4px!important;padding:9px 4px 2px!important;
  border-top:1px solid #edf0f4!important;
}
.pro6-account-menu .cpanel-logout form{margin:0!important}
.pro6-account-menu .cpanel-logout button{
  width:100%!important;height:38px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;
  border:1px solid #fecaca!important;border-radius:9px!important;
  background:#fff7f7!important;color:#b42318!important;
  font-family:inherit!important;font-size:9px!important;font-weight:800!important;
  cursor:pointer!important;
}
.pro6-account-menu .cpanel-logout button:hover{background:#fef3f2!important}

/* -------- Search backdrop / dialog -------- */
.pro6-search-backdrop{
  position:fixed;
  z-index:8990;
  inset:0;
  background:rgba(15,23,42,.44);
  backdrop-filter:blur(3px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:.16s;
}
.pro6-search-backdrop.show{
  opacity:1;visibility:visible;pointer-events:auto;
}
.pro6-search-panel{
  position:fixed;
  z-index:9000;
  left:50%;top:82px;
  width:min(780px,calc(100vw - 34px));
  max-height:calc(100dvh - 110px);
  overflow:auto;
  transform:translate(-50%,-10px) scale(.985);
  opacity:0;visibility:hidden;pointer-events:none;
  border:1px solid #dde4ed;
  border-radius:18px;
  background:#fff;
  box-shadow:0 30px 90px rgba(16,24,40,.22);
  transition:.17s;
}
.pro6-search-panel.show{
  transform:translate(-50%,0) scale(1);
  opacity:1;visibility:visible;pointer-events:auto;
}
.pro6-search-panel-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:16px;
  padding:18px 20px 10px;
}
.pro6-search-eyebrow{
  display:block;
  margin-bottom:5px;
  color:#246bfd;
  font-size:7.5px;font-weight:900;letter-spacing:.12em;
}
.pro6-search-panel-head h2{margin:0;color:#182230;font-size:20px;letter-spacing:-.035em}
.pro6-search-close{
  width:36px;height:36px;
  display:grid;place-items:center;
  border:1px solid #e4e7ec;border-radius:10px;
  background:#fff;color:#667085;cursor:pointer;
}
.pro6-search-close:hover{background:#f5f7fa;color:#182230}

.pro6-search-form{
  display:grid;
  grid-template-columns:26px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  margin:6px 20px 0;
  min-height:54px;
  padding:6px 7px 6px 13px;
  border:1px solid #ccd9ef;
  border-radius:13px;
  background:#fff;
  box-shadow:0 0 0 4px rgba(36,107,253,.045);
}
.pro6-search-form>i{color:#667085;font-size:16px}
.pro6-search-form input{
  width:100%;min-width:0;
  border:0!important;outline:0!important;box-shadow:none!important;
  background:transparent!important;color:#182230!important;
  font-family:inherit;font-size:12px!important;
}
.pro6-search-form button{
  height:40px!important;
  display:flex!important;align-items:center!important;gap:6px!important;
  padding:0 13px!important;
  border:0!important;border-radius:9px!important;
  background:#246bfd!important;color:#fff!important;
  font-family:inherit!important;font-size:9px!important;font-weight:800!important;
  cursor:pointer!important;
}
.pro6-search-form button:hover{background:#175cd3!important}
.pro6-search-hint{
  display:flex;align-items:center;gap:10px;
  padding:8px 21px 11px;
  color:#98a2b3;font-size:7.5px;
}
.pro6-search-hint kbd{
  padding:2px 5px;border:1px solid #e4e7ec;border-radius:5px;
  background:#f8fafc;color:#667085;font:700 7px inherit;
}
.pro6-search-hint a{margin-left:auto;color:#175cd3;font-weight:750}

.pro6-search-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  padding:4px 15px 16px;
}
.pro6-search-section{
  min-width:0;
  padding:8px;
  border:1px solid #edf0f4;
  border-radius:13px;
  background:#fbfcfe;
}
.pro6-search-section-title{
  padding:5px 7px 7px;
  color:#98a2b3;
  font-size:7px;font-weight:900;letter-spacing:.11em;
}
.pro6-search-section>a{
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 14px;
  align-items:center;
  gap:9px;
  min-height:49px;
  padding:7px;
  border-radius:10px;
  color:#475467;
  text-decoration:none;
}
.pro6-search-section>a:hover,
.pro6-search-section>a.pro6-search-match{
  background:#fff;color:#175cd3;
  box-shadow:0 4px 15px rgba(16,24,40,.04);
}
.pro6-search-section>a.pro6-search-hidden{display:none!important}
.pro6-search-section>a>i:first-child{
  width:32px;height:32px;
  display:grid;place-items:center;
  border-radius:9px;
  background:#eef4ff;color:#175cd3;
}
.pro6-search-section>a>span{min-width:0}
.pro6-search-section>a b,
.pro6-search-section>a small{
  display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap
}
.pro6-search-section>a b{font-size:9.5px;color:inherit}
.pro6-search-section>a small{font-size:7.5px;color:#98a2b3;margin-top:2px}
.pro6-search-section>a>i:last-child{font-size:8px;color:#b5beca}

.pro6-search-recent{
  margin:7px 4px 2px;
  padding:10px;
  border-top:1px solid #e9edf3;
}
.pro6-search-recent>span{
  display:block;margin-bottom:6px;
  color:#98a2b3;font-size:7px;font-weight:900;letter-spacing:.1em
}
#pro6RecentSearchList{display:flex;gap:5px;flex-wrap:wrap}
#pro6RecentSearchList button{
  border:1px solid #e1e7ef;border-radius:999px;
  background:#fff;color:#667085;
  padding:5px 8px;font:700 7.5px inherit;cursor:pointer
}
#pro6RecentSearchList button:hover{border-color:#b7ccff;color:#175cd3}
#pro6RecentSearchList small{font-size:7.5px;color:#98a2b3}

/* Ensure old V2 command UI never overlays V19 search. */
body.pro6-v19-search-open .command-center,
body.pro6-v19-search-open .command-backdrop{display:none!important}

body.theme-dark .pro6-account-panel .cpanel-toggle,
body.theme-dark .pro6-account-menu,
body.theme-dark .pro6-search-panel,
body.theme-dark .pro6-search-form,
body.theme-dark .pro6-search-section{
  background:#151f2f!important;border-color:#2b3c50!important;color:#e6edf5!important
}
body.theme-dark .pro6-account-menu .cpanel-head b,
body.theme-dark .pro6-account-menu .cpanel-stats b,
body.theme-dark .pro6-search-panel-head h2,
body.theme-dark .pro6-search-form input{color:#e6edf5!important}
body.theme-dark .pro6-account-menu .cpanel-stats,
body.theme-dark .pro6-search-section{background:#111b29!important}

@media(max-width:1280px){
  .pro6-account-panel .cpanel-name{display:none!important}
  .pro6-account-panel .cpanel-toggle{padding-right:6px!important}
}
@media(max-width:760px){
  .pro6-account-menu{
    position:fixed!important;
    left:10px!important;right:10px!important;
    top:72px!important;
    width:auto!important;
    max-height:calc(100dvh - 84px)!important;
  }
  .pro6-search-panel{
    top:62px;
    width:calc(100vw - 18px);
    max-height:calc(100dvh - 72px);
    border-radius:14px;
  }
  .pro6-search-panel-head{padding:15px 14px 8px}
  .pro6-search-form{margin:5px 12px 0;grid-template-columns:22px minmax(0,1fr)}
  .pro6-search-form button{grid-column:1/-1;width:100%;justify-content:center}
  .pro6-search-hint{padding:8px 14px 10px}
  .pro6-search-hint span{display:none}
  .pro6-search-grid{grid-template-columns:1fr;padding:4px 9px 12px}
}
