/* =============================================================================
   MOBILE REFRESH — lớp responsive chung cho toàn bộ ERP Family

   File này chỉ thay cách bày trên màn cảm ứng hẹp. Màu, nghiệp vụ và dữ liệu
   vẫn đến từ component/module hiện có; không tạo một nhánh giao diện thứ hai.
   ========================================================================== */

@media (max-width:1023px){
  :root{--mobile-nav-h:64px}

  html{scroll-behavior:smooth;overscroll-behavior-y:none}
  body{min-width:280px;overflow-x:hidden}
  button,a,input,select,textarea{touch-action:manipulation}

  /* Vỏ màn hình: đầu trang gọn, nội dung không bị thanh đáy che. */
  .c-screen__bar{
    min-height:calc(56px + var(--safe-t));
    padding:calc(var(--safe-t) + var(--s2)) var(--s3) var(--s2);
    gap:var(--s2);
  }
  .c-screen__bar>div:first-child{flex:1;min-width:0}
  .c-screen__bar>div:last-child{flex:0 0 auto}
  .c-screen__title{font-size:var(--fs-lg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .c-screen__body{
    padding:var(--s3);
    padding-bottom:calc(var(--mobile-nav-h) + var(--safe-b) + var(--s6));
  }
  .c-screen__body>.c-stack:first-child,.c-screen__body>.c-col:first-child{margin-top:0}

  /* Thanh công cụ cuộn ngang một hàng, không đẩy nội dung xuống nhiều dòng. */
  .c-tool{
    min-height:48px;padding:var(--s1) var(--s3);flex-wrap:nowrap;
    overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;
  }
  .c-tool::-webkit-scrollbar{display:none}
  .c-tool>*{flex:0 0 auto}
  .c-tool .c-field__input,.c-tool .c-field__select{min-height:40px}
  .c-tool>span[style*="flex:1"]{display:none}

  /* Thẻ và danh sách: tăng vùng đọc, giảm khoảng trống vô ích. */
  .c-card{border-radius:var(--r-md)}
  .c-card__head{padding:var(--s3)}
  .c-card__body{padding:var(--s3)}
  .c-card__body--tight{padding:0 var(--s3)}
  .c-grid,.c-col{gap:var(--s3)}
  .c-stack>*+*{margin-top:var(--s3)}
  .c-row{gap:var(--s2);padding:var(--s3) 0}
  .c-row__icon{width:40px;height:40px}
  .c-row__title{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .c-row__end{max-width:44%}
  .c-row__value,.c-row__note{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  /* Số liệu tổng quan: 2×2 trên điện thoại thường, một cột ở máy rất hẹp. */
  .c-stat{padding:var(--s3)}
  .c-stat__value{font-size:clamp(var(--fs-lg),5.8vw,var(--fs-xl))}
  .c-stat__value--lg{font-size:clamp(var(--fs-xl),8vw,var(--fs-2xl))}
  .c-grid--3,.c-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .c-grid--3>:last-child:nth-child(odd){grid-column:1/-1}

  /* Bộ lọc và bảng số không bị bóp chữ. */
  .c-chipbar{
    margin-inline:calc(var(--s3) * -1);padding-inline:var(--s3);
    scroll-padding-inline:var(--s3);scroll-snap-type:x proximity;
  }
  .c-chipbar__item{min-height:var(--tap);scroll-snap-align:start}
  .m-muc{gap:var(--s1)}
  .m-muc>div{padding:var(--s2)}
  .m-muc__value{font-size:clamp(var(--fs-xs),3.7vw,var(--fs-sm))}
  .m-so{gap:var(--s1) var(--s3)}
  .m-dong{gap:var(--s2)}
  .m-dong__v{max-width:58%;overflow-wrap:anywhere}
  .c-tbl__scroll{margin-inline:calc(var(--s3) * -1);padding-inline:var(--s3);overscroll-behavior-x:contain}

  /* Form: 16px ngăn Safari tự phóng khi chạm; sheet theo đúng bàn phím động. */
  .c-field__input,.c-field__select,textarea.c-field__input{font-size:16px}
  .c-sheet__backdrop{overscroll-behavior:contain}
  .c-sheet{
    max-height:calc(100dvh - var(--safe-t) - var(--s2));
    padding-inline:var(--s3);overscroll-behavior-y:contain;
    scroll-padding-bottom:calc(var(--safe-b) + 96px);
  }
  .c-sheet__head{
    position:sticky;top:calc(var(--s3) * -1);z-index:3;
    margin-inline:calc(var(--s3) * -1);padding:var(--s3);
    background:var(--surface);border-bottom:1px solid var(--line);
  }
  .c-sheet form>.c-btn:last-child{width:100%}

  /* Điều hướng ngón cái: nền mờ, trạng thái chọn nhìn được bằng cả màu và vạch. */
  .c-tabbar{
    min-height:calc(var(--mobile-nav-h) + var(--safe-b));
    background:color-mix(in srgb,var(--surface) 94%,transparent);
    -webkit-backdrop-filter:saturate(180%) blur(16px);
    backdrop-filter:saturate(180%) blur(16px);
    box-shadow:0 -4px 18px color-mix(in srgb,var(--text) 7%,transparent);
  }
  .c-tabbar__item{position:relative;min-height:var(--mobile-nav-h);padding:var(--s2) var(--s1)}
  .c-tabbar__item[aria-current="page"]::before{
    content:"";position:absolute;top:0;left:50%;width:24px;height:3px;
    border-radius:0 0 var(--r-pill) var(--r-pill);background:var(--accent);
    transform:translateX(-50%);
  }
  .c-tabbar__item--primary::before{display:none}
  .c-tabbar__item--primary .c-tabbar__icon{width:48px;height:34px}
  .p-sync{bottom:calc(var(--mobile-nav-h) + var(--safe-b) + var(--s2))}
  .c-fab{bottom:calc(var(--mobile-nav-h) + var(--safe-b) + var(--s3))}
  .c-toast{bottom:calc(var(--mobile-nav-h) + var(--safe-b) + 64px)}

  /* Trung tâm module, ảnh, báo cáo và nhà trọ. */
  .tt-luoi{padding:var(--s2);gap:var(--s2)}
  .tt-o{min-height:112px;padding:var(--s3)}
  .kk-luoi{padding:var(--s1);gap:var(--s1)}
  .nt-phieu__qr{width:100%}
  .nt-qr{width:min(230px,78vw)!important}
  .nt-cot{overflow-x:auto;overscroll-behavior-x:contain}
  .nt-cot__mot{min-width:54px}

  /* Gia phả: công cụ và inspector theo chiều cao thật của màn hình. */
  .c-sheet--wide{height:100dvh}
  .gp-inspector{height:min(88dvh,760px)}
  .gp-inspector__head{padding-top:var(--s3)}
  .gp-tree-tools,.gp-viewbar__actions{scroll-snap-type:x proximity}
  .gp-tree-tools>*,.gp-viewbar__actions>*{scroll-snap-align:start}

  /* Terminal Forex mới: quỹ và biểu đồ giữ đúng thứ tự ưu tiên trên điện thoại. */
  .fxt{padding-bottom:calc(var(--mobile-nav-h) + var(--safe-b))}
  .fxt__bar{padding-inline:var(--s3)}
  .fxt__than{padding:var(--s3);gap:var(--s3)}
  .fxt__quy-dau{gap:var(--s2)}
  .fxt__quy-so{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fxt__do{height:42dvh;min-height:240px}
  .fxt__tabs{min-height:calc(var(--mobile-nav-h) + var(--safe-b))}
  .fxt__tabs button{min-height:var(--mobile-nav-h)}

  /* Quản trị: tab ngang dễ chạm, form hành động xếp dọc. */
  .qt-admin__nav button{min-height:var(--tap)}
  .qt-actions{width:100%;justify-content:flex-start!important;overflow-x:auto}
  .qt-actions button{min-height:var(--tap)}
  .qt-inline-form .c-btn,.qt-inline-form button{width:100%;min-height:var(--tap)}
  .qt-admin__head span,.qt-metric small,.qt-health small,.qt-table__row small,.qt-storage small{font-size:var(--fs-xs)}

  /* Hồ sơ/tệp Gia phả trước đây còn nút 28px và chữ 10px. */
  .gp-file-card__meta b,.gp-file-card__meta small,.gp-file-card__actions select{font-size:var(--fs-xs)}
  .gp-file-card__actions button{width:var(--tap);height:var(--tap)}
  .gp-file-card__actions select{min-height:var(--tap)}

  /* Màn vào app và cổng người thuê dùng hết chiều ngang, không ép ngón tay. */
  .c-auth__form{padding-inline:var(--s3)}
  .c-auth__who button{padding-block:var(--s2);min-height:52px}
  .c-auth__foot{padding-bottom:var(--safe-b)}
}

@media (max-width:480px){
  .p-sync{width:38px;height:38px;padding:0;justify-content:center}
  .p-sync span{display:none}
  .c-screen__bar .c-btn--icon{width:40px;min-height:40px}
  .c-screen__bar>div:last-child{gap:0!important}
  .m-plan{padding:var(--s3)}
  .m-plan__head{align-items:flex-start;flex-wrap:wrap}
  .m-plan__meta{width:100%;margin-left:0}
  .gp-file-grid{grid-template-columns:1fr}
  .fxt__quy-dau{display:grid;grid-template-columns:1fr}
  .fxt__quy-dau label{justify-content:space-between}
  .fxt__quy-dau input{width:min(140px,44vw)}
}

@media (max-width:359px){
  .c-screen__body{padding-inline:var(--s2)}
  .c-grid--3,.c-grid--4,.c-stat-grid{grid-template-columns:1fr!important}
  .c-grid--3>:last-child:nth-child(odd){grid-column:auto}
  .tt-luoi{grid-template-columns:1fr}
  .m-muc{grid-template-columns:1fr}
  .m-muc__value{font-size:var(--fs-sm)}
  .c-row__end{max-width:40%}
  .c-tabbar__item{font-size:var(--fs-xs)}
}

@media (max-width:1023px) and (orientation:landscape) and (max-height:520px){
  .c-screen__bar{position:static;min-height:48px;padding-top:var(--s2)}
  .c-screen__body{padding-bottom:calc(var(--mobile-nav-h) + var(--safe-b) + var(--s3))}
  .c-sheet{max-height:100dvh;border-radius:0}
  .fxt__bar{position:static}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}