/* AVYORA Connect R6.16-RS1-UX1 — Cross-device UX hardening.
   Responsive/visual only: no business logic, RBAC, finance or clinical behavior changes. */
:root{--ux-safe-bottom:env(safe-area-inset-bottom,0px);--ux-safe-top:env(safe-area-inset-top,0px)}
html,body{max-width:100%;overflow-x:hidden}
.shell,.main,.content,.card,.headline,.topbar,.top-user,.detail-row,.slot-head{min-width:0}
.table-wrap{max-width:100%;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain;scrollbar-width:thin}
.table th,.table td,.nav button,.portal-choice,.workspace-option{text-align:start}
.detail-row>*{min-width:0;overflow-wrap:anywhere}
.card,.notice,.meta,.sub,.headline p{overflow-wrap:anywhere}
.filters>*{max-width:100%}
.modal-x{left:auto;inset-inline-end:14px}
.toast{left:auto;inset-inline-end:24px;max-width:min(360px,calc(100vw - 32px))}
.portal-choice,.workspace-option{touch-action:manipulation}

/* Tablet portrait: the former 2-column login became cramped around 820px. */
@media(max-width:960px){
  .portal-login{grid-template-columns:1fr!important;max-width:760px}
  .portal-hero{padding:28px}
  .portal-grid{margin:22px 0}
  .portal-auth{padding:28px}
  .premium-login-r614{margin-block:18px}
}

/* Drawer follows UI direction after Regional Settings / language switching. */
@media(max-width:900px){
  .premium-shell-r614 .sidebar{height:100dvh!important;max-height:100dvh}
  html[dir="ltr"] .premium-shell-r614 .sidebar{left:0!important;right:auto!important;transform:translateX(-105%);box-shadow:18px 0 50px rgba(5,24,35,.22)}
  html[dir="ltr"] .premium-shell-r614.mobile-nav-open .sidebar{transform:translateX(0)}
  .premium-shell-r614 .content{max-width:100%}
  .flow-mobile-dock{bottom:calc(10px + var(--ux-safe-bottom))}
  .flow-shell-r615 .main{padding-bottom:calc(76px + var(--ux-safe-bottom))!important}
  .toast{bottom:calc(82px + var(--ux-safe-bottom))}
}

