/* ══════════════════════════════════════════════════════════════════════════
   Khu vực phụ huynh — 3 mục (Tổng quan · Hỏi Buddy · Lộ trình). MOBILE-FIRST:
   mặc định là điện thoại (1 cột, thanh 3 mục cố định dưới cùng); ≥ 900px dùng thanh mục ở trên.
   Nạp SAU sb-parent.css.
   ══════════════════════════════════════════════════════════════════════════ */
.pv{ display:flex; flex-direction:column; gap:12px; min-width:0; }
.pv[style*="none"]{ display:none !important; }
.pv-head{ background:#fff; border:1px solid #E3EEE9; border-radius:16px; padding:12px 14px; display:flex; flex-direction:column; gap:6px; }
.pv-who{ display:flex; align-items:center; gap:10px; min-width:0; }
.pv-ava{ width:40px; height:40px; border-radius:12px; background:#E8F7F2; display:grid; place-items:center; font-size:20px; flex-shrink:0; }
.pv-name{ font:900 17px/1.2 Nunito,Arial,sans-serif; color:var(--text1); overflow-wrap:anywhere; }
.pv-meta{ font:700 12.5px/1.4 Nunito,Arial,sans-serif; color:var(--text2); overflow-wrap:anywhere; }
.pv-summary{ margin:0; font:700 14px/1.5 Nunito,Arial,sans-serif; color:#2C4566; }

/* Thanh 3 mục: điện thoại → cố định dưới cùng */
.pv-nav{ position:fixed; left:0; right:0; bottom:0; z-index:400; display:grid; grid-template-columns:repeat(3,1fr);
  background:#fff; border-top:1px solid #E3EEE9; box-shadow:0 -6px 18px rgba(18,49,74,.08);
  padding:6px 8px max(6px, env(safe-area-inset-bottom)); }
.pv-nav button{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; min-height:52px;
  border:0; background:transparent; border-radius:12px; font:900 12.5px Nunito,Arial,sans-serif; color:#5A6E80; cursor:pointer; }
.pv-nav button span{ font-size:20px; line-height:1; }
.pv-nav button.active{ background:#E6F7F2; color:#0E8F7E; }
.pv-nav button.pv-nav-main:not(.active){ color:#0E8F7E; }
.pv-nav button:focus-visible{ outline:3px solid #1E90FF; outline-offset:-3px; }
/* #child-view không được co theo khung cuộn .main (flex:1; min-height:0 cũ làm nội dung tràn
   ra ngoài, khiến khoảng đệm dưới vô tác dụng và thanh điều hướng cố định che nút cuối) */
body.pv-on #child-view{ flex:1 0 auto; }
body.pv-on .main{ padding-bottom:calc(84px + env(safe-area-inset-bottom)) !important;
  scroll-padding-bottom:calc(84px + env(safe-area-inset-bottom)); }
body.pv-on.pv-typing .pv-nav{ display:none; }
body.pv-on.pv-typing .main{ padding-bottom:12px !important; }
.pv-sec[hidden]{ display:none !important; }
.pv-sec{ display:flex; flex-direction:column; gap:12px; min-width:0; }

/* Thẻ */
.pv-card{ background:#fff; border:1px solid #E3EEE9; border-radius:16px; padding:14px; display:flex; flex-direction:column; gap:8px; min-width:0; }
.pv-card h3{ margin:0; font:900 15px Nunito,Arial,sans-serif; color:var(--text1); }
.pv-card-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; }
.pv-sub{ margin:0; font:600 13.5px/1.55 Nunito,Arial,sans-serif; color:#3B5370; overflow-wrap:anywhere; }
.pv-note{ margin:0; font:600 12px/1.5 Nunito,Arial,sans-serif; color:#7A8BA5; }
.pv-empty{ margin:0; font:600 13.5px/1.55 Nunito,Arial,sans-serif; color:#5A6E80; }
.pv-goal{ margin:0; font:900 15.5px/1.45 Nunito,Arial,sans-serif; color:#12314A; overflow-wrap:anywhere; }
.pv-chip{ display:inline-flex; align-items:center; border-radius:999px; padding:3px 10px; font:800 12px Nunito,Arial,sans-serif; background:#EEF3F7; color:#4B5F75; }
.pv-chip.tone-ok{ background:#E6F7EE; color:#167A43; } .pv-chip.tone-info{ background:#E8F1FF; color:#1D5FB8; }
.pv-chip.tone-warn{ background:#FFF4DF; color:#8A5A00; } .pv-chip.tone-muted{ background:#F1F3F5; color:#6B7785; }
.pv-progress{ height:8px; border-radius:99px; background:#EAF1EE; overflow:hidden; }
.pv-progress span{ display:block; height:100%; background:linear-gradient(90deg,#1FCBA6,#11917A); border-radius:99px; }

/* Hành động chính: Hỏi Buddy */
.pv-cta{ display:flex; align-items:center; gap:12px; width:100%; min-height:64px; padding:12px 14px; border:0; border-radius:16px;
  background:linear-gradient(135deg,#1FCBA6,#11917A); color:#fff; text-align:left; cursor:pointer; box-shadow:0 8px 20px rgba(17,145,122,.25); }
.pv-cta b{ display:block; font:900 15.5px Nunito,Arial,sans-serif; }
.pv-cta small{ display:block; font:700 12.5px Nunito,Arial,sans-serif; opacity:.92; }
.pv-cta > span:nth-child(2){ flex:1; min-width:0; }
.pv-cta-ic{ font-size:24px; }
.pv-btn, .pv-btn-ghost{ min-height:44px; padding:9px 16px; border-radius:12px; font:900 14px Nunito,Arial,sans-serif; cursor:pointer; align-self:flex-start; }
.pv-btn{ border:0; background:#11917A; color:#fff; }
.pv-btn-ghost{ border:1.5px solid #CFE6DF; background:#fff; color:#0E8F7E; }
.pv-btn-ghost.danger{ border-color:#F3CACA; color:#B03A3A; }
.pv-btn:disabled, .pv-btn-ghost:disabled{ opacity:.6; cursor:wait; }
.pv-link{ border:0; background:none; padding:8px 0; min-height:40px; color:#0E8F7E; font:900 13.5px Nunito,Arial,sans-serif; cursor:pointer; align-self:flex-start; }
.pv-actions{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.pv-foot{ display:flex; justify-content:center; }
.pv-err{ margin:0; color:#B03A3A; font:800 13px Nunito,Arial,sans-serif; }

/* Hoạt động gần đây: danh sách gọn */
.pv-period{ display:inline-flex; border:1px solid #D7E9E2; border-radius:10px; overflow:hidden; }
.pv-period button{ border:0; background:#fff; padding:6px 10px; min-height:34px; font:800 12.5px Nunito,Arial,sans-serif; color:#5A6E80; cursor:pointer; }
.pv-period button.on{ background:#11917A; color:#fff; }
.pv-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.pv-list > li + li{ border-top:1px solid #F0F4F2; }
.pv-row{ display:grid; grid-template-columns:auto minmax(0,1fr); grid-template-areas:"date title" "date result"; column-gap:10px; row-gap:1px;
  align-items:center; width:100%; padding:9px 2px; border:0; background:none; text-align:left; font:inherit; color:inherit; min-height:48px; }
button.pv-row{ cursor:pointer; }
button.pv-row:hover{ background:#F7FBFA; }
.pv-date{ grid-area:date; font:900 12px Nunito,Arial,sans-serif; color:#7A8BA5; min-width:40px; }
.pv-title{ grid-area:title; font:800 13.5px/1.35 Nunito,Arial,sans-serif; color:var(--text1); overflow-wrap:anywhere; }
.pv-result{ grid-area:result; font:700 12.5px Nunito,Arial,sans-serif; color:#5A6E80; }
.pv-result.tone-ok{ color:#167A43; } .pv-result.tone-mid{ color:#B4661A; } .pv-result.tone-low{ color:#C0392B; }
.pv-detail{ padding:4px 2px 12px 52px; display:flex; flex-direction:column; gap:8px; font:600 13px/1.55 Nunito,Arial,sans-serif; color:#3B5370; }
.pv-detail p{ margin:0; }
.pv-more{ background:#fff; border:1px solid #E3EEE9; border-radius:16px; padding:0 14px; }
.pv-more > summary{ min-height:48px; display:flex; align-items:center; font:900 14px Nunito,Arial,sans-serif; color:var(--text1); cursor:pointer; }
.pv-more[open]{ padding-bottom:12px; }
.pv-more .line-chart svg{ width:100%; height:auto; }

/* Lộ trình */
.pv-steps-intro{ margin:0; padding-left:20px; display:flex; flex-direction:column; gap:6px; font:600 13.5px/1.55 Nunito,Arial,sans-serif; color:#3B5370; }
.pv-rm-steps{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.pv-rm-steps li{ display:flex; gap:10px; align-items:flex-start; }
.pv-rm-steps li b{ display:block; font:800 13.5px/1.4 Nunito,Arial,sans-serif; color:var(--text1); }
.pv-rm-steps li small{ display:block; font:600 12.5px/1.45 Nunito,Arial,sans-serif; color:#5A6E80; }
.pv-rm-steps li.done b{ color:#167A43; }
.pv-tips{ margin:0; padding-left:20px; font:600 13.5px/1.55 Nunito,Arial,sans-serif; color:#3B5370; }
.pv-feedback{ background:#F7FBFA; border-radius:12px; padding:10px 12px; font:700 13px Nunito,Arial,sans-serif; color:#2C4566; }
.pv-feedback ul{ margin:6px 0 0; padding-left:18px; display:flex; flex-direction:column; gap:4px; font-weight:600; }
.pv-feedback li span{ color:#7A8BA5; font-weight:800; }
.pv-field{ display:flex; flex-direction:column; gap:5px; border:0; padding:0; margin:0; font:900 13px Nunito,Arial,sans-serif; color:var(--text1); }
.pv-field legend{ padding:0; margin-bottom:5px; }
.pv-field small{ font-weight:600; color:#7A8BA5; }
.pv-field input, .pv-field textarea{ width:100%; box-sizing:border-box; min-height:44px; border:1.5px solid #D5E6E3; border-radius:12px; padding:9px 12px;
  font:700 16px/1.45 Nunito,Arial,sans-serif; color:var(--text1); background:#fff; resize:vertical; }
.pv-step-edit{ display:grid; grid-template-columns:28px minmax(0,1fr) 40px; gap:6px; align-items:start; margin-bottom:8px; }
.pv-step-edit > div{ display:flex; flex-direction:column; gap:5px; }
.pv-step-edit input{ width:100%; box-sizing:border-box; min-height:42px; border:1.5px solid #D5E6E3; border-radius:10px; padding:8px 10px; font:700 16px Nunito,Arial,sans-serif; }
.pv-step-edit .pv-step-detail{ font-weight:600; }
.pv-step-no{ width:28px; height:28px; border-radius:50%; background:#E6F7F2; color:#0E8F7E; display:grid; place-items:center; font:900 13px Nunito,Arial; margin-top:7px; }
.pv-x{ width:40px; height:42px; border:1.5px solid #F3CACA; border-radius:10px; background:#fff; color:#B03A3A; font-size:20px; cursor:pointer; }
.pv-rewrite, .pv-share{ border-top:1px dashed #D5E6E3; padding-top:10px; display:flex; flex-direction:column; gap:8px; }
.pv-share blockquote{ margin:0; padding:10px 12px; background:#F2FBF8; border-left:4px solid #1FCBA6; border-radius:8px; font:600 14px/1.55 Nunito,Arial,sans-serif; color:#2C4566; }
.pv-check{ display:flex; gap:8px; align-items:flex-start; font:800 13.5px/1.45 Nunito,Arial,sans-serif; color:var(--text1); cursor:pointer; }
.pv-check input{ width:20px; height:20px; flex-shrink:0; margin-top:1px; }

/* Hỏi Buddy: khung trò chuyện chiếm phần màn hình còn lại, ô nhập luôn thấy */
#pv-advisor .advisor-card{ display:flex; flex-direction:column; margin:0; min-height:0; }
@media (max-width:899px){
  /* Mục Hỏi Buddy: không cuộn trang — khung trò chuyện co giãn vừa phần còn lại, chỉ danh sách tin nhắn cuộn */
  body.pv-on[data-pv="advisor"] #child-view{ flex:1 1 0; min-height:0; }
  body.pv-on[data-pv="advisor"] #pv-advisor{ flex:1 1 0; min-height:0; }
  body.pv-on[data-pv="advisor"] #pv-advisor .advisor-card{ flex:1 1 0; min-height:260px; }
}
#pv-advisor .advisor-messages{ flex:1; min-height:0; max-height:none; overflow-y:auto; }
#pv-advisor .advisor-input-row{ flex:0 0 auto; }
#pv-advisor .adv-mic{ width:52px; height:52px; min-width:52px; font-size:22px; }
.pv-make-plan{ margin:0 12px 6px; min-height:42px; border:1.5px dashed #1FCBA6; border-radius:12px; background:#F2FBF8; color:#0E8F7E;
  font:900 13.5px Nunito,Arial,sans-serif; cursor:pointer; }
.pv-make-plan[hidden]{ display:none; }
.pv-vol{ display:flex; align-items:center; gap:4px; margin-left:auto; font-size:14px; }
.pv-vol[hidden]{ display:none; }
.pv-vol input{ width:72px; }
body[data-pv="advisor"] .pv-summary{ display:none; }
body[data-pv="advisor"] .mobile-parent-bar .mobile-link-details{ display:none; }
@media (max-width:899px){
  body[data-pv="advisor"] .pv-head{ padding:8px 12px; }
  body[data-pv="advisor"] .pv-ava{ display:none; }
}

/* Tablet & desktop: cùng 3 mục, thanh mục ở trên, nội dung rộng hơn */
@media (min-width:900px){
  .pv-nav{ position:static; box-shadow:none; border:1px solid #E3EEE9; border-radius:14px; padding:4px; max-width:520px; }
  .pv-nav button{ flex-direction:row; gap:8px; min-height:44px; font-size:14px; }
  .pv-nav button span{ font-size:17px; }
  body.pv-on .main{ padding-bottom:20px !important; }
  body.pv-on .main{ scroll-padding-bottom:0; }
  #pv-overview{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; }
  #pv-overview[hidden]{ display:none !important; }
  #pv-overview > .pv-cta, #pv-overview > .pv-more, #pv-overview > .pv-foot{ grid-column:1 / -1; }
  #pv-roadmap{ max-width:820px; }
  #pv-advisor .advisor-card{ height:calc(100vh - 64px - 150px); min-height:420px; }
}

/* Toast: không chặn thao tác chạm (trước đây lớp toast ẩn vẫn nằm đè lên nút ở đáy màn hình),
   và nằm TRÊN thanh 3 mục ở điện thoại */
.toast{ pointer-events:none; }
@media (max-width:899px){
  body.pv-on .toast{ left:12px; right:12px; bottom:calc(84px + env(safe-area-inset-bottom)); text-align:center; }
  body.pv-on.pv-typing .toast{ bottom:12px; }
}

.pv-privacy{ margin:6px 0 8px; padding-left:18px; font-size:13.5px; line-height:1.55; }
.pv-privacy li{ margin-bottom:4px; }