/*
  TuroVA Material UI layer
  Server-rendered Material-style component skin for dashboard and auth pages.
*/

:root {
  --mui-font-family: "Roboto", Arial, Helvetica, sans-serif;
  --mui-display-family: "Montserrat", "Roboto", Arial, Helvetica, sans-serif;
  --mui-button-font-size-small: 13px;
  --mui-button-font-size-medium: 14px;
  --mui-button-font-size-large: 15px;
  --mui-button-font-size: var(--mui-button-font-size-medium);
  --mui-primary: #1565c0;
  --mui-primary-hover: #0d47a1;
  --mui-primary-soft: rgba(21, 101, 192, 0.1);
  --mui-secondary: #d32f2f;
  --mui-secondary-soft: rgba(211, 47, 47, 0.1);
  --mui-success: #2e7d32;
  --mui-success-soft: rgba(46, 125, 50, 0.1);
  --mui-warning: #ed6c02;
  --mui-warning-soft: rgba(237, 108, 2, 0.12);
  --mui-error: #d32f2f;
  --mui-error-soft: rgba(211, 47, 47, 0.1);
  --mui-info: #0288d1;
  --mui-info-soft: rgba(2, 136, 209, 0.1);
  --mui-bg: #f7f9fc;
  --mui-bg-strong: #eef3f8;
  --mui-surface: #ffffff;
  --mui-surface-variant: #f8fafc;
  --mui-outline: rgba(15, 23, 42, 0.12);
  --mui-outline-strong: rgba(15, 23, 42, 0.2);
  --mui-text: #17202f;
  --mui-text-muted: #5f6b7a;
  --mui-radius-xs: 4px;
  --mui-radius-sm: 6px;
  --mui-radius-md: 8px;
  --mui-radius-lg: 12px;
  --mui-elevation-1: 0 1px 2px rgba(15, 23, 42, 0.1), 0 1px 3px rgba(15, 23, 42, 0.08);
  --mui-elevation-2: 0 3px 6px rgba(15, 23, 42, 0.1), 0 8px 20px rgba(15, 23, 42, 0.08);
  --mui-elevation-3: 0 8px 16px rgba(15, 23, 42, 0.12), 0 18px 42px rgba(15, 23, 42, 0.1);
  --mui-elevation-modal: 0 18px 40px rgba(15, 23, 42, 0.22), 0 32px 70px rgba(15, 23, 42, 0.18);
  --mui-focus-ring: 0 0 0 3px rgba(21, 101, 192, 0.18);
  --mui-state-hover: rgba(21, 101, 192, 0.06);
  --mui-state-selected: rgba(21, 101, 192, 0.12);
  --mui-motion-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --mui-motion-normal: 220ms cubic-bezier(0.4, 0, 0.2, 1);
}

body.dashboard-page,
body.auth-page {
  color: var(--mui-text);
  background: var(--mui-bg);
  font-family: var(--mui-font-family);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.dashboard-page button,
.dashboard-page input[type="button"],
.dashboard-page input[type="submit"],
.dashboard-page input[type="reset"],
.dashboard-page .dashboard-button,
.dashboard-page .dashboard-link-button,
.dashboard-page .trip-card__action,
.dashboard-page .car-card__ai-trigger,
.dashboard-page .dashboard-modal__close,
.dashboard-page .turova-toast__close,
.dashboard-page .trip-photo-upload__remove,
.dashboard-page .trip-incidentals__remove,
.auth-page button,
.auth-page input[type="button"],
.auth-page input[type="submit"],
.auth-page input[type="reset"],
.auth-page .sc-button,
.auth-page .auth-social-button {
  font-family: var(--mui-font-family);
  font-size: var(--turova-button-font-size, var(--mui-button-font-size));
}

.dashboard-page {
  --dashboard-bg: var(--mui-bg);
  --dashboard-surface: var(--mui-surface);
  --dashboard-surface-strong: var(--mui-surface-variant);
  --dashboard-border: var(--mui-outline);
  --dashboard-text: var(--mui-text);
  --dashboard-muted: var(--mui-text-muted);
  --dashboard-accent: var(--mui-primary);
  --dashboard-accent-deep: var(--mui-primary-hover);
  --dashboard-accent-soft: var(--mui-primary-soft);
  --dashboard-success: var(--mui-success);
  --dashboard-warning: var(--mui-warning);
  --dashboard-sidebar: var(--mui-surface);
  --dashboard-sidebar-text: var(--mui-text);
  --dashboard-radius-xs: var(--mui-radius-xs);
  --dashboard-radius-sm: var(--mui-radius-sm);
  --dashboard-radius-md: var(--mui-radius-md);
}

.auth-page {
  --auth-ink: var(--mui-text);
  --auth-muted: var(--mui-text-muted);
  --auth-border: var(--mui-outline);
  --auth-panel: var(--mui-surface);
  --auth-shadow: var(--mui-elevation-3);
  --auth-accent: var(--mui-secondary);
  --auth-accent-alt: var(--mui-primary);
  --auth-success: var(--mui-success);
}

.dashboard-brand h1,
.dashboard-header h2,
.dashboard-panel h3,
.dashboard-panel h4,
.dashboard-modal__header h3,
.auth-hero h1,
.auth-brand-row h2,
.auth-section__header h3,
.auth-admin-editor__header h4 {
  font-family: var(--mui-display-family);
  letter-spacing: 0;
}

.dashboard-header h2,
.auth-brand-row h2 {
  color: var(--mui-text);
}

.dashboard-brand__eyebrow,
.dashboard-header__eyebrow,
.dashboard-panel__eyebrow,
.dashboard-summary-card__label,
.account-summary-card__label,
.account-label,
.auth-eyebrow,
.auth-brand-row__eyebrow,
.auth-summary-item__label,
.auth-section__eyebrow {
  letter-spacing: 0;
  color: var(--mui-text-muted);
}

.dashboard-sidebar {
  box-shadow: var(--mui-elevation-1);
}

.dashboard-brand h1,
.auth-wordmark {
  color: var(--mui-primary);
  font-weight: 800;
}

.dashboard-nav__item,
.dashboard-user-card,
.dashboard-panel,
.dashboard-summary-card,
.dashboard-command-strip,
.dashboard-action-card,
.notification-card,
.account-summary-card,
.account-admin-editor,
.account-user-list__item,
.account-user-card,
.car-card,
.trip-card,
.trip-license-verification__renter div,
.trip-license-verification__compare,
.trip-incidentals__extracted,
.auth-panel,
.auth-summary-item,
.auth-user-list__item,
.auth-admin-editor,
.auth-recaptcha {
  border-color: var(--mui-outline);
  border-radius: var(--mui-radius-md);
  background: var(--mui-surface);
  box-shadow: var(--mui-elevation-1);
}

.dashboard-panel,
.auth-panel {
  box-shadow: var(--mui-elevation-2);
}

.dashboard-summary-card,
.account-summary-card,
.auth-summary-item {
  position: relative;
  overflow: hidden;
}

.dashboard-summary-card::before,
.account-summary-card::before,
.auth-summary-item::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg, var(--mui-primary), var(--mui-secondary));
  opacity: 0.84;
}

