/* BB Account — 覆寫 Flatsome 使 input/button 一致 */
.bb-account-wrap{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; max-width:1280px; margin:0 auto; --bb-primary:#6c5cff; --bb-primary-hover:#5a4de8; --bb-border:#dfe4ee; --bb-border-focus:#6c5cff; --bb-bg-input:#fff; --bb-bg-readonly:#f7f8fb; --bb-text:#1a2333; --bb-text-muted:#6b7388; --bb-radius:8px; --bb-h:42px;}
.bb-account-wrap *,.bb-account-wrap *::before,.bb-account-wrap *::after{box-sizing:border-box;}
.bb-account-hero{background:#fef9e7; padding:18px 20px 18px; margin:-30px -15px 0; border-radius:0;}
.page-wrapper:has(.bb-account-wrap){padding-top:0 !important;}
.page-wrapper:has(.bb-account-wrap) .bb-account-hero{margin-top:0 !important;}
.bb-account-hero h1{font-size:16px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; margin:0; color:#1a1a2e;}
.bb-account-hero .bb-breadcrumb{float:right; font-size:13px; color:#7a7a8a; margin-top:2px;}
.bb-account-hero .bb-breadcrumb a{color:#5a6a8a; text-decoration:none;}
.bb-account-hero .bb-breadcrumb a:hover{color:#1a1a2e;}
.bb-account-hero::after{content:""; display:table; clear:both;}
.bb-account-body{margin-top:20px; display:flex; gap:16px; align-items:flex-start;}
@media(max-width:768px){ .bb-account-body{flex-direction:column;} .bb-account-hero .bb-breadcrumb{float:none; margin-top:8px;} }
.bb-account-left{flex:1 1 0; min-width:0;}
.bb-account-card{background:#fff; border:1px solid #e8eaf0; border-radius:8px; padding:20px; margin-bottom:16px; box-shadow:0 1px 2px rgba(0,0,0,.04);}
.bb-account-card__title{margin:0 0 16px; font-size:15px; font-weight:700; color:var(--bb-text); line-height:1.3;}
.bb-account-card__subtitle{margin:0 0 14px; font-size:14px; font-weight:700; color:var(--bb-text);}
.bb-account-card__subtitle small{font-weight:400; color:#94a3b8; font-size:12px; margin-left:4px;}
.bb-account-divider{border:0; border-top:1px solid #eef2f7; margin:22px 0 0; padding-top:20px;}
.bb-form-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
@media(max-width:640px){ .bb-form-grid{grid-template-columns:1fr;} }
.bb-field-full{grid-column:1 / -1;}
.bb-form-grid label{font-size:13px; font-weight:700; color:#1a2333; display:block; margin-bottom:7px; line-height:1.2;}
/* ---- INPUT — 強制覆寫 Flatsome form-flat ---- */
.bb-account-wrap .bb-form-grid input[type="text"],
.bb-account-wrap .bb-form-grid input[type="email"],
.bb-account-wrap .bb-form-grid input[type="password"],
.bb-account-wrap .bb-form-grid input[type="tel"],
.bb-account-wrap .bb-form-grid select{
  width:100% !important;
  height:var(--bb-h) !important;
  min-height:var(--bb-h) !important;
  padding:0 12px !important;
  border:1px solid var(--bb-border) !important;
  border-radius:var(--bb-radius) !important;
  font-size:14px !important;
  font-weight:400 !important;
  line-height:var(--bb-h) !important;
  background:var(--bb-bg-input) !important;
  color:var(--bb-text) !important;
  box-shadow:none !important;
  margin:0 !important;
  outline:none !important;
  -webkit-appearance:none; appearance:none;
  transition:border-color .15s, box-shadow .15s;
}
.bb-account-wrap .bb-form-grid input:focus,
.bb-account-wrap .bb-form-grid select:focus{
  border-color:var(--bb-border-focus) !important;
  box-shadow:0 0 0 3px rgba(108,92,255,.12) !important;
}
.bb-account-wrap .bb-form-grid input[readonly]{
  background:#f1f5f9 !important;
  border-color:#e2e8f0 !important;
  color:#94a3b8 !important;
  cursor:default;
}
.bb-account-wrap .bb-form-grid input::placeholder{color:#a0aec0; opacity:1;}
/* ---- INPUT GROUP (Gmail + Xac thuc) ---- */
.bb-input-group{display:flex; align-items:stretch; width:100%; gap:8px;}
.bb-input-group input{flex:1 1 0; min-width:0; border-radius:var(--bb-radius) !important;}
.bb-input-group .bb-btn-verify{
  flex:0 0 auto;
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  height:var(--bb-h) !important;
  min-height:var(--bb-h) !important;
  padding:0 16px !important;
  border:1px solid #1aa9a0 !important;
  border-radius:var(--bb-radius) !important;
  background:#fff !important;
  color:#1aa9a0 !important;
  font-size:13px !important; font-weight:700 !important; line-height:1 !important;
  letter-spacing:.02em;
  cursor:pointer; white-space:nowrap;
  box-shadow:none !important; margin:0 !important;
  transition:background .15s, color .15s, border-color .15s;
}
.bb-input-group .bb-btn-verify:hover{background:#eefaf9 !important; border-color:#159489 !important; color:#159489 !important;}
.bb-input-group .bb-btn-verify:active{background:#e0f5f3 !important;}
/* ---- AVATAR ROW ---- */
.bb-avatar-row{display:flex; align-items:center; gap:10px; min-height:var(--bb-h);}
.bb-avatar-row__img{width:40px; height:40px; border-radius:50%; object-fit:cover; border:1px solid #e8eaf0; background:#eef1f6; flex:0 0 40px; display:block;}
.bb-btn-outline{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  height:var(--bb-h) !important;
  min-height:var(--bb-h) !important;
  padding:0 16px !important;
  border:1px solid #6c5cff !important;
  border-radius:var(--bb-radius) !important;
  background:#fff !important; color:#6c5cff !important;
  font-size:13px !important; font-weight:700 !important; line-height:1 !important;
  text-align:center;
  cursor:pointer; white-space:nowrap; box-shadow:none !important; margin:0 !important;
  transition:background .15s, border-color .15s;
  box-sizing:border-box;
}
.bb-btn-outline:hover{background:#f3f0ff !important; border-color:#5a4de8 !important; color:#5a4de8 !important;}
.bb-avatar-name{font-size:12px; color:var(--bb-text-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
/* ---- PRIMARY BUTTON ---- */
.bb-btn-primary{
  display:inline-flex; align-items:center; justify-content:center;
  height:var(--bb-h) !important;
  padding:0 22px !important;
  border:0 !important; border-radius:var(--bb-radius) !important;
  background:var(--bb-primary) !important; color:#fff !important;
  font-size:14px !important; font-weight:700 !important; line-height:1 !important;
  cursor:pointer; box-shadow:none !important; margin:0 !important;
  transition:background .15s, opacity .15s;
  -webkit-appearance:none; appearance:none;
}
.bb-btn-primary:hover{background:var(--bb-primary-hover) !important; color:#fff !important;}
.bb-btn-primary:active{opacity:.92;}
.bb-btn-primary:disabled{opacity:.55; cursor:not-allowed;}
/* Action row */
.bb-form-actions{margin-top:20px; display:flex; align-items:center; gap:12px; flex-wrap:wrap;}
.bb-msg{font-size:13px; line-height:1.4;}
.bb-msg.ok{color:#0a7a4a;} .bb-msg.err{color:#c0392b;}
/* Right column */
.bb-account-right{width:320px; flex:0 0 320px;}
@media(max-width:768px){ .bb-account-right{width:100%; flex:auto;} }
.bb-profile-card{background:linear-gradient(135deg,#6b7cff 0%, #6c5cff 45%, #7a4ec5 100%); border-radius:8px; padding:18px; color:#fff; text-align:center;}
.bb-profile-card h3{color:#fff; font-size:15px; font-weight:700; margin:0 0 14px;}
.bb-avatar-wrap{position:relative; display:inline-block;}
.bb-avatar-wrap img{width:110px; height:110px; border-radius:50%; object-fit:cover; border:4px solid rgba(255,255,255,.9); background:#e8eaf0;}
.bb-avatar-badge{position:absolute; right:2px; bottom:2px; width:32px; height:32px; background:#1ecb7a; border-radius:50%; display:grid; place-items:center; color:#fff; font-size:14px; border:3px solid #fff;}
.bb-username{margin-top:10px; font-size:18px; font-weight:800; color:#fff;}
.bb-stat-card{background:#eef1f6; border-radius:8px; padding:14px 16px; margin-top:12px; display:flex; justify-content:space-between; align-items:center; border-left:4px solid transparent;}
.bb-stat-card.purple{border-left-color:#6c5cff;}
.bb-stat-card.green{border-left-color:#1ecb7a;}
.bb-stat-label{font-size:12px; color:#6b7388; margin-bottom:2px;}
.bb-stat-value{font-size:16px; font-weight:800;}
.bb-stat-value.purple{color:#6c5cff;}
.bb-stat-value.green{color:#1ecb7a;}
.bb-stat-icon{font-size:28px; opacity:.35;}
.bb-meta-card{margin-top:12px;}
.bb-meta-row{display:flex; justify-content:space-between; font-size:13px; padding:10px 2px; border-bottom:1px solid #eef1f6;}
.bb-meta-row:last-child{border:0;}
.bb-meta-label{color:#6b7388;}
.bb-meta-value{font-weight:600; color:#1a2333;}
