

/* ===== CONSOLIDATED FROM: mobile-layout-fix.css, case-client-mobile-fix.css, case-client-mobile.css, case-client-mobile-professional-v2.css, clients-mobile-professional-fix.css, mobile-all-pages-final.css, mobile-professional-global-fix.css, mobile-professional-readability-v3.css, mobile-task-case-final-fix.css, task-client-party-typing.css, mobile-keyboard-final-fix.css, sidebar-menu-visibility-fix.css, user-menu-fix.css ===== */
/* ===== mobile-layout-fix.css ===== */
/* Mobile-only layout correction. No desktop styles or application logic are changed. */
@media (max-width:720px){
  html,body{max-width:100%;overflow-x:hidden}
  #app{min-width:0;width:100%}
  .main{min-width:0;width:100%;margin-left:0}
  .topbar{min-width:0;height:auto;min-height:62px;gap:10px;padding:12px 14px;flex-wrap:nowrap}
  .mobile-menu{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;padding:0;border-radius:10px;color:#172554;background:#eef4fb;font-size:22px;line-height:1}
  .search{min-width:0;flex:1;width:auto;max-width:none}
  .top-actions{flex:0 0 auto;gap:6px}
  .icon-btn{padding:9px;width:40px;height:40px}
  .user-chip{padding:10px;font-size:11px;white-space:nowrap}
  .content{width:100%;min-width:0;padding:14px}
  .page-title{width:100%;min-width:0;gap:10px;align-items:stretch}
  .page-title h1,.page-title p{overflow-wrap:anywhere;word-break:normal}
  .page-title .primary,.page-title .secondary{max-width:100%;white-space:normal;line-height:1.35}
  .panel{width:100%;min-width:0;overflow:hidden}
  .panel-head{width:100%;min-width:0;gap:8px;flex-wrap:wrap;align-items:flex-start}
  .panel-head h3,.panel-head span{min-width:0;overflow-wrap:anywhere}
  .toolbar{width:100%;min-width:0;flex-wrap:wrap}
  .toolbar .filter,.toolbar input,.toolbar select{min-width:0;max-width:100%;flex:1 1 150px}
  .form-grid{width:100%;min-width:0;grid-template-columns:minmax(0,1fr)}
  .field,.field.full{min-width:0;grid-column:auto}
  .field input,.field select,.field textarea{max-width:100%;min-width:0;font-size:16px}
  .form-actions{flex-wrap:wrap;justify-content:stretch}
  .form-actions button{flex:1 1 130px;min-width:0}
  .modal{padding:10px}
  .modal-card{width:100%;max-width:100%;max-height:calc(100vh - 20px);overflow:auto;padding:16px}
  .modal-head h3{min-width:0;overflow-wrap:anywhere}
  table{min-width:0!important;width:100%!important;table-layout:fixed}
  th,td{padding:10px 8px;font-size:11px;overflow-wrap:anywhere;word-break:break-word;vertical-align:top}
  th:first-child,td:first-child{width:34%}
  .case-link{overflow-wrap:anywhere;word-break:break-word}
  .table-wrap,.table-responsive{width:100%;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .list-row{min-width:0;align-items:flex-start;padding:12px}
  .list-main{min-width:0;overflow-wrap:anywhere}
  .list-main strong,.list-main small{overflow-wrap:anywhere}
  .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr));min-width:0}
}
@media (max-width:430px){
  .topbar{padding:10px;gap:7px}
  .mobile-menu{flex-basis:38px;width:38px;height:38px}
  .top-actions .icon-btn{display:none}
  .user-chip{max-width:42px;overflow:hidden}
  .content{padding:10px}
  .quick-grid{grid-template-columns:minmax(0,1fr)}
  .page-title h1{font-size:20px}
  .panel-head{padding:13px}
  th,td{padding:9px 6px;font-size:10px}
}

