/* Simplification pass (owner, 2026-10-05): hubs pages. */

/* The access tabs' pages: every section a full-width row of tiles, People
   first, so Manager's few tiles fill the page like Admin's many do. */
.hub-directory { display: grid; gap: 22px; }
.hub-section h2 { margin: 0 0 10px; font-size: 1.05rem; }
.hub-directory .admin-links { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px;
  grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); background: none; border: 0; border-radius: 0; overflow: visible; }
.hub-directory .admin-links li { min-width: 0; }
.hub-directory .admin-links li + li { border-top: 0; }
.hub-directory .admin-links a { height: 100%; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 16px; background: var(--card); border: 1px solid var(--line); border-radius: 8px; color: var(--heading); }
.hub-directory .admin-links a:hover { background: var(--surface-2); border-color: var(--accent, var(--line)); text-decoration: none; }
.hub-directory .admin-links a > span:first-child { min-width: 0; }
.hub-directory .admin-links strong { display: block; font-size: .95rem; font-weight: 600; }
.hub-directory .admin-links .doc-meta { display: block; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hub-directory .admin-links a > span:last-child { color: var(--text-light); flex: none; }
@media (max-width: 640px) {
  .hub-directory .admin-links { grid-template-columns: 1fr; gap: 8px; }
  .hub-directory .admin-links .doc-meta { white-space: normal; }
}

/* A file picker styled like the portal's buttons, on one line with its
   submit button (Import from ADP). */
.file-pick-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.file-pick-row input[type="file"] { flex: 0 1 auto; min-width: 0; max-width: 100%; font: inherit; font-size: .9rem; color: var(--text-light); border: 0; padding: 0; background: none; }
.file-pick-row input[type="file"]::file-selector-button {
  margin-right: 10px; border: 1px solid var(--line); border-radius: 6px; cursor: pointer; font: inherit; font-weight: 600; font-size: .95rem;
  padding: 9px 18px; min-height: 40px; background: var(--card); color: var(--heading); }
.file-pick-row input[type="file"]::file-selector-button:hover { background: var(--surface-2); border-color: var(--steel); }

/* Company holidays: each year as a compact grid of tiles. */
.holiday-tiles { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
.holiday-tile { position: relative; background: var(--card); border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; min-width: 0; }
.holiday-tile strong { display: block; font-size: .9rem; color: var(--heading); }
.holiday-tile strong { padding-right: 1.6rem; }
.holiday-tile .holiday-name { display: block; font-size: .88rem; color: var(--text-light); margin-top: 2px; overflow-wrap: anywhere; }
.holiday-tile .holiday-remove { position: absolute; top: 6px; right: 6px; margin: 0; }
.holiday-remove-btn { width: 26px; height: 26px; border: 0; border-radius: 50%; background: none; color: var(--text-light); font-size: 1.1rem; line-height: 1; cursor: pointer; }
.holiday-remove-btn:hover, .holiday-remove-btn:focus-visible { background: var(--surface-2); color: var(--danger); }

/* The request queue's one toolbar row: search, filters, saved views and
   saved replies (IT and Admin tabs). */
.request-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 6px 0 4px; }
.request-filter-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; flex: 1 1 28rem; min-width: 0; margin: 0; }
.request-filter-form input[type="search"] { flex: 1 1 9rem; width: auto; min-width: 0; }
.request-filter-form select { flex: 0 0 auto; width: auto; min-width: 0; max-width: 100%; }
.request-toolbar .pop-btn { padding: 6px 12px; min-height: 36px; font-size: .88rem; }
.request-toolbar .request-saved-views { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; max-width: 100%; }
.request-toolbar .request-saved-views > form { margin: 0; flex: 1 1 18rem; min-width: 0; max-width: 100%; flex-wrap: nowrap; gap: 6px; }
.request-toolbar .request-saved-views > form select { flex: 1 1 auto; width: auto; min-width: 0; }
.request-toolbar .request-saved-views > form .btn { flex: none; white-space: nowrap; }
.request-toolbar .request-saved-views > form label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.request-toolbar-link { white-space: nowrap; font-size: .92rem; }
[data-no-js-only][hidden] { display: none !important; }

/* Equipment register: the add form's boxes and ticks on one baseline, and
   each row's Edit button at its end. */
.equipment-add-row { flex-wrap: wrap; align-items: flex-end; gap: 8px 12px; margin-top: .6rem; }
.hub-check-line { display: inline-flex; align-items: center; gap: .35rem; min-height: 40px; font-size: .9rem; white-space: nowrap; }
.equipment-register .equipment-edit-cell { text-align: right; white-space: nowrap; }
/* The register's Assign row on a phone: the select gives way, the button
   keeps its word on one line. */
.equipment-assign select { min-width: 0; max-width: 10rem; flex: 1 1 auto; width: auto; }
.equipment-assign .btn { flex: none; white-space: nowrap; }
@media (max-width: 600px) { .form-row.equipment-assign > select { width: auto; flex: 1 1 auto; } }