/* Phone UX: login first, touch targets, true bottom sheets, safe areas. */
@media(max-width:600px){
  .login-wrap{padding:10px;place-items:start center}
  .portal-login{border-radius:18px!important;margin:0;overflow:visible}
  .portal-auth{order:-1;padding:20px!important;border-radius:18px;background:#fff}
  .portal-hero{order:2;padding:18px!important;border-radius:18px;margin-top:10px}
  .portal-hero h1{font-size:27px;margin:12px 0 3px}
  .portal-hero>p{margin:4px 0 10px;font-size:12px}
  .premium-login-tag,.pill-row{display:none!important}
  .portal-grid{grid-template-columns:1fr!important;gap:8px!important;margin:14px 0 0!important}
  .portal-choice{min-height:58px!important;padding:11px 13px!important;border-radius:13px}
  .portal-choice b{font-size:14px}.portal-choice span{font-size:10px}
  .portal-auth .login-form,.portal-auth{width:100%}
  .login-form h2{font-size:24px}
  .demo-box{margin-top:14px}
  .login-credit{margin-top:14px;padding-top:12px}
  .public-legal-links{margin:10px 0;flex-wrap:wrap}

  .premium-shell-r614 .topbar{height:auto!important;min-height:64px;padding:8px 10px;gap:6px}
  .premium-shell-r614 .top-title-box{max-width:min(45vw,190px)}
  .premium-shell-r614 .top-title-box #viewTitle{font-size:14px}
  .mobile-menu-btn,.flow-command-btn{width:40px!important;height:40px!important;min-height:40px!important;flex:0 0 40px}
  .premium-shell-r614 .avatar{width:34px;height:34px}
  .premium-shell-r614 .topbar .btn#logout{min-width:38px;height:38px}

  .content,.premium-shell-r614 .content{padding:12px!important}
  .headline{gap:7px}
  .headline h1,.premium-shell-r614 .headline h1{font-size:20px!important}
  .headline p{font-size:12px!important}
  .card,.premium-shell-r614 .card{padding:13px!important}
  .kpis,.premium-shell-r614 .kpis,.flow-shell-r615 .kpis{gap:8px!important}
  .kpi,.premium-shell-r614 .kpi{min-height:90px!important;padding:12px!important}
  .kpi b,.premium-shell-r614 .kpi b{font-size:23px!important}

  .btn,.flow-shell-r615 .btn{min-height:44px}
  .btn.sm,.flow-shell-r615 .btn.sm{min-height:40px;padding:9px 11px}
  .field input,.field select,.field textarea,.flow-shell-r615 .field input,.flow-shell-r615 .field select,.flow-shell-r615 .field textarea{min-height:46px;font-size:16px}
  .filters{display:grid;grid-template-columns:1fr;gap:7px}
  .filters input,.filters select{width:100%;min-height:44px}

  .modal{align-items:end!important;padding:0!important;padding-top:var(--ux-safe-top)!important}
  .modal-card,.premium-shell-r614 .modal-card,.flow-shell-r615 .modal-card{width:100%!important;max-width:none!important;max-height:calc(92dvh - var(--ux-safe-top))!important;border-radius:22px 22px 0 0!important;padding:18px 16px calc(18px + var(--ux-safe-bottom))!important;overscroll-behavior:contain}
  .modal-x{position:sticky;top:0;float:inline-end;z-index:3;margin-inline-start:auto;background:#eef3f6}
  .form-grid{grid-template-columns:1fr!important}
  .form-grid .full{grid-column:auto!important}

  .table{min-width:620px!important}
  .table th,.table td{padding:10px 9px!important;font-size:12px}
  .table-wrap{border-radius:12px;box-shadow:inset 14px 0 14px -18px rgba(20,50,66,.35),inset -14px 0 14px -18px rgba(20,50,66,.35)}
  .detail-row{gap:9px;align-items:flex-start}
  .slot-head{align-items:flex-start;flex-wrap:wrap}
  .actions{gap:6px}
  .flow616-context{max-width:100%;overflow:hidden}
  .flow616-crumb{min-width:0}
  .flow616-crumb b{max-width:38vw!important}
  .flow616-next{grid-template-columns:36px minmax(0,1fr)!important;gap:10px!important}
  .flow616-next-icon{width:36px;height:36px;border-radius:11px}
  .flow616-next>.btn{grid-column:1/-1}
  .flow-mobile-dock{left:8px;right:8px;height:60px}
  .toast{inset-inline:10px;max-width:none;bottom:calc(84px + var(--ux-safe-bottom));text-align:start}
}

/* Small phones: avoid compressed two-column KPI cards and topbar collisions. */
@media(max-width:360px){
  .kpis,.premium-shell-r614 .kpis,.flow-shell-r615 .kpis{grid-template-columns:1fr!important}
  .premium-shell-r614 .avatar{display:none}
  .premium-shell-r614 .top-title-box{max-width:42vw}
  .flow616-crumb b{max-width:32vw!important}
}

/* Desktop density and long-screen stability. */
@media(min-width:1200px){
  .premium-shell-r614 .content{padding-inline:30px}
  .modal-card{scrollbar-gutter:stable}
}

/* Respect LTR display without forking the product by country. */
html[dir="ltr"] .developer-rights-card,
html[dir="ltr"] .detail-row,
html[dir="ltr"] .slot-head,
html[dir="ltr"] .flow-command-item,
html[dir="ltr"] .flow-nav-item,
html[dir="ltr"] .flow-action-grid button{text-align:left}
html[dir="ltr"] .nav button.active{box-shadow:inset 3px 0 0 #31c7be}