/* Shared responsive adjustments, loaded after each page stylesheet. */
.mobile-filter-trigger { display: none; }
.date-control { position: relative; display: block; width: 100%; min-width: 0; }
.date-control input[type="date"] { width: 100%; padding-right: 2.75rem; }
.date-control-placeholder { position: absolute; left: 0.8rem; top: 50%; transform: translateY(-50%); color: #f4f6f8; font-size: 16px; pointer-events: none; }
.date-control-icon { position: absolute; right: 0.9rem; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; color: #f4f6f8; pointer-events: none; }
.date-control-icon svg { display: block; width: 100%; height: 100%; }
.date-control.has-value .date-control-placeholder { display: none; }
.date-control:not(.has-value) input[type="date"] { color: transparent; }
.date-control:not(.has-value) input[type="date"]::-webkit-datetime-edit { opacity: 0; }
.date-control input[type="date"]::-webkit-calendar-picker-indicator { opacity: 0; }
.mobile-filter-dialog { width: min(calc(100% - 1.5rem), 480px); padding: 1.25rem; border: 1px solid #38424e; border-radius: 20px; background: #181c22; color: #f4f6f8; }
.mobile-filter-dialog::backdrop { background: #04070abf; }
.mobile-filter-dialog h2 { margin: 0; font-size: 1.25rem; }
.mobile-filter-dialog .record-filters { display: grid; width: 100%; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
.mobile-filter-dialog .search-field { display: flex; flex-direction: column; gap: 0.45rem; margin: 0; font-size: 0.85rem; color: #b7c2ce; }
.mobile-filter-dialog .search-field:last-child { grid-column: auto; }
.mobile-filter-dialog input, .mobile-filter-dialog select { min-width: 0; min-height: 50px; margin: 0; padding: 0.75rem; background: #232830; color: #f4f6f8; border: 1px solid #3a424c; border-radius: 10px; font-size: 16px; color-scheme: dark; }
.mobile-filter-dialog .filter-apply { margin-top: 1.5rem; }
.mobile-filter-dialog .mobile-filter-fields, .mobile-filter-dialog .record-filters, .mobile-filter-dialog .search-field { min-width: 0; max-width: 100%; }
.mobile-filter-dialog .search-field { width: 100%; align-items: stretch; }
.mobile-filter-dialog input, .mobile-filter-dialog select { box-sizing: border-box; width: 100%; max-width: 100%; }
.mobile-filter-dialog input[type="date"] { appearance: none; -webkit-appearance: none; display: block; width: 100%; min-width: 0; height: 50px; text-align: left; }
.mobile-filter-dialog input[type="date"]::-webkit-date-and-time-value { min-width: 0; text-align: left; }
.mobile-filter-dialog input[type="date"]::-webkit-datetime-edit { padding: 0; }
@media (max-width: 768px) { .mobile-filter-trigger { display: inline-flex; justify-self: start; min-width: 120px; } }
main > *, .dashboard > *, .workers-dashboard > *, .record-filters > *,
.login-card, .card, .table-scroll { min-width: 0; }
input, select { max-width: 100%; }
dialog { max-height: calc(100dvh - 2rem); overflow-y: auto; overscroll-behavior: contain; }
.form-error { overflow-wrap: anywhere; }
.location-groups, .location-group { min-width: 0; max-width: 100%; }
.table-scroll { width: 100%; max-width: 100%; overflow-x: auto; touch-action: pan-x pan-y; -webkit-overflow-scrolling: touch; scrollbar-color: #51a0d5 #222831; }
@media (max-width: 768px) {
  input, select { font-size: 16px; }
  .topbar { flex-wrap: wrap; gap: 0.5rem; }
  .header-nav { flex-wrap: wrap; }
  .header-nav-link, .back-access, .access-link, .text-button { min-height: 44px; }
  .record-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .search-field { min-width: 0; }
  .search-field input, .search-field select { min-width: 0; margin-top: 0.4rem; }
  .table-scroll { border-radius: 10px; }
  .table-scroll table { font-size: 0.85rem; }
  .table-scroll th { position: sticky; top: 0; }
  .worker-dialog, .employee-dialog, .confirm-dialog, .confirmation { padding: 1.25rem; }
  .login-card label:not(:first-child) { margin-top: 1rem; }
}
@media (max-width: 560px) {
  .container { width: calc(100% - 1.5rem); }
  .app-shell, .owner-page, .workers-page { padding-bottom: 0.5rem; }
  .topbar { min-height: 76px; }
  .awhak-brand { gap: 0.35rem; }
  .awhak-mark, .awhak-mark img { width: 36px; height: 36px; }
  .owner-link { padding: 0.65rem; font-size: 0.75rem; }
  .card { padding: 1.1rem; border-radius: 16px; }
  .records-card { padding: 0; }
  .records-heading { padding: 1rem; gap: 1rem; }
  .record-filters { grid-template-columns: minmax(0, 1fr); }
  .record-filters .search-field:last-child { grid-column: auto; }
  .dashboard-heading h1, .login-copy h1 { font-size: clamp(2rem, 9vw, 3rem); }
  .dashboard-actions { width: 100%; }
  .dashboard-actions .button { padding-inline: 0.5rem; }
  .intro h1 { font-size: clamp(2rem, 9vw, 2.8rem); line-height: 1.05; }
  .intro > p:not(.eyebrow) { font-size: 1rem; }
  .login-view { padding-top: 1.5rem; }
  .site-summary { padding: 1rem; }
  .site-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .worker-row .text-button { padding: 0.5rem 0; }
  .timeline-item { grid-template-columns: auto minmax(0, 1fr); }
  .timeline-time { grid-column: 2; }
  .section-title-row { flex-wrap: wrap; gap: 0.5rem; }
  .employee-card-id, .employee-card-site { overflow-wrap: anywhere; }
  .worker-dialog-actions .delete-icon-button { align-self: flex-start; }
  .site-footer { padding-block: 2rem 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .employee-card { transition: none; }
  .employee-card:hover { transform: none; }
}
@media (max-width: 768px) {
  .owner-page .records-heading { padding: 1.25rem; }
  .owner-page .record-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 0.75rem; align-items: end; }
  .owner-page .record-filters .search-field { display: flex; flex-direction: column; gap: 0.4rem; margin: 0; font-size: 0.85rem; font-weight: 700; }
  .owner-page .record-filters input, .owner-page .record-filters select { margin: 0; width: 100%; min-width: 0; min-height: 50px; padding: 0.75rem; }
  .owner-page .record-filters .search-field:nth-child(1) { order: 1; }
  .owner-page .record-filters .search-field:nth-child(4) { order: 2; }
  .owner-page .record-filters .search-field:nth-child(2) { order: 3; }
  .owner-page .record-filters .search-field:nth-child(3) { order: 4; }
  .owner-page .record-filters .search-field:last-child { order: 5; grid-column: 1 / -1; }
  .site-card span { min-height: auto; font-size: 1rem; line-height: 1.4; font-weight: 700; overflow-wrap: anywhere; }
  .site-card strong { margin-top: 0.75rem; font-size: 1.8rem; }
  .stat-card span { font-size: 0.9rem; line-height: 1.4; }
  .owner-page .topbar { align-items: center; }
  .owner-page .header-nav { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 0.75rem; }
  .owner-page .header-nav a { max-width: none; min-height: 44px; white-space: nowrap; font-size: 0.78rem; }
}
@media (max-width: 440px) {
  .owner-page .topbar { gap: 0.5rem; }
  .owner-page .header-nav { width: 100%; justify-content: space-between; }
  .owner-page .header-nav a { font-size: 0.85rem; }
  .owner-page .records-heading { padding: 1rem; }
}
@media (max-width: 360px) {
  .owner-page .record-filters { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 768px) {
  .owner-page .records-heading { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .owner-page .records-heading .mobile-filter-trigger { justify-self: end; min-width: 0; padding: 0.75rem 1rem; }
}
@media (max-width: 600px) {
  .owner-page .records-heading { padding: 1.25rem 1rem; gap: 1.25rem; }
  .owner-page .records-heading h2 { font-size: 1.25rem; letter-spacing: -0.025em; }
  .owner-page .records-heading > div > p { margin-top: 0.5rem; line-height: 1.5; }
  .owner-page .record-filters { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .owner-page .record-filters .search-field { font-size: 0.8rem; font-weight: 600; color: #b7c2ce; gap: 0.5rem; }
  .owner-page .record-filters .search-field:last-child { order: 0; grid-column: auto; }
  .owner-page .record-filters input, .owner-page .record-filters select { display: block; min-height: 52px; padding: 0.8rem 1rem; border: 1px solid #38424e; border-radius: 12px; background: #20262e; color: #f4f6f8; font-size: 16px; font-weight: 400; line-height: 1.4; color-scheme: dark; }
  .owner-page .record-filters input::placeholder { color: #909eac; }
  .owner-page .record-filters input:focus, .owner-page .record-filters select:focus { border-color: var(--primary); outline: 2px solid #51a0d533; outline-offset: 2px; }
  .owner-page .record-filters input[type="date"] { text-align: left; }
  .owner-page .record-filters input[type="date"]::-webkit-date-and-time-value { text-align: left; }
}
