/* Shared phone and tablet experience. Loaded after page-specific styles. */

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  overflow-wrap: break-word;
}

img,
svg,
canvas {
  max-width: 100%;
}

button,
input,
select,
textarea {
  letter-spacing: 0;
}

.main-column,
.page-body,
.organizations-page-wrap,
.settings-page-wrap,
.general-workspace,
.general-home-shell,
.org-ops-root,
.kassa-root,
.schet-root,
.reports-root,
.general-kassa-root,
.general-schet-root,
.general-reports-root {
  min-width: 0;
  max-width: 100%;
}

.org-ops-table-wrap,
.kassa-table-wrapper,
.reports-table-wrap,
.org-balance-table-wrap,
.settings-employees-table-wrap,
.org-hr-history-table-wrap,
.org-hr-attendance-dialog-table-wrap,
.org-hr-salary-table-wrap,
.general-reports-table-wrap,
.general-reports-reconciliation-table-wrap,
.general-reports-inventory-table-wrap,
.general-reports-client-debt-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
}

dialog[open] {
  overscroll-behavior: contain;
}

@media (hover: none) and (pointer: coarse) {
  button,
  [role="button"],
  a.btn,
  input[type="button"],
  input[type="submit"],
  input[type="reset"] {
    touch-action: manipulation;
  }

  input,
  select,
  textarea,
  button {
    font-size: max(16px, 1em);
  }

  input[type="checkbox"],
  input[type="radio"] {
    width: 1.15rem;
    height: 1.15rem;
  }
}

/* Tablet: preserve density while removing desktop-only fixed widths. */
@media (max-width: 1024px) {
  .page-body {
    width: 100%;
    padding: 16px;
  }

  .general-module-tabs,
  .settings-module-tabs,
  .org-hr-tabs,
  .org-shipments-tabs {
    display: flex;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  .general-module-tabs::-webkit-scrollbar,
  .settings-module-tabs::-webkit-scrollbar,
  .org-hr-tabs::-webkit-scrollbar,
  .org-shipments-tabs::-webkit-scrollbar {
    display: none;
  }

  .general-module-tab,
  .general-module-tab-shell {
    flex: 0 0 auto;
    max-width: min(78vw, 18rem);
  }

  .general-report-launcher,
  .org-report-launcher,
  .general-settings-launcher,
  .org-shipments-launcher,
  .org-hr-launcher {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100%;
    gap: 10px;
  }

  .general-report-card,
  .general-settings-card,
  .org-report-launcher .general-report-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 6.5rem;
  }

  .director-section-head,
  .reports-panel-head,
  .org-hr-toolbar,
  .org-hr-toolbar-left,
  .org-shipments-journal-footer,
  .kassa-overview-toolbar,
  .general-reports-section-head,
  .general-reports-reconciliation-toolbar {
    flex-wrap: wrap;
    min-width: 0;
  }

  .kassa-filters-row,
  .gk-filters-toolbar,
  .reports-reconcile-toolbar,
  .org-hr-toolbar {
    align-items: stretch;
  }

  .kassa-filter-group,
  .gk-field,
  .reports-reconcile-toolbar label,
  .org-hr-staff-search,
  .org-hr-staff-position-filter {
    min-width: 0;
  }

  .settings-business-grid,
  .settings-profile-grid,
  .settings-employees-form-grid,
  .director-modal-grid,
  .org-shipments-payment-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .organizations-card-grid,
  .director-org-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .org-hr-rollcall-shell {
    grid-template-columns: minmax(15rem, 0.34fr) minmax(0, 1fr);
  }

  .org-ops-table,
  .kassa-table,
  .reports-data-table,
  .general-kassa-table,
  .general-reports-balance-table,
  .general-reports-statement-table {
    font-variant-numeric: tabular-nums lining-nums;
  }

  .settings-profile-modal,
  .director-org-modal,
  .org-hr-modal,
  .org-hr-attendance-dialog,
  .general-reports-reconciliation-dialog,
  .general-reports-inventory-dialog,
  .general-reports-client-debt-dialog,
  .general-reports-cash-dialog {
    width: min(94vw, 56rem);
    max-width: none;
  }
}

