/* Named mobile controls; secondary actions live in the account/menu surfaces. */
.mobile-global-search, .mobile-theme-toggle, .mobile-add-lead { display: none; }
@media (max-width:768px), (max-width:1080px) and (max-height:500px) and (orientation:landscape) {
  .app .topbar { gap: 8px; padding-inline: max(8px, env(safe-area-inset-left)); }
  .app .topbar-search, .app .topbar-actions > .theme-toggle { display: none; }
  /* Add lead stays one tap away on phones: a 44px "+" whose name is "Add lead". */
  .app .topbar-add-lead { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 10px; box-sizing: border-box; flex: 0 0 auto; }
  .app .topbar-add-lead .btn-label { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .app .mobile-global-search { display: inline-flex; min-height: 44px; }
  .app .mobile-theme-toggle, .app .mobile-add-lead { display: flex; min-height: 44px; }
  .app .topbar-actions { gap: 8px; min-width: 0; }
  .app .hamburger, .app .usermenu-trigger, .app .sidebar-close { min-width: 44px; min-height: 44px; }
  .app .content { padding: 12px max(12px, env(safe-area-inset-right)) calc(16px + env(safe-area-inset-bottom)); min-width: 0; }
  .app .sidebar { max-width: calc(100vw - 44px); padding-bottom: env(safe-area-inset-bottom); }
  .app .usermenu-pop { max-width: calc(100vw - 24px); }
  .app input:not([type=checkbox]):not([type=radio]), .app select, .app textarea { font-size: 16px; min-height: 44px; max-width: 100%; box-sizing: border-box; }
  .app .btn, .app button:not(.row-check), .app summary { min-height: 44px; }
  .app .detail-grid, .app .card, .app .kv dd { min-width: 0; overflow-wrap: anywhere; }
  .app :focus-visible { scroll-margin-block: calc(var(--topbar-h) + 8px) 20px; }
  .app .move-list { bottom: max(12px, env(safe-area-inset-bottom)); max-height: 60dvh; }
  #task-board .cell-title { width: 180px; max-width: 180px; }
  #task-board .task-open { min-width: 44px; min-height: 44px; }
}
/* Contrast targets for the mobile working surfaces, without changing branding. */
@media (max-width:768px), (max-width:1080px) and (max-height:500px) and (orientation:landscape){
  [data-theme=light] .app { --muted:#435363; --faint:#435363; }
  [data-theme=dark] .app { --muted:#c1cede; --faint:#c1cede; }
  .app .btn-primary, .app button.primary { background:var(--accent); border-color:var(--accent); color:var(--on-accent); }
  #lead-board .group-label { color:var(--text); }
  #lead-board .board-clear-filters[hidden] { display:none; }
  #lead-board .lead-card-more > summary { display:flex; align-items:center; min-height:44px; }
}
.global-search-form { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:16px; }
.global-search-form label { flex-basis:100%; }
.global-search-form input { flex:1; min-width:0; }
@media (max-width:768px), (max-width:1080px) and (max-height:500px) and (orientation:landscape){
  .app .topbar { flex-wrap:wrap; height:auto; min-height:60px; padding-left:max(8px,env(safe-area-inset-left)); padding-right:max(8px,env(safe-area-inset-right)); }
  .app .mobile-global-search { max-width:calc(100% - 60px); white-space:normal; }
  .app .content { padding-left:max(12px,env(safe-area-inset-left)); padding-right:max(12px,env(safe-area-inset-right)); }
  .app .notifbell-trigger { min-width:44px; min-height:44px; box-sizing:border-box; }
  .app .listing-section-nav a,.app .search-results li a { display:inline-flex; align-items:center; min-height:44px; }
  .app input::placeholder,.app textarea::placeholder { color:var(--muted); opacity:1; }
  #lead-board .row-select-target { display:flex; align-items:center; justify-content:center; width:44px; height:44px; flex-shrink:0; cursor:pointer; }
  #lead-board .row-select-target .row-check { width:24px; height:24px; margin:0; }
  #lead-board .board-toolbar > .loading-dot { position:absolute; right:16px; pointer-events:none; }
}
.task-filter-fields { display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; }
.mobile-task-select-label { display:none; }
@media (max-width:768px), (max-width:1080px) and (max-height:500px) and (orientation:landscape){
  #task-board .board-toolbar { display:grid; grid-template-columns:minmax(0,1fr); }
  #task-board .task-filter-fields { display:grid; grid-template-columns:minmax(0,1fr); }
  #task-board .task-filter-disclosure .col-menu { display:none; }
  #task-board .save-view-form { position:static; min-width:0; width:100%; box-sizing:border-box; }
  #task-board .board-scroll { overflow:visible; max-height:none; border:0; }
  #task-board #board-table { display:block; min-width:0!important; width:100%!important; }
  #task-board #board-table colgroup { display:none; }
  #task-board #board-table thead,#task-board #board-table thead tr { display:block; }
  #task-board #board-table thead th:not(.col-check) { display:none; }
  #task-board #board-table thead th.col-check { position:static; display:flex; background:transparent; }
  #task-board .task-select-all { display:flex; align-items:center; gap:8px; min-height:44px; }
  #task-board .mobile-task-select-label { display:inline; }
  #task-board #board-table tbody { display:block; }
  #task-board #board-table tr.board-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); margin-bottom:12px; padding:8px; border:1px solid var(--border); border-radius:var(--r); background:var(--surface); }
  #task-board #board-table tr.board-row td { display:block; position:static; min-width:0; max-width:none; white-space:normal; overflow-wrap:anywhere; padding:4px; border:0; }
  #task-board #board-table tr.board-row td[data-label]::before { content:attr(data-label); display:block; font-size:.8rem; color:var(--muted); margin-bottom:4px; }
  #task-board #board-table tr.board-row .col-task { grid-column:1/-1; order:0; }
  #task-board #board-table tr.board-row .col-task::before { display:none; }
  #task-board #board-table tr.board-row .col-check { grid-column:2; order:1; justify-self:end; }
  #task-board #board-table tr.board-row .col-status { grid-column:1; grid-row:2; order:2; }
  #task-board #board-table tr.board-row .col-people { order:3; }
  #task-board #board-table tr.board-row td:not(.col-check):not(.col-task):not(.col-status):not(.col-people) { order:4; }
  #task-board .cell-title { width:auto; max-width:none; }
  #task-board .row-select-target { display:flex; align-items:center; justify-content:center; width:44px; height:44px; }
  #task-board .row-select-target .row-check { width:24px; height:24px; }
  #task-board #board-table .group-head th { position:static; }
  #task-board .move-menu > summary { display:inline-flex; align-items:center; min-height:44px; white-space:normal; }
}
@media(min-width:769px){.task-filter-disclosure > summary{display:none}}

@media (max-width:768px), (max-width:1080px) and (max-height:500px) and (orientation:landscape){
  [data-theme=light] .app { --warn:#674016; --ok:#125535; --bad:#8a241f; }
  .app .chip { color:var(--text); }
  .app :focus-visible { outline:3px solid var(--focus-ring); outline-offset:2px; }
  #compact-status-menu .compact-status-menu-item:focus-visible { outline:3px solid var(--focus-ring); outline-offset:-3px; }
}

.mobile-task-people { display:none; }
@media (max-width:768px), (max-width:1080px) and (max-height:500px) and (orientation:landscape){#task-board .mobile-task-people{display:block} #task-board .col-people .avatars{display:none} #task-board .col-sticky-2{box-shadow:none}}

/* Keep shared header controls within the content column when text grows. */
.app .topbar { flex-wrap:wrap; height:auto; min-height:60px; padding-block:8px; }
.app .topbar-search { min-width:0; flex-basis:220px; }
.app .topbar-search input { min-width:0; box-sizing:border-box; }
.app .topbar-actions { min-width:0; max-width:100%; flex-wrap:wrap; }
.app .admin-view-switch { min-width:0; max-width:100%; flex-wrap:wrap; }
.app .admin-view-switch label { white-space:normal; }
.app .admin-view-switch select { min-width:0; max-width:100%; }
.app .topbar .btn { max-width:100%; white-space:normal; overflow-wrap:anywhere; }
@media (min-width:769px) and (max-width:1080px) {
  .app .topbar-search, .app .topbar-add-lead, .app .topbar-actions > .theme-toggle, .app .admin-view-switch { display:none; }
  .app .mobile-global-search { display:inline-flex; min-height:44px; }
  .app .mobile-theme-toggle, .app .mobile-add-lead { display:flex; min-height:44px; }
  .app .admin-view-menu { display:block; }
  .app .notifbell-trigger, .app .usermenu-trigger { min-width:44px; min-height:44px; }
}
.app .usermenu-pop, .app .notifbell-pop { max-height:60dvh; overflow-y:auto; box-sizing:border-box; }
@media (min-width:769px) and (max-width:1080px) {
  .app .admin-view-menu select, .app .usermenu-item { min-height:44px; max-width:100%; white-space:normal; overflow-wrap:anywhere; }
}

/* A wide phone in landscape still needs a drawer, not the desktop sidebar.
   Keep the CSS and appShell media query aligned through rotation. */
@media (min-width:769px) and (max-width:1080px) and (max-height:500px) and (orientation:landscape) {
  .app .sidebar { transform:translateX(-100%); transition:transform .22s ease; box-shadow:var(--shadow-pop); }
  .app .sidebar.is-open { transform:translateX(0); }
  .app .sidebar-close, .app .hamburger { display:inline-flex; }
  .app .app-main { margin-left:0; }
  .app .app-scrim { display:block; position:fixed; inset:0; background:var(--scrim); z-index:55; opacity:0; pointer-events:none; transition:opacity .2s; }
  .app .app-scrim.is-open { opacity:1; pointer-events:auto; }
  .app .grid2 { grid-template-columns:1fr; }
  .app .task-filter-disclosure > summary { display:list-item; }
}