.dashboard-summary-card strong,
.account-summary-card strong,
.auth-summary-item strong {
  color: var(--mui-text);
  font-weight: 700;
}

.dashboard-action-card,
.account-user-list__item,
.account-user-card,
.car-card--clickable,
.trip-card,
.notification-card,
.auth-user-list__item {
  transition:
    background-color var(--mui-motion-fast),
    border-color var(--mui-motion-fast),
    box-shadow var(--mui-motion-fast),
    transform var(--mui-motion-fast);
}

.dashboard-action-card:hover,
.dashboard-action-card:focus,
.account-user-list__item:hover,
.account-user-list__item:focus,
.account-user-card:hover,
.account-user-card:focus,
.car-card--clickable:hover,
.car-card--clickable:focus-within,
.trip-card:hover,
.trip-card:focus-within,
.notification-card:hover,
.auth-user-list__item:hover,
.auth-user-list__item:focus {
  border-color: rgba(21, 101, 192, 0.32);
  background: #ffffff;
  box-shadow: var(--mui-elevation-2);
  transform: translateY(-1px);
}

.dashboard-nav__item {
  position: relative;
  min-height: 48px;
  border-radius: var(--mui-radius-lg);
  box-shadow: none;
  overflow: hidden;
}

.dashboard-nav__item::before,
.dashboard-button::before,
.dashboard-modal__close::before,
.trip-card__action::before,
.sc-button::before,
.auth-social-button::before {
  content: "";
  position: absolute;
  inset: 0;
  background: currentColor;
  opacity: 0;
  transition: opacity var(--mui-motion-fast);
  pointer-events: none;
}

.dashboard-nav__item:hover::before,
.dashboard-nav__item:focus::before,
.dashboard-button:hover::before,
.dashboard-button:focus::before,
.dashboard-modal__close:hover::before,
.dashboard-modal__close:focus::before,
.trip-card__action:hover::before,
.trip-card__action:focus::before,
.sc-button:hover::before,
.sc-button:focus::before,
.auth-social-button:hover::before,
.auth-social-button:focus::before {
  opacity: 0.06;
}

.dashboard-nav__item.is-active {
  color: #ffffff;
  border-color: var(--mui-primary);
  background: var(--mui-primary);
  box-shadow: var(--mui-elevation-1);
}

.dashboard-chip,
.dashboard-stat,
.dashboard-nav__badge,
.account-pill,
.auth-brand-row__chip,
.trip-photo-upload__count,
.trip-incidentals__count,
.trip-statistics-table__today {
  min-height: 32px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: var(--mui-primary-soft);
  color: var(--mui-primary-hover);
  font-weight: 700;
}

.dashboard-chip--subtle,
.account-pill--subtle,
.auth-brand-row__chip {
  background: var(--mui-secondary-soft);
  color: var(--mui-secondary);
}

.account-pill--success,
.turova-toast--success {
  color: var(--mui-success);
}

.account-pill--warning,
.account-pill--pending,
.turova-toast--warning {
  color: var(--mui-warning);
}

.account-pill--danger,
.dashboard-message--error,
.auth-message--error,
.turova-toast--error {
  color: var(--mui-error);
}