/* Phone and small tablet portrait. */
@media (max-width: 768px) {
  :root {
    --mobile-page-gap: 12px;
    --mobile-control-height: 44px;
  }

  body {
    min-width: 0;
  }

  .auth-page {
    justify-content: flex-start;
    padding: calc(24px + env(safe-area-inset-top, 0px)) calc(16px + env(safe-area-inset-right, 0px)) calc(24px + env(safe-area-inset-bottom, 0px)) calc(16px + env(safe-area-inset-left, 0px));
  }

  .auth-shell {
    width: 100%;
    max-width: 28rem;
    margin: auto;
  }

  .auth-brand-lockup {
    gap: 10px;
    margin-bottom: 18px;
  }

  .auth-brand-lockup .brand-octopus {
    width: 72px;
    height: 72px;
  }

  .auth-card {
    width: 100%;
    padding: 20px 18px;
    border-radius: 8px;
  }

  .auth-card-head {
    margin-bottom: 18px;
  }

  .auth-card .form-stack {
    gap: 14px;
  }

  .auth-card .btn {
    min-height: var(--mobile-control-height);
  }

  .billing-page {
    width: 100%;
    padding: 12px;
  }

  .billing-topbar,
  .billing-header-row,
  .billing-client-row,
  .billing-client-edit-line,
  .billing-detail-grid,
  .billing-detail-user-row,
  .billing-password-line {
    grid-template-columns: 1fr !important;
  }

  .billing-topbar {
    align-items: flex-start;
    gap: 12px;
  }

  .billing-modal {
    width: calc(100vw - 20px);
    max-width: none;
    max-height: calc(100dvh - 20px);
    overflow: auto;
  }

  .mobile-topbar {
    min-height: calc(56px + env(safe-area-inset-top, 0px));
    padding-right: calc(var(--mobile-page-gap) + env(safe-area-inset-right, 0px));
    padding-left: calc(var(--mobile-page-gap) + env(safe-area-inset-left, 0px));
  }

  .mobile-nav-toggle {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    margin: 0;
  }

  .sidebar {
    width: min(19rem, calc(100vw - 2rem));
  }

  .sidebar-head {
    height: 72px;
  }

  .nav-link,
  .nav-folder-row,
  .nav-sublink,
  .workspace-switcher-trigger,
  .sidebar-user {
    min-height: 44px;
  }

  .page-body {
    padding: var(--mobile-page-gap) calc(var(--mobile-page-gap) + env(safe-area-inset-right, 0px)) calc(24px + env(safe-area-inset-bottom, 0px)) calc(var(--mobile-page-gap) + env(safe-area-inset-left, 0px));
  }

  .general-module-tabs,
  .settings-module-tabs,
  .org-hr-tabs,
  .org-shipments-tabs {
    min-height: 44px;
    height: auto;
    padding: 5px;
    gap: 5px;
  }

  .general-module-tab,
  .general-module-tab-shell {
    min-height: 36px;
    height: 36px;
  }

  .organizations-page-wrap,
  .organizations-page-wrap--general,
  .organizations-page-wrap--fluid,
  .general-workspace,
  .settings-page-wrap,
  .org-settings-panel-surface {
    width: 100%;
    margin: 0;
    padding-right: 0;
    padding-left: 0;
  }

  .org-settings-panel-surface {
    padding: 10px;
  }

  .general-report-launcher,
  .org-report-launcher,
  .general-settings-launcher,
  .org-shipments-launcher,
  .org-hr-launcher {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .general-report-card,
  .general-settings-card,
  .org-report-launcher .general-report-card {
    min-height: 6rem !important;
    padding: 12px !important;
  }

  .director-section-head,
  .reports-panel-head,
  .general-reports-section-head,
  .kassa-overview-toolbar,
  .settings-dict-head,
  .settings-business-head {
    align-items: stretch;
    gap: 10px;
  }

  .director-section-head > *,
  .reports-panel-head > *,
  .general-reports-section-head > * {
    min-width: 0;
  }

  .btn,
  .btn-secondary,
  .kassa-btn,
  .schet-btn,
  .general-reports-section-actions button,
  .org-hr-toolbar button,
  .director-section-actions button {
    min-height: var(--mobile-control-height);
  }

  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  select,
  textarea,
  .kassa-filter-select,
  .kassa-multi-filter-btn,
  .org-hr-position-multi-btn,
  .settings-lang-trigger,
  .upos-ccy-select-btn {
    min-height: var(--mobile-control-height);
    font-size: 16px;
  }

  /* Filters become a predictable two-column grid. */
  .kassa-filters-row,
  .gk-filters-toolbar,
  .reports-reconcile-toolbar,
  .org-shipments-journal-tools,
  .org-shipments-order-controls,
  .org-hr-toolbar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 8px;
  }

  .kassa-search-group,
  .kassa-panel-actions,
  .kassa-filter-group--dates,
  .gk-field--wide,
  .gk-field--date-range,
  .reports-reconcile-toolbar > :first-child,
  .org-hr-toolbar-left,
  .org-hr-staff-search,
  .org-hr-staff-position-filter,
  .org-hr-staff-period-form,
  .org-hr-month-summary,
  .org-shipments-journal-field--search {
    grid-column: 1 / -1;
    width: 100%;
  }

  .kassa-panel-actions,
  .org-hr-toolbar-left {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kassa-panel-actions > *,
  .org-hr-toolbar-left > * {
    min-width: 0;
  }

  .org-hr-month-summary {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x proximity;
  }

  .org-hr-month-summary-card {
    flex: 0 0 10rem;
    scroll-snap-align: start;
  }

  .org-hr-month-summary-arrow {
    flex: 0 0 2.75rem;
    min-height: 5rem;
    scroll-snap-align: start;
  }

  .kassa-filters-shell,
  .kassa-data-panel,
  .kassa-overview-grid,
  .org-ops-panel,
  .reports-panel,
  .schet-overview-shell,
  .settings-ios-group,
  .org-settings-panel-surface {
    border-radius: 8px !important;
  }

  .kassa-table-wrapper,
  .org-ops-table-wrap,
  .reports-table-wrap,
  .general-reports-table-wrap,
  .general-reports-reconciliation-table-wrap,
  .general-reports-inventory-table-wrap,
  .general-reports-client-debt-table-wrap {
    position: relative;
    border-right: 1px solid var(--border);
    border-left: 1px solid var(--border);
  }

  .kassa-table,
  .org-ops-table,
  .reports-data-table,
  .general-kassa-table,
  .general-reports-balance-table,
  .general-reports-statement-table,
  .general-reports-reconciliation-table,
  .general-reports-inventory-table,
  .general-reports-client-debt-table {
    min-width: 46rem;
  }

  .general-reports-client-debt-table {
    min-width: 56rem;
  }

  .general-reports-client-debt-table th:first-child,
  .general-reports-client-debt-table td:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    box-shadow: 1px 0 0 var(--border);
  }

  .general-reports-client-debt-table th:first-child {
    z-index: 4;
  }

  .kassa-table th,
  .org-ops-table th,
  .reports-data-table th,
  .general-kassa-table th,
  .general-reports-balance-table th,
  .general-reports-statement-table th {
    white-space: nowrap;
  }

  .kassa-pagination,
  .kassa-table-footer,
  .org-shipments-journal-footer,
  .reports-reconcile-summary {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
  }

  .kassa-overview-grid,
  .kassa-summary-grid,
  .reports-analysis-grid,
  .reports-courier-balance-totals,
  .schet-chart-grid,
  .director-capital-signals,
  .settings-business-grid,
  .settings-profile-grid,
  .settings-employees-form-grid,
  .director-modal-grid,
  .org-shipments-payment-form,
  .organizations-card-grid,
  .director-org-grid {
    grid-template-columns: 1fr !important;
  }

  .schet-total-inner,
  .schet-total-controls,
  .schet-list-item,
  .schet-pocket-head,
  .schet-detail-head {
    min-width: 0;
  }

  .schet-total-inner,
  .schet-list-item {
    gap: 10px;
  }

  .schet-total-value,
  .general-reports-balance-amount,
  .director-capital-total,
  .kassa-summary-total-amt {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .org-hr-rollcall-shell {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .org-hr-rollcall-left,
  .org-hr-rollcall-main,
  .org-hr-attendance-history,
  .org-hr-calendar-wrap {
    width: 100%;
    min-width: 0;
  }

  .org-hr-history-table-wrap {
    border: 1px solid var(--border);
    border-radius: 8px;
  }

  .org-hr-attendance-history table,
  .org-hr-history-table {
    width: 100%;
    min-width: 29rem;
  }

  .settings-pref-row,
  .settings-cat-main-row,
  .settings-business-row,
  .tg-rule-row {
    align-items: stretch;
    gap: 10px;
  }

  .settings-pref-control,
  .settings-pref-control--select,
  .settings-select-wrap,
  .settings-token-wrap {
    width: 100%;
    max-width: none;
  }

  /* Dialogs use the available viewport and keep actions reachable. */
  .settings-profile-modal,
  .director-org-modal,
  .org-hr-modal,
  .org-hr-attendance-dialog,
  .general-reports-reconciliation-dialog,
  .general-reports-inventory-dialog,
  .general-reports-client-debt-dialog,
  .general-reports-cash-dialog,
  .kassa-dialog,
  .schet-dialog,
  .schet-detail-dialog {
    width: calc(100vw - 20px) !important;
    max-width: none !important;
    max-height: calc(100dvh - 20px) !important;
    margin: auto;
    padding: 0;
  }

  .settings-profile-modal-surface,
  .director-modal-card,
  .org-hr-modal-card,
  .org-hr-attendance-dialog-card,
  .general-reports-reconciliation-modal,
  .general-reports-inventory-modal,
  .general-reports-client-debt-modal,
  .general-reports-cash-modal,
  .kassa-dialog-surface,
  .schet-dialog-surface,
  .schet-detail-surface {
    width: 100%;
    max-width: none !important;
    max-height: calc(100dvh - 20px) !important;
    border-radius: 8px !important;
  }

  .settings-profile-modal-head,
  .director-modal-head,
  .org-hr-modal-head,
  .org-hr-attendance-dialog-head,
  .general-reports-reconciliation-head,
  .general-reports-inventory-head,
  .general-reports-client-debt-head,
  .kassa-dialog-head,
  .schet-dialog-head {
    position: sticky;
    top: 0;
    z-index: 5;
    background: var(--card);
  }

  .settings-profile-modal-foot,
  .director-modal-actions,
  .org-hr-modal-actions,
  .org-hr-attendance-dialog-actions,
  .general-reports-reconciliation-actions,
  .kassa-dialog-foot,
  .schet-editor-foot,
  .schet-confirm-foot {
    position: sticky;
    bottom: 0;
    z-index: 5;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    background: var(--card);
  }

  .settings-profile-modal-foot > *,
  .director-modal-actions > *,
  .org-hr-modal-actions > *,
  .org-hr-attendance-dialog-actions > *,
  .kassa-dialog-foot > *,
  .schet-editor-foot > *,
  .schet-confirm-foot > * {
    width: 100%;
    min-width: 0;
    min-height: var(--mobile-control-height);
  }

  .upos-date-popover,
  .date-range-picker-popover {
    max-width: calc(100vw - 20px);
    max-height: calc(100dvh - 80px);
    overflow: auto;
  }
}

@media (max-width: 520px) {
  :root {
    --mobile-page-gap: 10px;
  }

  .mobile-topbar-brand {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .general-report-launcher,
  .org-report-launcher,
  .general-settings-launcher,
  .org-shipments-launcher,
  .org-hr-launcher {
    grid-template-columns: 1fr !important;
  }

  .general-report-card,
  .general-settings-card,
  .org-report-launcher .general-report-card {
    min-height: 5.25rem !important;
  }

  .kassa-filters-row,
  .gk-filters-toolbar,
  .reports-reconcile-toolbar,
  .org-shipments-journal-tools,
  .org-shipments-order-controls,
  .org-hr-toolbar,
  .kassa-panel-actions,
  .org-hr-toolbar-left {
    grid-template-columns: 1fr;
  }

  .kassa-filter-group,
  .kassa-panel-actions,
  .kassa-filter-group--dates,
  .gk-field,
  .reports-reconcile-toolbar > *,
  .org-hr-toolbar > *,
  .org-shipments-journal-tools > *,
  .org-shipments-order-controls > * {
    grid-column: 1;
  }

  .kassa-panel-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .director-section-head,
  .reports-panel-head,
  .general-reports-section-head,
  .settings-pref-row,
  .settings-cat-main-row,
  .settings-business-row,
  .kassa-overview-toolbar {
    flex-direction: column;
  }

  .director-section-actions,
  .general-reports-section-actions,
  .kassa-overview-currency-control {
    width: 100%;
  }

  .director-section-actions .btn,
  .general-reports-section-actions .btn,
  .general-reports-section-actions button {
    flex: 1 1 auto;
  }

  .org-ops-table,
  .kassa-table,
  .reports-data-table,
  .general-kassa-table,
  .general-reports-balance-table,
  .general-reports-statement-table,
  .general-reports-reconciliation-table,
  .general-reports-inventory-table,
  .general-reports-client-debt-table {
    min-width: 40rem;
  }

  .general-reports-client-debt-table {
    min-width: 52rem;
  }

  .general-reports-balance-total.is-final .general-reports-balance-amount,
  .general-reports-balance-total .general-reports-balance-amount {
    font-size: 1.15rem !important;
  }

  .adjustments-days-summary {
    grid-template-columns: 1fr;
  }

  .adjustments-calendar {
    padding: 8px;
  }

  .adjustments-calendar-weekdays,
  .adjustments-calendar-grid {
    gap: 4px;
  }

  .adjustments-calendar-day {
    min-height: 34px;
  }
}

@media (max-width: 390px) {
  .kassa-panel-actions {
    grid-template-columns: 1fr;
  }

  .general-module-tab,
  .general-module-tab-shell {
    max-width: 84vw;
  }

  .settings-profile-modal-foot,
  .director-modal-actions,
  .org-hr-modal-actions,
  .org-hr-attendance-dialog-actions,
  .kassa-dialog-foot,
  .schet-editor-foot,
  .schet-confirm-foot {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
  }
}