/* An Đông 4 CRM V10.55 — mobile refinement & frame stability.
   Everything in this file is phone/tablet scoped; desktop layout remains unchanged. */
@media (max-width:820px){
  :root{--v1055-gap:10px;--v1055-radius:15px}
  html,body{overscroll-behavior-y:none}
  body.v1043-mobile-ui{background:#f3f7fb!important}

  /* Login: always centered inside the visible viewport, with no "scroll to find the form" behavior. */
  body.v1043-mobile-ui .login-screen:not(.hidden){height:100dvh!important;min-height:100svh!important;max-height:100dvh!important;overflow:hidden!important;padding:max(12px,env(safe-area-inset-top)) 14px max(12px,env(safe-area-inset-bottom))!important;align-items:center!important;justify-items:center!important}
  body.v1043-mobile-ui .login-shell{max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;overflow:auto!important;overscroll-behavior:contain!important}
  body.v1043-mobile-ui .login-card{min-height:0!important;padding:24px 20px 22px!important;gap:7px!important}
  body.v1043-mobile-ui .login-card:before{min-height:42px!important;margin-bottom:8px!important}
  body.v1043-mobile-ui .login-card h2{font-size:23px!important}
  body.v1043-mobile-ui .login-card>p{margin-bottom:10px!important}
  body.v1043-mobile-ui .login-card input{height:46px!important;min-height:46px!important}
  body.v1043-mobile-ui .login-card .btn{height:46px!important}

  /* Touch rhythm */
  body.v1043-mobile-ui button,body.v1043-mobile-ui .btn,body.v1043-mobile-ui select{min-height:42px}
  body.v1043-mobile-ui input,body.v1043-mobile-ui select,body.v1043-mobile-ui textarea{font-size:16px!important}
  body.v1043-mobile-ui .main{padding-top:8px!important}

  /* Enterprise customer dashboard */
  body.v1043-mobile-ui .v1053-dashboard{padding:8px!important;gap:9px!important;border-radius:0!important;background:#f3f7fb!important}
  body.v1043-mobile-ui .v1053-page-head{margin:0!important;gap:7px!important}
  body.v1043-mobile-ui .v1053-page-head>div:first-child>span{font-size:8px!important;margin-bottom:2px!important}
  body.v1043-mobile-ui .v1053-page-head h1{font-size:22px!important}
  body.v1043-mobile-ui .v1053-page-head p{font-size:10.5px!important;line-height:1.35!important;margin-top:2px!important}
  body.v1043-mobile-ui .v1053-head-actions{display:flex!important;gap:6px!important;width:100%!important}
  body.v1043-mobile-ui .v1053-head-actions .btn{flex:1!important;padding:8px!important;font-size:11px!important}

  body.v1043-mobile-ui .v10541-filterbar{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;padding:10px!important;min-height:0!important;border-radius:14px!important}
  body.v1043-mobile-ui .v10541-filter-copy{display:none!important}
  body.v1043-mobile-ui .v10541-date-controls{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important;width:100%!important}
  body.v1043-mobile-ui .v10541-date-controls .v1053-filter{min-width:0!important;gap:3px!important}
  body.v1043-mobile-ui .v10541-date-controls .v1053-filter span{font-size:8px!important}
  body.v1043-mobile-ui .v10541-date-controls .v1053-filter input{width:100%!important;height:42px!important;padding:0 8px!important;font-size:13px!important}
  body.v1043-mobile-ui .v10541-date-controls .btn{grid-column:1/-1!important;height:42px!important}

  /* KPI cards: compact horizontal snap keeps the dashboard short and one-handed. */
  body.v1043-mobile-ui .v1053-kpis{display:flex!important;overflow-x:auto!important;overflow-y:hidden!important;gap:8px!important;margin:0 -8px!important;padding:0 8px 4px!important;scroll-snap-type:x proximity!important;scrollbar-width:none!important;-webkit-overflow-scrolling:touch!important}
  body.v1043-mobile-ui .v1053-kpis::-webkit-scrollbar{display:none!important}
  body.v1043-mobile-ui .v1053-kpi{flex:0 0 min(76vw,260px)!important;min-height:76px!important;padding:10px!important;grid-template-columns:38px minmax(0,1fr) 10px!important;gap:9px!important;scroll-snap-align:start!important;border-radius:14px!important;transform:none!important;transition:none!important}
  body.v1043-mobile-ui .v1053-kpi:hover{transform:none!important}
  body.v1043-mobile-ui .v1053-kpi strong{font-size:19px!important;white-space:normal!important;line-height:1.05!important}
  body.v1043-mobile-ui .v1053-kpi em{font-size:9px!important}

  /* Conversion panel */
  body.v1043-mobile-ui .v1053-panel{border-radius:15px!important;box-shadow:0 3px 12px rgba(18,58,99,.035)!important}
  body.v1043-mobile-ui .v1053-panel-title{padding:11px 12px!important}
  body.v1043-mobile-ui .v1053-panel-title strong{font-size:14px!important}
  body.v1043-mobile-ui .v1053-panel-title small{font-size:9px!important;line-height:1.35!important}
  body.v1043-mobile-ui .v1053-funnel{display:grid!important;grid-template-columns:1fr!important;gap:5px!important;padding:9px!important}
  body.v1043-mobile-ui .v1053-funnel>i{font-size:17px!important;line-height:1!important;transform:rotate(90deg)!important}
  body.v1043-mobile-ui .v1053-funnel article{min-height:72px!important;padding:10px!important;grid-template-columns:38px 1fr auto!important;gap:9px!important;border-radius:12px!important}
  body.v1043-mobile-ui .v1053-funnel article>span{width:38px!important;height:38px!important;font-size:16px!important}
  body.v1043-mobile-ui .v1053-funnel strong{font-size:20px!important}

  /* Team performance uses cards instead of a wide desktop spreadsheet on phones. */
  body.v1043-mobile-ui .v1053-panel:has(.v1053-table) .v1053-table{min-width:0!important}
  body.v1043-mobile-ui table.v1053-table.v1043-card-table tbody{gap:8px!important;padding:8px!important}
  body.v1043-mobile-ui table.v1053-table.v1043-card-table tbody tr{border-radius:13px!important;box-shadow:none!important}
  body.v1043-mobile-ui table.v1053-table.v1043-card-table tbody td{grid-template-columns:minmax(105px,38%) minmax(0,1fr)!important;min-height:36px!important;padding:8px 10px!important}
  body.v1043-mobile-ui table.v1053-table.v1043-card-table tbody td:before{font-size:8px!important}
  body.v1043-mobile-ui .v1053-conv-cell>span{width:72px!important}

  /* Tasks and common customer management */
  body.v1043-mobile-ui .v1053-task-grid{grid-template-columns:1fr!important;padding:8px!important;gap:7px!important}
  body.v1043-mobile-ui .v1053-task{padding:10px!important;min-height:68px!important;border-radius:12px!important;transform:none!important}
  body.v1043-mobile-ui .v1053-task>span{width:36px!important;height:36px!important}
  body.v1043-mobile-ui .v1045-stage-tabs{display:flex!important;overflow-x:auto!important;gap:6px!important;scrollbar-width:none!important;padding-bottom:2px!important}
  body.v1043-mobile-ui .v1045-stage-tabs::-webkit-scrollbar{display:none!important}
  body.v1043-mobile-ui .v1045-stage-tabs>*{flex:0 0 auto!important}
  body.v1043-mobile-ui .v1045-toolbar{grid-template-columns:1fr!important;gap:7px!important}

  /* Company lookup */
  body.v1043-mobile-ui .v1053-company-page{padding:8px!important;gap:10px!important}
  body.v1043-mobile-ui .v1053-company-head{gap:8px!important}
  body.v1043-mobile-ui .v1053-company-head>div:last-child{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important;gap:7px!important}
  body.v1043-mobile-ui .v1053-company-head>div:last-child .btn:only-child{grid-column:1/-1!important}
  body.v1043-mobile-ui .v1053-company-search{padding:15px!important;border-radius:16px!important}
  body.v1043-mobile-ui .v1053-company-search:after{display:none!important}
  body.v1043-mobile-ui .v1053-company-search-copy{margin-bottom:12px!important;gap:10px!important}
  body.v1043-mobile-ui .v1053-company-search-copy>span{width:38px!important;height:38px!important;border-radius:11px!important}
  body.v1043-mobile-ui .v1053-company-search-copy strong{font-size:15px!important}
  body.v1043-mobile-ui .v1053-company-search-copy small{font-size:10px!important;line-height:1.35!important}
  body.v1043-mobile-ui .v1053-company-search form{grid-template-columns:1fr!important;gap:7px!important}
  body.v1043-mobile-ui .v1053-company-search form>div{height:48px!important;padding:0 12px!important}
  body.v1043-mobile-ui .v1053-company-search form>.btn{height:46px!important}
  body.v1043-mobile-ui .v1053-company-results{min-height:190px!important;padding:10px!important;border-radius:15px!important}
  body.v1043-mobile-ui .v1053-company-empty{min-height:165px!important}
  body.v1043-mobile-ui .v1053-company-result-grid{grid-template-columns:1fr!important;gap:8px!important}
  body.v1043-mobile-ui .v1053-company-result-grid article{grid-template-columns:38px 1fr!important;padding:12px!important;gap:10px!important;border-radius:13px!important}
  body.v1043-mobile-ui .v1053-result-icon{width:38px!important;height:38px!important;border-radius:11px!important}
  body.v1043-mobile-ui .v1053-company-result-grid h3{font-size:14px!important;margin:3px 0 9px!important}

  /* Company warehouse category cards remain tappable and compact. */
  body.v1043-mobile-ui .v1042-stat-grid{display:flex!important;overflow-x:auto!important;gap:7px!important;margin:0 -8px!important;padding:0 8px 4px!important;scroll-snap-type:x proximity!important;scrollbar-width:none!important}
  body.v1043-mobile-ui .v1042-stat-grid::-webkit-scrollbar{display:none!important}
  body.v1043-mobile-ui .v1042-stat{flex:0 0 155px!important;min-height:88px!important;scroll-snap-align:start!important;cursor:pointer!important}
  body.v1043-mobile-ui .v1042-stat.total{grid-column:auto!important;flex-basis:165px!important}
  body.v1043-mobile-ui .v1042-stat-filter.active{outline:2px solid #2683e6!important;outline-offset:-2px!important}

  /* Frame stability: reserve layouts and remove hover transforms/paint-heavy effects on touch devices. */
  body.v1043-mobile-ui .v1053-dashboard .v1053-kpi,
  body.v1043-mobile-ui .v1053-dashboard .v1053-panel,
  body.v1043-mobile-ui .v1053-dashboard .v1053-task{contain:layout paint!important}
  body.v1043-mobile-ui .v1053-dashboard *{scroll-behavior:auto!important}
  body.v1043-mobile-ui .v1053-kpi,body.v1043-mobile-ui .v1053-task,body.v1043-mobile-ui .v1053-view-team{transition:none!important}
}

@media (max-width:390px){
  body.v1043-mobile-ui .v1053-kpi{flex-basis:82vw!important}
  body.v1043-mobile-ui .v10541-date-controls{grid-template-columns:1fr 1fr!important}
  body.v1043-mobile-ui .v1053-company-head>div:last-child{grid-template-columns:1fr!important}
}

@media (max-width:820px) and (max-height:650px){
  body.v1043-mobile-ui .login-card{padding:16px 18px 14px!important;gap:4px!important}
  body.v1043-mobile-ui .login-card:before{min-height:36px!important;margin-bottom:4px!important}
  body.v1043-mobile-ui .login-card h2{font-size:20px!important}
  body.v1043-mobile-ui .login-card>p{font-size:10.5px!important;margin-bottom:5px!important}
  body.v1043-mobile-ui .login-card label{margin-top:4px!important}
  body.v1043-mobile-ui .login-card input,body.v1043-mobile-ui .login-card .btn{height:42px!important;min-height:42px!important}
}