.dashboard-button,
.dashboard-modal__close,
.trip-card__action,
.auth-page .sc-button,
.auth-social-button {
  --turova-button-bg: transparent;
  --turova-button-border: transparent;
  --turova-button-color: var(--mui-primary);
  --turova-button-shadow: none;
  --turova-button-hover-bg: var(--mui-state-hover);
  --turova-button-hover-border: transparent;
  --turova-button-hover-color: var(--mui-primary-hover);
  --turova-button-hover-shadow: none;
  appearance: none;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid var(--turova-button-border);
  border-radius: var(--mui-radius-sm);
  background: var(--turova-button-bg);
  color: var(--turova-button-color);
  font-family: var(--mui-font-family);
  font-size: var(--turova-button-font-size, var(--mui-button-font-size));
  font-weight: 600;
  line-height: 1.75;
  letter-spacing: 0;
  text-transform: none;
  vertical-align: middle;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  box-shadow: var(--turova-button-shadow);
  transition:
    background-color var(--mui-motion-fast),
    border-color var(--mui-motion-fast),
    color var(--mui-motion-fast),
    box-shadow var(--mui-motion-fast),
    transform var(--mui-motion-fast);
}

.dashboard-button,
.dashboard-modal__close,
.auth-page .sc-button {
  min-height: 42px;
  padding-inline: 18px;
}

.dashboard-button:hover,
.dashboard-button:focus,
.dashboard-modal__close:hover,
.dashboard-modal__close:focus,
.trip-card__action:hover,
.trip-card__action:focus,
.auth-page .sc-button:hover,
.auth-page .sc-button:focus,
.auth-social-button:hover,
.auth-social-button:focus {
  border-color: var(--turova-button-hover-border);
  background: var(--turova-button-hover-bg);
  color: var(--turova-button-hover-color);
  box-shadow: var(--turova-button-hover-shadow);
  text-decoration: none;
}

.dashboard-button--text,
.dashboard-link-button,
.auth-page .sc-button-text {
  --turova-button-bg: transparent;
  --turova-button-border: transparent;
  --turova-button-color: var(--mui-primary);
  --turova-button-shadow: none;
  --turova-button-hover-bg: var(--mui-state-hover);
  --turova-button-hover-border: transparent;
  --turova-button-hover-color: var(--mui-primary-hover);
  --turova-button-hover-shadow: none;
}

.dashboard-button--primary,
.dashboard-button--contained,
.auth-page .sc-button-primary,
.auth-page .sc-button-danger,
.auth-page .sc-button-large:not(.sc-button-outline) {
  --turova-button-bg: var(--mui-primary);
  --turova-button-border: var(--mui-primary);
  --turova-button-color: #ffffff;
  --turova-button-shadow: var(--mui-elevation-1);
  --turova-button-hover-bg: var(--mui-primary-hover);
  --turova-button-hover-border: var(--mui-primary-hover);
  --turova-button-hover-color: #ffffff;
  --turova-button-hover-shadow: var(--mui-elevation-2);
}

.dashboard-button--ghost,
.dashboard-button--outlined,
.dashboard-modal__close,
.auth-page .sc-button-outline,
.auth-social-button {
  --turova-button-bg: var(--mui-surface);
  --turova-button-border: rgba(21, 101, 192, 0.5);
  --turova-button-color: var(--mui-primary);
  --turova-button-shadow: none;
  --turova-button-hover-bg: var(--mui-state-hover);
  --turova-button-hover-border: var(--mui-primary);
  --turova-button-hover-color: var(--mui-primary-hover);
  --turova-button-hover-shadow: none;
}

.dashboard-button--ghost.is-active {
  --turova-button-bg: var(--mui-state-selected);
  --turova-button-border: var(--mui-primary);
  --turova-button-color: var(--mui-primary-hover);
}

.auth-social-button {
  --turova-button-border: var(--mui-outline);
  --turova-button-color: var(--mui-text);
  --turova-button-hover-border: rgba(21, 101, 192, 0.32);
  --turova-button-hover-color: var(--mui-text);
}

.auth-social-button--facebook {
  --turova-button-color: var(--auth-facebook);
  --turova-button-hover-color: var(--auth-facebook);
}

.dashboard-button--secondary {
  --turova-button-color: var(--mui-secondary);
  --turova-button-hover-bg: var(--mui-secondary-soft);
  --turova-button-hover-border: var(--mui-secondary);
  --turova-button-hover-color: #b71c1c;
}

.dashboard-button--success {
  --turova-button-color: var(--mui-success);
  --turova-button-hover-bg: var(--mui-success-soft);
  --turova-button-hover-border: var(--mui-success);
  --turova-button-hover-color: #1b5e20;
}

.dashboard-button--warning {
  --turova-button-color: var(--mui-warning);
  --turova-button-hover-bg: var(--mui-warning-soft);
  --turova-button-hover-border: var(--mui-warning);
  --turova-button-hover-color: #b45309;
}

.dashboard-button--info {
  --turova-button-color: var(--mui-info);
  --turova-button-hover-bg: var(--mui-info-soft);
  --turova-button-hover-border: var(--mui-info);
  --turova-button-hover-color: #01579b;
}

.dashboard-button--error,
.dashboard-button--danger,
.auth-page .sc-button.sc-button-danger {
  --turova-button-color: var(--mui-error);
  --turova-button-hover-bg: var(--mui-error-soft);
  --turova-button-hover-border: var(--mui-error);
  --turova-button-hover-color: #b71c1c;
}

.dashboard-button--ghost.dashboard-button--secondary,
.dashboard-button--outlined.dashboard-button--secondary {
  --turova-button-border: rgba(211, 47, 47, 0.5);
}

.dashboard-button--ghost.dashboard-button--success,
.dashboard-button--outlined.dashboard-button--success {
  --turova-button-border: rgba(46, 125, 50, 0.5);
}

.dashboard-button--ghost.dashboard-button--warning,
.dashboard-button--outlined.dashboard-button--warning {
  --turova-button-border: rgba(237, 108, 2, 0.5);
}

