/* office-touch.css: touch sizes for the Office Dashboard, the pages on the Office frame and Inventory (screen-size round,
   owner Oct 23 2026). From 600 to 1023 wide (an unfolded foldable or a tablet) every control is at least 44px (gloves).
   Under 600 (regular phones) nothing here applies: the pages stay exactly as they were (owner, Oct 25 2026). From
   769 to 1023 the side menu shows as on a computer, so its links get the touch size too. At 1024 and up nothing here
   applies: desktop keeps its compact sizes. Delete / remove buttons keep their smaller, harder-to-hit size on purpose.
   Linked last on each page, so it wins over the page's own compact sizes on a touch screen. */
@media screen and (min-width: 600px) and (max-width: 1023.98px) {
  /* Time Tickets: the page numbers (more than one page of tickets); Fleet: the upcoming items' tick and edit buttons */
  #pagination .page-btn { min-width: 44px; min-height: 44px; }
  #fleet-upcoming-list .btn { min-width: 44px; min-height: 44px; }
  /* Office Home, "Permits needing attention": the project links and the one-tap permit buttons (show when permits need
     attention) */
  .hm-permit-proj > a, .pm-onetap > button { display: inline-flex; align-items: center; min-height: 44px; }
  /* Profit and the job tables: a job's expand button (44px under 768 already) */
  .jt-expand { min-height: 44px; }
  /* Tools: a deleted tool's name (a link to the tool; shows once a tool is deleted) */
  .tools-deleted-row a { display: inline-flex; align-items: center; min-height: 44px; }
  /* The side menu (office.html and office-sidebar.js) */
  .sidebar .sidebar-hub, .sidebar .sidebar-nav a, .sidebar .sidebar-bottom a { min-height: 44px; box-sizing: border-box; }
  .sidebar-brand > a { display: flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }

  /* Buttons, button links and the Back buttons */
  .btn:not(.btn-danger), .btn-sm:not(.btn-danger), a.btn:not(.btn-danger), .back-btn, .lr-back, .action-btn:not(.action-btn-red),
  .btn-save-primary, .btn-cancel-secondary { min-height: 44px; box-sizing: border-box; }
  a.btn:not(.btn-block), a.back-btn, a.lr-back { display: inline-flex; align-items: center; }

  /* Form boxes */
  .form-control, .lr-in, .lr-sel, .td-input, .td-select, .tm-search, .input, select.input,
  .main-content input[type="text"], .main-content input[type="search"], .main-content input[type="date"], .main-content input[type="number"],
  .main-content input[type="email"], .main-content input[type="tel"], .main-content input:not([type]), .main-content select { min-height: 44px; box-sizing: border-box; }

  /* Office Dashboard screens: tabs, chips, Show / Hide, the Home cards' links, the calendar arrows */
  .proj-tab, .proj-subtab, .po-tab, .rfq-tab, .tt-chip, .jt-chip, .archived-toggle, .new-po-check, .proj-search-all, .hm-toggle { min-height: 44px; box-sizing: border-box; }
  .rfq-tab { display: inline-flex; align-items: center; }
  .home-card .view-link, .home-stat-row > a { display: flex; align-items: center; min-height: 44px; }
  .home-stat-row > a { display: inline-flex; }
  .status-quick-btn { min-height: 44px; }
  #fleet-cal-prev, #fleet-cal-next { min-width: 44px; min-height: 44px; }

  /* Team, Settings: their own side menus and tab strips, the colour and look controls, the permission switches */
  .tm-nav-btn, .tm-invite-btn, .tm-tab-pill, .st-nav-btn, .st-tab-pill, .btn-st-primary, .btn-st-secondary, .radius-btn { min-height: 44px; box-sizing: border-box; }
  a.st-nav-btn, a.tm-nav-btn, a.st-tab-pill, a.tm-tab-pill { display: inline-flex; align-items: center; }
  .preset-swatch, .color-preview { width: 44px; height: 44px; min-width: 44px; }
  .tm-drawer-close { width: 44px; height: 44px; }
  .perm-toggle { width: 44px; height: 44px; }
  .perm-toggle .perm-toggle-track { inset: 12px 4px; }
  .perm-toggle .perm-toggle-thumb { top: 15px; left: 7px; }
  /* Pages on the Office frame: tick labels, sortable headings, Worksites' project menu and Show removed, Job print */
  .lr-check { min-height: 44px; min-width: 44px; justify-content: center; }
  .pf-sort { min-height: 44px; }
  .proj-menu-btn { min-width: 44px; min-height: 44px; }
  .ws-show-removed-wrap { min-height: 44px; box-sizing: border-box; }
  .jp-check, .jp-in, .jp-lines .jp-check { min-height: 44px; }
  /* Panel schedules' own header (no side menu there) */
  body > header > a.brand, body > header > nav > a { display: inline-flex; align-items: center; min-height: 44px; }

  /* Inventory: the header's settings gear, the alert chips, a lone link under a page ("Back to the Count board") */
  .inv-gear { min-width: 44px; min-height: 44px; }
  .inv-chips a.clear-filter-btn, .clear-filter-btn.visible { min-height: 44px; }
  .inv p.flush > a, p.flush > a:only-child { display: inline-flex; align-items: center; min-height: 44px; }

  /* Links that are the whole cell of a table row (the row's name, a PO, an item) */
  td > a:not(.btn):not(.back-btn), td > strong > a, .tools-open-link { display: inline-flex; align-items: center; min-height: 44px; }

  /* Tick boxes that are not inside a label: a 44px box to tap, the same small tick drawn in the middle */
  .po-cb, .sched-cb, .tt-cb, .to-req-cb, .ll-tick, .proj-bulk-cb, .archive-month-cb, .archive-month-all-cb, .archive-period-cb, .ws-item-cb,
  #tools-select-all, #to-req-select-all, #to-archive-select-all, #po-arch-select-all-top, #proj-select-all-cb, #arch-ticket-select-all,
  input[type="checkbox"].fh-tick, #tools-table td > input[type="checkbox"], #tools-inv-tbody td > input[type="checkbox"] {
    -webkit-appearance: none; appearance: none; margin: 0; cursor: pointer; flex: none; vertical-align: middle;
    width: 44px !important; height: 44px !important; min-width: 44px; min-height: 44px; border: 0; border-radius: 8px;
    background: transparent no-repeat center / 22px 22px
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Crect x='1' y='1' width='20' height='20' rx='4' fill='%23fff' stroke='%236e6e6e' stroke-width='2'/%3E%3C/svg%3E");
  }
  .po-cb:checked, .sched-cb:checked, .tt-cb:checked, .to-req-cb:checked, .ll-tick:checked, .proj-bulk-cb:checked, .archive-month-cb:checked,
  .archive-month-all-cb:checked, .archive-period-cb:checked, .ws-item-cb:checked, #tools-select-all:checked, #to-req-select-all:checked,
  #to-archive-select-all:checked, #po-arch-select-all-top:checked, #proj-select-all-cb:checked, #arch-ticket-select-all:checked,
  input[type="checkbox"].fh-tick:checked, #tools-table td > input[type="checkbox"]:checked, #tools-inv-tbody td > input[type="checkbox"]:checked {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Crect x='0' y='0' width='22' height='22' rx='5' fill='%23F47920'/%3E%3Cpath d='M5.5 11.5l3.5 3.5 7.5-8' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  }
  .po-cb:indeterminate, .tt-cb:indeterminate, .ll-tick:indeterminate, #tools-select-all:indeterminate, #proj-select-all-cb:indeterminate {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Crect x='0' y='0' width='22' height='22' rx='5' fill='%23F47920'/%3E%3Cpath d='M6 11h10' stroke='%23fff' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E");
  }
  .po-cb:focus-visible, .sched-cb:focus-visible, .tt-cb:focus-visible, .to-req-cb:focus-visible, .ll-tick:focus-visible, .proj-bulk-cb:focus-visible,
  input[type="checkbox"].fh-tick:focus-visible { outline: 2px solid #F47920; outline-offset: -4px; }
  .po-table .cb-col, .ll-tick-cell { width: 48px; padding-top: 0; padding-bottom: 0; }
}

/* Inventory's photo and file buttons: the hidden file box covers its button (see-through), so a tap anywhere on the
   button opens the picker and the box itself is never a 1px target. From 600 wide. */
@media screen and (min-width: 600px) {
  label.photo-btn, label.lv-file { position: relative; }
  label.photo-btn > input.visually-hidden[type="file"], label.lv-file > input.visually-hidden[type="file"] {
    position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; opacity: 0; clip: auto; clip-path: none; overflow: hidden; cursor: pointer; }
}

/* 600-639, where Office tables are still cards: the 44px tick box sits in the card's top right corner, clear of the
   first line (the PO / ticket number). */
@media screen and (min-width: 600px) and (max-width: 639.98px) {
  .stack-narrow .po-table td.cb-col { top: 0; right: 16px; width: 44px; }
  .stack-narrow .po-table td.cb-col + td { padding-right: 60px; }
}
