/*
 * Ritremis UI/UX Refresh
 * Global presentation and responsive safety layer.
 * Loaded last by the interactive layouts so module-specific business logic
 * remains untouched while common controls behave consistently.
 * 2026-08-18
 */

:root {
  --rr-ui-radius-xs: 8px;
  --rr-ui-radius-sm: 11px;
  --rr-ui-radius-md: 14px;
  --rr-ui-radius-lg: 18px;
  --rr-ui-radius-xl: 24px;
  --rr-ui-touch: 42px;
  --rr-ui-focus: 0 0 0 3px color-mix(in srgb, var(--rr-primary, #344a5f) 20%, transparent);
  --rr-ui-shadow-soft: 0 8px 24px rgba(23, 35, 58, .07);
  --rr-ui-shadow-card: 0 14px 38px rgba(23, 35, 58, .09);
  --rr-ui-transition: 160ms ease;
}

/* ---------- Universal interactive defaults ---------- */
.rr-app-body,
.rr-client-body,
.rr-lo-body,
.rr-auth-estate-body,
.rr-access-body,
.rr-public-body,
.rr-feed-body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.rr-app-body :where(button, a, input, select, textarea, summary),
.rr-client-body :where(button, a, input, select, textarea, summary),
.rr-lo-body :where(button, a, input, select, textarea, summary),
.rr-auth-estate-body :where(button, a, input, select, textarea, summary),
.rr-access-body :where(button, a, input, select, textarea, summary),
.rr-public-body :where(button, a, input, select, textarea, summary),
.rr-feed-body :where(button, a, input, select, textarea, summary) {
  -webkit-tap-highlight-color: transparent;
}

.rr-app-body :where(a, button, input, select, textarea, [tabindex]):focus-visible,
.rr-client-body :where(a, button, input, select, textarea, [tabindex]):focus-visible,
.rr-lo-body :where(a, button, input, select, textarea, [tabindex]):focus-visible,
.rr-auth-estate-body :where(a, button, input, select, textarea, [tabindex]):focus-visible,
.rr-access-body :where(a, button, input, select, textarea, [tabindex]):focus-visible,
.rr-public-body :where(a, button, input, select, textarea, [tabindex]):focus-visible,
.rr-feed-body :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid color-mix(in srgb, var(--rr-primary, #344a5f) 68%, #fff);
  outline-offset: 2px;
}

.rr-app-body :where(img, svg, canvas, video),
.rr-client-body :where(img, svg, canvas, video),
.rr-lo-body :where(img, svg, canvas, video),
.rr-public-body :where(img, svg, canvas, video),
.rr-feed-body :where(img, svg, canvas, video) {
  max-width: 100%;
}

/* ---------- Staff workspace ---------- */
.rr-app-body .rr-content {
  width: 100%;
  min-width: 0;
}

.rr-app-body .rr-module-frame,
.rr-app-body .rr-module-frame > * {
  min-width: 0;
}

.rr-app-body .rr-module-frame > :first-child {
  margin-top: 0 !important;
}

.rr-app-body :where(.rr-platform-page, .rr-sa-page, .rr-clients-page, .rr-company-page, .rr-rawland-page, .rr-res-page, .rr-trip-page, .rr-fin-page) {
  width: 100%;
  min-width: 0;
}

/* Headings and action bars */
.rr-app-body :where(.rr-platform-page-head, .rr-page-head, .rr-section-heading, .rr-sa-section-head, .rr-platform-panel-head, .rr-platform-panel-header, .rr-company-toolbar) {
  gap: 14px;
}

.rr-app-body :where(.rr-platform-page-head, .rr-page-head, .rr-section-heading) h1,
.rr-app-body :where(.rr-platform-page-head, .rr-page-head, .rr-section-heading) h2 {
  letter-spacing: -.025em;
  line-height: 1.15;
}

.rr-app-body :where(.rr-platform-head-actions, .rr-company-filter-actions, .rr-page-actions, .rr-toolbar-actions) {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

/* Cards/panels */
.rr-app-body :where(
  .card,
  .panel-card,
  .rr-card,
  .rr-platform-panel,
  .rr-platform-metric-card,
  .rr-sa-card,
  .rr-clients-panel,
  .rr-clients-stat,
  .rr-rawland-panel,
  .rr-company-panel,
  .rr-res-table-card,
  .rr-trip-list-card,
  .rr-public-content-card,
  .rr-users-card,
  .rr-branch-card,
  .rr-landowners-card
) {
  overflow-wrap: anywhere;
  transition: border-color var(--rr-ui-transition), box-shadow var(--rr-ui-transition), transform var(--rr-ui-transition);
}

@media (hover: hover) and (pointer: fine) {
  .rr-app-body :where(.rr-platform-metric-card, .rr-clients-stat, .rr-sa-card):hover {
    border-color: color-mix(in srgb, var(--rr-primary, #344a5f) 25%, var(--rr-border, #dfe1dc));
    box-shadow: var(--rr-ui-shadow-card);
    transform: translateY(-2px);
  }
}

.rr-app-body :where(.card-header, .rr-platform-panel-head, .rr-platform-panel-header, .rr-sa-section-head) {
  min-width: 0;
}

/* Buttons */
.rr-app-body :where(.btn, .rr-platform-btn) {
  min-height: var(--rr-ui-touch);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .48rem;
  padding-inline: .9rem;
  line-height: 1.1;
  white-space: normal;
  transition: transform var(--rr-ui-transition), box-shadow var(--rr-ui-transition), background-color var(--rr-ui-transition), border-color var(--rr-ui-transition), color var(--rr-ui-transition);
}

.rr-app-body :where(.btn-sm, .rr-platform-btn.compact) {
  min-height: 34px;
  padding: .42rem .7rem;
}

.rr-app-body :where(.btn, .rr-platform-btn):not(:disabled):active {
  transform: translateY(1px);
}

.rr-app-body :where(.btn, .rr-platform-btn):disabled {
  cursor: not-allowed;
  opacity: .58;
}

.rr-app-body :where(.btn-group, .btn-group-vertical) .btn {
  white-space: nowrap;
}

/* Forms */
.rr-app-body :where(.form-label, .rr-field-label) {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  margin-bottom: .42rem;
  line-height: 1.25;
}

.rr-app-body :where(.form-control, .form-select, .input-group-text) {
  min-height: var(--rr-ui-touch);
}

.rr-app-body textarea.form-control {
  min-height: 104px;
  resize: vertical;
}

.rr-app-body :where(.form-control, .form-select):disabled,
.rr-app-body :where(.form-control, .form-select)[readonly] {
  opacity: 1;
  color: color-mix(in srgb, var(--rr-text, #20252b) 76%, var(--rr-muted, #697077));
  background-color: color-mix(in srgb, var(--rr-surface-2, #faf9f6) 88%, var(--rr-border, #dfe1dc));
  cursor: not-allowed;
}

.rr-app-body .form-text {
  margin-top: .38rem;
  line-height: 1.45;
}

.rr-app-body :where(.form-check-input[type="checkbox"], .form-check-input[type="radio"]) {
  width: 1.05rem;
  height: 1.05rem;
  margin-top: .16rem;
}

.rr-app-body .input-group > :where(.form-control, .form-select):not(:first-child),
.rr-app-body .input-group > :where(.form-control, .form-select):not(:last-child) {
  border-radius: 0;
}

.rr-app-body :where(.rr-company-filter-form, .rr-filter-form, .filter-form, form[data-filter-form]) {
  min-width: 0;
}

/* Tables: readable desktop, reliably scrollable mobile */
.rr-app-body :where(.table-responsive, .rr-platform-table-wrap, .rr-table-shell) {
  position: relative;
  max-width: 100%;
  overflow-x: auto !important;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--rr-muted, #697077) 45%, transparent) transparent;
}

.rr-app-body :where(.table-responsive, .rr-platform-table-wrap, .rr-table-shell)::-webkit-scrollbar {
  height: 9px;
}
.rr-app-body :where(.table-responsive, .rr-platform-table-wrap, .rr-table-shell)::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: color-mix(in srgb, var(--rr-muted, #697077) 45%, transparent);
  background-clip: padding-box;
}

.rr-app-body :where(.table, .rr-platform-table) {
  width: 100%;
  vertical-align: middle;
}

.rr-app-body :where(.table, .rr-platform-table) thead th {
  vertical-align: middle;
  line-height: 1.2;
}

.rr-app-body :where(.table, .rr-platform-table) tbody td {
  line-height: 1.4;
}

.rr-app-body :where(.table, .rr-platform-table) td .btn,
.rr-app-body :where(.table, .rr-platform-table) td .rr-platform-btn {
  margin-block: 2px;
}

.rr-app-body :where(.table, .rr-platform-table) .text-end {
  font-variant-numeric: tabular-nums;
}

/* Statuses, alerts and empty states */
.rr-app-body :where(.badge, .rr-platform-badge, .rr-platform-status) {
  max-width: 100%;
  white-space: normal;
  line-height: 1.2;
}

.rr-app-body .alert {
  display: flex;
  align-items: flex-start;
  gap: .7rem;
  padding: .9rem 1rem;
  line-height: 1.45;
}

.rr-app-body :where(.rr-platform-empty, .rr-empty-state) {
  min-height: 180px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: .55rem;
  padding: 28px 20px;
  text-align: center;
}

/* Modals / dropdowns */
.rr-app-body .modal-dialog {
  max-width: min(var(--bs-modal-width, 500px), calc(100vw - 28px));
}
.rr-app-body .modal-lg { --bs-modal-width: 800px; }
.rr-app-body .modal-xl { --bs-modal-width: 1140px; }
.rr-app-body .modal-header {
  gap: 12px;
  padding: 1rem 1.15rem;
}
.rr-app-body .modal-body {
  min-width: 0;
  padding: 1.05rem 1.15rem;
}
.rr-app-body .modal-footer {
  gap: 8px;
  padding: .9rem 1.15rem;
}
.rr-app-body .dropdown-menu {
  max-width: min(340px, calc(100vw - 24px));
  padding: .45rem;
  box-shadow: 0 18px 44px rgba(23, 35, 58, .16);
}
.rr-app-body .dropdown-item {
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: .5rem;
  border-radius: 8px;
  white-space: normal;
}

/* Pagination */
.rr-app-body :where(.rr-pagination-wrap, .rr-platform-pagination-wrap) {
  gap: 12px;
  flex-wrap: wrap;
}
.rr-app-body :where(.pagination, .rr-pagination, .rr-platform-pagination) {
  flex-wrap: wrap;
  gap: 4px;
}
.rr-app-body .pagination .page-link {
  min-width: 36px;
  min-height: 36px;
  display: grid;
  place-items: center;
  border-radius: 9px !important;
}

/* Top navigation quality-of-life */
.rr-app-body .rr-topbar {
  backdrop-filter: saturate(130%) blur(14px);
  -webkit-backdrop-filter: saturate(130%) blur(14px);
}
.rr-app-body .rr-topbar-heading {
  min-width: 0;
}
.rr-app-body .rr-topbar-heading h1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rr-app-body .rr-topbar-actions {
  flex: 0 0 auto;
}

/* ---------- Client workspace ---------- */
.rr-client-body :where(.rr-client-main, .rr-client-content, main) {
  min-width: 0;
}

.rr-client-body :where(.card, .rr-client-card, .rr-clients-panel, .rr-client-panel, .rr-client-stat) {
  border-radius: var(--rr-ui-radius-lg);
}

.rr-client-body :where(.btn, .rr-client-primary-button, .rr-client-secondary-button) {
  min-height: var(--rr-ui-touch);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
}

.rr-client-body :where(.form-control, .form-select, .input-group-text, input, select, textarea) {
  max-width: 100%;
}

.rr-client-body :where(.table-responsive, .rr-client-table-wrap) {
  max-width: 100%;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}

.rr-client-body .modal-dialog {
  max-width: min(var(--bs-modal-width, 500px), calc(100vw - 28px));
}

/* ---------- Landowner portal ---------- */
.rr-lo-body :where(.rr-lo-frame, .rr-lo-content, .rr-lo-main) {
  min-width: 0;
}

.rr-lo-body :where(.card, .rr-lo-card, .rr-lo-panel) {
  border-radius: var(--rr-ui-radius-lg);
}

.rr-lo-body :where(.btn, button:not(.rr-lo-icon):not(.rr-lo-user)) {
  min-height: var(--rr-ui-touch);
}

.rr-lo-body :where(.table-responsive, .rr-lo-table-wrap) {
  max-width: 100%;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}

/* ---------- Authentication / access ---------- */
.rr-auth-estate-body :where(input, select, textarea, button),
.rr-access-body :where(input, select, textarea, button) {
  min-height: var(--rr-ui-touch);
}

.rr-auth-estate-body :where(input, select, textarea),
.rr-access-body :where(input, select, textarea) {
  font-size: 16px; /* prevents iOS input zoom */
}

.rr-auth-estate-body :where(.alert, .rr-auth-alert),
.rr-access-body :where(.alert, .rr-access-alert) {
  line-height: 1.45;
}

/* ---------- Public / projectline ---------- */
.rr-public-body :where(button, .btn),
.rr-feed-body :where(button, .rr-feed-icon-button, .rr-feed-signin, .rr-feed-join) {
  min-height: 40px;
}

.rr-public-body :where(input, select, textarea),
.rr-feed-body :where(input, select, textarea) {
  font-size: 16px;
}

/* ---------- Responsive ---------- */
@media (max-width: 991.98px) {
  .rr-app-body .rr-content {
    padding-inline: clamp(12px, 2.4vw, 20px);
  }

  .rr-app-body :where(.rr-platform-page-head, .rr-page-head, .rr-section-heading, .rr-company-toolbar) {
    align-items: flex-start !important;
    flex-wrap: wrap;
  }

  .rr-app-body :where(.rr-platform-head-actions, .rr-company-filter-actions, .rr-page-actions, .rr-toolbar-actions) {
    width: 100%;
  }

  .rr-app-body :where(.rr-platform-head-actions, .rr-company-filter-actions, .rr-page-actions, .rr-toolbar-actions) > :where(.btn, .rr-platform-btn) {
    flex: 0 1 auto;
  }

  .rr-app-body .rr-workspace-banner {
    margin-bottom: 16px;
  }
}

@media (max-width: 767.98px) {
  .rr-app-body .rr-topbar-public-link span {
    display: none;
  }

  .rr-app-body :where(.card-body, .rr-platform-panel-body, .rr-sa-card-body) {
    padding: .9rem !important;
  }

  .rr-app-body :where(.rr-platform-metrics, .rr-sa-metrics, .rr-clients-stats) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .rr-app-body :where(.rr-company-filter-form, .rr-filter-form, form[data-filter-form]) :where(.row, .d-flex) {
    row-gap: 10px;
  }

  .rr-app-body :where(.rr-company-filter-actions, .rr-platform-head-actions) > :where(.btn, .rr-platform-btn) {
    min-width: 0;
  }

  .rr-app-body .table-responsive::after,
  .rr-app-body .rr-platform-table-wrap::after {
    content: "Swipe horizontally to see more";
    position: sticky;
    left: 0;
    display: block;
    width: max-content;
    margin: 6px 8px 8px;
    color: var(--rr-muted, #697077);
    font-size: .65rem;
    font-weight: 650;
    letter-spacing: .01em;
  }

  .rr-app-body :where(.table, .rr-platform-table) thead th,
  .rr-app-body :where(.table, .rr-platform-table) tbody td {
    padding: .72rem .66rem;
  }

  .rr-client-body :where(.table-responsive, .rr-client-table-wrap)::after,
  .rr-lo-body :where(.table-responsive, .rr-lo-table-wrap)::after {
    content: "Swipe horizontally to see more";
    display: block;
    width: max-content;
    margin: 6px 8px 8px;
    opacity: .68;
    font-size: .68rem;
  }
}

@media (max-width: 575.98px) {
  .rr-app-body .rr-content {
    padding: 12px !important;
  }

  .rr-app-body .rr-workspace-banner {
    min-height: auto;
    padding: 16px;
  }

  .rr-app-body .rr-workspace-banner-copy {
    align-items: flex-start;
    gap: 12px;
  }

  .rr-app-body .rr-workspace-icon {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
    border-radius: 13px;
  }

  .rr-app-body :where(.rr-platform-metrics, .rr-sa-metrics, .rr-clients-stats) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .rr-app-body :where(.rr-platform-head-actions, .rr-company-filter-actions, .rr-page-actions, .rr-toolbar-actions) > :where(.btn, .rr-platform-btn) {
    flex: 1 1 calc(50% - 4px);
  }

  .rr-app-body :where(.rr-platform-head-actions, .rr-company-filter-actions, .rr-page-actions, .rr-toolbar-actions) > :where(.btn, .rr-platform-btn):only-child {
    flex-basis: 100%;
  }

  .rr-app-body .modal-dialog,
  .rr-client-body .modal-dialog {
    width: auto;
    max-width: none;
    margin: 8px;
    min-height: calc(100% - 16px);
  }

  .rr-app-body .modal-content,
  .rr-client-body .modal-content {
    min-height: auto !important;
    max-height: calc(100dvh - 16px);
    border-radius: var(--rr-ui-radius-lg) !important;
  }

  .rr-app-body .modal-dialog-scrollable .modal-content,
  .rr-client-body .modal-dialog-scrollable .modal-content {
    max-height: calc(100dvh - 16px);
  }

  .rr-app-body .modal-footer,
  .rr-client-body .modal-footer {
    flex-wrap: wrap;
  }

  .rr-app-body .modal-footer > .btn,
  .rr-client-body .modal-footer > .btn {
    flex: 1 1 calc(50% - 4px);
  }

  .rr-app-body .dropdown-menu,
  .rr-client-body .dropdown-menu {
    max-width: calc(100vw - 18px);
  }

  .rr-client-body :where(.rr-client-primary-button, .rr-client-secondary-button) {
    min-height: 44px;
  }
}

/* ---------- Accessibility / comfort ---------- */
@media (prefers-reduced-motion: reduce) {
  .rr-app-body *, .rr-app-body *::before, .rr-app-body *::after,
  .rr-client-body *, .rr-client-body *::before, .rr-client-body *::after,
  .rr-lo-body *, .rr-lo-body *::before, .rr-lo-body *::after,
  .rr-auth-estate-body *, .rr-auth-estate-body *::before, .rr-auth-estate-body *::after,
  .rr-access-body *, .rr-access-body *::before, .rr-access-body *::after,
  .rr-public-body *, .rr-public-body *::before, .rr-public-body *::after,
  .rr-feed-body *, .rr-feed-body *::before, .rr-feed-body *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media (pointer: coarse) {
  .rr-app-body :where(.btn, .rr-platform-btn, .dropdown-item, .page-link),
  .rr-client-body :where(.btn, button, .dropdown-item),
  .rr-lo-body :where(.btn, button, .dropdown-item) {
    min-height: 44px;
  }
}