.dashboard-button--ghost.dashboard-button--info,
.dashboard-button--outlined.dashboard-button--info {
  --turova-button-border: rgba(2, 136, 209, 0.5);
}

.dashboard-button--ghost.dashboard-button--error,
.dashboard-button--ghost.dashboard-button--danger,
.dashboard-button--outlined.dashboard-button--error,
.dashboard-button--outlined.dashboard-button--danger {
  --turova-button-border: rgba(211, 47, 47, 0.5);
}

.dashboard-button--primary.dashboard-button--secondary,
.dashboard-button--contained.dashboard-button--secondary,
.dashboard-button--primary.dashboard-button--error,
.dashboard-button--primary.dashboard-button--danger,
.dashboard-button--contained.dashboard-button--error,
.dashboard-button--contained.dashboard-button--danger,
.auth-page .sc-button.sc-button-danger {
  --turova-button-bg: var(--mui-secondary);
  --turova-button-border: var(--mui-secondary);
  --turova-button-color: #ffffff;
  --turova-button-shadow: var(--mui-elevation-1);
  --turova-button-hover-bg: #b71c1c;
  --turova-button-hover-border: #b71c1c;
  --turova-button-hover-color: #ffffff;
  --turova-button-hover-shadow: var(--mui-elevation-2);
}

.dashboard-button--primary.dashboard-button--success,
.dashboard-button--contained.dashboard-button--success {
  --turova-button-bg: var(--mui-success);
  --turova-button-border: var(--mui-success);
  --turova-button-color: #ffffff;
  --turova-button-shadow: var(--mui-elevation-1);
  --turova-button-hover-bg: #1b5e20;
  --turova-button-hover-border: #1b5e20;
  --turova-button-hover-color: #ffffff;
  --turova-button-hover-shadow: var(--mui-elevation-2);
}

.dashboard-button--primary.dashboard-button--warning,
.dashboard-button--contained.dashboard-button--warning {
  --turova-button-bg: var(--mui-warning);
  --turova-button-border: var(--mui-warning);
  --turova-button-color: #ffffff;
  --turova-button-shadow: var(--mui-elevation-1);
  --turova-button-hover-bg: #e65100;
  --turova-button-hover-border: #e65100;
  --turova-button-hover-color: #ffffff;
  --turova-button-hover-shadow: var(--mui-elevation-2);
}

.dashboard-button--primary.dashboard-button--info,
.dashboard-button--contained.dashboard-button--info {
  --turova-button-bg: var(--mui-info);
  --turova-button-border: var(--mui-info);
  --turova-button-color: #ffffff;
  --turova-button-shadow: var(--mui-elevation-1);
  --turova-button-hover-bg: #01579b;
  --turova-button-hover-border: #01579b;
  --turova-button-hover-color: #ffffff;
  --turova-button-hover-shadow: var(--mui-elevation-2);
}

.dashboard-button--text,
.dashboard-button--ghost.dashboard-button--text,
.dashboard-button--outlined.dashboard-button--text,
.auth-page .sc-button-text {
  --turova-button-bg: transparent;
  --turova-button-border: transparent;
  --turova-button-shadow: none;
  --turova-button-hover-border: transparent;
  --turova-button-hover-shadow: none;
}

.dashboard-button:active,
.dashboard-modal__close:active,
.trip-card__action:active,
.auth-page .sc-button:active {
  transform: translateY(0);
  box-shadow: none;
}

.dashboard-button:focus-visible,
.dashboard-modal__close:focus-visible,
.trip-card__action:focus-visible,
.dashboard-nav__item:focus-visible,
.dashboard-summary-card--interactive:focus-visible,
.dashboard-link-button:focus-visible,
.auth-page .sc-button:focus-visible,
.auth-social-button:focus-visible,
.auth-page a:focus-visible {
  outline: 0;
  box-shadow: var(--mui-focus-ring);
}

.dashboard-button:disabled,
.dashboard-button[disabled],
.dashboard-button.is-disabled,
.dashboard-button[aria-disabled="true"],
.trip-card__action[disabled],
.auth-page .sc-button:disabled,
.auth-social-button[aria-disabled="true"] {
  background: rgba(15, 23, 42, 0.08);
  border-color: transparent;
  color: rgba(15, 23, 42, 0.38);
  box-shadow: none;
}

.dashboard-button--text:disabled,
.dashboard-button--text[disabled],
.dashboard-button--text.is-disabled,
.dashboard-button--text[aria-disabled="true"],
.auth-page .sc-button-text:disabled {
  background: transparent;
  border-color: transparent;
}

.dashboard-button--ghost:disabled,
.dashboard-button--ghost[disabled],
.dashboard-button--ghost.is-disabled,
.dashboard-button--ghost[aria-disabled="true"],
.dashboard-button--outlined:disabled,
.dashboard-button--outlined[disabled],
.dashboard-button--outlined.is-disabled,
.dashboard-button--outlined[aria-disabled="true"],
.auth-page .sc-button-outline:disabled {
  background: var(--mui-surface);
  border-color: rgba(15, 23, 42, 0.12);
}

.dashboard-button--tiny {
  --turova-button-font-size: var(--mui-button-font-size-small);
  min-height: 30px;
  padding: 3px 10px;
}

.dashboard-button--large,
.auth-page .sc-button-large {
  --turova-button-font-size: var(--mui-button-font-size-large);
  min-height: 44px;
  padding-inline: 22px;
}