/* ===== case-client-mobile-fix.css ===== */
/* Case & Client — mobile readability fix only. */
@media (max-width:720px){
  #caseClientTable,#caseClientTable tbody,#caseClientTable tr,#caseClientTable td{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important}
  #caseClientTable{table-layout:auto!important;border-collapse:separate!important;border-spacing:0!important;background:transparent!important}
  #caseClientTable thead{display:none!important}
  #caseClientTable tbody tr{margin:0 0 14px!important;padding:14px!important;background:#fff!important;border:1px solid #dce4f0!important;border-radius:14px!important;box-shadow:0 8px 22px rgba(30,58,138,.08)!important;overflow:hidden!important}
  #caseClientTable tbody td{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:14px!important;padding:10px 0!important;border-bottom:1px dashed #e3e8f1!important;text-align:right!important;font-size:14px!important;line-height:1.45!important;overflow-wrap:anywhere!important;word-break:normal!important}
  #caseClientTable tbody td:last-child{border-bottom:0!important;padding-bottom:0!important}
  #caseClientTable tbody td:first-child{padding-top:0!important}
  #caseClientTable tbody td::before{flex:0 0 38%!important;max-width:38%!important;color:#667085!important;font-size:11px!important;font-weight:700!important;letter-spacing:.02em!important;text-align:left!important;text-transform:uppercase!important}
  #caseClientTable tbody td:nth-child(1)::before{content:'Case number'} #caseClientTable tbody td:nth-child(2)::before{content:'Case title'} #caseClientTable tbody td:nth-child(3)::before{content:'Client / party'} #caseClientTable tbody td:nth-child(4)::before{content:'Court'} #caseClientTable tbody td:nth-child(5)::before{content:'Next hearing'} #caseClientTable tbody td:nth-child(6)::before{content:'Status'} #caseClientTable tbody td:nth-child(7)::before{content:'Actions'}
  #caseClientTable .case-link{display:block!important;max-width:62%!important;font-size:16px!important;font-weight:750!important;line-height:1.35!important;overflow-wrap:anywhere!important;word-break:normal!important}
  #caseClientTable .badge{white-space:normal!important;text-align:center!important}
  #caseClientTable button{max-width:100%!important;white-space:normal!important}
  .case-client-page .panel,.case-client-page .panel-body{overflow:visible!important}
}
@media (max-width:430px){
  #caseClientTable tbody tr{padding:12px!important;border-radius:12px!important}
  #caseClientTable tbody td{font-size:13px!important;gap:10px!important}
  #caseClientTable tbody td::before{font-size:10px!important;flex-basis:40%!important;max-width:40%!important}
  #caseClientTable .case-link{font-size:15px!important;max-width:60%!important}
}

/* ===== case-client-mobile.css ===== */
/* Case & Client mobile readability fix — scoped to mobile only. */
@media (max-width:720px){
  #caseClientTable,.case-client-table,.case-client-table table{width:100% !important;min-width:0 !important;table-layout:fixed !important}
  #caseClientTable thead,.case-client-table thead{display:none !important}
  #caseClientTable tbody,.case-client-table tbody{display:block !important;width:100% !important}
  #caseClientTable tr,.case-client-table tr{display:grid !important;grid-template-columns:minmax(92px, .72fr) minmax(0, 1.28fr) !important;gap:0 14px !important;width:100% !important;padding:16px 14px !important;margin:0 !important;border-bottom:1px solid #e5eaf2 !important;background:#fff !important}
  #caseClientTable td,.case-client-table td{display:block !important;width:auto !important;min-width:0 !important;padding:7px 0 !important;border:0 !important;font-size:13px !important;line-height:1.45 !important;overflow-wrap:anywhere !important;word-break:normal !important;white-space:normal !important;color:#24324a !important}
  #caseClientTable td:first-child,.case-client-table td:first-child{grid-column:1 !important;grid-row:1 / span 6 !important;align-self:start !important;font-size:18px !important;font-weight:800 !important;line-height:1.35 !important;color:#172554 !important;padding-top:2px !important;overflow-wrap:break-word !important}
  #caseClientTable td:nth-child(n+2),.case-client-table td:nth-child(n+2){grid-column:2 !important}
  #caseClientTable td:nth-child(2),.case-client-table td:nth-child(2){font-weight:650 !important;font-size:14px !important;color:#243f7a !important}
  #caseClientTable td:last-child,.case-client-table td:last-child{padding-bottom:0 !important}
  #caseClientTable .case-link,.case-client-table .case-link{display:block !important;overflow-wrap:anywhere !important;word-break:normal !important}
  #caseClientTable .badge,.case-client-table .badge{display:inline-flex !important;max-width:100% !important;white-space:normal !important}
  #caseClientTable button,.case-client-table button{max-width:100% !important;min-height:40px !important;white-space:normal !important}
  #caseClientTable + *,.case-client-table + *{max-width:100% !important}
}
@media (max-width:430px){
  #caseClientTable tr,.case-client-table tr{grid-template-columns:minmax(76px,.62fr) minmax(0,1.38fr) !important;padding:14px 10px !important;gap:0 10px !important}
  #caseClientTable td,.case-client-table td{font-size:12px !important;padding:6px 0 !important}
  #caseClientTable td:first-child,.case-client-table td:first-child{font-size:16px !important}
}