.dashboard-link-button {
  --turova-button-font-size: var(--mui-button-font-size-small);
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 3px 8px;
  border-radius: var(--mui-radius-xs);
  color: var(--mui-primary);
  font-weight: 600;
  text-decoration: none;
  transition:
    background-color var(--mui-motion-fast),
    color var(--mui-motion-fast),
    box-shadow var(--mui-motion-fast);
}

.dashboard-link-button:hover,
.dashboard-link-button:focus {
  background: var(--mui-state-hover);
  color: var(--mui-primary-hover);
  text-decoration: none;
}

.dashboard-button-group {
  display: inline-flex;
  align-items: stretch;
  border: 0;
  border-radius: var(--mui-radius-sm);
  overflow: visible;
  background: transparent;
  box-shadow: none;
}

.dashboard-button-group .dashboard-button {
  border: 1px solid rgba(21, 101, 192, 0.5);
  border-radius: 0;
  color: var(--mui-primary);
  background: var(--mui-surface);
  box-shadow: none;
}

.dashboard-button-group .dashboard-button:not(:first-child) {
  margin-left: -1px;
}

.dashboard-button-group .dashboard-button:first-child {
  border-top-left-radius: var(--mui-radius-sm);
  border-bottom-left-radius: var(--mui-radius-sm);
}

.dashboard-button-group .dashboard-button:last-child {
  border-right: 1px solid rgba(21, 101, 192, 0.5);
  border-top-right-radius: var(--mui-radius-sm);
  border-bottom-right-radius: var(--mui-radius-sm);
}

.dashboard-button-group .dashboard-button:hover,
.dashboard-button-group .dashboard-button:focus {
  z-index: 1;
  border-color: var(--mui-primary);
  background: var(--mui-state-hover);
  box-shadow: none;
}

.dashboard-button-group .dashboard-button:disabled,
.dashboard-button-group .dashboard-button[disabled] {
  border-color: rgba(15, 23, 42, 0.12);
  background: var(--mui-surface);
  color: rgba(15, 23, 42, 0.38);
}

.dashboard-page .uk-input,
.dashboard-page .uk-select,
.dashboard-page .uk-textarea,
.auth-page .uk-input,
.auth-page .uk-select,
.auth-page .uk-textarea,
.trip-odometer-gas__field select,
.trip-odometer-gas__field input,
.trip-incidentals__message textarea {
  min-height: 48px;
  border: 1px solid var(--mui-outline);
  border-radius: var(--mui-radius-sm);
  background: var(--mui-surface);
  color: var(--mui-text);
  box-shadow: none;
  font-family: var(--mui-font-family);
  transition:
    border-color var(--mui-motion-fast),
    box-shadow var(--mui-motion-fast),
    background-color var(--mui-motion-fast);
}

.dashboard-page .uk-input:hover,
.dashboard-page .uk-select:hover,
.dashboard-page .uk-textarea:hover,
.auth-page .uk-input:hover,
.auth-page .uk-select:hover,
.auth-page .uk-textarea:hover,
.trip-odometer-gas__field select:hover,
.trip-odometer-gas__field input:hover,
.trip-incidentals__message textarea:hover {
  border-color: var(--mui-outline-strong);
}

.dashboard-page .uk-input:focus,
.dashboard-page .uk-select:focus,
.dashboard-page .uk-textarea:focus,
.auth-page .uk-input:focus,
.auth-page .uk-select:focus,
.auth-page .uk-textarea:focus,
.trip-odometer-gas__field select:focus,
.trip-odometer-gas__field input:focus,
.trip-incidentals__message textarea:focus {
  border-color: var(--mui-primary);
  box-shadow: var(--mui-focus-ring);
  outline: 0;
}

.dashboard-page input[type="checkbox"],
.dashboard-page input[type="radio"],
.auth-page input[type="checkbox"],
.auth-page input[type="radio"] {
  accent-color: var(--mui-primary);
}

.account-checkbox,
.auth-checkbox,
.trip-incidentals__category,
.trip-license-verification__check {
  border-radius: var(--mui-radius-sm);
  transition:
    background-color var(--mui-motion-fast),
    border-color var(--mui-motion-fast),
    box-shadow var(--mui-motion-fast);
}

.account-checkbox:hover,
.auth-checkbox:hover,
.trip-incidentals__category:hover,
.trip-license-verification__check:hover {
  border-color: rgba(21, 101, 192, 0.28);
  background: var(--mui-state-hover);
}

.dashboard-metric-strip,
.account-summary-grid,
.account-card-board,
.cars-card-grid,
.trip-photo-upload__grid,
.trip-incidentals__preview-panel,
.charge-incidental__preview-grid {
  gap: 16px;
}

.dashboard-grid,
.account-admin-layout {
  gap: 24px;
}

.dashboard-modal::backdrop {
  background: rgba(15, 23, 42, 0.44);
  backdrop-filter: blur(4px);
}

.dashboard-modal,
.dashboard-modal[open] {
  max-height: none;
  overflow: visible;
}

.dashboard-modal__dialog {
  border-radius: var(--mui-radius-lg);
  border-color: transparent;
  overscroll-behavior: contain;
  box-shadow: var(--mui-elevation-modal);
}

.dashboard-modal__header {
  padding-bottom: 18px;
  border-bottom: 1px solid var(--mui-outline);
}

.dashboard-modal__close {
  flex: 0 0 auto;
}

.dashboard-message,
.auth-message,
.account-field-errors--global,
.auth-field-errors--global,
.fleet-inline-note,
.trip-license-verification__loading {
  border-radius: var(--mui-radius-md);
  box-shadow: none;
}

.dashboard-message--success,
.auth-message--success {
  border-color: rgba(46, 125, 50, 0.2);
  background: var(--mui-success-soft);
  color: var(--mui-success);
}

.dashboard-message--error,
.auth-message--error,
.account-field-errors--global,
.auth-field-errors--global {
  border-color: rgba(211, 47, 47, 0.18);
  background: var(--mui-error-soft);
}

.dashboard-message--info,
.auth-message--info {
  border-color: rgba(2, 136, 209, 0.2);
  background: var(--mui-info-soft);
  color: var(--mui-info);
}

.turova-toast {
  border-radius: var(--mui-radius-md);
  border-left-width: 5px;
  box-shadow: var(--mui-elevation-3);
}

.turova-toast[data-toast-click-url] {
  cursor: pointer;
}

.turova-toast__close,
.trip-photo-upload__remove,
.trip-incidentals__remove {
  --turova-button-font-size: var(--mui-button-font-size-small);
  border-color: transparent;
  border-radius: var(--mui-radius-xs);
  background: transparent;
  color: var(--mui-text-muted);
  box-shadow: none;
  transition:
    background-color var(--mui-motion-fast),
    color var(--mui-motion-fast),
    box-shadow var(--mui-motion-fast),
    transform var(--mui-motion-fast);
}

.turova-toast__close:hover,
.turova-toast__close:focus {
  background: var(--mui-state-hover);
  color: var(--mui-text);
  box-shadow: none;
}

.trip-photo-upload__remove:hover,
.trip-photo-upload__remove:focus,
.trip-incidentals__remove:hover,
.trip-incidentals__remove:focus {
  border-color: transparent;
  background: var(--mui-error-soft);
  color: var(--mui-error);
  box-shadow: none;
}

.trip-photo-upload__picker,
.trip-incidentals__picker {
  border-color: rgba(21, 101, 192, 0.32);
  border-radius: var(--mui-radius-md);
  background: var(--mui-primary-soft);
}

.trip-photo-upload__item,
.trip-incidentals__preview-item,
.charge-incidental__preview-item,
.cars-vin-excel-action {
  border-radius: var(--mui-radius-md);
  background: var(--mui-surface);
  box-shadow: var(--mui-elevation-1);
}

.trip-card__actions {
  border: 0;
  border-radius: var(--mui-radius-sm);
  overflow: visible;
  background: transparent;
}

.trip-card__action {
  --turova-button-font-size: var(--mui-button-font-size-small);
  border: 1px solid rgba(21, 101, 192, 0.5);
  border-radius: 0;
  color: var(--mui-primary);
  background: var(--mui-surface);
}

.trip-card__action:not(:first-child) {
  margin-left: -1px;
}

.trip-card__action:first-child {
  border-top-left-radius: var(--mui-radius-sm);
  border-bottom-left-radius: var(--mui-radius-sm);
}

.trip-card__action:last-child {
  border-right: 1px solid rgba(21, 101, 192, 0.5);
  border-top-right-radius: var(--mui-radius-sm);
  border-bottom-right-radius: var(--mui-radius-sm);
}

.trip-card__action:hover,
.trip-card__action:focus {
  z-index: 1;
  border-color: var(--mui-primary);
  background: var(--mui-state-hover);
}

.trip-card__action--status-awaiting,
.trip-card__action--status-awaiting:hover,
.trip-card__action--status-awaiting:focus,
.trip-card__action.trip-card__action--status-awaiting[disabled] {
  border-color: rgba(237, 108, 2, 0.5);
  color: var(--mui-warning);
  background: var(--mui-warning-soft);
}

.trip-card__action--status-verified,
.trip-card__action--status-verified:hover,
.trip-card__action--status-verified:focus,
.trip-card__action.trip-card__action--status-verified[disabled] {
  border-color: rgba(46, 125, 50, 0.5);
  color: var(--mui-success);
  background: var(--mui-success-soft);
}

.trip-card__action--status-required,
.trip-card__action--status-required:hover,
.trip-card__action--status-required:focus,
.trip-card__action.trip-card__action--status-required[disabled] {
  border-color: rgba(15, 23, 42, 0.16);
  color: var(--mui-text-muted);
  background: rgba(15, 23, 42, 0.04);
}

.trip-card__action--ai-approve-off,
.trip-card__action--ai-approve-off:hover,
.trip-card__action--ai-approve-off:focus,
.trip-card__action.trip-card__action--ai-approve-off[disabled] {
  border-color: rgba(15, 23, 42, 0.16);
  color: var(--mui-text-muted);
  background: rgba(15, 23, 42, 0.04);
}

.trip-card__action--ai-approve-on,
.trip-card__action--ai-approve-on:hover,
.trip-card__action--ai-approve-on:focus,
.trip-card__action.trip-card__action--ai-approve-on[disabled] {
  border-color: rgba(46, 125, 50, 0.5);
  color: var(--mui-success);
  background: var(--mui-success-soft);
  font-weight: 700;
}

.car-card__ai-trigger {
  border-color: rgba(100, 116, 139, 0.34);
  background: #f1f5f9;
  color: #475569;
  box-shadow: var(--mui-elevation-2);
}