/* ===== case-client-mobile-professional-v2.css ===== */
/* Final Case & Client mobile readability fix. Scoped only to Case & Client. */
@media (max-width:720px){
  .case-client-page{width:100%!important;max-width:100%!important;min-width:0!important;overflow:visible!important}
  .case-client-page .panel,.case-client-page .panel-body,.case-client-page .table-wrap,.case-client-page .table-container{width:100%!important;max-width:100%!important;min-width:0!important;overflow:visible!important}
  #caseClientTable{display:block!important;width:100%!important;max-width:100%!important;table-layout:auto!important;border:0!important;border-spacing:0!important}
  #caseClientTable thead{display:none!important}
  #caseClientTable tbody{display:block!important;width:100%!important}
  #caseClientTable tbody tr{display:block!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important;margin:0 0 16px!important;padding:16px!important;background:#fff!important;border:1px solid #dbe4f0!important;border-radius:16px!important;box-shadow:0 6px 18px rgba(15,35,75,.07)!important;overflow:hidden!important}
  #caseClientTable tbody td{display:grid!important;grid-template-columns:minmax(94px,38%) minmax(0,1fr)!important;align-items:start!important;gap:12px!important;width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;padding:11px 0!important;margin:0!important;text-align:left!important;white-space:normal!important;overflow:visible!important;border:0!important;border-bottom:1px dashed #e1e7f0!important;font-size:15px!important;line-height:1.45!important;word-break:normal!important;overflow-wrap:anywhere!important}
  #caseClientTable tbody td:last-child{border-bottom:0!important;padding-bottom:0!important}
  #caseClientTable tbody td::before{grid-column:1!important;display:block!important;min-width:0!important;max-width:none!important;flex:none!important;color:#64748b!important;font-size:11px!important;font-weight:800!important;line-height:1.35!important;letter-spacing:.04em!important;text-transform:uppercase!important;text-align:left!important;white-space:normal!important;overflow-wrap:normal!important;word-break:normal!important}
  #caseClientTable tbody td > *{grid-column:2!important;min-width:0!important;max-width:100%!important;width:auto!important;box-sizing:border-box!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important}
  #caseClientTable tbody td > span,#caseClientTable tbody td > a,#caseClientTable tbody td > div{display:block!important}
  #caseClientTable .case-link{display:block!important;max-width:100%!important;width:auto!important;font-size:20px!important;line-height:1.25!important;font-weight:800!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important}
  #caseClientTable .badge{display:inline-flex!important;width:max-content!important;max-width:100%!important;white-space:normal!important;text-align:center!important}
  #caseClientTable button{width:auto!important;max-width:100%!important;min-height:44px!important;white-space:normal!important}
}
@media (max-width:430px){
  #caseClientTable tbody tr{padding:14px!important;border-radius:14px!important}
  #caseClientTable tbody td{grid-template-columns:minmax(88px,36%) minmax(0,1fr)!important;gap:10px!important;font-size:14px!important}
  #caseClientTable .case-link{font-size:18px!important}
}