.car-card__ai-trigger:hover,
.car-card__ai-trigger:focus,
.car-card__ai-trigger[aria-expanded="true"] {
  border-color: rgba(100, 116, 139, 0.48);
  background: #64748b;
  color: #ffffff;
  box-shadow: var(--mui-elevation-3);
}

.car-card__ai-trigger.is-active,
.car-card__ai-trigger.is-active[aria-expanded="true"] {
  border-color: var(--mui-success);
  background: var(--mui-success);
  color: #ffffff;
  box-shadow:
    0 0 0 4px rgba(46, 125, 50, 0.16),
    var(--mui-elevation-2);
}

.car-card__ai-trigger.is-active:hover,
.car-card__ai-trigger.is-active:focus {
  border-color: #1b5e20;
  background: #1b5e20;
  color: #ffffff;
  box-shadow:
    0 0 0 5px rgba(46, 125, 50, 0.18),
    var(--mui-elevation-3);
}

.trip-card__guest-avatar,
.account-user-card__avatar,
.notification-card__avatar {
  background: var(--mui-primary-soft);
  color: var(--mui-primary);
}

.trip-card__vehicle-image,
.trip-card__vehicle-placeholder,
.car-card__image-wrap,
.notification-card__image,
.notification-card__avatar,
.cars-vin-row__image-link,
.trip-license-verification__photo-button,
.trip-license-photo-modal__image {
  border-radius: var(--mui-radius-md);
}

.trip-statistics-table {
  overflow: hidden;
  border: 1px solid var(--mui-outline);
  border-radius: var(--mui-radius-md);
  border-collapse: separate;
  border-spacing: 0;
  background: var(--mui-surface);
}

.trip-statistics-table thead th {
  background: var(--mui-surface-variant);
  color: var(--mui-text-muted);
}

.trip-statistics-table tbody tr {
  transition: background-color var(--mui-motion-fast);
}

.trip-statistics-table tbody tr:hover {
  background: var(--mui-state-hover);
}

.auth-shell {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.7), rgba(247, 249, 252, 0.98)),
    var(--mui-bg);
}

.auth-grid {
  border-radius: var(--mui-radius-lg);
  box-shadow: var(--mui-elevation-3);
}

.auth-hero {
  background:
    linear-gradient(145deg, rgba(9, 18, 31, 0.1), rgba(9, 18, 31, 0.82)),
    linear-gradient(135deg, #0f172a 0%, #1565c0 58%, #d32f2f 100%);
}

.auth-hero::before {
  display: none;
}

.auth-wordmark {
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--mui-elevation-1);
}

.auth-feature-list li::before {
  background: var(--mui-secondary);
  box-shadow: 0 0 0 5px rgba(211, 47, 47, 0.16);
}

.auth-panel {
  border-color: transparent;
  border-radius: var(--mui-radius-lg);
}

.auth-separator::before {
  background: var(--mui-outline);
}

.auth-separator span {
  background: var(--mui-surface);
}

.auth-social-button--google:hover,
.auth-social-button--google:focus,
.auth-social-button--facebook:hover,
.auth-social-button--facebook:focus {
  background: var(--mui-state-hover);
}

@keyframes turova-mui-rise-in {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes turova-mui-scale-in {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.985);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes turova-mui-soft-pop {
  0% {
    transform: scale(0.98);
  }

  70% {
    transform: scale(1.015);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes turova-mui-toast-in {
  from {
    opacity: 0;
    transform: translateY(-10px) scale(0.98);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes turova-mui-sheen {
  from {
    transform: translateX(-125%) skewX(-16deg);
  }

  to {
    transform: translateX(125%) skewX(-16deg);
  }
}

@media (prefers-reduced-motion: no-preference) {
  .dashboard-header,
  .dashboard-metric-strip,
  .dashboard-command-strip,
  .dashboard-panel,
  .auth-grid,
  .auth-hero__content,
  .auth-panel {
    animation: turova-mui-rise-in 420ms var(--mui-motion-normal) backwards;
  }

  .dashboard-summary-card,
  .dashboard-action-card,
  .notification-card,
  .account-summary-card,
  .account-user-card,
  .account-user-list__item,
  .car-card,
  .trip-card,
  .trip-photo-upload__item,
  .trip-incidentals__preview-item,
  .charge-incidental__preview-item,
  .auth-summary-item,
  .auth-user-list__item {
    animation: turova-mui-rise-in 360ms var(--mui-motion-normal) backwards;
  }

  .dashboard-summary-card:nth-child(2),
  .dashboard-action-card:nth-child(2),
  .notification-card:nth-child(2),
  .account-summary-card:nth-child(2),
  .account-user-card:nth-child(2),
  .car-card:nth-child(2),
  .trip-card:nth-child(2),
  .auth-summary-item:nth-child(2),
  .auth-user-list__item:nth-child(2) {
    animation-delay: 45ms;
  }

  .dashboard-summary-card:nth-child(3),
  .dashboard-action-card:nth-child(3),
  .notification-card:nth-child(3),
  .account-summary-card:nth-child(3),
  .account-user-card:nth-child(3),
  .car-card:nth-child(3),
  .trip-card:nth-child(3),
  .auth-summary-item:nth-child(3),
  .auth-user-list__item:nth-child(3) {
    animation-delay: 90ms;
  }

  .dashboard-summary-card:nth-child(4),
  .dashboard-action-card:nth-child(4),
  .notification-card:nth-child(4),
  .account-summary-card:nth-child(4),
  .account-user-card:nth-child(4),
  .car-card:nth-child(4),
  .trip-card:nth-child(4),
  .auth-summary-item:nth-child(4),
  .auth-user-list__item:nth-child(4) {
    animation-delay: 135ms;
  }

  .dashboard-summary-card:nth-child(5),
  .dashboard-action-card:nth-child(5),
  .notification-card:nth-child(5),
  .account-summary-card:nth-child(5),
  .account-user-card:nth-child(5),
  .car-card:nth-child(5),
  .trip-card:nth-child(5),
  .auth-summary-item:nth-child(5),
  .auth-user-list__item:nth-child(5) {
    animation-delay: 180ms;
  }

  .dashboard-summary-card:nth-child(n + 6),
  .dashboard-action-card:nth-child(n + 6),
  .notification-card:nth-child(n + 6),
  .account-summary-card:nth-child(n + 6),
  .account-user-card:nth-child(n + 6),
  .car-card:nth-child(n + 6),
  .trip-card:nth-child(n + 6),
  .auth-summary-item:nth-child(n + 6),
  .auth-user-list__item:nth-child(n + 6) {
    animation-delay: 225ms;
  }

  .dashboard-modal[open] .dashboard-modal__dialog {
    animation: turova-mui-scale-in 220ms var(--mui-motion-normal) backwards;
  }

  .turova-toast.is-visible {
    animation: turova-mui-toast-in 240ms var(--mui-motion-normal) backwards;
  }

  .dashboard-button:active,
  .dashboard-modal__close:active,
  .trip-card__action:active,
  .auth-page .sc-button:active,
  .auth-social-button:active {
    transform: scale(0.985);
  }

  .dashboard-button--primary::after,
  .auth-page .sc-button-primary::after,
  .auth-page .sc-button-danger::after,
  .auth-page .sc-button-large:not(.sc-button-outline)::after {
    content: "";
    position: absolute;
    inset: -35% auto -35% 0;
    width: 52%;
    background: linear-gradient(
      90deg,
      transparent,
      rgba(255, 255, 255, 0.28),
      transparent
    );
    opacity: 0;
    transform: translateX(-125%) skewX(-16deg);
    pointer-events: none;
  }

  .dashboard-button--primary:hover::after,
  .dashboard-button--primary:focus::after,
  .auth-page .sc-button-primary:hover::after,
  .auth-page .sc-button-primary:focus::after,
  .auth-page .sc-button-danger:hover::after,
  .auth-page .sc-button-danger:focus::after,
  .auth-page .sc-button-large:not(.sc-button-outline):hover::after,
  .auth-page .sc-button-large:not(.sc-button-outline):focus::after {
    opacity: 1;
    animation: turova-mui-sheen 760ms var(--mui-motion-normal);
  }

  .dashboard-nav__badge,
  .dashboard-chip,
  .dashboard-stat,
  .account-pill,
  .trip-photo-upload__count,
  .trip-incidentals__count {
    transition:
      background-color var(--mui-motion-fast),
      border-color var(--mui-motion-fast),
      color var(--mui-motion-fast),
      transform var(--mui-motion-fast);
  }

  .dashboard-nav__badge:hover,
  .dashboard-chip:hover,
  .dashboard-stat:hover,
  .account-pill:hover,
  .trip-photo-upload__count:hover,
  .trip-incidentals__count:hover {
    transform: translateY(-1px);
  }

  .account-checkbox:has(input:checked),
  .auth-checkbox:has(input:checked),
  .trip-incidentals__category:has(input:checked),
  .trip-license-verification__check:has(input:checked) {
    animation: turova-mui-soft-pop 220ms var(--mui-motion-normal);
    border-color: rgba(21, 101, 192, 0.35);
    background: var(--mui-state-selected);
  }

  .car-card__image,
  .trip-card__vehicle-image,
  .trip-photo-upload__preview,
  .trip-incidentals__preview-image,
  .charge-incidental__preview-image,
  .notification-card__image,
  .trip-license-verification__photo-button img,
  .account-user-card__avatar,
  .notification-card__avatar,
  .trip-card__guest-avatar {
    transition: transform var(--mui-motion-normal);
  }

  .car-card:hover .car-card__image,
  .car-card:focus-within .car-card__image,
  .trip-card:hover .trip-card__vehicle-image,
  .trip-card:focus-within .trip-card__vehicle-image,
  .notification-card:hover .notification-card__image,
  .trip-photo-upload__item:hover .trip-photo-upload__preview,
  .trip-incidentals__preview-item:hover .trip-incidentals__preview-image,
  .charge-incidental__preview-item:hover .charge-incidental__preview-image,
  .trip-license-verification__photo-button:hover img,
  .trip-license-verification__photo-button:focus img {
    transform: scale(1.025);
  }

  .account-user-card:hover .account-user-card__avatar,
  .account-user-card:focus .account-user-card__avatar,
  .notification-card:hover .notification-card__avatar,
  .trip-card:hover .trip-card__guest-avatar,
  .trip-card:focus-within .trip-card__guest-avatar {
    transform: scale(1.04);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 1ms !important;
  }
}

@media (max-width: 780px) {
  .dashboard-panel,
  .dashboard-modal__dialog,
  .auth-panel {
    border-radius: var(--mui-radius-md);
  }

  .dashboard-button,
  .dashboard-modal__close,
  .auth-page .sc-button {
    min-height: 44px;
  }
}