/* ===== clients-mobile-professional-fix.css ===== */
/* Client list mobile readability fix. Scoped to Case & Client only. */
@media (max-width:720px){
  .case-client-page table:not(#caseClientTable){display:block!important;width:100%!important;max-width:100%!important;table-layout:auto!important;border:0!important;border-spacing:0!important;background:transparent!important}
  .case-client-page table:not(#caseClientTable) thead{display:none!important}
  .case-client-page table:not(#caseClientTable) tbody{display:block!important;width:100%!important}
  .case-client-page table:not(#caseClientTable) tbody tr{display:block!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important;margin:0 0 16px!important;padding:14px 16px!important;background:#fff!important;border:1px solid #dbe4f0!important;border-radius:16px!important;box-shadow:0 6px 18px rgba(15,35,75,.07)!important;overflow:hidden!important}
  .case-client-page table:not(#caseClientTable) tbody td{display:grid!important;grid-template-columns:minmax(112px,38%) minmax(0,1fr)!important;gap:12px!important;align-items:start!important;width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;padding:11px 0!important;margin:0!important;text-align:left!important;white-space:normal!important;border:0!important;border-bottom:1px dashed #e1e7f0!important;font-size:15px!important;line-height:1.45!important;overflow:visible!important;word-break:normal!important;overflow-wrap:anywhere!important}
  .case-client-page table:not(#caseClientTable) tbody td:last-child{border-bottom:0!important;padding-bottom:0!important}
  .case-client-page table:not(#caseClientTable) tbody td::before{grid-column:1!important;display:block!important;min-width:0!important;max-width:none!important;color:#64748b!important;font-size:11px!important;font-weight:800!important;line-height:1.35!important;letter-spacing:.04em!important;text-transform:uppercase!important;text-align:left!important;white-space:normal!important;overflow-wrap:normal!important;word-break:normal!important}
  .case-client-page table:not(#caseClientTable) tbody td > *{grid-column:2!important;min-width:0!important;max-width:100%!important;width:auto!important;box-sizing:border-box!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important}
  .case-client-page table:not(#caseClientTable) tbody td > span,.case-client-page table:not(#caseClientTable) tbody td > a,.case-client-page table:not(#caseClientTable) tbody td > div{display:block!important}
  .case-client-page table:not(#caseClientTable) tbody td:nth-child(1)::before{content:'Client'}
  .case-client-page table:not(#caseClientTable) tbody td:nth-child(2)::before{content:'Phone / WhatsApp'}
  .case-client-page table:not(#caseClientTable) tbody td:nth-child(3)::before{content:'Email'}
  .case-client-page table:not(#caseClientTable) tbody td:nth-child(4)::before{content:'Cases'}
  .case-client-page table:not(#caseClientTable) tbody td:nth-child(5)::before{content:'Status'}
  .case-client-page table:not(#caseClientTable) tbody td:nth-child(6)::before{content:'Action'}
  .case-client-page table:not(#caseClientTable) tbody td:first-child > *{font-weight:800!important;font-size:17px!important;color:#172554!important}
  .case-client-page table:not(#caseClientTable) button{width:auto!important;max-width:100%!important;min-height:44px!important;white-space:normal!important}
}
@media (max-width:430px){
  .case-client-page table:not(#caseClientTable) tbody tr{padding:12px 14px!important;border-radius:14px!important}
  .case-client-page table:not(#caseClientTable) tbody td{grid-template-columns:minmax(104px,36%) minmax(0,1fr)!important;gap:10px!important;font-size:14px!important}
  .case-client-page table:not(#caseClientTable) tbody td::before{font-size:10px!important}
}

/* ===== mobile-all-pages-final.css ===== */
/* Mobile-only layout stabilization. Desktop styles and app functions remain unchanged. */
@media (max-width:720px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  #app,.main,.content{min-width:0;max-width:100%;width:100%}
  .content{padding:16px 14px 28px}
  .topbar{height:auto;min-height:68px;gap:10px;flex-wrap:nowrap;padding:12px 14px}
  .mobile-menu{flex:0 0 44px;width:44px;height:44px;border-radius:12px;background:#eef4fb;color:#172554;display:grid;place-items:center;font-size:25px;line-height:1}
  .search{flex:1 1 auto;min-width:0;width:auto;height:44px}
  .search input{min-width:0;font-size:14px}
  .top-actions{flex:0 0 auto;min-width:0}
  .icon-btn{display:none}
  .user-chip{max-width:44px;overflow:hidden;white-space:nowrap;padding:10px}
  .page-title{display:flex;flex-direction:column;gap:12px;margin-bottom:18px}
  .page-title h1{font-size:24px;line-height:1.2;overflow-wrap:anywhere}
  .page-title p{font-size:14px;line-height:1.45;overflow-wrap:anywhere}
  .page-title .primary{width:100%;min-height:48px;font-size:16px}
  .toolbar{display:grid;grid-template-columns:1fr;gap:10px;width:100%}
  .toolbar>*{width:100%;min-width:0}
  .panel{width:100%;max-width:100%;min-width:0;overflow:hidden}
  .panel-head{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-start;padding:15px}
  .panel-head>div{min-width:0;flex:1 1 180px}
  .panel-head h3,.panel-head span{overflow-wrap:anywhere}
  .panel-head button{max-width:100%;white-space:normal}
  .form-grid{grid-template-columns:1fr!important;gap:12px}
  .field,.field.full{grid-column:auto!important;min-width:0}
  .field label{font-size:12px}
  .field input,.field select,.field textarea{min-height:44px;font-size:16px;max-width:100%}
  .form-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .form-actions button{width:100%;min-height:44px}
  .cards{grid-template-columns:1fr!important;gap:12px}
  .stat{min-height:130px}
  .grid-2{grid-template-columns:1fr!important;gap:14px}
  .quick-grid{grid-template-columns:1fr!important}
  .quick{min-height:90px}
  .list-row{align-items:flex-start;gap:10px;padding:12px}
  .list-main{min-width:0;overflow-wrap:anywhere}
  .list-main strong,.list-main small{overflow-wrap:anywhere;white-space:normal}
  .badge{max-width:100%;white-space:normal;text-align:center}
  table{min-width:0!important;width:100%!important;table-layout:fixed!important}
  th,td{padding:10px 8px;font-size:12px;overflow-wrap:anywhere;word-break:normal}
  .table-wrap,.table-container,.panel-body{max-width:100%;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .modal{padding:10px}
  .modal-card{width:100%;max-width:100%;max-height:92vh;overflow-y:auto;padding:16px;border-radius:14px}
  .modal-head h3{font-size:17px;overflow-wrap:anywhere}
  .same-day-calendar,.dashboard-calendar{width:100%;max-width:100%;min-width:0}
  .dash-cal-weekdays,.dash-cal-grid{max-width:100%}
  .dash-cal-day{min-width:0}
  .report-view,.report-container{max-width:100%;min-width:0;overflow-x:auto}
  .invoice-actions,.case-actions,.action-buttons{display:flex;flex-wrap:wrap;gap:8px}
  .invoice-actions button,.case-actions button,.action-buttons button{min-height:42px;max-width:100%}
}
@media (max-width:430px){
  .content{padding:14px 12px 24px}
  .topbar{padding:10px 12px;gap:8px}
  .mobile-menu{flex-basis:42px;width:42px;height:42px}
  .page-title h1{font-size:22px}
  .panel-head{padding:13px}
  th,td{padding:9px 7px;font-size:11px}
  .field input,.field select,.field textarea{font-size:16px}
}

/* ===== mobile-professional-global-fix.css ===== */
/* Global mobile readability fix - presentation only. Desktop and app logic untouched. */
@media (max-width:720px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  #app,.main,.content{width:100%;max-width:100%;min-width:0}
  .main{overflow-x:hidden}
  .content{padding:16px 12px!important}
  .topbar{width:100%;min-width:0;padding:10px 12px!important;gap:8px;flex-wrap:nowrap}
  .topbar>*{min-width:0}
  .mobile-menu{flex:0 0 44px;width:44px;height:44px;display:grid!important;place-items:center;font-size:24px!important;border-radius:10px;background:#eef3fa!important;color:#172554!important}
  .search{flex:1 1 auto;width:auto!important;min-width:0!important}
  .search input{min-width:0!important;width:100%!important;font-size:14px!important}
  .top-actions{flex:0 0 auto;min-width:0}
  .user-chip{max-width:44px;overflow:hidden;white-space:nowrap}
  .page-title{width:100%;min-width:0;gap:12px;align-items:flex-start}
  .page-title h1,.page-title p{max-width:100%;overflow-wrap:anywhere;word-break:normal}
  .page-title h1{font-size:24px!important;line-height:1.2!important}
  .page-title p{font-size:14px!important;line-height:1.5!important}
  .page-title .primary,.page-title .secondary{max-width:100%;white-space:normal;overflow-wrap:anywhere}
  .panel,.panel-head,.panel-body,.card,.cards,.grid-2,.form-grid,.toolbar,.list,.list-row,.quick-grid{min-width:0;max-width:100%}
  .panel{overflow:hidden!important}
  .panel-head{gap:10px;flex-wrap:wrap;align-items:flex-start;padding:14px!important}
  .panel-head h3,.panel-head span{max-width:100%;overflow-wrap:anywhere;white-space:normal;line-height:1.4}
  .toolbar{flex-wrap:wrap;align-items:stretch}
  .toolbar>*{min-width:0;max-width:100%}
  .toolbar .filter:first-child{flex:1 1 100%;width:100%}
  input,select,textarea{max-width:100%;min-width:0;font-size:16px!important}
  .form-grid{gap:12px}
  .field{min-width:0}
  .field label{line-height:1.4}
  .form-actions{flex-wrap:wrap;justify-content:stretch}
  .form-actions button{flex:1 1 140px;min-height:44px;white-space:normal}
  .primary,.secondary{min-height:44px;line-height:1.35;white-space:normal;overflow-wrap:anywhere}
  table{width:100%;min-width:0!important;table-layout:fixed}
  th,td{white-space:normal!important;overflow-wrap:anywhere;word-break:normal;line-height:1.45;padding:10px 8px!important}
  .table-wrap,.table-container{width:100%;max-width:100%;overflow-x:auto!important;-webkit-overflow-scrolling:touch}
  .table-wrap table,.table-container table{min-width:620px!important;table-layout:auto}
  .case-link{white-space:normal!important;overflow-wrap:anywhere;word-break:normal;line-height:1.35}
  .badge{max-width:100%;white-space:normal!important;text-align:center;line-height:1.3}
  button{max-width:100%;white-space:normal;overflow-wrap:anywhere}
  .modal{padding:10px!important;align-items:center}
  .modal-card{width:100%!important;max-width:100%!important;max-height:92vh;overflow:auto;padding:16px!important}
  .modal-head{gap:10px;align-items:flex-start}
  .modal-head h3{min-width:0;overflow-wrap:anywhere;line-height:1.3}
  .stat-value{font-size:26px!important;overflow-wrap:anywhere}
  .list-row{align-items:flex-start;flex-wrap:nowrap}
  .list-main{min-width:0}
  .list-main strong,.list-main small{overflow-wrap:anywhere;word-break:normal;line-height:1.4}
  #caseClientTable tbody td,#clientsTable tbody td{display:grid!important;grid-template-columns:minmax(105px,34%) minmax(0,1fr)!important;align-items:start!important;gap:12px!important;text-align:left!important;white-space:normal!important;word-break:normal!important;overflow-wrap:anywhere!important}
  #caseClientTable tbody td::before,#clientsTable tbody td::before{width:auto!important;min-width:0!important;white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important;line-height:1.35!important}
  #caseClientTable tbody td>*,#clientsTable tbody td>*{grid-column:2!important;min-width:0!important;max-width:100%!important;width:auto!important;text-align:left!important;white-space:normal!important;word-break:normal!important;overflow-wrap:anywhere!important}
  #caseClientTable .case-link{font-size:20px!important;line-height:1.3!important}
  #caseClientTable tbody tr,#clientsTable tbody tr{width:100%!important;max-width:100%!important;box-sizing:border-box!important;overflow:hidden!important}
}
@media (max-width:430px){
  .content{padding:14px 10px!important}
  .topbar{padding:8px 10px!important}
  .page-title h1{font-size:22px!important}
  #caseClientTable tbody td,#clientsTable tbody td{grid-template-columns:minmax(92px,32%) minmax(0,1fr)!important;gap:10px!important;font-size:14px!important}
  #caseClientTable .case-link{font-size:18px!important}
}
@media (max-width:720px){
  .modal{display:flex!important;align-items:flex-start!important;justify-content:center!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;padding:10px 10px max(12px,env(safe-area-inset-bottom))!important}
  .modal-card{width:100%!important;max-width:650px!important;max-height:calc(100dvh - 20px)!important;margin:0 auto!important;overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior:contain;padding:18px!important}
  #modalBody{min-width:0!important}
  .modal-head{position:sticky;top:-18px;z-index:3;background:#fff;padding:2px 0 12px}
  .modal-card input,.modal-card select,.modal-card textarea{font-size:16px!important}
  .modal-card .form-actions{position:sticky;bottom:-18px;z-index:3;background:#fff;padding:12px 0 2px}
}
@supports not (height:100dvh){@media(max-width:720px){.modal-card{max-height:calc(100vh - 20px)!important}}}

/* ===== mobile-professional-readability-v3.css ===== */
/* Professional mobile readability normalization. Scoped to mobile presentation only. */
@media (max-width:720px){
  *,*::before,*::after{box-sizing:border-box}
  html,body{overflow-x:hidden!important}
  .content,.content *{min-width:0}
  h1,h2,h3,h4,h5,h6,p,span,label,button,a,th,td{overflow-wrap:normal;word-break:normal}
  .page-title,.panel-head,.panel-body,.card,.panel,.section,.toolbar{max-width:100%;min-width:0}
  .panel-head h3,.panel-head p,.page-title h1,.page-title p{white-space:normal;line-height:1.35}
  .panel-head button,.toolbar button,.primary,.secondary{white-space:normal;overflow-wrap:normal;line-height:1.3}
  .detail-row,.detail-item,.info-row,.summary-row,.record-row{display:grid!important;grid-template-columns:minmax(112px,34%) minmax(0,1fr)!important;gap:14px!important;align-items:start!important;width:100%!important;max-width:100%!important}
  .detail-row>*,.detail-item>*,.info-row>*,.summary-row>*,.record-row>*{min-width:0!important;max-width:100%!important;white-space:normal!important;overflow-wrap:break-word!important;word-break:normal!important}
  .detail-label,.info-label,.summary-label,.record-label{font-size:12px!important;line-height:1.4!important;letter-spacing:.04em!important;white-space:normal!important}
  .detail-value,.info-value,.summary-value,.record-value{font-size:15px!important;line-height:1.5!important;text-align:left!important}
  .table-wrap,.table-container{width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:visible!important}
  .table-wrap table,.table-container table{table-layout:auto!important;width:100%!important;min-width:560px!important}
  .table-wrap th,.table-wrap td,.table-container th,.table-container td{white-space:normal!important;word-break:normal!important;overflow-wrap:break-word!important;vertical-align:top!important;line-height:1.45!important}
  .table-wrap th,.table-container th{font-size:12px!important}
  .table-wrap td,.table-container td{font-size:14px!important}
  .case-card,.client-card,.record-card,.detail-card{width:100%!important;max-width:100%!important;overflow:hidden!important}
  .case-card .label,.client-card .label{white-space:normal!important;word-break:normal!important}
  input,select,textarea{max-width:100%!important;width:100%;font-size:16px!important}
  .modal-card{width:100%!important;max-width:100%!important}
}
@media (max-width:430px){
  .detail-row,.detail-item,.info-row,.summary-row,.record-row{grid-template-columns:minmax(100px,36%) minmax(0,1fr)!important;gap:10px!important}
  .detail-value,.info-value,.summary-value,.record-value{font-size:14px!important}
}

/* ===== mobile-task-case-final-fix.css ===== */
/* Final mobile card alignment fix for Task, Case and Client lists */
@media (max-width:720px){
  html,body{max-width:100%;overflow-x:hidden}
  #content,.content,.panel{min-width:0;max-width:100%}
  #taskTable,#caseTable,#clientTable{display:block!important;width:100%!important;min-width:0!important;table-layout:fixed!important;border-collapse:separate!important;border-spacing:0!important}
  #taskTable thead,#caseTable thead,#clientTable thead{display:none!important}
  #taskTable tbody,#caseTable tbody,#clientTable tbody{display:block!important;width:100%!important}
  #taskTable tbody tr,#caseTable tbody tr,#clientTable tbody tr{display:block!important;width:100%!important;box-sizing:border-box!important;margin:0 0 14px!important;padding:14px 16px!important;border:1px solid var(--line)!important;border-radius:16px!important;background:#fff!important;box-shadow:0 5px 16px rgba(30,58,138,.06)!important}
  #taskTable tbody td,#caseTable tbody td,#clientTable tbody td{display:grid!important;grid-template-columns:minmax(108px,34%) minmax(0,1fr)!important;gap:12px!important;align-items:start!important;width:100%!important;min-width:0!important;max-width:none!important;box-sizing:border-box!important;padding:12px 0!important;border-bottom:1px dashed #dfe6f0!important;text-align:left!important;white-space:normal!important;overflow:visible!important}
  #taskTable tbody td:last-child,#caseTable tbody td:last-child,#clientTable tbody td:last-child{border-bottom:0!important;padding-bottom:2px!important}
  #taskTable tbody td::before,#caseTable tbody td::before,#clientTable tbody td::before{grid-column:1!important;display:block!important;width:auto!important;max-width:none!important;min-width:0!important;white-space:normal!important;overflow-wrap:normal!important;word-break:normal!important;line-height:1.45!important}
  #taskTable tbody td>*:not(.compound-value),#caseTable tbody td>*:not(.compound-value),#clientTable tbody td>*:not(.compound-value){grid-column:2!important;width:100%!important;max-width:none!important;min-width:0!important;white-space:normal!important;overflow-wrap:break-word!important;word-break:normal!important;line-height:1.5!important}
  #taskTable .compound-value,#caseTable .compound-value,#clientTable .compound-value{grid-column:2!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:3px!important;width:100%!important;min-width:0!important;max-width:none!important}
  #taskTable .compound-value strong,#taskTable .compound-value span,#caseTable .compound-value strong,#caseTable .compound-value span,#clientTable .compound-value strong,#clientTable .compound-value span{display:block!important;width:100%!important;max-width:none!important;min-width:0!important;white-space:normal!important;overflow-wrap:break-word!important;word-break:normal!important;line-height:1.45!important}
  #taskTable tbody td:last-child>button,#caseTable tbody td:last-child>button,#clientTable tbody td:last-child>button{grid-column:2!important;width:100%!important;max-width:none!important;min-height:44px!important}
  #taskTable .badge,#caseTable .badge,#clientTable .badge{justify-self:start!important;width:max-content!important;max-width:100%!important}
  .panel:has(#taskTable),.panel:has(#caseTable),.panel:has(#clientTable){overflow:visible!important}
}
@media(max-width:380px){
  #taskTable tbody td,#caseTable tbody td,#clientTable tbody td{grid-template-columns:minmax(94px,32%) minmax(0,1fr)!important;gap:10px!important;padding:11px 0!important}
}

/* ===== task-client-party-typing.css ===== */
/* Task module only: searchable client/party field */
.client-party-typeahead{width:100%;min-width:0;box-sizing:border-box;padding:12px 14px;border:1px solid #d9e2f1;border-radius:12px;background:#fff;color:#172554;font:inherit;line-height:1.4;}
.client-party-typeahead:focus{outline:2px solid rgba(37,99,235,.22);border-color:#2563eb;}
@media(max-width:720px){.client-party-typeahead{font-size:16px;min-height:46px;}}

/* ===== mobile-keyboard-final-fix.css ===== */
/* Global mobile keyboard-safe layout. Presentation only; no record logic changed. */
@supports (height: 100dvh){@media (max-width:720px){.modal{min-height:100dvh!important;max-height:100dvh!important}}}
@media (max-width:720px){
  html,body{max-width:100%;overflow-x:hidden!important}
  .modal{position:fixed!important;inset:0!important;display:flex!important;align-items:flex-start!important;justify-content:center!important;box-sizing:border-box!important;overflow-y:auto!important;padding:8px 8px calc(16px + env(safe-area-inset-bottom))!important;overscroll-behavior:contain!important}
  .modal.hidden{display:none!important}
  .modal-card{box-sizing:border-box!important;width:100%!important;max-width:680px!important;max-height:calc(100dvh - 16px)!important;height:auto!important;margin:0!important;overflow-x:hidden!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;transform:none!important}
  #modalBody{min-width:0!important;overflow:visible!important;padding-bottom:12px!important}
  .modal-card form{min-width:0!important}
  .modal-card input,.modal-card select,.modal-card textarea{box-sizing:border-box!important;max-width:100%!important;min-width:0!important;font-size:16px!important;line-height:1.4!important;scroll-margin-top:72px!important;scroll-margin-bottom:140px!important}
  .modal-card button{max-width:100%!important;min-height:40px!important;height:auto!important;touch-action:manipulation}
  .modal-card .modal-actions,.modal-card .form-actions,.modal-card .actions{display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:8px!important}
  .modal-card .modal-actions button,.modal-card .form-actions button,.modal-card .actions button{flex:0 1 auto!important;width:auto!important}
}
@media (max-width:430px){.modal{padding-left:6px!important;padding-right:6px!important}.modal-card{padding:14px!important;border-radius:18px!important}}
#modalBody input[placeholder="Type court name..."]{display:none!important}

/* ===== sidebar-menu-visibility-fix.css ===== */
/* Sidebar menu visibility fix only. No navigation or application logic changes. */
.sidebar{overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;}
.sidebar .brand,.sidebar nav,.sidebar-bottom{flex-shrink:0;}
.sidebar-bottom{margin-top:20px;padding-bottom:8px;}

/* ===== user-menu-fix.css ===== */
/* Professional account menu: keep logout away from accidental single clicks. */
.top-actions{position:relative;display:flex;align-items:center;gap:10px}
.user-chip{position:relative;z-index:1001;cursor:pointer}
.profile-menu{display:none;position:absolute;right:0;top:calc(100% + 10px);width:230px;background:#fff;border:1px solid #dbe3f0;border-radius:12px;box-shadow:0 16px 40px rgba(15,23,42,.16);padding:8px;z-index:2000}
.profile-menu.open{display:block}
.profile-menu-head{padding:10px 12px 12px;border-bottom:1px solid #edf1f7;margin-bottom:5px}
.profile-menu-head strong{display:block;color:#172033;font-size:14px}
.profile-menu-head small{display:block;color:#71809a;font-size:12px;margin-top:3px}
.profile-menu-item{width:100%;display:flex;align-items:center;gap:8px;border:0;background:transparent;border-radius:8px;padding:10px 12px;text-align:left;cursor:pointer;color:#25324a;font-size:14px}
.profile-menu-item:hover{background:#f3f6fb}
.profile-menu-item.danger{color:#b42318}
.profile-menu-item.danger:hover{background:#fff1f0}
.sidebar-user-note{display:flex;align-items:center;gap:9px;padding:12px 14px;margin-top:8px;color:#b8c7e5;font-size:12px;border-top:1px solid rgba(255,255,255,.12)}
.sidebar-user-note strong{display:block;color:#e7eefc;font-size:12px}
@media(max-width:720px){.profile-menu{right:0;width:210px}}
.topbar{position:sticky;}
.topbar .top-actions{margin-left:auto!important;margin-right:0!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;position:relative!important;flex:0 0 auto!important;}
.topbar .user-chip{margin-left:0!important;}
@media(max-width:720px){.topbar .top-actions{margin-left:auto!important;margin-right:0!important;}}