@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/poppins-400-devanagari-0d84d9e9.woff2") format("woff2");
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/poppins-400-latin-63b2f885.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/poppins-500-devanagari-7e3331de.woff2") format("woff2");
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/poppins-500-latin-8a81ee6e.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/poppins-600-devanagari-f411cbbf.woff2") format("woff2");
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/poppins-600-latin-0c170bdd.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/poppins-700-devanagari-64beecfe.woff2") format("woff2");
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/poppins-700-latin-317ebe11.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* Nayara token set (docs/design/design-tokens.json) — anchors from the
     Nayara Energy logo: navy #10447C · cyan #0080A0 · green #18945C. */
  --fl-primary: #1d63b0;
  --fl-primary-strong: #10447c;
  --fl-primary-accent: #4c94e9;
  --fl-primary-contrast: #ffffff;
  --fl-primary-contrast-rgb: 255, 255, 255;
  --fl-primary-soft: rgba(29, 99, 176, 0.12);
  --fl-success: #18945c;
  --fl-info: #0080a0;
  --fl-warning: #cd7e00;
  --fl-danger: #df2935;
  --fl-bg: #f9fafc;
  --fl-surface: #ffffff;
  --fl-surface-elevated: #ffffff;
  --fl-surface-muted: #f1f3f5;
  --fl-text: #111820;
  --fl-muted: #636a71;
  --fl-border: #e2e5e9;
  --fl-shadow: 0 1rem 2.5rem rgba(16, 24, 40, 0.08);
  --fl-overlay: rgba(8, 15, 24, 0.6);
  --fl-gray-50: var(--fl-bg);
  --fl-gray-100: var(--fl-surface-muted);
  --fl-gray-200: var(--fl-border);
  --fl-gray-400: #a7acb2;
  --fl-gray-500: var(--fl-muted);
  --fl-gray-700: #4d535b;
  --fl-gray-800: var(--fl-text);
  --fl-shell-width: 240px;
  --fl-shell-width-collapsed: 60px;
  --fl-topbar-height: 56px;
  --bs-primary: var(--fl-primary);
  --bs-primary-rgb: 29, 99, 176;
  --bs-success-rgb: 24, 148, 92;
  --bs-info-rgb: 0, 128, 160;
  --bs-warning-rgb: 205, 126, 0;
  --bs-danger-rgb: 223, 41, 53;
  --bs-body-bg: var(--fl-bg);
  --bs-body-color: var(--fl-text);
  --bs-border-color: var(--fl-border);
  --bs-secondary-color: var(--fl-muted);
  --bs-secondary-bg: var(--fl-surface-muted);
  --bs-tertiary-bg: var(--fl-surface);
  /* Bootstrap's .bg-body / .bg-body-secondary / .bg-body-tertiary utilities read
     the *-rgb triples, not the vars above. Overriding only the vars left every
     such panel painted Bootstrap-light while the text followed the theme —
     white on white in dark mode. Keep each triple in step with its var. */
  --bs-body-bg-rgb: 249, 250, 252;
  --bs-secondary-bg-rgb: 241, 243, 245;
  --bs-tertiary-bg-rgb: 255, 255, 255;
  --bs-form-control-bg: var(--fl-surface);
  --bs-form-control-disabled-bg: var(--fl-surface-muted);
  --bs-form-select-bg: var(--fl-surface);
  --bs-form-select-disabled-bg: var(--fl-surface-muted);
  --bs-link-color: var(--fl-gray-700);
  --bs-link-hover-color: var(--fl-primary);
  color-scheme: light;
}

html[data-theme="dark"] {
  /* Nayara dark: navy-tinted surfaces, sky-300 primary (AA on #0F1822). */
  --fl-primary: #8fd0ff;
  --fl-primary-strong: #b9e4ff;
  --fl-primary-accent: #5cb4f0;
  --fl-primary-contrast: #052b54;
  --fl-primary-contrast-rgb: 5, 43, 84;
  --fl-primary-soft: rgba(143, 208, 255, 0.16);
  --fl-success: #97d9b1;
  --fl-info: #96d2e8;
  --fl-warning: #f8ba69;
  --fl-danger: #ffa8a1;
  --fl-bg: #080f18;
  --fl-surface: #0f1822;
  --fl-surface-elevated: #18212d;
  --fl-surface-muted: #242f3c;
  --fl-text: #f4f7fc;
  --fl-muted: #a7acb2;
  --fl-border: #242f3c;
  --fl-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.55);
  --fl-overlay: rgba(0, 0, 0, 0.7);
  --fl-gray-400: #838990;
  --fl-gray-700: #d0d4d9;
  --bs-body-bg-rgb: 8, 15, 24;
  --bs-secondary-bg-rgb: 36, 47, 60;
  --bs-tertiary-bg-rgb: 15, 24, 34;
  --bs-primary-rgb: 143, 208, 255;
  --bs-success-rgb: 151, 217, 177;
  --bs-info-rgb: 150, 210, 232;
  --bs-warning-rgb: 248, 186, 105;
  --bs-danger-rgb: 255, 168, 161;
  color-scheme: dark;
}

body {
  min-height: 100vh;
  font-family: "Poppins", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 0.9375rem;
  line-height: 1.45;
  background: radial-gradient(circle at top, rgba(29, 99, 176, 0.06), transparent 34%), var(--fl-gray-50);
  color: var(--fl-gray-800);
  overflow-x: hidden;
}

a {
  text-decoration: none;
}

html[data-theme="dark"] body {
  background: radial-gradient(circle at top, rgba(143, 208, 255, 0.08), transparent 36%), var(--fl-gray-50);
}

::selection {
  background: var(--fl-primary-soft);
  color: var(--fl-gray-800);
}

.overlay {
  position: fixed;
  inset: 0;
  background: var(--fl-overlay);
  backdrop-filter: blur(1px);
  display: none;
  z-index: 1030;
}

.overlay.show {
  display: block;
}

.sidebar {
  width: var(--fl-shell-width);
  background: var(--fl-surface);
  transition: width 0.3s, left 0.3s;
  border-right: 1px solid var(--fl-gray-200);
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  padding-top: var(--fl-topbar-height);
  padding-bottom: 1rem;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
  z-index: 1030;
}

.sidebar .nav-link {
  color: var(--fl-gray-800);
  padding: 7px 10px;
  display: flex;
  align-items: center;
  font-size: 0.8125rem;
  font-weight: 400;
  gap: 10px;
  white-space: nowrap;
  margin: 1px 10px;
  border-radius: 8px;
}

.sidebar .nav-link:hover,
.sidebar .nav-link.active {
  color: var(--fl-primary);
  background-color: var(--fl-primary-soft);
}

.sidebar .nav-link .ti {
  font-size: 17px;
}

.sidebar .logo-area {
  position: absolute;
  top: 0;
  left: 0;
  height: var(--fl-topbar-height);
  width: 100%;
  background: var(--fl-surface);
  display: flex;
  align-items: center;
  padding: 0 17px;
  border-bottom: 1px solid var(--fl-gray-200);
}

.brand-lockup {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: var(--fl-gray-800);
  font-weight: 600;
}

.brand-mark {
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.brand-mark-image {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  filter: drop-shadow(0 8px 16px rgba(16, 68, 124, 0.22));
}

.logo-text {
  white-space: nowrap;
  font-size: 0.95rem;
}

.nav-section-label {
  color: var(--fl-gray-500);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sidebar.collapsed {
  width: var(--fl-shell-width-collapsed);
}

.sidebar.collapsed .nav-link {
  margin: 0;
  padding: 7px 10px;
  justify-content: center;
}

.sidebar.collapsed .nav-text,
.sidebar.collapsed .logo-text,
.sidebar.collapsed .nav-section-label {
  display: none;
}

.sidebar.collapsed .logo-area {
  justify-content: center;
  padding: 0 10px;
}

.sidebar.collapsed .brand-lockup {
  justify-content: center;
  width: 100%;
}

.topbar {
  height: var(--fl-topbar-height);
  margin-left: var(--fl-shell-width);
  transition: margin-left 0.3s;
  background-color: var(--fl-surface) !important;
  border-color: var(--fl-gray-200) !important;
}

.topbar.full {
  margin-left: var(--fl-shell-width-collapsed);
}

.content {
  margin-left: var(--fl-shell-width);
  transition: margin-left 0.3s;
}

.content.full {
  margin-left: var(--fl-shell-width-collapsed);
}

.public-main {
  min-height: calc(100vh - 72px);
}

.py-10 {
  padding-top: 5rem !important;
  padding-bottom: 4.5rem !important;
}

.content .container-fluid {
  max-width: 1440px;
}

.btn-icon {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  font-size: 0.92969rem;
  font-weight: 400;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
}

.theme-switch-floating {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 1040;
}

.theme-switch-inline {
  display: inline-flex;
  align-items: center;
}

.sidebar-mode-inline {
  display: inline-flex;
  align-items: center;
}

.sidebar-mode-shell {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  border-radius: 999px;
  padding: 0.35rem 0.55rem;
  background: var(--fl-surface-elevated);
  border-color: var(--fl-gray-200) !important;
  color: var(--fl-gray-800);
  box-shadow: var(--fl-shadow);
  border: 1px solid var(--fl-gray-200);
}

.sidebar-mode-icon {
  font-size: 0.85rem;
  color: var(--fl-muted);
}

.sidebar-mode-text {
  color: var(--fl-gray-600);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.theme-switch-shell {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  border-radius: 999px;
  padding: 0.45rem 0.75rem;
  background: var(--fl-surface-elevated);
  border-color: var(--fl-gray-200) !important;
  color: var(--fl-gray-800);
  box-shadow: var(--fl-shadow);
  border: 1px solid var(--fl-gray-200);
}

.theme-switch-shell--compact {
  gap: 0.4rem;
  padding: 0.35rem 0.55rem;
  box-shadow: none;
}

.theme-switch-shell--compact .theme-switch-text {
  display: none;
}

.theme-switch-shell--compact .theme-switch-icon {
  font-size: 0.85rem;
}

.theme-switch-shell--compact .theme-switch-input {
  width: 2.15rem !important;
  height: 1.15rem;
}

.theme-switch-icon {
  font-size: 0.95rem;
  color: var(--fl-muted);
}

.theme-switch-shell .form-check {
  display: flex;
  align-items: center;
  min-height: auto;
  padding-left: 0;
}

.sidebar-mode-shell .form-check {
  display: flex;
  align-items: center;
  min-height: auto;
  padding-left: 0;
}

.theme-switch-input {
  cursor: pointer;
  width: 2.6rem !important;
  height: 1.35rem;
  margin: 0 !important;
  background-color: var(--fl-surface-muted);
  border-color: var(--fl-gray-400);
  background-image: var(--bs-form-switch-bg-image);
}

.theme-switch-input:checked {
  background-color: var(--fl-primary);
  border-color: var(--fl-primary);
}

.sidebar-mode-input {
  cursor: pointer;
  width: 2.15rem !important;
  height: 1.15rem;
  margin: 0 !important;
  background-color: var(--fl-surface-muted);
  border-color: var(--fl-gray-400);
  background-image: var(--bs-form-switch-bg-image);
}

.sidebar-mode-input:checked {
  background-color: var(--fl-primary);
  border-color: var(--fl-primary);
}

.theme-switch-text {
  font-size: 0.8125rem;
  font-weight: 600;
  min-width: 2.6rem;
}

.btn-icon.btn-sm {
  font-size: 0.8125rem;
  width: 2rem;
  height: 2rem;
}

.avatar {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
}

.avatar-sm {
  width: 1.875rem;
  height: 1.875rem;
}

.avatar-md {
  width: 2.25rem;
  height: 2.25rem;
}

.avatar-initials {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  text-transform: uppercase;
  font-weight: 600;
}

.user-menu {
  min-width: 210px;
  background: var(--fl-surface-elevated);
  border: 1px solid var(--fl-gray-200);
  box-shadow: var(--fl-shadow);
}

.confirm-modal-content {
  background: var(--fl-surface-elevated);
  color: var(--fl-gray-800);
  border: 1px solid var(--fl-gray-200);
  box-shadow: var(--fl-shadow);
}

.confirm-modal-content .btn-close {
  filter: var(--fl-close-filter, none);
}

.icon-shape {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  vertical-align: middle;
}

.icon-md {
  width: 2.2rem;
  height: 2.2rem;
  line-height: 2.2rem;
}

.page-intro {
  margin-bottom: 1.15rem;
  width: 100%;
  min-width: 0;
}

.page-intro h1 {
  font-size: 1.45rem;
  margin-bottom: 0.2rem;
}

.page-intro p {
  color: var(--fl-gray-500);
  margin-bottom: 0;
  font-size: 0.875rem;
}

.page-header,
.summary-header {
  gap: 0.75rem;
}

.page-actions,
.summary-actions,
.table-action-group {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.table-action-group form {
  margin: 0;
}

.customer-list-name {
  font-weight: 600;
  color: var(--fl-text) !important;
  text-decoration: underline;
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.14em;
}

.customer-search-results__row {
  position: relative;
  gap: 0.85rem;
  align-items: flex-start;
  padding-right: 2.6rem;
}

.customer-search-results__main {
  gap: 0.9rem;
  width: 100%;
}

.customer-search-results__heading {
  display: flex;
  align-items: flex-start;
  width: 100%;
}

.customer-search-results__name {
  font-size: 1.7rem;
  font-weight: 500;
  color: var(--fl-primary-strong) !important;
  text-decoration: none;
  letter-spacing: -0.01em;
  line-height: 1.02;
}

.customer-search-results__details {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.customer-search-results__side {
  position: absolute;
  top: 0.72rem;
  right: 0.8rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.customer-search-results__points {
  display: inline;
  color: var(--fl-gray-500);
  font-size: 0.74rem;
  font-weight: 500;
  line-height: 1.2;
}

.metric-card {
  border: 1px solid transparent;
  border-radius: 0.875rem;
}

.metric-card .metric-value {
  font-size: 1.45rem;
  font-weight: 700;
  margin-bottom: 0;
}

.loyalty-result-card {
  border: 1px solid var(--fl-gray-200);
}

.loyalty-result-card + .loyalty-result-card {
  margin-top: 1rem;
}

.loyalty-result-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 8%, rgba(255, 255, 255, 0.72), transparent 28%),
    radial-gradient(circle at top, rgba(var(--bs-primary-rgb), 0.22), transparent 48%),
    radial-gradient(circle at 50% 38%, rgba(251, 191, 36, 0.12), transparent 44%),
    linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
}

.loyalty-result-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 30%, rgba(255, 255, 255, 0.42), transparent 26%),
    radial-gradient(circle at 50% 52%, rgba(var(--bs-primary-rgb), 0.11), transparent 38%);
  opacity: 0.7;
}

.loyalty-result-hero__body {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 0.85rem;
  padding: 1.4rem 1.15rem 1.25rem;
  text-align: center;
}

.loyalty-result-hero__confetti {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  opacity: 1;
  transition: opacity 700ms ease-out;
}

.loyalty-result-hero__confetti.is-fading {
  opacity: 0;
}

.loyalty-result-points {
  position: relative;
  z-index: 2;
  min-width: 0;
  display: grid;
  justify-items: center;
  gap: 0.18rem;
  padding: 0;
}

.loyalty-result-points .small-muted {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--fl-gray-500);
}

.loyalty-result-points__status {
  display: inline-block;
  min-height: 2rem;
  padding: 0.36rem 0.82rem;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  white-space: normal;
  border: 1px solid var(--fl-gray-200);
  background: rgba(255, 255, 255, 0.74);
  color: var(--fl-gray-700);
}

.loyalty-result-points__status strong {
  font-weight: 800;
}

.loyalty-result-points__status.is-redeemable {
  color: #166534;
  background: rgba(134, 239, 172, 0.18);
  border-color: rgba(34, 197, 94, 0.24);
}

.loyalty-result-points__status.is-pending {
  color: #92400e;
  background: rgba(253, 224, 71, 0.18);
  border-color: rgba(245, 158, 11, 0.28);
}

.loyalty-result-hero__value {
  display: inline-block;
  font-size: clamp(4.25rem, 12vw, 7.2rem);
  line-height: 1.04;
  letter-spacing: -0.06em;
  padding: 0.04em 0.04em 0.1em;
  color: #f59e0b;
  background: linear-gradient(180deg, #fde68a 0%, #fbbf24 38%, #f59e0b 74%, #d97706 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow:
    0 0.14rem 0.45rem rgba(120, 53, 15, 0.14),
    0 0 1.25rem rgba(253, 224, 71, 0.36);
}

.loyalty-result-hero__identity {
  position: relative;
  z-index: 1;
  display: grid;
  width: calc(100% + 2.3rem);
  margin: 0 -1.15rem -1.25rem;
  justify-items: center;
  gap: 0.34rem;
  padding: 0.9rem 1.15rem 1rem;
  background:
    linear-gradient(90deg, rgba(var(--bs-primary-rgb), 0.12), rgba(255, 255, 255, 0.72) 50%, rgba(251, 191, 36, 0.18)),
    linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.48));
  border-top: 1px solid rgba(255, 255, 255, 0.78);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.loyalty-result-hero__name {
  font-size: clamp(1.42rem, 4.8vw, 1.95rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--fl-gray-800);
  text-shadow: 0 0.08rem 0.24rem rgba(255, 255, 255, 0.42);
}

.loyalty-result-hero__phone {
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--fl-gray-600) !important;
}

html[data-theme="dark"] .loyalty-result-hero {
  background:
    radial-gradient(circle at 50% 8%, rgba(255, 255, 255, 0.08), transparent 24%),
    radial-gradient(circle at top, rgba(var(--bs-primary-rgb), 0.2), transparent 48%),
    radial-gradient(circle at 50% 40%, rgba(var(--bs-warning-rgb), 0.08), transparent 44%),
    linear-gradient(180deg, #2b241b, var(--fl-surface));
}

html[data-theme="dark"] .loyalty-result-hero::before {
  background:
    radial-gradient(circle at 50% 30%, rgba(255, 255, 255, 0.08), transparent 24%),
    radial-gradient(circle at 50% 52%, rgba(var(--bs-primary-rgb), 0.12), transparent 36%);
  opacity: 0.88;
}

html[data-theme="dark"] .loyalty-result-points .small-muted {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .loyalty-result-points__status {
  border-color: rgba(255, 255, 255, 0.08);
  background: rgba(15, 12, 8, 0.52);
  color: var(--fl-gray-700);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

html[data-theme="dark"] .loyalty-result-points__status.is-redeemable {
  color: #bff1cb;
  background: rgba(var(--bs-success-rgb), 0.16);
  border-color: rgba(var(--bs-success-rgb), 0.28);
}

html[data-theme="dark"] .loyalty-result-points__status.is-pending {
  color: #f6d889;
  background: rgba(var(--bs-warning-rgb), 0.16);
  border-color: rgba(var(--bs-warning-rgb), 0.26);
}

html[data-theme="dark"] .loyalty-result-hero__value {
  text-shadow:
    0 0.2rem 0.7rem rgba(0, 0, 0, 0.28),
    0 0 1.65rem rgba(251, 191, 36, 0.2);
}

html[data-theme="dark"] .loyalty-result-hero__identity {
  background:
    linear-gradient(90deg, rgba(var(--bs-primary-rgb), 0.12), rgba(35, 28, 18, 0.72) 50%, rgba(var(--bs-warning-rgb), 0.12)),
    linear-gradient(180deg, rgba(38, 30, 20, 0.8), rgba(29, 24, 18, 0.72));
  border-top-color: rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

html[data-theme="dark"] .loyalty-result-hero__name {
  color: #fff2d7;
  text-shadow: 0 0.16rem 0.45rem rgba(0, 0, 0, 0.26);
}

html[data-theme="dark"] .loyalty-result-hero__phone {
  color: var(--fl-gray-700) !important;
}

html[data-theme="dark"] .loyalty-result-confetti__piece {
  box-shadow:
    0 0 0.95rem rgba(255, 255, 255, 0.24),
    0 0.16rem 0.45rem rgba(0, 0, 0, 0.18);
}

html[data-theme="dark"] .loyalty-result-firework__trail {
  box-shadow:
    0 0 0.75rem rgba(255, 255, 255, 0.26),
    0 0 1rem rgba(var(--bs-warning-rgb), 0.12);
}

html[data-theme="dark"] .loyalty-result-firework__burst {
  box-shadow:
    0 0 0.8rem rgba(255, 255, 255, 0.18),
    0 0 1.15rem rgba(var(--bs-warning-rgb), 0.28);
}

.loyalty-result-confetti__piece {
  position: absolute;
  left: var(--confetti-origin-x, 50%);
  top: var(--confetti-origin-y, 38%);
  width: var(--confetti-size, 0.72rem);
  height: calc(var(--confetti-size, 0.72rem) * 0.64);
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.92), var(--confetti-color, var(--fl-primary)));
  opacity: 0;
  transform: translate(-50%, -40%) rotate(0deg);
  box-shadow:
    0 0 0.8rem rgba(255, 255, 255, 0.42),
    0 0.22rem 0.65rem rgba(12, 16, 13, 0.1);
  animation: loyalty-result-confetti-burst var(--confetti-duration, 2.2s) cubic-bezier(0.16, 0.84, 0.22, 1) forwards;
  animation-delay: var(--confetti-delay, 0s);
  will-change: transform, opacity;
}

.loyalty-result-confetti__piece:nth-child(3n) {
  border-radius: 0.25rem;
}

.loyalty-result-confetti__piece:nth-child(4n) {
  width: var(--confetti-size, 0.72rem);
  height: var(--confetti-size, 0.72rem);
  border-radius: 50%;
}

.loyalty-result-confetti__piece:nth-child(5n) {
  width: calc(var(--confetti-size, 0.72rem) * 0.42);
  height: calc(var(--confetti-size, 0.72rem) * 1.18);
  border-radius: 0.28rem;
}

.loyalty-result-firework {
  position: absolute;
  left: var(--firework-x, 50%);
  top: var(--firework-y, 24%);
  width: 0;
  height: 0;
  pointer-events: none;
}

.loyalty-result-firework__trail {
  position: absolute;
  left: 0;
  top: 0;
  width: 0.28rem;
  height: var(--firework-trail-length, 6.4rem);
  border-radius: 999px;
  opacity: 0;
  transform-origin: 50% 0;
  transform: translate(-50%, 0) rotate(var(--firework-angle, 0deg)) scaleY(0.04);
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.98) 0%,
    rgba(255, 255, 255, 0.92) 18%,
    var(--firework-color, #fbbf24) 52%,
    rgba(255, 255, 255, 0) 100%
  );
  box-shadow:
    0 0 0.95rem rgba(255, 255, 255, 0.74),
    0 0 1.2rem rgba(255, 255, 255, 0.42);
  animation: loyalty-result-firework-launch var(--firework-duration, 1.9s) cubic-bezier(0.12, 0.9, 0.22, 1) forwards;
  animation-delay: var(--firework-delay, 0s);
}

.loyalty-result-firework__burst,
.loyalty-result-firework__spark {
  position: absolute;
  left: 0;
  top: 0;
  width: var(--firework-burst-size, 3rem);
  height: var(--firework-burst-size, 3rem);
  transform: translate(-50%, -50%) scale(0.16);
  opacity: 0;
  animation: loyalty-result-firework-burst 1.45s cubic-bezier(0.16, 0.84, 0.24, 1) forwards;
  animation-delay: calc(var(--firework-delay, 0s) + 0.52s);
}

.loyalty-result-firework__burst {
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(255, 255, 255, 0.98) 0 12%,
    rgba(255, 255, 255, 0.8) 16%,
    var(--firework-color, #fbbf24) 36%,
    rgba(255, 255, 255, 0) 72%
  );
  box-shadow:
    0 0 1rem rgba(255, 255, 255, 0.6),
    0 0 1.45rem var(--firework-color, #fbbf24);
}

.loyalty-result-firework__burst::before,
.loyalty-result-firework__burst::after,
.loyalty-result-firework__spark::before,
.loyalty-result-firework__spark::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  height: 0.14rem;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    var(--firework-color, #fbbf24) 18%,
    rgba(255, 255, 255, 0.98) 50%,
    var(--firework-color, #fbbf24) 82%,
    rgba(255, 255, 255, 0) 100%
  );
  box-shadow: 0 0 0.75rem rgba(255, 255, 255, 0.54);
  transform: translate(-50%, -50%);
}

.loyalty-result-firework__burst::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.loyalty-result-firework__spark::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.loyalty-result-firework__spark::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.loyalty-result-hero.is-points-bouncing .loyalty-result-hero__value {
  animation: loyalty-result-points-pop 1.45s cubic-bezier(0.18, 0.88, 0.26, 1);
}

.loyalty-result-hero.is-celebrating::before {
  animation: loyalty-result-hero-bloom 2.2s ease-out;
}

@keyframes loyalty-result-points-pop {
  0% {
    transform: scale(0.88);
    text-shadow:
      0 0.14rem 0.45rem rgba(120, 53, 15, 0.14),
      0 0 0 rgba(255, 255, 255, 0);
  }

  24% {
    transform: scale(1.16);
    text-shadow:
      0 0.24rem 0.95rem rgba(146, 64, 14, 0.2),
      0 0 2.3rem rgba(253, 224, 71, 0.78);
  }

  48% {
    transform: scale(0.98);
    text-shadow:
      0 0.16rem 0.55rem rgba(120, 53, 15, 0.16),
      0 0 1.45rem rgba(253, 224, 71, 0.44);
  }

  68% {
    transform: scale(1.06);
    text-shadow:
      0 0.2rem 0.7rem rgba(146, 64, 14, 0.18),
      0 0 1.7rem rgba(253, 224, 71, 0.54);
  }

  86% {
    transform: scale(1.01);
    text-shadow:
      0 0.16rem 0.52rem rgba(120, 53, 15, 0.15),
      0 0 1.38rem rgba(253, 224, 71, 0.42);
  }

  100% {
    transform: scale(1);
    text-shadow:
      0 0.14rem 0.45rem rgba(120, 53, 15, 0.14),
      0 0 1.25rem rgba(253, 224, 71, 0.36);
  }
}

@keyframes loyalty-result-hero-bloom {
  0% {
    opacity: 0.24;
    transform: scale(0.94);
  }

  38% {
    opacity: 0.88;
    transform: scale(1.02);
  }

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

@keyframes loyalty-result-confetti-burst {
  0% {
    opacity: 0;
    transform: translate(-50%, -28%) scale(0.28) rotate(0deg);
  }

  14% {
    opacity: 1;
  }

  76% {
    opacity: 0.94;
  }

  100% {
    opacity: 0;
    transform: translate(
      calc(-50% + var(--confetti-x, 0px)),
      calc(-50% + var(--confetti-y, 0px))
    ) scale(1.02) rotate(var(--confetti-rotate, 0deg));
  }
}

@keyframes loyalty-result-firework-launch {
  0% {
    opacity: 0;
    transform: translate(-50%, 0) rotate(var(--firework-angle, 0deg)) scaleY(0.04);
  }

  18% {
    opacity: 1;
  }

  58% {
    opacity: 1;
    transform: translate(-50%, 0) rotate(var(--firework-angle, 0deg)) scaleY(1);
  }

  100% {
    opacity: 0;
    transform: translate(-50%, 0) rotate(var(--firework-angle, 0deg)) scaleY(1);
  }
}

@keyframes loyalty-result-firework-burst {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.16);
  }

  28% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.04);
  }

  72% {
    opacity: 0.94;
  }

  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.34);
  }
}

@media (prefers-reduced-motion: reduce) {
  .loyalty-result-confetti__piece,
  .loyalty-result-firework__trail,
  .loyalty-result-firework__burst,
  .loyalty-result-firework__spark,
  .loyalty-result-hero.is-celebrating .loyalty-result-hero__value {
    animation: none;
  }
}

.loyalty-activity-header {
  margin-bottom: 0.8rem !important;
}

.loyalty-activity-list {
  display: grid;
  gap: 0.7rem;
}

.loyalty-activity-item {
  border: 1px solid var(--fl-gray-200);
  border-radius: 0.9rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
  overflow: hidden;
}

.loyalty-activity-item[open] {
  border-color: rgba(var(--bs-primary-rgb), 0.24);
  box-shadow: 0 0.65rem 1.4rem rgba(12, 16, 13, 0.07);
}

.loyalty-activity-item__summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  padding: 0.85rem 1rem;
  cursor: pointer;
}

.loyalty-activity-item__summary::-webkit-details-marker {
  display: none;
}

.loyalty-activity-item__summary::after {
  content: "+";
  margin-left: auto;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--fl-primary);
  background: var(--fl-primary-soft);
  font-size: 1rem;
  font-weight: 700;
}

.loyalty-activity-item[open] .loyalty-activity-item__summary::after {
  content: "-";
}

.loyalty-activity-item__date {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--fl-gray-800);
}

.loyalty-activity-item__points {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4.4rem;
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  border: 1px solid var(--fl-gray-200);
  font-size: 0.76rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.loyalty-activity-item__points.is-positive {
  color: var(--fl-success);
  background: rgba(var(--bs-success-rgb), 0.12);
  border-color: rgba(var(--bs-success-rgb), 0.22);
}

.loyalty-activity-item__points.is-negative {
  color: var(--fl-danger);
  background: rgba(var(--bs-danger-rgb), 0.12);
  border-color: rgba(var(--bs-danger-rgb), 0.22);
}

.loyalty-activity-item__details {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.35rem;
  padding: 0.72rem 1rem 0.95rem;
  border-top: 1px solid var(--fl-gray-200);
  position: relative;
}

.loyalty-activity-item__details-header {
  position: absolute;
  top: 0.72rem;
  right: 1rem;
  margin: 0;
}

.loyalty-activity-item__fuel-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.9rem;
  height: 1.9rem;
  padding: 0 0.55rem;
  border-radius: 999px;
  border: 1px solid var(--fl-gray-200);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.loyalty-activity-item__fuel-badge.is-petrol {
  color: var(--fl-primary);
  background: rgba(var(--bs-primary-rgb), 0.12);
  border-color: rgba(var(--bs-primary-rgb), 0.22);
}

.loyalty-activity-item__fuel-badge.is-diesel {
  color: var(--fl-info);
  background: rgba(var(--bs-info-rgb), 0.12);
  border-color: rgba(var(--bs-info-rgb), 0.22);
}

.loyalty-activity-item__fuel-badge.is-cng {
  color: var(--fl-success);
  background: rgba(var(--bs-success-rgb), 0.12);
  border-color: rgba(var(--bs-success-rgb), 0.22);
}

.loyalty-activity-item__detail {
  display: grid;
  gap: 0.08rem;
  padding: 0;
}

.loyalty-activity-item__detail span {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--fl-gray-500);
}

.loyalty-activity-item__detail strong {
  font-size: 0.84rem;
  color: var(--fl-gray-800);
}

.customer-details-shell {
  display: grid;
  gap: 1rem;
}

.customer-details-hero__body {
  gap: 1rem;
}

.customer-details-hero {
  overflow: visible;
}

.customer-details-hero__points {
  gap: 0.5rem;
}

.customer-details-hero__transaction-summary {
  width: min(100%, 26rem);
  margin: 0 auto;
  padding: 0.8rem 0.95rem;
  border-radius: 1rem;
  border: 1px solid rgba(34, 197, 94, 0.18);
  background: linear-gradient(180deg, rgba(240, 253, 244, 0.96), rgba(220, 252, 231, 0.92));
  color: #166534;
  box-shadow: 0 0.8rem 1.8rem rgba(34, 197, 94, 0.12);
}

.customer-details-hero__transaction-summary-copy {
  font-size: 0.9rem;
  line-height: 1.45;
  color: #14532d;
}

.customer-details-hero__transaction-summary-copy strong {
  font-weight: 800;
}

.customer-details-hero__meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.55rem;
}

.customer-details-hero__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.32rem;
  padding: 0.42rem 0.8rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.78);
  background: rgba(255, 255, 255, 0.68);
  color: var(--fl-gray-600);
  font-size: 0.82rem;
  font-weight: 600;
  box-shadow: 0 0.35rem 0.95rem rgba(12, 16, 13, 0.04);
}

.customer-details-hero__chip strong {
  font-weight: 800;
  color: var(--fl-gray-800);
}

.customer-details-hero__chip--action {
  border-color: rgba(var(--bs-primary-rgb), 0.22);
  background: var(--fl-primary-soft);
  color: var(--fl-primary);
  text-decoration: none;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.customer-details-hero__chip--warning {
  border-color: rgba(245, 158, 11, 0.28);
  background: rgba(253, 224, 71, 0.18);
  color: #92400e;
}

.customer-details-hero__chip--action:hover,
.customer-details-hero__chip--action:focus,
.customer-details-hero__chip--action:active {
  background: rgba(var(--bs-primary-rgb), 0.18);
  border-color: rgba(var(--bs-primary-rgb), 0.34);
  color: var(--fl-primary);
  transform: translateY(-1px);
}

.customer-details-hero__identity {
  grid-template-columns: minmax(0, 1fr) auto;
  justify-items: stretch;
  align-items: start;
  position: relative;
  text-align: left;
  gap: 1rem 1.25rem;
}

.customer-details-hero__identity-main {
  min-width: 0;
  display: grid;
  gap: 0.34rem;
}

.customer-details-hero__identity-heading {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
}

.customer-details-hero__status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2rem;
  padding: 0.36rem 0.8rem;
  border-radius: 999px;
  border: 1px solid var(--fl-gray-200);
  background: rgba(255, 255, 255, 0.74);
  color: var(--fl-gray-700);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.customer-details-hero__status.is-active {
  color: #166534;
  background: rgba(134, 239, 172, 0.18);
  border-color: rgba(34, 197, 94, 0.24);
}

.customer-details-hero__status.is-inactive {
  color: #92400e;
  background: rgba(253, 224, 71, 0.18);
  border-color: rgba(245, 158, 11, 0.28);
}

.customer-details-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  justify-self: end;
  align-self: start;
  gap: 0.55rem;
}

.customer-details-hero__menu {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 1060;
  flex-shrink: 0;
}

.customer-details-hero__actions .button_to {
  margin: 0;
}

.customer-details-hero__actions .btn {
  white-space: nowrap;
}

.customer-details-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
}

.customer-details-stack {
  display: grid;
  gap: 1rem;
}

.customer-details-stack--tight {
  gap: 0.1rem;
}

.customer-details-section .card-body {
  display: grid;
  gap: 1rem;
}

.customer-details-section__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.customer-details-section__header--with-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}

.customer-details-section__header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  flex-shrink: 0;
}

.customer-details-history-intro {
  font-size: 0.8rem;
}

.customer-details-history-preview-action {
  appearance: none;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.22);
  width: 1.5rem;
  height: 1.5rem;
  min-width: 1.5rem;
  min-height: 1.5rem;
  padding: 0;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--fl-primary);
  background: var(--fl-primary-soft);
  font-size: 0.92rem;
  cursor: pointer;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.customer-details-history-preview-action:hover,
.customer-details-history-preview-action:focus,
.customer-details-history-preview-action:active {
  background: rgba(var(--bs-primary-rgb), 0.18);
  border-color: rgba(var(--bs-primary-rgb), 0.34);
  color: var(--fl-primary);
  transform: translateY(-1px);
}

.customer-details-quick-action {
  appearance: none;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.22);
  width: 1.5rem;
  height: 1.5rem;
  min-width: 1.5rem;
  min-height: 1.5rem;
  aspect-ratio: 1 / 1;
  flex: 0 0 1.5rem;
  padding: 0;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--fl-primary);
  background: var(--fl-primary-soft);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.customer-details-quick-action:hover,
.customer-details-quick-action:focus,
.customer-details-quick-action:active {
  background: rgba(var(--bs-primary-rgb), 0.18);
  border-color: rgba(var(--bs-primary-rgb), 0.34);
  color: var(--fl-primary);
  transform: translateY(-1px);
}

html[data-theme="dark"] .customer-details-quick-action {
  color: #9dd6ff;
  background: rgba(var(--bs-primary-rgb), 0.18);
  border-color: rgba(157, 214, 255, 0.26);
}

html[data-theme="dark"] .customer-details-history-preview-action {
  color: #9dd6ff;
  background: rgba(var(--bs-primary-rgb), 0.18);
  border-color: rgba(157, 214, 255, 0.26);
}

html[data-theme="dark"] .customer-details-quick-action:hover,
html[data-theme="dark"] .customer-details-quick-action:focus,
html[data-theme="dark"] .customer-details-quick-action:active {
  background: rgba(var(--bs-primary-rgb), 0.28);
  border-color: rgba(157, 214, 255, 0.38);
}

html[data-theme="dark"] .customer-details-history-preview-action:hover,
html[data-theme="dark"] .customer-details-history-preview-action:focus,
html[data-theme="dark"] .customer-details-history-preview-action:active {
  background: rgba(var(--bs-primary-rgb), 0.28);
  border-color: rgba(157, 214, 255, 0.38);
}

.customer-details-list {
  display: grid;
  gap: 0.75rem;
}

.customer-details-vehicle-list {
  border: 1px solid var(--fl-gray-200);
  border-radius: 0.9rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
  overflow: hidden;
}

.customer-details-vehicle-list--allow-overflow {
  overflow: visible;
}

.customer-details-vehicle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.78rem;
  padding: 0.72rem 0.85rem;
}

.customer-details-vehicle-row--registered {
  position: relative;
  align-items: flex-start;
  padding-right: 5.1rem;
}

.customer-details-vehicle-row + .customer-details-vehicle-row {
  border-top: 1px solid var(--fl-gray-200);
}

.customer-details-vehicle-row__main {
  min-width: 0;
  display: grid;
  gap: 0.15rem;
}

.customer-details-vehicle-row__number {
  font-size: 0.98rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--fl-gray-800);
}

.customer-details-vehicle-row__meta {
  font-size: 0.82rem;
  color: var(--fl-gray-500);
}

.customer-details-vehicle-row__commercial {
  font-size: 0.76rem;
  color: var(--fl-primary);
  line-height: 1.4;
}

.customer-details-vehicle-row__menu {
  flex-shrink: 0;
}

.customer-details-vehicle-row__actions {
  position: absolute;
  top: 0.72rem;
  right: 0.85rem;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.45rem;
  flex-shrink: 0;
}

.customer-details-vehicle-row__transaction-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.9rem;
  height: 1.9rem;
  min-width: 1.9rem;
  min-height: 1.9rem;
  padding: 0;
  border-radius: 999px;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.22);
  background: var(--fl-primary-soft);
  color: var(--fl-primary);
  text-decoration: none;
  line-height: 1;
  flex-shrink: 0;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.customer-details-vehicle-row__transaction-link .ti {
  font-size: 0.92rem;
}

.customer-details-vehicle-row__transaction-link:hover,
.customer-details-vehicle-row__transaction-link:focus,
.customer-details-vehicle-row__transaction-link:active {
  background: rgba(var(--bs-primary-rgb), 0.18);
  border-color: rgba(var(--bs-primary-rgb), 0.34);
  color: var(--fl-primary);
  transform: translateY(-1px);
}

.customer-details-vehicle-row__menu-toggle {
  appearance: none;
  border: 1px solid rgba(var(--bs-warning-rgb), 0.22);
  width: 1.9rem;
  height: 1.9rem;
  min-width: 1.9rem;
  min-height: 1.9rem;
  padding: 0;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(var(--bs-warning-rgb), 0.16);
  color: #b45309;
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  box-shadow: none;
  transition: background-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.customer-details-vehicle-row__menu-toggle .ti {
  font-size: 0.92rem;
}

.customer-details-vehicle-row__menu-toggle:hover,
.customer-details-vehicle-row__menu-toggle:focus,
.customer-details-vehicle-row__menu-toggle:active,
.customer-details-vehicle-row__menu-toggle.show {
  background: rgba(var(--bs-warning-rgb), 0.26);
  color: #92400e;
  transform: translateY(-1px);
}

.customer-details-vehicle-row__menu-list {
  min-width: 10.5rem;
  z-index: 1065;
}

.customer-details-vehicle-row__menu-form {
  margin: 0;
}

.customer-details-vehicle-row__menu-form .dropdown-item {
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
}

.customer-details-list-item {
  border: 1px solid var(--fl-gray-200);
  border-radius: 0.9rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
  padding: 0.74rem 0.85rem;
}

.customer-details-history-row {
  gap: 0.9rem;
  align-items: flex-start;
}

.customer-details-history-row__main {
  gap: 0.16rem;
}

.customer-details-history-row__side {
  flex-shrink: 0;
  display: grid;
  justify-items: end;
  gap: 0.24rem;
}

.customer-details-history-row__handled-by {
  font-size: 0.78rem;
  color: var(--fl-gray-500);
}

.customer-details-history-row__handled-by strong {
  color: var(--fl-gray-700);
  font-weight: 700;
}

.transaction-location-meta {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  font-size: 0.78rem;
  color: var(--fl-primary);
  line-height: 1.3;
}

.transaction-location-meta i {
  font-size: 0.9rem;
  flex-shrink: 0;
}

.customer-details-history-row__location {
  margin-top: 0.1rem;
}

.customer-details-history-row__rewards {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.42rem 0.7rem;
  margin-top: 0.18rem;
  font-size: 0.76rem;
  color: var(--fl-gray-500);
}

.customer-details-history-row__reward-points strong,
.customer-details-history-row__reward-cash strong {
  color: var(--fl-gray-700);
  font-weight: 700;
}

.customer-details-history-row__date {
  font-size: 0.78rem;
  font-weight: 400;
  color: var(--fl-gray-500);
}

.customer-details-history-item__amount {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 5.4rem;
  padding: 0.34rem 0.65rem;
  border-radius: 999px;
  border: 1px solid rgba(245, 158, 11, 0.22);
  background: rgba(253, 186, 116, 0.16);
  color: #9a3412;
  font-size: 0.78rem;
  font-weight: 700;
  white-space: nowrap;
}

.customer-details-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  padding: 0.36rem 0.72rem;
  border-radius: 999px;
  border: 1px solid var(--fl-gray-200);
  background: rgba(var(--bs-primary-rgb), 0.08);
  color: var(--fl-gray-600);
  font-size: 0.78rem;
  font-weight: 600;
}

.customer-details-pill strong {
  color: var(--fl-gray-800);
  font-weight: 800;
}

.customer-details-inline-form {
  display: grid;
  gap: 0.8rem;
  padding-top: 1rem;
  border-top: 1px solid var(--fl-gray-200);
}

.customer-details-inline-form .vstack {
  gap: 0.8rem !important;
}

.customer-details-modal__content .modal-body .vstack {
  gap: 0.85rem !important;
}

.customer-details-ledger-item {
  gap: 0.9rem;
  align-items: flex-start;
}

.customer-details-ledger-item__meta {
  min-width: 0;
  display: grid;
  gap: 0.16rem;
}

.customer-details-ledger-item__label {
  font-size: 0.94rem;
  font-weight: 700;
  color: var(--fl-gray-800);
}

.customer-details-ledger-item__support {
  font-size: 0.78rem;
  color: var(--fl-gray-500);
}

.customer-details-ledger-item__side {
  flex-shrink: 0;
}

.customer-details-ledger-item__cash {
  font-size: 0.76rem;
  color: var(--fl-gray-500);
}

.customer-details-ledger-item__cash strong {
  color: var(--fl-gray-700);
  font-weight: 700;
}

.customer-details-ledger-item__date {
  font-size: 0.8rem;
  color: var(--fl-gray-500);
}

.customer-details-ledger-shell {
  display: grid;
  gap: 0.85rem;
  min-height: 4.5rem;
}

.customer-details-ledger-expand {
  display: grid;
  gap: 0.85rem;
}

.customer-details-remote-shell {
  display: grid;
  gap: 0.85rem;
  min-height: 4.5rem;
}

.customer-details-ledger-state {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  min-height: 4.5rem;
  padding: 0.82rem;
  border: 1px dashed var(--fl-gray-200);
  border-radius: 0.9rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
  color: var(--fl-gray-500);
  text-align: center;
}

.customer-details-ledger-state.is-error {
  flex-direction: column;
}

.customer-details-ledger-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  flex-wrap: wrap;
  padding-top: 0.2rem;
}

.customer-details-ledger-pagination__summary,
.customer-details-ledger-pagination__status {
  font-size: 0.82rem;
  color: var(--fl-gray-500);
}

.customer-details-ledger-pagination__summary strong,
.customer-details-ledger-pagination__status strong {
  color: var(--fl-gray-800);
  font-weight: 700;
}

.customer-details-ledger-pagination__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.55rem;
  flex-wrap: wrap;
}

html[data-theme="dark"] .customer-details-hero__chip {
  border-color: rgba(255, 255, 255, 0.08);
  background: rgba(18, 15, 10, 0.5);
  color: var(--fl-gray-500);
  box-shadow: none;
}

html[data-theme="dark"] .customer-details-hero__chip--action {
  color: #9dd6ff;
  background: rgba(var(--bs-primary-rgb), 0.18);
  border-color: rgba(157, 214, 255, 0.26);
}

html[data-theme="dark"] .customer-details-hero__chip--warning {
  color: #fcd34d;
  background: rgba(217, 119, 6, 0.2);
  border-color: rgba(251, 191, 36, 0.28);
}

html[data-theme="dark"] .customer-details-hero__chip--action:hover,
html[data-theme="dark"] .customer-details-hero__chip--action:focus,
html[data-theme="dark"] .customer-details-hero__chip--action:active {
  background: rgba(var(--bs-primary-rgb), 0.28);
  border-color: rgba(157, 214, 255, 0.38);
  color: #9dd6ff;
}

html[data-theme="dark"] .customer-details-hero__transaction-summary {
  border-color: rgba(var(--bs-success-rgb), 0.3);
  background: linear-gradient(180deg, rgba(13, 37, 24, 0.92), rgba(10, 30, 19, 0.92));
  color: #bbf7d0;
  box-shadow: none;
}

html[data-theme="dark"] .customer-details-hero__transaction-summary-copy {
  color: #dcfce7;
}

html[data-theme="dark"] .customer-search-results__name {
  color: var(--fl-primary-accent) !important;
}

html[data-theme="dark"] .customer-search-results__points {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .customer-details-hero__chip strong {
  color: #fff2d7;
}

html[data-theme="dark"] .customer-details-hero__status {
  border-color: rgba(255, 255, 255, 0.08);
  background: rgba(15, 12, 8, 0.52);
  color: var(--fl-gray-300);
}

html[data-theme="dark"] .customer-details-hero__status.is-active {
  color: #bff1cb;
  background: rgba(var(--bs-success-rgb), 0.16);
  border-color: rgba(var(--bs-success-rgb), 0.28);
}

html[data-theme="dark"] .customer-details-hero__status.is-inactive {
  color: #f6d889;
  background: rgba(var(--bs-warning-rgb), 0.16);
  border-color: rgba(var(--bs-warning-rgb), 0.26);
}

html[data-theme="dark"] .customer-details-list-item {
  border-color: rgba(255, 255, 255, 0.08);
  background: linear-gradient(180deg, rgba(42, 34, 24, 0.92), rgba(28, 24, 19, 0.92));
}

html[data-theme="dark"] .customer-details-vehicle-list {
  border-color: rgba(255, 255, 255, 0.08);
  background: linear-gradient(180deg, rgba(42, 34, 24, 0.92), rgba(28, 24, 19, 0.92));
}

html[data-theme="dark"] .customer-details-vehicle-row + .customer-details-vehicle-row {
  border-top-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .customer-details-history-item__amount {
  color: #ffd27a;
  background: rgba(var(--bs-warning-rgb), 0.15);
  border-color: rgba(var(--bs-warning-rgb), 0.24);
}

html[data-theme="dark"] .customer-details-history-row__handled-by {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .customer-details-history-row__handled-by strong {
  color: #fff2d7;
}

html[data-theme="dark"] .customer-details-history-row__rewards {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .customer-details-history-row__reward-points strong,
html[data-theme="dark"] .customer-details-history-row__reward-cash strong {
  color: #fff2d7;
}

html[data-theme="dark"] .transaction-location-meta {
  color: #9dd6ff;
}

html[data-theme="dark"] .customer-details-history-row__date {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .customer-details-vehicle-row__number,
html[data-theme="dark"] .customer-details-ledger-item__label,
html[data-theme="dark"] .customer-details-pill strong {
  color: #fff2d7;
}

html[data-theme="dark"] .customer-details-vehicle-row__commercial {
  color: #9dd6ff;
}

html[data-theme="dark"] .customer-details-vehicle-row__transaction-link {
  color: #9dd6ff;
  background: rgba(var(--bs-primary-rgb), 0.18);
  border-color: rgba(157, 214, 255, 0.26);
}

html[data-theme="dark"] .customer-details-vehicle-row__transaction-link:hover,
html[data-theme="dark"] .customer-details-vehicle-row__transaction-link:focus,
html[data-theme="dark"] .customer-details-vehicle-row__transaction-link:active {
  background: rgba(var(--bs-primary-rgb), 0.28);
  border-color: rgba(157, 214, 255, 0.38);
  color: #bfe7ff;
}

html[data-theme="dark"] .customer-details-ledger-item__support {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .customer-details-ledger-item__cash {
  color: var(--fl-gray-500);
}

html[data-theme="dark"] .customer-details-ledger-item__cash strong {
  color: var(--fl-gray-300);
}

html[data-theme="dark"] .customer-details-vehicle-row__menu-toggle {
  background: rgba(var(--bs-warning-rgb), 0.2);
  color: #f6d889;
  border-color: rgba(246, 216, 137, 0.24);
}

html[data-theme="dark"] .customer-details-vehicle-row__menu-toggle:hover,
html[data-theme="dark"] .customer-details-vehicle-row__menu-toggle:focus,
html[data-theme="dark"] .customer-details-vehicle-row__menu-toggle:active,
html[data-theme="dark"] .customer-details-vehicle-row__menu-toggle.show {
  background: rgba(var(--bs-warning-rgb), 0.3);
  color: #fde68a;
}

html[data-theme="dark"] .customer-details-ledger-state {
  border-color: rgba(255, 255, 255, 0.08);
  background: linear-gradient(180deg, rgba(42, 34, 24, 0.92), rgba(28, 24, 19, 0.92));
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .customer-details-pill {
  border-color: rgba(255, 255, 255, 0.08);
  background: rgba(var(--bs-primary-rgb), 0.12);
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .customer-details-inline-form {
  border-top-color: rgba(255, 255, 255, 0.08);
}

.dashboard-root {
  display: grid;
  gap: 1.15rem;
}

.dashboard-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

.dashboard-filter-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
  width: min(100%, 820px);
  padding: 0.95rem;
  border: 1px solid var(--fl-gray-200);
  border-radius: 1rem;
  background:
    linear-gradient(135deg, rgba(var(--bs-primary-rgb), 0.08), transparent 65%),
    var(--fl-surface-elevated);
  box-shadow: var(--fl-shadow);
}

.dashboard-filter-form__field {
  display: grid;
  gap: 0.38rem;
}

.dashboard-filter-form__field--full {
  grid-column: 1 / -1;
}

.dashboard-filter-form__field-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.dashboard-filter-form__header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.55rem;
  flex-wrap: wrap;
}

.dashboard-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.dashboard-filter-chip {
  border: 1px solid var(--fl-gray-200);
  border-radius: 999px;
  padding: 0.45rem 0.85rem;
  background: var(--fl-surface);
  color: var(--fl-gray-800);
  font-size: 0.8rem;
  font-weight: 600;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.dashboard-filter-chip:hover {
  border-color: rgba(var(--bs-primary-rgb), 0.45);
  color: var(--fl-primary);
}

.dashboard-filter-chip.is-active {
  background: var(--fl-primary);
  border-color: var(--fl-primary);
  color: var(--fl-primary-contrast);
  box-shadow: 0 10px 24px rgba(var(--bs-primary-rgb), 0.18);
}

.dashboard-filter-form__actions {
  display: flex;
  align-items: end;
  justify-content: flex-end;
  gap: 0.55rem;
}

.dashboard-filter-form__actions--inline {
  align-items: center;
}

.dashboard-meta-row {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-wrap: wrap;
}

.dashboard-export-summary {
  display: none;
  gap: 0.9rem;
  padding: 1rem 1.05rem;
  border: 1px solid var(--fl-gray-200);
  border-radius: 1rem;
  background:
    linear-gradient(135deg, rgba(var(--bs-primary-rgb), 0.08), transparent 62%),
    var(--fl-surface-elevated);
  box-shadow: var(--fl-shadow);
}

.dashboard-export-summary__header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 0.8rem;
}

.dashboard-export-summary__header h2 {
  font-size: 1rem;
  margin-bottom: 0.18rem;
}

.dashboard-export-summary__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.7rem;
}

.dashboard-export-summary__item {
  display: grid;
  gap: 0.18rem;
  padding: 0.72rem 0.8rem;
  border: 1px solid var(--fl-gray-200);
  border-radius: 0.85rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
}

.dashboard-export-summary__item span {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--fl-gray-500);
}

.dashboard-export-summary__item strong {
  font-size: 0.92rem;
  color: var(--fl-gray-800);
}

.dashboard-export-summary__item--wide {
  grid-column: span 2;
}

.dashboard-section {
  display: grid;
  gap: 0.85rem;
}

.dashboard-section__header {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 0.8rem;
}

.dashboard-section__header h2 {
  font-size: 1.02rem;
  margin-bottom: 0.15rem;
}

.dashboard-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.9rem;
}

.dashboard-kpi-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--fl-gray-200);
}

.dashboard-kpi-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: var(--dashboard-accent, var(--fl-primary));
}

.dashboard-kpi-card__icon {
  width: 2.85rem;
  height: 2.85rem;
  border-radius: 0.95rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(var(--dashboard-accent-rgb, var(--bs-primary-rgb)), 0.14);
  color: var(--dashboard-accent, var(--fl-primary));
  font-size: 1.2rem;
  flex-shrink: 0;
}

.dashboard-kpi-card__content {
  display: grid;
  gap: 0.4rem;
}

.dashboard-kpi-card .card-body {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.9rem;
  align-items: start;
  min-height: 136px;
}

.dashboard-kpi-card__title {
  margin: 0;
  font-size: 0.79rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--fl-gray-500);
}

.dashboard-kpi-card__value {
  margin: 0;
  font-size: 1.55rem;
  line-height: 1.08;
  font-weight: 700;
  color: var(--fl-gray-800);
}

.dashboard-kpi-card__breakdown {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.45rem;
}

.dashboard-kpi-card__breakdown-item {
  display: grid;
  gap: 0.12rem;
  padding: 0.45rem 0.6rem;
  border: 1px solid var(--fl-gray-200);
  border-radius: 0.8rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
}

.dashboard-kpi-card__breakdown-label {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--fl-gray-500);
}

.dashboard-kpi-card__breakdown-value {
  font-size: 0.88rem;
  color: var(--fl-gray-800);
}

.dashboard-kpi-card__footer {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.dashboard-kpi-card__change {
  font-size: 0.76rem;
  font-weight: 600;
}

.dashboard-kpi-card__change.is-positive {
  color: var(--fl-success);
}

.dashboard-kpi-card__change.is-negative {
  color: var(--fl-danger);
}

.dashboard-kpi-card__change.is-neutral {
  color: var(--fl-gray-500);
}

.dashboard-kpi-card--primary {
  --dashboard-accent: var(--fl-primary);
  --dashboard-accent-rgb: var(--bs-primary-rgb);
}

.dashboard-kpi-card--success {
  --dashboard-accent: var(--fl-success);
  --dashboard-accent-rgb: var(--bs-success-rgb);
}

.dashboard-kpi-card--info {
  --dashboard-accent: var(--fl-info);
  --dashboard-accent-rgb: var(--bs-info-rgb);
}

.dashboard-kpi-card--warning {
  --dashboard-accent: var(--fl-warning);
  --dashboard-accent-rgb: var(--bs-warning-rgb);
}

.dashboard-kpi-card--danger {
  --dashboard-accent: var(--fl-danger);
  --dashboard-accent-rgb: var(--bs-danger-rgb);
}

.dashboard-chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.95rem;
}

.dashboard-chart-card,
.dashboard-insight-card {
  position: relative;
  border: 1px solid var(--fl-gray-200);
}

.dashboard-chart-card__header,
.dashboard-insight-card__header {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 0.75rem;
  margin-bottom: 0.9rem;
}

.dashboard-chart-card__badge {
  background: var(--fl-surface-elevated);
  color: var(--fl-gray-500);
  border-color: var(--fl-gray-200);
}

.dashboard-chart-card__badge.is-positive {
  background: rgba(var(--bs-success-rgb), 0.12);
  color: var(--fl-success);
  border-color: rgba(var(--bs-success-rgb), 0.24);
}

.dashboard-chart-card__badge.is-negative {
  background: rgba(var(--bs-danger-rgb), 0.12);
  color: var(--fl-danger);
  border-color: rgba(var(--bs-danger-rgb), 0.24);
}

.dashboard-chart-card__badge.is-neutral {
  background: rgba(var(--bs-primary-rgb), 0.08);
  color: var(--fl-gray-600);
  border-color: var(--fl-gray-200);
}

.dashboard-chart-card__stage {
  position: relative;
  min-height: 280px;
}

.dashboard-chart-card canvas {
  width: 100% !important;
  height: 280px !important;
}

.dashboard-chart-card__empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  text-align: center;
  font-size: 0.85rem;
  color: var(--fl-gray-500);
  border: 1px dashed var(--fl-gray-200);
  border-radius: 0.9rem;
  background: rgba(var(--bs-primary-rgb), 0.03);
}

.dashboard-leaderboard-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.95rem;
}

.dashboard-leaderboard-card .card-body {
  display: grid;
  gap: 0.9rem;
}

.dashboard-leaderboard-list {
  display: grid;
  gap: 0.72rem;
}

.dashboard-leaderboard-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.9rem;
  padding: 0.85rem 0.9rem;
  border: 1px solid var(--fl-gray-200);
  border-radius: 0.95rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
}

.dashboard-leaderboard-row__identity {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  min-width: 0;
}

.dashboard-leaderboard-row__rank {
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 0.76rem;
  font-weight: 700;
  color: var(--fl-primary);
  background: var(--fl-primary-soft);
}

.dashboard-leaderboard-row__copy {
  min-width: 0;
  display: grid;
  gap: 0.15rem;
}

.dashboard-leaderboard-row__name {
  font-size: 0.88rem;
  color: var(--fl-gray-800);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dashboard-leaderboard-row__value {
  font-size: 0.78rem;
  color: var(--fl-gray-500);
}

.dashboard-leaderboard-row__trend {
  min-width: 208px;
  display: grid;
  grid-template-columns: 132px minmax(56px, auto);
  align-items: center;
  justify-content: flex-end;
  gap: 0.48rem;
}

.dashboard-leaderboard-row__change {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.9rem;
  padding: 0.28rem 0.5rem;
  border-radius: 999px;
  border: 1px solid var(--fl-gray-200);
  background: var(--fl-surface-elevated);
  font-size: 0.76rem;
  font-weight: 700;
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.dashboard-leaderboard-row__change.is-up {
  background: rgba(var(--bs-success-rgb), 0.12);
  border-color: rgba(var(--bs-success-rgb), 0.24);
  color: var(--fl-success);
}

.dashboard-leaderboard-row__change.is-down {
  background: rgba(var(--bs-danger-rgb), 0.12);
  border-color: rgba(var(--bs-danger-rgb), 0.24);
  color: var(--fl-danger);
}

.dashboard-leaderboard-row__change.is-neutral {
  background: rgba(var(--bs-primary-rgb), 0.08);
  color: var(--fl-gray-500);
}

.dashboard-leaderboard-row canvas {
  width: 132px !important;
  height: 42px !important;
  flex-shrink: 0;
}

.dashboard-leaderboard-card__empty {
  position: static;
  min-height: 220px;
}

.dashboard-rewards-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.9fr);
  gap: 0.95rem;
}

.dashboard-redemption-rate {
  display: grid;
  gap: 0.9rem;
}

.dashboard-redemption-rate__value {
  font-size: 2.15rem;
  line-height: 1;
  font-weight: 700;
  color: var(--fl-gray-800);
}

.dashboard-redemption-rate__meter {
  width: 100%;
  height: 0.9rem;
  border-radius: 999px;
  background: var(--fl-surface-muted);
  overflow: hidden;
}

.dashboard-redemption-rate__meter span {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--fl-primary), var(--fl-primary-accent));
  transition: width 0.35s ease;
}

.dashboard-redemption-rate__meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.7rem;
}

.dashboard-redemption-rate__meta div {
  display: grid;
  gap: 0.22rem;
  padding: 0.85rem 0.9rem;
  border: 1px solid var(--fl-gray-200);
  border-radius: 0.9rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
}

.dashboard-redemption-rate__meta strong {
  font-size: 1.05rem;
  color: var(--fl-gray-800);
}

.dashboard-skeleton {
  display: none;
  pointer-events: none;
}

.dashboard-skeleton span {
  display: block;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(var(--bs-primary-rgb), 0.06), rgba(var(--bs-primary-rgb), 0.16), rgba(var(--bs-primary-rgb), 0.06));
  background-size: 200% 100%;
  animation: dashboardPulse 1.35s ease-in-out infinite;
}

.dashboard-skeleton--kpi {
  position: absolute;
  inset: 1rem;
  gap: 0.55rem;
  justify-content: start;
  align-content: start;
}

.dashboard-skeleton--kpi span:nth-child(1) {
  width: 6.5rem;
  height: 0.75rem;
}

.dashboard-skeleton--kpi span:nth-child(2) {
  width: 7.8rem;
  height: 1.55rem;
}

.dashboard-skeleton--kpi span:nth-child(3) {
  width: 9rem;
  height: 0.72rem;
}

.dashboard-skeleton--chart {
  position: absolute;
  inset: 0;
  gap: 0.7rem;
  align-content: end;
  padding: 1rem 0;
}

.dashboard-skeleton--chart span {
  height: 100%;
  border-radius: 0.85rem 0.85rem 0.25rem 0.25rem;
}

.dashboard-skeleton--chart span:nth-child(1) {
  height: 34%;
}

.dashboard-skeleton--chart span:nth-child(2) {
  height: 58%;
}

.dashboard-skeleton--chart span:nth-child(3) {
  height: 46%;
}

.dashboard-skeleton--chart span:nth-child(4) {
  height: 72%;
}

.dashboard-skeleton--insight {
  position: absolute;
  inset: 1rem;
  gap: 0.75rem;
  align-content: start;
}

.dashboard-skeleton--insight span:nth-child(1) {
  width: 6.5rem;
  height: 1.7rem;
}

.dashboard-skeleton--insight span:nth-child(2) {
  width: 100%;
  height: 0.85rem;
}

.dashboard-skeleton--insight span:nth-child(3) {
  width: 100%;
  height: 3.2rem;
  border-radius: 1rem;
}

.dashboard-root.is-loading .dashboard-kpi-card__content,
.dashboard-root.is-loading .dashboard-chart-card canvas,
.dashboard-root.is-loading .dashboard-redemption-rate {
  opacity: 0.15;
}

.dashboard-root.is-loading [data-dashboard-skeleton] {
  display: grid;
}

@keyframes dashboardPulse {
  0% {
    background-position: 200% 0;
  }

  100% {
    background-position: -200% 0;
  }
}

.card {
  border: 0;
  border-radius: 0.875rem;
  background: var(--fl-surface-elevated);
  box-shadow: var(--fl-shadow);
}

.card-body {
  padding: 1rem;
}

.card .table {
  margin-bottom: 0;
}

.table > :not(caption) > * > * {
  padding-top: 0.7rem;
  padding-bottom: 0.7rem;
  vertical-align: middle;
  color: var(--fl-gray-800);
  font-size: 0.875rem;
}

.table thead th {
  white-space: nowrap;
  color: var(--fl-gray-500);
  font-size: 0.72rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: var(--fl-gray-100);
}

.table {
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--fl-gray-200);
  --bs-table-color: var(--fl-gray-800);
}

.table-responsive {
  border-radius: 0.875rem;
}

.responsive-table td,
.responsive-table th {
  white-space: normal;
}

.vehicle-row {
  gap: 0.6rem;
}

.vehicle-meta {
  min-width: 0;
}

.vehicle-mini-card {
  padding: 0.75rem 0.9rem !important;
}

.vehicle-action-group {
  justify-content: flex-end;
}

.admin-transactions-card {
  overflow: hidden;
}

.admin-customers-card .card-body,
.admin-users-card .card-body,
.admin-staff-card .card-body,
.admin-shifts-card .card-body,
.admin-attendance-card .card-body {
  display: grid;
  gap: 0.9rem;
}

.admin-transactions-header,
.admin-customers-header,
.admin-users-header,
.admin-staff-header,
.admin-shifts-header,
.admin-attendance-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 0.9rem;
}

.admin-transactions-header {
  grid-template-columns: minmax(0, 1fr) auto;
}

.admin-users-header {
  grid-template-columns: minmax(0, 1fr) auto;
}

.admin-transactions-header .page-intro,
.admin-customers-header .page-intro,
.admin-users-header .page-intro,
.admin-staff-header .page-intro,
.admin-shifts-header .page-intro,
.admin-attendance-header .page-intro {
  grid-column: 1 / -1;
}

.admin-transactions-header .page-intro {
  grid-column: auto;
}

.admin-users-header .page-intro {
  grid-column: auto;
}

.admin-transactions-header .page-actions,
.admin-customers-header .page-actions,
.admin-users-header .page-actions,
.admin-staff-header .page-actions,
.admin-shifts-header .page-actions,
.admin-attendance-header .page-actions {
  justify-content: flex-end;
  align-self: start;
  justify-self: end;
}

.admin-attendance-header {
  display: block;
}

.admin-transactions-header,
.admin-customers-header,
.admin-users-header {
  display: block;
}

.admin-transactions-header__intro,
.admin-customers-header__intro,
.admin-users-header__intro,
.admin-attendance-header__intro {
  display: grid;
  gap: 0.35rem;
}

.admin-transactions-header__topline,
.admin-customers-header__topline,
.admin-users-header__topline,
.admin-attendance-header__topline {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 0.9rem;
}

.admin-transactions-header__topline h1,
.admin-customers-header__topline h1,
.admin-users-header__topline h1,
.admin-attendance-header__topline h1 {
  margin-bottom: 0;
}

.admin-transactions-header__topline .page-actions,
.admin-customers-header__topline .page-actions,
.admin-users-header__topline .page-actions,
.admin-attendance-header__topline .page-actions {
  width: auto;
  display: flex;
  justify-content: flex-end;
  justify-self: end;
}

.admin-attendance-header__topline .page-actions > *,
.admin-attendance-header__topline .page-actions .btn {
  width: auto;
}

.admin-shifts-create-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  min-width: 1.65rem;
  min-height: 1.65rem;
  flex: 0 0 1.65rem;
  padding: 0;
  text-decoration: none;
  line-height: 1;
  color: #ffffff;
  background: var(--fl-primary);
  box-shadow: 0 16px 30px rgba(var(--bs-primary-rgb), 0.18);
}

.admin-customers-create-action,
.admin-transactions-create-action,
.admin-users-create-action,
.admin-shift-templates-create-action {
  appearance: none;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: 2rem;
  min-width: 2rem;
  min-height: 2rem;
  aspect-ratio: auto;
  flex: 0 0 auto;
  padding: 0 0.85rem;
  text-decoration: none;
  white-space: nowrap;
  line-height: 1;
  font-size: 0.82rem;
  font-weight: 700;
  color: #ffffff;
  background: var(--fl-primary);
  box-shadow: 0 16px 30px rgba(var(--bs-primary-rgb), 0.18);
  transition: background-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.admin-customers-create-action,
.admin-transactions-create-action,
.admin-users-create-action {
  height: 1.86rem;
  min-width: 1.86rem;
  min-height: 1.86rem;
  padding: 0 0.72rem;
  font-size: 0.76rem;
}

.admin-shift-templates-create-action {
  height: 1.82rem;
  min-width: 1.82rem;
  min-height: 1.82rem;
  padding: 0 0.72rem;
  font-size: 0.76rem;
}

.admin-transactions-create-action {
  height: 1.82rem;
  min-width: 1.82rem;
  min-height: 1.82rem;
  padding: 0 0.72rem;
  font-size: 0.76rem;
}

.admin-transactions-create-action:hover,
.admin-transactions-create-action:focus,
.admin-transactions-create-action:active,
.admin-customers-create-action:hover,
.admin-customers-create-action:focus,
.admin-customers-create-action:active,
.admin-users-create-action:hover,
.admin-users-create-action:focus,
.admin-users-create-action:active,
.admin-shift-templates-create-action:hover,
.admin-shift-templates-create-action:focus,
.admin-shift-templates-create-action:active,
.admin-shifts-create-action:hover,
.admin-shifts-create-action:focus,
.admin-shifts-create-action:active {
  color: #ffffff;
  background: var(--fl-primary-strong);
}

.admin-transactions-filter__form {
  display: grid;
  grid-template-columns: minmax(0, auto) minmax(320px, 1fr);
  align-items: end;
  gap: 1rem;
}

.admin-transactions-filter__topline {
  display: grid;
  grid-template-columns: max-content minmax(180px, 220px);
  align-items: end;
  gap: 1rem;
}

.admin-transactions-filter__group {
  display: grid;
  gap: 0.55rem;
}

.admin-transactions-filter__label {
  display: inline-flex;
  align-items: center;
  color: var(--fl-gray-500);
  font-size: 0.74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.admin-transactions-filter__sort {
  min-width: 0;
}

.admin-transactions-filter__sort > div {
  display: grid;
  gap: 0.5rem;
}

.admin-transactions-filter__range {
  min-width: min(360px, 100%);
}

.admin-transactions-filter__range-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

.admin-transactions-filter__date {
  min-width: 240px;
}

.admin-attendance-filter__form {
  grid-template-columns: 1fr;
  align-items: stretch;
}

.admin-attendance-filter__topline {
  grid-template-columns: minmax(220px, max-content) minmax(360px, 1fr);
  align-items: end;
}

.admin-attendance-filter__range {
  min-width: 0;
  width: 100%;
}

.admin-transactions-filter__select {
  min-width: 0;
  width: 100%;
}

.admin-customers-filter__form {
  display: grid;
  grid-template-columns: minmax(260px, 1.35fr) minmax(0, 1fr) auto;
  align-items: end;
  gap: 1rem;
}

.admin-customers-filter__search,
.admin-customers-filter__quick-filter {
  min-width: 0;
}

.admin-customers-filter__input {
  min-width: 0;
  width: 100%;
}

.admin-customers-filter__thresholds {
  grid-column: 1 / -1;
  min-width: 0;
}

.admin-customers-filter__threshold-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 0.65rem;
}

.admin-customers-filter__threshold {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
}

.admin-customers-filter__actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: end;
  justify-content: flex-end;
  gap: 0.55rem;
  flex-wrap: wrap;
}

.admin-users-list {
  display: grid;
  gap: 1px;
  background: rgba(148, 163, 184, 0.2);
  overflow: hidden;
}

.admin-customers-list {
  display: grid;
  gap: 1px;
  background: rgba(148, 163, 184, 0.2);
  overflow: hidden;
}

.admin-customer-item {
  gap: 0.85rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
}

.admin-customer-item__main {
  min-width: 0;
  display: grid;
  gap: 0.28rem;
}

.admin-customer-item__heading {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
}

.admin-customer-item__name {
  color: var(--fl-gray-800);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.admin-customer-item__status {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.admin-customer-item__status.is-active {
  background: rgba(34, 197, 94, 0.14);
  border-color: rgba(34, 197, 94, 0.28);
  color: #15803d;
}

.admin-customer-item__status.is-inactive {
  background: rgba(148, 163, 184, 0.16);
  border-color: rgba(148, 163, 184, 0.24);
  color: var(--fl-gray-600);
}

.admin-customer-item__details {
  display: grid;
  gap: 0.12rem;
  min-width: 0;
}

.admin-customer-item__phone,
.admin-customer-item__vehicles {
  color: var(--fl-gray-500);
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.admin-customer-item__metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 0.1rem 0.75rem;
  margin-top: 0.18rem;
  color: var(--fl-gray-500);
  font-size: 0.78rem;
}

.admin-customer-item__side {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.admin-customer-item__points {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4.8rem;
  padding: 0.34rem 0.68rem;
  border-radius: 999px;
  border: 1px solid rgba(245, 158, 11, 0.22);
  background: rgba(253, 186, 116, 0.16);
  color: #9a3412;
  font-weight: 700;
  line-height: 1.1;
}

.admin-customers-empty {
  padding: 2rem 1rem;
  text-align: center;
  color: var(--fl-gray-500);
  font-size: 0.95rem;
}

.admin-user-item {
  gap: 0.85rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
}

.admin-user-item__main {
  min-width: 0;
  display: grid;
  gap: 0.28rem;
}

.admin-user-item__heading {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
}

.admin-user-item__name {
  color: var(--fl-gray-800);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.admin-user-item__role,
.admin-user-item__status {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.admin-user-item__role.is-admin {
  background: rgba(var(--bs-primary-rgb), 0.14);
  border-color: rgba(var(--bs-primary-rgb), 0.28);
  color: var(--fl-primary);
}

.admin-user-item__role.is-staff {
  background: rgba(148, 163, 184, 0.14);
  border-color: rgba(148, 163, 184, 0.22);
  color: var(--fl-gray-600);
}

.admin-user-item__status {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.admin-user-item__status.is-active {
  background: rgba(34, 197, 94, 0.14);
  border-color: rgba(34, 197, 94, 0.28);
  color: #15803d;
}

.admin-user-item__status.is-inactive {
  background: rgba(148, 163, 184, 0.16);
  border-color: rgba(148, 163, 184, 0.24);
  color: var(--fl-gray-600);
}

.admin-user-item__details {
  display: grid;
  gap: 0.12rem;
  min-width: 0;
}

.admin-user-item__phone,
.admin-user-item__email {
  color: var(--fl-gray-500);
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.admin-user-item__side {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

.admin-user-item__edit {
  color: #d97706;
  background: rgba(var(--bs-warning-rgb), 0.14);
  border-color: rgba(var(--bs-warning-rgb), 0.3);
}

.admin-user-item__edit:hover,
.admin-user-item__edit:focus,
.admin-user-item__edit:active {
  color: #b45309;
  background: rgba(var(--bs-warning-rgb), 0.2);
  border-color: rgba(var(--bs-warning-rgb), 0.42);
}

.admin-staff-member,
.admin-shift-item,
.admin-attendance-item {
  gap: 0.85rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
}

.admin-shift-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}

.admin-staff-member {
  display: grid;
  gap: 1rem;
  padding: 1rem;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 1.2rem;
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.07);
}

.admin-shifts-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 360px));
  justify-content: flex-start;
  gap: 1rem;
}

.admin-shifts-card--cycle {
  height: 100%;
}

.admin-shifts-card--cycle .card-body {
  height: 100%;
}

.admin-shift-item--cycle-card {
  padding: 0;
}

.admin-staff-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  justify-content: stretch;
  gap: 1rem;
}

@media (min-width: 1200px) {
  .admin-staff-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.admin-staff-card--member {
  height: 100%;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 1.2rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.07);
}

.admin-staff-card--member .card-body {
  height: 100%;
}

.admin-staff-member--card {
  padding: 0;
  border: 0;
  box-shadow: none;
  background: transparent;
}

.admin-staff-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.9rem;
}

.admin-staff-summary__item .card-body {
  display: grid;
  gap: 0.22rem;
  padding: 1rem 1.05rem;
}

.admin-staff-summary__item .small-muted {
  line-height: 1.25;
}

.admin-staff-summary__item h2 {
  font-size: clamp(1.7rem, 3vw, 2.3rem);
  line-height: 1;
}

.admin-attendance-entry-list,
.admin-attendance-list,
.admin-attendance-run-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 360px));
  justify-content: flex-start;
  gap: 1rem;
}

.admin-attendance-run-list {
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  justify-content: stretch;
}

@media (min-width: 1200px) {
  .admin-attendance-run-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.admin-attendance-run-card {
  height: 100%;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 1.2rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.07);
}

.admin-attendance-run-card .card-body {
  height: 100%;
}

.admin-attendance-run-item {
  padding: 0;
  border: 0;
  box-shadow: none;
  background: transparent;
}

.admin-attendance-run__summary {
  white-space: normal;
  line-height: 1.45;
}

.admin-attendance-run__actions {
  display: grid;
  justify-items: end;
  align-content: start;
  justify-content: flex-end;
  gap: 0.4rem;
  margin-left: auto;
}

.admin-attendance-run__action-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.4rem;
}

.admin-attendance-run__state-badge {
  color: #8a1f1f;
  background: rgba(var(--bs-danger-rgb), 0.14);
  border: 1px solid rgba(var(--bs-danger-rgb), 0.28);
  font-weight: 600;
}

.admin-attendance-pagination {
  margin-top: 1.15rem;
  padding: 0.9rem 1rem;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 1.05rem;
  background:
    radial-gradient(circle at left top, rgba(var(--bs-primary-rgb), 0.08), transparent 30%),
    linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.05);
}

.admin-attendance-pagination__summary {
  font-size: 0.84rem;
}

.admin-attendance-pagination__actions {
  margin-left: auto;
  padding: 0.22rem;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.64);
  gap: 0.3rem;
}

.admin-attendance-pagination__button {
  appearance: none;
  border: 1px solid transparent;
  min-height: 2.1rem;
  padding: 0.42rem 0.82rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  color: var(--fl-gray-700);
  background: transparent;
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.admin-attendance-pagination__button:hover,
.admin-attendance-pagination__button:focus,
.admin-attendance-pagination__button:active {
  border-color: rgba(var(--bs-primary-rgb), 0.18);
  background: rgba(var(--bs-primary-rgb), 0.08);
  color: var(--fl-primary);
  transform: translateY(-1px);
}

.admin-attendance-pagination__button.is-disabled {
  border-color: transparent;
  color: var(--fl-gray-400);
  background: transparent;
  opacity: 0.8;
  cursor: default;
}

.admin-attendance-pagination__status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  min-height: 2.1rem;
  padding: 0.42rem 0.92rem;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.14);
  border-radius: 999px;
  background: rgba(var(--bs-primary-rgb), 0.08);
  color: var(--fl-gray-600);
  white-space: nowrap;
}

.admin-attendance-pagination__status strong {
  color: var(--fl-primary);
}

.admin-attendance-pagination__status-label,
.admin-attendance-pagination__status-separator {
  font-weight: 600;
}

.admin-attendance-status-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(104px, 1fr));
  gap: 0.75rem;
}

.admin-attendance-status-card {
  height: 100%;
}

.admin-attendance-status-card .card-body {
  display: grid;
  gap: 0.2rem;
  min-height: 96px;
  padding: 0.85rem 0.9rem;
  align-content: start;
}

.admin-staff-member__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.admin-shift-item__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  min-width: 0;
}

.admin-staff-member__identity {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  min-width: 0;
}

.admin-staff-member__avatar {
  flex-shrink: 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

.admin-staff-member__main,
.admin-attendance-item__main {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 0.22rem;
}

.admin-staff-member__heading,
.admin-shift-item__heading,
.admin-attendance-item__heading {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  flex-wrap: wrap;
}

.admin-staff-member__name,
.admin-shift-item__name,
.admin-attendance-item__name {
  color: var(--fl-gray-800);
  font-size: 1.02rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.15;
}

.admin-staff-member__subcopy {
  max-width: 36ch;
}

.admin-staff-guide {
  overflow: hidden;
}

.admin-staff-guide .card-body {
  display: grid;
  gap: 0.35rem;
  background:
    radial-gradient(circle at right top, rgba(var(--bs-primary-rgb), 0.12), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0.18));
}

.admin-staff-guide__copy h2 {
  font-size: 1.05rem;
  line-height: 1.25;
}

.admin-staff-member__shift-card {
  display: grid;
  gap: 0.22rem;
  padding: 0.85rem 0.95rem;
  border-radius: 1rem;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.14);
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.1), transparent 44%),
    linear-gradient(180deg, rgba(248, 250, 252, 0.96), rgba(241, 245, 249, 0.82));
}

.admin-staff-member__shift-label {
  color: var(--fl-gray-500);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.admin-staff-member__shift-value {
  color: var(--fl-gray-800);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.25;
}

.admin-staff-member__shift-meta {
  color: var(--fl-gray-500);
  font-size: 0.82rem;
  line-height: 1.35;
}

.admin-staff-member__details,
.admin-shift-item__details,
.admin-attendance-item__details {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.72rem;
  min-width: 0;
  color: var(--fl-gray-500);
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.admin-staff-member__details {
  gap: 0;
}

.admin-shift-item__details {
  grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 220px));
  justify-content: flex-start;
}

.admin-shift-item__details--flush {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0;
  justify-content: stretch;
  margin-top: 0.28rem;
}

.admin-staff-member__details--flush {
  gap: 0;
  margin-top: 0.28rem;
}

.admin-shift-item--flush-details {
  gap: 0.32rem;
}

.admin-staff-member--flush-details {
  gap: 0.45rem;
}

.admin-staff-member__side,
.admin-shift-item__side {
  flex-shrink: 0;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.admin-staff-member__side {
  flex-direction: column;
  align-items: flex-end;
}

.admin-staff-member__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.4rem;
  flex-wrap: nowrap;
}

.admin-staff-member__status {
  align-self: flex-end;
}

.admin-shift-item__side form {
  margin: 0;
}

@media (min-width: 992px) {
  .admin-shift-item__details {
    margin-top: 0.28rem;
  }

  .admin-shift-item__details--flush {
    margin-top: 0.28rem;
  }

  .admin-shift-item__details--stacked {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .admin-shift-item {
    padding: 0.72rem 0.85rem;
  }

  .admin-shift-item__name {
    font-size: 1.02rem;
  }

  .admin-shift-item__details {
    gap: 0.72rem;
    margin-top: 0.28rem;
    font-size: 0.82rem;
  }

  .admin-shift-item__details--flush {
    margin-top: 0.28rem;
  }

  .admin-shift-item__top {
    gap: 1rem;
  }
}

.admin-staff-member__detail {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem;
  min-width: 0;
  max-width: 100%;
  padding: 0.72rem 0.78rem;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 0.95rem;
  background: rgba(255, 255, 255, 0.42);
  color: var(--fl-gray-500);
  line-height: 1.3;
}

.admin-shift-item__detail {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem;
  min-width: 0;
  max-width: 100%;
  padding: 0.72rem 0.78rem;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 0.95rem;
  background: rgba(255, 255, 255, 0.42);
  color: var(--fl-gray-500);
  line-height: 1.3;
}

.admin-shift-item__details--flush .admin-shift-item__detail {
  padding: 0.78rem 0;
  border: 0;
  border-top: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 0;
  background: transparent;
}

.admin-staff-member__details--flush .admin-staff-member__detail {
  padding: 0.78rem 0;
  border: 0;
  border-top: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 0;
  background: transparent;
}

.admin-staff-member__details--flush .admin-staff-member__detail:last-child {
  padding-bottom: 0.4rem;
}

.admin-staff-member__detail-label {
  color: var(--fl-gray-500);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}

.admin-shift-item__detail-label {
  color: var(--fl-gray-500);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}

.admin-staff-member__detail-value {
  display: inline-block;
  color: var(--fl-gray-800);
  font-weight: 700;
  font-size: 0.86rem;
  line-height: 1.35;
  min-width: 0;
  text-align: right;
}

.admin-shift-item__detail-value {
  display: inline-block;
  color: var(--fl-gray-800);
  font-weight: 700;
  font-size: 0.86rem;
  line-height: 1.35;
  min-width: 0;
  text-align: right;
}

.admin-shift-item__sequence {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.34rem;
}

.admin-shift-item__sequence-shift {
  color: #15803d;
}

.admin-shift-item__sequence-arrow {
  color: #dc2626;
  font-weight: 800;
}

.admin-staff-member__action {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  min-width: 0;
  justify-content: center;
  padding: 0.34rem 0.72rem;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.58);
  color: var(--fl-gray-700);
  font-size: 0.76rem;
  font-weight: 700;
  line-height: 1;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.admin-staff-member__action .ti {
  font-size: 0.9rem;
}

.admin-staff-member__action:hover,
.admin-staff-member__action:focus,
.admin-staff-member__action:active {
  transform: translateY(-1px);
}

.admin-staff-member__action--neutral:hover,
.admin-staff-member__action--neutral:focus,
.admin-staff-member__action--neutral:active {
  border-color: rgba(148, 163, 184, 0.34);
  background: rgba(255, 255, 255, 0.86);
  color: var(--fl-gray-800);
}

.admin-staff-member__action--primary {
  border-color: rgba(var(--bs-primary-rgb), 0.22);
  background: rgba(var(--bs-primary-rgb), 0.08);
  color: var(--fl-primary);
}

.admin-staff-member__action--primary:hover,
.admin-staff-member__action--primary:focus,
.admin-staff-member__action--primary:active {
  border-color: rgba(var(--bs-primary-rgb), 0.34);
  background: rgba(var(--bs-primary-rgb), 0.14);
  color: var(--fl-primary-strong);
}

.admin-shift-item__edit {
  color: #d97706;
  background: rgba(var(--bs-warning-rgb), 0.14);
  border-color: rgba(var(--bs-warning-rgb), 0.3);
}

.admin-shift-item__delete {
  color: #dc2626;
  background: rgba(var(--bs-danger-rgb), 0.12);
  border-color: rgba(var(--bs-danger-rgb), 0.28);
}

.admin-shift-item__edit:hover,
.admin-shift-item__edit:focus,
.admin-shift-item__edit:active {
  color: #b45309;
  background: rgba(var(--bs-warning-rgb), 0.2);
  border-color: rgba(var(--bs-warning-rgb), 0.42);
}

.admin-shift-item__delete:hover,
.admin-shift-item__delete:focus,
.admin-shift-item__delete:active {
  color: #b91c1c;
  background: rgba(var(--bs-danger-rgb), 0.18);
  border-color: rgba(var(--bs-danger-rgb), 0.4);
}

.admin-shift-item__delete[disabled] {
  opacity: 1;
  filter: none;
  transform: none;
  color: rgba(220, 38, 38, 0.72);
  background: rgba(var(--bs-danger-rgb), 0.08);
  border-color: rgba(var(--bs-danger-rgb), 0.2);
  cursor: not-allowed;
}

.admin-users-empty {
  padding: 2rem 1rem;
  text-align: center;
  color: var(--fl-gray-500);
  font-size: 0.95rem;
}

.admin-attendance-planner__form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 1fr) minmax(220px, 1fr) 160px;
  gap: 1rem;
  align-items: end;
}

.admin-attendance-planner__actions {
  display: flex;
  align-items: end;
}

.admin-attendance-card__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.9rem;
}

.admin-attendance-card__side {
  display: grid;
  justify-items: end;
  gap: 0.55rem;
  flex-shrink: 0;
}

.admin-attendance-card__summary {
  display: grid;
  gap: 0.12rem;
  text-align: right;
}

.admin-attendance-card__summary-label {
  color: var(--fl-gray-500);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.admin-attendance-card__summary-value {
  color: var(--fl-gray-800);
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1;
}

.admin-attendance-entry {
  display: grid;
  gap: 0.85rem;
  height: 100%;
}

.admin-attendance-item {
  display: grid;
  gap: 0.85rem;
  padding: 1rem;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 1.2rem;
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.07);
}

.admin-attendance-entry__header {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: start;
}

.admin-attendance-entry__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.9rem;
}

.transaction-entry-shell .card-body {
  display: grid;
  gap: 0.9rem;
}

[data-transaction-page-stepper],
.transaction-entry-tabs,
.transaction-entry-stepper,
.transaction-entry-launch-actions {
  min-width: 0;
}

.transaction-entry-launch-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

.transaction-entry-page-error {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.9rem;
  flex-wrap: wrap;
  margin-bottom: 0;
}

.transaction-entry-page-error > div {
  display: grid;
  gap: 0.2rem;
}

.transaction-entry-modal__dialog {
  max-width: min(76rem, calc(100vw - 1.25rem));
}

.transaction-entry-modal__content {
  border: 0;
  border-radius: 1.5rem;
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.08), transparent 38%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98));
  box-shadow: 0 1.8rem 3.6rem rgba(15, 23, 42, 0.2);
}

.customer-details-modal {
  z-index: 1085;
}

.modal-backdrop.transaction-registration-modal-backdrop {
  z-index: 1080;
  --bs-backdrop-opacity: 0.42;
  background-color: #0f172a;
}

.transaction-entry-modal__header {
  padding-bottom: 0.2rem;
}

.transaction-entry-modal__body {
  padding-top: 0.55rem;
  padding-bottom: 0.75rem;
}

.transaction-entry-titlebar {
  display: grid;
  gap: 0.55rem;
}

.transaction-entry-titlebar__heading {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.transaction-entry-titlebar__hint-toggle {
  appearance: none;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.18);
  width: 1.85rem;
  height: 1.85rem;
  min-width: 1.85rem;
  min-height: 1.85rem;
  padding: 0;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--fl-primary);
  background: rgba(var(--bs-primary-rgb), 0.08);
  box-shadow: 0 10px 24px rgba(var(--bs-primary-rgb), 0.08);
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.transaction-entry-titlebar__hint-toggle:hover,
.transaction-entry-titlebar__hint-toggle:focus,
.transaction-entry-titlebar__hint-toggle:active {
  border-color: rgba(var(--bs-primary-rgb), 0.28);
  background: rgba(var(--bs-primary-rgb), 0.14);
  color: var(--fl-primary-strong);
  transform: translateY(-1px);
}

.transaction-entry-titlebar__hint-card {
  max-width: 42rem;
  padding: 0.72rem 0.92rem;
  border-radius: 0.92rem;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.14);
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.08), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.96));
  color: var(--fl-gray-600);
  font-size: 0.82rem;
  line-height: 1.45;
}

.transaction-entry-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 0.8rem;
  width: 100%;
}

.transaction-entry-tabs .nav-item {
  display: flex;
  min-width: 0;
}

.transaction-entry-tabs .nav-link {
  position: relative;
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-columns: 1fr;
  align-content: center;
  gap: 0;
  padding: 1rem 1.05rem;
  border-radius: 1rem;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.12);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 250, 252, 0.94)),
    var(--fl-surface);
  color: var(--fl-gray-700);
  text-align: left;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.06);
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.transaction-entry-tabs__icon {
  width: 2.2rem;
  height: 2.2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.8rem;
  background: rgba(var(--bs-primary-rgb), 0.1);
  color: var(--fl-primary);
  font-size: 1.05rem;
  flex-shrink: 0;
}

.transaction-entry-tabs__header {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.82rem;
}

.transaction-entry-tabs__title {
  color: var(--fl-gray-900);
  font-size: 0.95rem;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.transaction-entry-tabs__description {
  padding: 0.78rem 0.92rem;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.12);
  border-radius: 0.9rem;
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.08), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.96));
}

.transaction-entry-tabs__description-text {
  color: var(--fl-gray-500);
  font-size: 0.78rem;
  line-height: 1.35;
}

.transaction-entry-tabs .nav-link:hover,
.transaction-entry-tabs .nav-link:focus {
  color: var(--fl-gray-800);
  border-color: rgba(var(--bs-primary-rgb), 0.28);
  background:
    linear-gradient(180deg, rgba(240, 253, 244, 0.94), rgba(248, 250, 252, 0.98)),
    var(--fl-surface);
  box-shadow: 0 18px 34px rgba(var(--bs-primary-rgb), 0.12);
  transform: translateY(-1px);
}

.transaction-entry-tabs .nav-link.active {
  color: var(--fl-gray-900);
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.14), transparent 44%),
    linear-gradient(180deg, rgba(240, 253, 244, 0.98), rgba(255, 255, 255, 0.98));
  border-color: var(--fl-primary);
  box-shadow: 0 18px 36px rgba(var(--bs-primary-rgb), 0.16);
}

.transaction-entry-tabs .nav-link.active .transaction-entry-tabs__icon {
  background: rgba(var(--bs-primary-rgb), 0.14);
  color: var(--fl-primary-strong);
}

.transaction-entry-tabs .nav-link.active .transaction-entry-tabs__title {
  color: var(--fl-gray-900);
}

.transaction-entry-tabs .nav-link.active .transaction-entry-tabs__meta {
  color: var(--fl-gray-600);
}

.transaction-entry-stepper {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.8rem;
  margin-bottom: 0.9rem;
  width: 100%;
}

.transaction-entry-step {
  appearance: none;
  width: 100%;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.12);
  border-radius: 1rem;
  padding: 0.85rem 0.92rem;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.96)),
    var(--fl-surface);
  color: var(--fl-gray-700);
  display: grid;
  gap: 0.38rem;
  text-align: left;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.06);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease, background-color 0.18s ease;
}

.transaction-entry-step__eyebrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
}

.transaction-entry-step__count {
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(var(--bs-primary-rgb), 0.1);
  color: var(--fl-primary);
  font-size: 0.82rem;
  font-weight: 800;
  flex-shrink: 0;
}

.transaction-entry-step__status {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--fl-gray-500);
}

.transaction-entry-step__title {
  font-size: 0.92rem;
  font-weight: 800;
  color: var(--fl-gray-900);
}

.transaction-entry-step__text {
  font-size: 0.77rem;
  line-height: 1.38;
  color: var(--fl-gray-500);
}

.transaction-entry-step.is-current {
  border-color: var(--fl-primary);
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.16), transparent 44%),
    linear-gradient(180deg, rgba(240, 253, 244, 0.98), rgba(255, 255, 255, 0.98));
  box-shadow: 0 18px 36px rgba(var(--bs-primary-rgb), 0.16);
}

.transaction-entry-step.is-complete {
  border-color: rgba(34, 197, 94, 0.26);
  background:
    radial-gradient(circle at top right, rgba(34, 197, 94, 0.12), transparent 42%),
    linear-gradient(180deg, rgba(240, 253, 244, 0.96), rgba(255, 255, 255, 0.98));
}

.transaction-entry-step.is-ready {
  border-color: rgba(var(--bs-primary-rgb), 0.22);
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.12), transparent 42%),
    linear-gradient(180deg, rgba(239, 246, 255, 0.96), rgba(255, 255, 255, 0.98));
}

.transaction-entry-step.is-locked,
.transaction-entry-step:disabled {
  opacity: 0.62;
  box-shadow: none;
  cursor: not-allowed;
}

.transaction-entry-step:not(:disabled):hover,
.transaction-entry-step:not(:disabled):focus-visible {
  border-color: rgba(var(--bs-primary-rgb), 0.28);
  box-shadow: 0 18px 34px rgba(var(--bs-primary-rgb), 0.12);
  transform: translateY(-1px);
  outline: 0;
}

.transaction-entry-wizard-form {
  display: grid;
  gap: 1rem;
}

.transaction-entry-step-modal {
  display: grid;
  gap: 0.8rem;
  max-width: 60rem;
  margin: 0 auto;
}

.transaction-entry-step-card {
  border: 1px solid rgba(var(--bs-primary-rgb), 0.12);
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.08), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.96));
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease, opacity 0.18s ease;
}

.transaction-entry-step-card .card-body {
  padding: 0.9rem;
}

.transaction-entry-step-card.is-current {
  border-color: var(--fl-primary);
  box-shadow: 0 18px 36px rgba(var(--bs-primary-rgb), 0.12);
}

.transaction-entry-step-card.is-complete {
  border-color: rgba(34, 197, 94, 0.24);
}

.transaction-entry-step-card.is-ready {
  border-color: rgba(var(--bs-primary-rgb), 0.18);
}

.transaction-entry-step-card.is-locked {
  opacity: 0.82;
}

.transaction-entry-step-card__header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 0.8rem;
}

.transaction-entry-step-card__header-actions {
  display: inline-flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 0.45rem;
  flex: 0 0 auto;
}

.transaction-entry-step-card__header--with-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  column-gap: 0.8rem;
  row-gap: 0.35rem;
}

.transaction-entry-step-card__header--with-action .transaction-entry-step-card__header-actions {
  position: static;
}

.transaction-entry-step-card__header--with-action .transaction-entry-step-card__summary {
  grid-column: 1 / -1;
}

.transaction-entry-step-card__header--with-toggle {
  position: relative;
  padding-right: 3rem;
}

.transaction-entry-step-card__title-stack {
  display: grid;
  gap: 0.35rem;
}

.transaction-entry-step-card__title-row {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.transaction-entry-step-card__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-bottom: 0.22rem;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--fl-primary);
}

.transaction-entry-step-card__summary {
  color: var(--fl-gray-500);
  font-size: 0.83rem;
  line-height: 1.45;
}

.transaction-entry-step-card__camera-toggle {
  position: absolute;
  top: 0;
  right: 0;
}

.transaction-entry-step-card__header-action--positive {
  color: var(--fl-primary-contrast);
  background: var(--fl-primary);
  border-color: var(--fl-primary);
  box-shadow: 0 0.6rem 1.2rem rgba(var(--bs-primary-rgb), 0.18);
}

.transaction-entry-step-card__header-action--positive:hover,
.transaction-entry-step-card__header-action--positive:focus-visible,
.transaction-entry-step-card__header-action--positive:active {
  color: var(--fl-primary-contrast);
  background: var(--fl-primary-strong);
  border-color: var(--fl-primary-strong);
}

.transaction-entry-step-card__header-action:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  box-shadow: none;
}

.transaction-entry-step-card__body {
  display: grid;
  gap: 0.85rem;
  margin-top: 0.7rem;
}

.transaction-entry-step-card__footer {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 0.75rem;
  padding-top: 0.7rem;
  border-top: 1px solid rgba(var(--bs-primary-rgb), 0.1);
}

.transaction-entry-step-card__footer-note {
  flex: 1 0 100%;
  color: var(--fl-gray-500);
  font-size: 0.8rem;
  line-height: 1.4;
  text-align: center;
}

.transaction-entry-step-card__actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  flex-wrap: wrap;
}

.transaction-entry-step-card__fieldset {
  display: grid;
  gap: 1rem;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.transaction-entry-step-card__fieldset[disabled] {
  opacity: 0.64;
}

.transaction-entry-content {
  display: grid;
  gap: 1rem;
}

.transaction-entry-panel .transaction-entry-lookup-input {
  min-height: 3.9rem;
  padding: 0 1rem;
  font-size: clamp(1.4rem, 2.4vw, 1.85rem);
  font-weight: 700;
  letter-spacing: 0.02em;
}

.transaction-entry-panel .transaction-entry-lookup-input::placeholder {
  font-weight: 600;
}

.transaction-entry-panel .transaction-entry-lookup-prefix {
  min-width: 4.9rem;
  padding-inline: 0.95rem;
  font-size: clamp(1.15rem, 2vw, 1.5rem);
  font-weight: 700;
}

.transaction-plate-scanner-shell {
  display: grid;
  gap: 0.75rem;
}

.transaction-plate-scanner__field-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  flex-wrap: wrap;
}

.transaction-plate-scanner__toggle {
  appearance: none;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.18);
  border-radius: 999px;
  background: rgba(var(--bs-primary-rgb), 0.08);
  color: var(--fl-primary);
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-height: 2.25rem;
  padding: 0.45rem 0.8rem;
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 10px 22px rgba(var(--bs-primary-rgb), 0.08);
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.transaction-plate-scanner__toggle:hover,
.transaction-plate-scanner__toggle:focus-visible,
.transaction-plate-scanner__toggle:active {
  border-color: rgba(var(--bs-primary-rgb), 0.3);
  background: rgba(var(--bs-primary-rgb), 0.14);
  color: var(--fl-primary-strong);
  transform: translateY(-1px);
  outline: 0;
}

.transaction-plate-scanner {
  border: 1px solid rgba(var(--bs-primary-rgb), 0.14);
  border-radius: 1rem;
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.08), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.96));
}

.transaction-plate-scanner .card-body {
  display: grid;
  gap: 0.85rem;
}

.transaction-plate-scanner__preview-shell {
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 2 / 1;
  max-height: 15rem;
  border-radius: 1rem;
  background: linear-gradient(180deg, #0f172a, #111827);
}

.transaction-plate-scanner__video,
.transaction-plate-scanner__canvas {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  background: #020617;
}

.transaction-plate-scanner__guide {
  position: absolute;
  left: 8%;
  top: 34%;
  width: 84%;
  height: 28%;
  border-radius: 0.9rem;
  border: 2px solid rgba(255, 255, 255, 0.94);
  box-shadow:
    0 0 0 9999px rgba(15, 23, 42, 0.34),
    inset 0 0 0 1px rgba(255, 255, 255, 0.25);
}

.transaction-plate-scanner__status {
  font-size: 0.85rem;
  line-height: 1.45;
  color: var(--fl-gray-600);
}

.transaction-plate-scanner__status[data-tone="warning"] {
  color: #92400e;
}

.transaction-plate-scanner__status[data-tone="success"] {
  color: #166534;
}

.transaction-plate-scanner__actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: stretch;
  gap: 0.65rem;
}

.transaction-plate-scanner__actions .btn.is-active {
  border-color: rgba(var(--bs-primary-rgb), 0.24);
  background: var(--fl-primary);
  color: #fff;
  box-shadow: 0 8px 18px rgba(var(--bs-primary-rgb), 0.18);
}

.transaction-plate-scanner__actions .btn {
  width: 100%;
  min-width: 0;
  white-space: nowrap;
}

.transaction-plate-scanner__result {
  display: grid;
  gap: 0.45rem;
  padding: 0.8rem 0.92rem;
  border-radius: 1rem;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.16);
  background: rgba(var(--bs-primary-rgb), 0.06);
}

.transaction-plate-scanner__result.is-success {
  border-color: rgba(34, 197, 94, 0.2);
  background: linear-gradient(180deg, rgba(240, 253, 244, 0.96), rgba(220, 252, 231, 0.92));
}

.transaction-plate-scanner__result.is-warning {
  border-color: rgba(245, 158, 11, 0.22);
  background: linear-gradient(180deg, rgba(255, 251, 235, 0.96), rgba(254, 243, 199, 0.92));
}

.transaction-plate-scanner__result-header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 0.8rem;
}

.transaction-plate-scanner__result-label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--fl-gray-500);
}

.transaction-plate-scanner__result-value {
  display: block;
  font-size: 1rem;
  color: var(--fl-gray-900);
}

.transaction-plate-scanner__result-confidence {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.8rem;
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: var(--fl-gray-700);
  font-size: 0.74rem;
  font-weight: 700;
  white-space: nowrap;
}

.transaction-plate-scanner__result-note {
  font-size: 0.84rem;
  line-height: 1.45;
  color: var(--fl-gray-700);
}

.transaction-plate-scanner__result-raw {
  font-size: 0.78rem;
  color: var(--fl-gray-500);
}

.my-pump-nozzle-picker {
  display: grid;
  gap: 0.85rem;
}

.my-pump-nozzle-grid,
.transaction-pump-card__nozzles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin-top: 0.8rem;
}

.my-pump-nozzle-card,
.transaction-pump-card__nozzle {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  padding: 0.85rem 0.95rem;
  border: 1px solid var(--fl-gray-200);
  border-radius: 1rem;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(248, 250, 252, 0.9));
  cursor: pointer;
  transition: border-color 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.my-pump-nozzle-option,
.transaction-pump-card__nozzle-option {
  position: relative;
}

.my-pump-nozzle-card,
.transaction-pump-card__nozzle {
  grid-template-columns: minmax(0, 1fr) auto;
  width: 100%;
}

.my-pump-nozzle-card:hover,
.my-pump-nozzle-card:focus-within,
.transaction-pump-card__nozzle:hover,
.transaction-pump-card__nozzle:focus-within {
  border-color: rgba(var(--bs-primary-rgb), 0.28);
  background: rgba(var(--bs-primary-rgb), 0.06);
  box-shadow: 0 0.7rem 1.6rem rgba(15, 23, 42, 0.08);
  transform: translateY(-1px);
}

.my-pump-nozzle-card:has(.my-pump-nozzle-card__input:checked),
.transaction-pump-card__nozzle:has(.transaction-pump-card__nozzle-input:checked) {
  border-color: rgba(var(--bs-primary-rgb), 0.36);
  background: rgba(var(--bs-primary-rgb), 0.12);
  box-shadow: 0 0.9rem 1.8rem rgba(var(--bs-primary-rgb), 0.12);
}

.my-pump-nozzle-card__input,
.transaction-pump-card__nozzle-input {
  margin: 0;
}

.my-pump-nozzle-card__input,
.transaction-pump-card__nozzle-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.my-pump-nozzle-card__input:checked + .my-pump-nozzle-card,
.transaction-pump-card__nozzle-input:checked + .transaction-pump-card__nozzle,
.transaction-pump-card__nozzle-option.is-selected .transaction-pump-card__nozzle {
  border-color: var(--bs-primary);
  background: linear-gradient(180deg, rgba(var(--bs-primary-rgb), 0.96), rgba(var(--bs-primary-rgb), 0.86));
  box-shadow: 0 1rem 2rem rgba(var(--bs-primary-rgb), 0.28);
}

.my-pump-nozzle-card__input:checked + .my-pump-nozzle-card .my-pump-nozzle-card__copy strong,
.transaction-pump-card__nozzle-input:checked + .transaction-pump-card__nozzle .transaction-pump-card__nozzle-copy strong,
.transaction-pump-card__nozzle-option.is-selected .transaction-pump-card__nozzle-copy strong {
  color: var(--bs-white);
}

.my-pump-nozzle-card__input:checked + .my-pump-nozzle-card .my-pump-nozzle-card__copy span,
.transaction-pump-card__nozzle-input:checked + .transaction-pump-card__nozzle .transaction-pump-card__nozzle-copy span,
.transaction-pump-card__nozzle-option.is-selected .transaction-pump-card__nozzle-copy span {
  color: rgba(255, 255, 255, 0.82);
}

.transaction-pump-card__nozzle-input:checked + .transaction-pump-card__nozzle .transaction-pump-card__nozzle-meta .badge,
.transaction-pump-card__nozzle-option.is-selected .transaction-pump-card__nozzle-meta .badge {
  color: var(--bs-primary);
  background: rgba(255, 255, 255, 0.96);
  border-color: rgba(255, 255, 255, 0.96) !important;
}

.my-pump-nozzle-card__input:focus-visible + .my-pump-nozzle-card,
.transaction-pump-card__nozzle-input:focus-visible + .transaction-pump-card__nozzle {
  border-color: rgba(var(--bs-primary-rgb), 0.32);
  box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.16);
}

.my-pump-nozzle-card__copy,
.transaction-pump-card__nozzle-copy {
  min-width: 0;
  display: grid;
  gap: 0.12rem;
}

.my-pump-nozzle-card__copy strong,
.transaction-pump-card__nozzle-copy strong {
  font-size: 0.96rem;
  color: var(--fl-gray-800);
}

.my-pump-nozzle-card__copy span,
.transaction-pump-card__nozzle-copy span {
  font-size: 0.8rem;
  color: var(--fl-gray-500);
}

.my-pump-nozzle-card__meta {
  justify-self: end;
}

.transaction-pump-card__nozzle-meta {
  justify-self: end;
}

.transaction-pump-card {
  display: grid;
  gap: 0.9rem;
  padding: 1rem;
  border: 1px solid var(--fl-gray-200);
  border-radius: 1rem;
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.1), transparent 42%),
    linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
}

.transaction-pump-card__header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 0.8rem;
}

.transaction-pump-card__change-link {
  justify-self: end;
  align-self: start;
  text-decoration: none;
}

.transaction-pump-card__pump {
  display: grid;
  gap: 0.18rem;
  padding: 0.85rem 0.95rem;
  border-radius: 1rem;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.16);
  background: rgba(var(--bs-primary-rgb), 0.06);
}

.transaction-pump-card__pump-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--fl-gray-500);
}

.transaction-pump-card__pump-value {
  font-size: 1.05rem;
  color: var(--fl-gray-800);
}

.transaction-pump-card__pump-meta {
  font-size: 0.82rem;
  color: var(--fl-gray-500);
}

.transaction-pump-card__nozzle-legend {
  display: block;
  font-size: 0.83rem;
  font-weight: 500;
  line-height: 1.4;
  margin-bottom: 0.5rem;
}

.admin-transactions-card .card-body {
  display: grid;
  gap: 0.9rem;
}

.admin-transactions-list {
  display: grid;
  gap: 2px;
  background: rgba(148, 163, 184, 0.22);
  overflow: hidden;
}

.admin-transaction-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 0.85rem;
  width: 100%;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
}

.admin-transactions-list .admin-transaction-item + .admin-transaction-item {
  border-top: 0;
}

.admin-transaction-item__main {
  min-width: 0;
  display: grid;
  gap: 0.18rem;
}

.admin-transaction-item__name {
  color: var(--fl-gray-800);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.admin-transaction-item__time {
  color: var(--fl-gray-500);
  font-size: 0.8rem;
}

.admin-transaction-item__location {
  margin-top: 0.08rem;
}

.admin-transaction-item__side {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  justify-self: end;
}

.admin-transaction-item__amount {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 5.8rem;
  padding: 0.34rem 0.68rem;
  border-radius: 999px;
  border: 1px solid rgba(245, 158, 11, 0.22);
  background: rgba(253, 186, 116, 0.16);
  color: #9a3412;
  font-weight: 700;
  line-height: 1.1;
}

.admin-transactions-empty {
  padding: 2rem 1rem;
  text-align: center;
  color: var(--fl-gray-500);
  font-size: 0.95rem;
}

.admin-transaction-modal__eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--fl-primary);
}

.admin-transaction-modal__hero {
  display: grid;
  gap: 0.8rem;
  margin-bottom: 0.9rem;
  padding: 1.05rem 1.05rem 1rem;
  border: 1px solid rgba(245, 158, 11, 0.18);
  border-radius: 1.15rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
  background:
    radial-gradient(circle at top right, rgba(251, 191, 36, 0.18), transparent 42%),
    radial-gradient(circle at top left, rgba(var(--bs-primary-rgb), 0.14), transparent 44%),
    linear-gradient(180deg, rgba(255, 251, 235, 0.96), rgba(255, 255, 255, 0.92));
}

.admin-transaction-modal__hero-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.9rem;
}

.admin-transaction-modal__hero-copy {
  display: grid;
  gap: 0.32rem;
  min-width: 0;
}

.admin-transaction-modal__amount {
  display: inline-block;
  font-size: 1.9rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #f59e0b;
  background: linear-gradient(180deg, #fde68a 0%, #fbbf24 42%, #f59e0b 76%, #d97706 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.admin-transaction-modal__hero-note {
  color: var(--fl-gray-500);
  font-size: 0.84rem;
}

.admin-transaction-modal__fuel-chip,
.admin-transaction-modal__meta-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: -0.01em;
  white-space: nowrap;
}

.admin-transaction-modal__fuel-chip {
  padding: 0.46rem 0.82rem;
  border: 1px solid rgba(245, 158, 11, 0.26);
  background: rgba(255, 255, 255, 0.72);
  color: #b45309;
  box-shadow: 0 10px 24px rgba(217, 119, 6, 0.08);
}

.admin-transaction-modal__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.admin-transaction-modal__meta-chip {
  padding: 0.38rem 0.72rem;
  border: 1px solid rgba(148, 163, 184, 0.18);
  background: rgba(255, 255, 255, 0.64);
  color: var(--fl-gray-600);
  font-size: 0.82rem;
}

.admin-transaction-modal__meta-chip i {
  font-size: 0.92rem;
}

.admin-transaction-modal__details {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0;
  margin-top: 0.32rem;
  color: var(--fl-gray-500);
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.admin-transaction-modal__detail {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem;
  min-width: 0;
  max-width: 100%;
  padding: 0.82rem 0;
  border: 0;
  border-top: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 0;
  background: transparent;
  line-height: 1.3;
}

.admin-transaction-modal__label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--fl-gray-500);
  white-space: nowrap;
}

.admin-transaction-modal__value {
  color: var(--fl-gray-800);
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.3;
  min-width: 0;
  text-align: right;
}

html[data-theme="dark"] .admin-transaction-item__name,
html[data-theme="dark"] .admin-transaction-modal__value,
html[data-theme="dark"] .admin-customer-item__name,
html[data-theme="dark"] .admin-user-item__name {
  color: #fff2d7;
}

html[data-theme="dark"] .admin-transactions-list {
  background: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .admin-customers-list,
html[data-theme="dark"] .admin-users-list {
  background: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .admin-transactions-filter__label {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .transaction-entry-modal__content {
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.12), transparent 38%),
    linear-gradient(180deg, rgba(42, 34, 24, 0.98), rgba(24, 21, 16, 0.98));
  color: var(--fl-gray-300);
}

html[data-theme="dark"] .modal-backdrop.transaction-registration-modal-backdrop {
  --bs-backdrop-opacity: 0.56;
  background-color: #020617;
}

html[data-theme="dark"] .transaction-entry-tabs .nav-link {
  background:
    linear-gradient(180deg, rgba(31, 41, 55, 0.92), rgba(17, 24, 39, 0.92)),
    rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.1);
  color: var(--fl-gray-300);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .transaction-entry-titlebar__hint-toggle {
  border-color: rgba(var(--bs-primary-rgb), 0.28);
  background: rgba(var(--bs-primary-rgb), 0.14);
  color: #b7f0c0;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .transaction-entry-titlebar__hint-toggle:hover,
html[data-theme="dark"] .transaction-entry-titlebar__hint-toggle:focus,
html[data-theme="dark"] .transaction-entry-titlebar__hint-toggle:active {
  border-color: rgba(134, 239, 172, 0.28);
  background: rgba(34, 197, 94, 0.18);
  color: #dcfce7;
}

html[data-theme="dark"] .transaction-entry-titlebar__hint-card {
  border-color: rgba(var(--bs-primary-rgb), 0.22);
  background:
    radial-gradient(circle at top right, rgba(34, 197, 94, 0.14), transparent 40%),
    linear-gradient(180deg, rgba(31, 41, 55, 0.94), rgba(17, 24, 39, 0.96));
  color: var(--fl-gray-300);
}

html[data-theme="dark"] .transaction-entry-step {
  border-color: rgba(255, 255, 255, 0.08);
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.12), transparent 42%),
    linear-gradient(180deg, rgba(42, 34, 24, 0.96), rgba(24, 21, 16, 0.96));
  color: var(--fl-gray-300);
}

html[data-theme="dark"] .transaction-entry-step__count {
  background: rgba(var(--bs-primary-rgb), 0.18);
  color: #b7f0c0;
}

html[data-theme="dark"] .transaction-entry-step__status,
html[data-theme="dark"] .transaction-entry-step__text,
html[data-theme="dark"] .transaction-entry-step-card__summary {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .transaction-entry-step__title {
  color: #f8fafc;
}

html[data-theme="dark"] .transaction-entry-step.is-current {
  border-color: rgba(134, 239, 172, 0.3);
  background:
    radial-gradient(circle at top right, rgba(34, 197, 94, 0.18), transparent 40%),
    linear-gradient(180deg, rgba(20, 83, 45, 0.62), rgba(24, 21, 16, 0.96));
}

html[data-theme="dark"] .transaction-entry-step.is-complete {
  border-color: rgba(34, 197, 94, 0.24);
  background:
    radial-gradient(circle at top right, rgba(34, 197, 94, 0.14), transparent 40%),
    linear-gradient(180deg, rgba(20, 83, 45, 0.48), rgba(24, 21, 16, 0.94));
}

html[data-theme="dark"] .transaction-entry-step.is-ready {
  border-color: rgba(134, 239, 172, 0.18);
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.14), transparent 40%),
    linear-gradient(180deg, rgba(30, 41, 59, 0.92), rgba(24, 21, 16, 0.94));
}

html[data-theme="dark"] .transaction-entry-step-card {
  border-color: rgba(255, 255, 255, 0.08);
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.12), transparent 42%),
    linear-gradient(180deg, rgba(42, 34, 24, 0.96), rgba(24, 21, 16, 0.96));
}

html[data-theme="dark"] .transaction-entry-step-card__footer {
  border-top-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .transaction-entry-step-card.is-current {
  border-color: rgba(134, 239, 172, 0.28);
}

html[data-theme="dark"] .transaction-entry-step-card.is-complete {
  border-color: rgba(34, 197, 94, 0.2);
}

html[data-theme="dark"] .transaction-entry-step-card.is-ready {
  border-color: rgba(134, 239, 172, 0.16);
}

html[data-theme="dark"] .transaction-entry-step-card__eyebrow {
  color: #b7f0c0;
}

html[data-theme="dark"] .transaction-plate-scanner__toggle {
  border-color: rgba(var(--bs-primary-rgb), 0.28);
  background: rgba(var(--bs-primary-rgb), 0.14);
  color: #b7f0c0;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .transaction-plate-scanner__toggle:hover,
html[data-theme="dark"] .transaction-plate-scanner__toggle:focus-visible,
html[data-theme="dark"] .transaction-plate-scanner__toggle:active {
  border-color: rgba(134, 239, 172, 0.28);
  background: rgba(34, 197, 94, 0.18);
  color: #dcfce7;
}

html[data-theme="dark"] .transaction-plate-scanner {
  border-color: rgba(255, 255, 255, 0.08);
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.16), transparent 42%),
    linear-gradient(180deg, rgba(42, 34, 24, 0.96), rgba(24, 21, 16, 0.96));
}

html[data-theme="dark"] .transaction-plate-scanner__status {
  color: var(--fl-gray-300);
}

html[data-theme="dark"] .transaction-plate-scanner__status[data-tone="warning"] {
  color: #fcd34d;
}

html[data-theme="dark"] .transaction-plate-scanner__status[data-tone="success"] {
  color: #bbf7d0;
}

html[data-theme="dark"] .transaction-plate-scanner__actions .btn {
  color: var(--fl-gray-300);
}

html[data-theme="dark"] .transaction-plate-scanner__actions .btn.is-active {
  border-color: rgba(134, 239, 172, 0.22);
  background: rgba(34, 197, 94, 0.22);
  color: #dcfce7;
}

html[data-theme="dark"] .transaction-plate-scanner__result {
  border-color: rgba(var(--bs-primary-rgb), 0.2);
  background: rgba(var(--bs-primary-rgb), 0.12);
}

html[data-theme="dark"] .transaction-plate-scanner__result.is-success {
  border-color: rgba(34, 197, 94, 0.18);
  background: linear-gradient(180deg, rgba(20, 83, 45, 0.68), rgba(17, 24, 39, 0.94));
}

html[data-theme="dark"] .transaction-plate-scanner__result.is-warning {
  border-color: rgba(245, 158, 11, 0.24);
  background: linear-gradient(180deg, rgba(120, 53, 15, 0.7), rgba(17, 24, 39, 0.94));
}

html[data-theme="dark"] .transaction-plate-scanner__result-label,
html[data-theme="dark"] .transaction-plate-scanner__result-raw {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .transaction-plate-scanner__result-value,
html[data-theme="dark"] .transaction-plate-scanner__result-note {
  color: #f8fafc;
}

html[data-theme="dark"] .transaction-plate-scanner__result-confidence {
  background: rgba(255, 255, 255, 0.08);
  color: #f8fafc;
}

html[data-theme="dark"] .transaction-entry-tabs__icon {
  background: rgba(var(--bs-primary-rgb), 0.16);
  color: #8ee3a0;
}

html[data-theme="dark"] .transaction-entry-tabs__title {
  color: #f8fafc;
}

html[data-theme="dark"] .transaction-entry-tabs__description {
  border-color: rgba(var(--bs-primary-rgb), 0.22);
  background:
    radial-gradient(circle at top right, rgba(34, 197, 94, 0.14), transparent 40%),
    linear-gradient(180deg, rgba(31, 41, 55, 0.94), rgba(17, 24, 39, 0.96));
}

html[data-theme="dark"] .transaction-entry-tabs__description-text {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .transaction-entry-tabs .nav-link:hover,
html[data-theme="dark"] .transaction-entry-tabs .nav-link:focus {
  background:
    linear-gradient(180deg, rgba(20, 83, 45, 0.42), rgba(17, 24, 39, 0.94)),
    rgba(var(--bs-primary-rgb), 0.12);
  border-color: rgba(var(--bs-primary-rgb), 0.28);
  color: #d7f7de;
}

html[data-theme="dark"] .transaction-entry-tabs .nav-link.active {
  background:
    radial-gradient(circle at top right, rgba(34, 197, 94, 0.22), transparent 42%),
    linear-gradient(180deg, rgba(20, 83, 45, 0.78), rgba(17, 24, 39, 0.94));
  border-color: var(--fl-primary);
  color: #ffffff;
}

html[data-theme="dark"] .transaction-entry-tabs .nav-link.active .transaction-entry-tabs__icon {
  background: rgba(134, 239, 172, 0.14);
  color: #dcfce7;
}

html[data-theme="dark"] .my-pump-nozzle-card,
html[data-theme="dark"] .transaction-pump-card__nozzle {
  border-color: rgba(255, 255, 255, 0.08);
  background: linear-gradient(180deg, rgba(29, 24, 18, 0.92), rgba(20, 16, 12, 0.88));
}

html[data-theme="dark"] .my-pump-nozzle-card:hover,
html[data-theme="dark"] .my-pump-nozzle-card:focus-within,
html[data-theme="dark"] .transaction-pump-card__nozzle:hover,
html[data-theme="dark"] .transaction-pump-card__nozzle:focus-within {
  border-color: rgba(157, 214, 255, 0.26);
  background: rgba(var(--bs-primary-rgb), 0.12);
  box-shadow: 0 0.8rem 1.6rem rgba(0, 0, 0, 0.22);
}

html[data-theme="dark"] .my-pump-nozzle-card:has(.my-pump-nozzle-card__input:checked),
html[data-theme="dark"] .transaction-pump-card__nozzle:has(.transaction-pump-card__nozzle-input:checked) {
  border-color: rgba(157, 214, 255, 0.34);
  background: rgba(var(--bs-primary-rgb), 0.18);
}

html[data-theme="dark"] .my-pump-nozzle-card__input:checked + .my-pump-nozzle-card,
html[data-theme="dark"] .transaction-pump-card__nozzle-input:checked + .transaction-pump-card__nozzle,
html[data-theme="dark"] .transaction-pump-card__nozzle-option.is-selected .transaction-pump-card__nozzle {
  border-color: #9dd6ff;
  background: linear-gradient(180deg, rgba(var(--bs-primary-rgb), 0.98), rgba(8, 84, 182, 0.94));
  box-shadow: 0 1rem 2rem rgba(var(--bs-primary-rgb), 0.34);
}

html[data-theme="dark"] .my-pump-nozzle-card__input:focus-visible + .my-pump-nozzle-card,
html[data-theme="dark"] .transaction-pump-card__nozzle-input:focus-visible + .transaction-pump-card__nozzle {
  border-color: rgba(157, 214, 255, 0.3);
  box-shadow: 0 0 0 0.2rem rgba(157, 214, 255, 0.14);
}

html[data-theme="dark"] .my-pump-nozzle-card__input:checked + .my-pump-nozzle-card .my-pump-nozzle-card__copy strong,
html[data-theme="dark"] .transaction-pump-card__nozzle-input:checked + .transaction-pump-card__nozzle .transaction-pump-card__nozzle-copy strong,
html[data-theme="dark"] .transaction-pump-card__nozzle-option.is-selected .transaction-pump-card__nozzle-copy strong {
  color: #ffffff;
}

html[data-theme="dark"] .my-pump-nozzle-card__input:checked + .my-pump-nozzle-card .my-pump-nozzle-card__copy span,
html[data-theme="dark"] .transaction-pump-card__nozzle-input:checked + .transaction-pump-card__nozzle .transaction-pump-card__nozzle-copy span,
html[data-theme="dark"] .transaction-pump-card__nozzle-option.is-selected .transaction-pump-card__nozzle-copy span {
  color: rgba(255, 255, 255, 0.84);
}

html[data-theme="dark"] .transaction-pump-card__nozzle-input:checked + .transaction-pump-card__nozzle .transaction-pump-card__nozzle-meta .badge,
html[data-theme="dark"] .transaction-pump-card__nozzle-option.is-selected .transaction-pump-card__nozzle-meta .badge {
  color: rgb(20, 62, 109);
  background: rgba(255, 255, 255, 0.96);
  border-color: rgba(255, 255, 255, 0.96) !important;
}

html[data-theme="dark"] .my-pump-nozzle-card__copy strong,
html[data-theme="dark"] .transaction-pump-card__nozzle-copy strong,
html[data-theme="dark"] .transaction-pump-card__pump-value {
  color: #fff2d7;
}

html[data-theme="dark"] .my-pump-nozzle-card__copy span,
html[data-theme="dark"] .transaction-pump-card__nozzle-copy span,
html[data-theme="dark"] .transaction-pump-card__pump-label,
html[data-theme="dark"] .transaction-pump-card__pump-meta {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .transaction-pump-card {
  border-color: rgba(255, 255, 255, 0.08);
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.16), transparent 42%),
    linear-gradient(180deg, rgba(42, 34, 24, 0.96), rgba(24, 21, 16, 0.96));
}

html[data-theme="dark"] .transaction-pump-card__pump {
  border-color: rgba(157, 214, 255, 0.18);
  background: rgba(var(--bs-primary-rgb), 0.12);
}

html[data-theme="dark"] .admin-transactions-create-action,
html[data-theme="dark"] .admin-shifts-create-action {
  color: #ffffff;
  background: var(--fl-primary);
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.22);
}

html[data-theme="dark"] .admin-customers-create-action,
html[data-theme="dark"] .admin-users-create-action,
html[data-theme="dark"] .admin-shift-templates-create-action {
  color: #ffffff;
  background: var(--fl-primary);
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.22);
}

html[data-theme="dark"] .admin-transaction-item {
  background: linear-gradient(180deg, rgba(42, 34, 24, 0.92), rgba(28, 24, 19, 0.92));
}

html[data-theme="dark"] .admin-transaction-item__time,
html[data-theme="dark"] .admin-transactions-empty,
html[data-theme="dark"] .admin-transaction-modal__hero-note,
html[data-theme="dark"] .admin-transaction-modal__label,
html[data-theme="dark"] .admin-customer-item__phone,
html[data-theme="dark"] .admin-customer-item__vehicles,
html[data-theme="dark"] .admin-customers-empty,
html[data-theme="dark"] .admin-user-item__phone,
html[data-theme="dark"] .admin-user-item__email,
html[data-theme="dark"] .admin-users-empty {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .admin-customer-item {
  background: linear-gradient(180deg, rgba(42, 34, 24, 0.92), rgba(28, 24, 19, 0.92));
}

html[data-theme="dark"] .admin-customer-item__status.is-active {
  background: rgba(34, 197, 94, 0.18);
  border-color: rgba(34, 197, 94, 0.32);
  color: #b7f7c7;
}

html[data-theme="dark"] .admin-customer-item__status.is-inactive {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.12);
  color: #d6d3d1;
}

html[data-theme="dark"] .admin-customer-item__points {
  color: #ffd27a;
  background: rgba(var(--bs-warning-rgb), 0.16);
  border-color: rgba(var(--bs-warning-rgb), 0.24);
}

html[data-theme="dark"] .admin-user-item {
  background: linear-gradient(180deg, rgba(42, 34, 24, 0.92), rgba(28, 24, 19, 0.92));
}

html[data-theme="dark"] .admin-staff-member,
html[data-theme="dark"] .admin-shift-item,
html[data-theme="dark"] .admin-attendance-item {
  background: linear-gradient(180deg, rgba(42, 34, 24, 0.92), rgba(28, 24, 19, 0.92));
}

html[data-theme="dark"] .admin-shifts-card--cycle {
  box-shadow: 0 18px 38px rgba(2, 6, 23, 0.3);
}

html[data-theme="dark"] .admin-staff-card--member {
  border-color: rgba(148, 163, 184, 0.14);
  background: linear-gradient(180deg, rgba(42, 34, 24, 0.92), rgba(28, 24, 19, 0.92));
  box-shadow: 0 18px 38px rgba(2, 6, 23, 0.3);
}

html[data-theme="dark"] .admin-attendance-run-card {
  border-color: rgba(148, 163, 184, 0.14);
  background: linear-gradient(180deg, rgba(42, 34, 24, 0.92), rgba(28, 24, 19, 0.92));
  box-shadow: 0 18px 38px rgba(2, 6, 23, 0.3);
}

html[data-theme="dark"] .admin-attendance-run__state-badge {
  color: #ffd1d1;
  background: rgba(var(--bs-danger-rgb), 0.18);
  border-color: rgba(var(--bs-danger-rgb), 0.34);
}

html[data-theme="dark"] .admin-attendance-pagination {
  border-color: rgba(148, 163, 184, 0.14);
  background:
    radial-gradient(circle at left top, rgba(var(--bs-primary-rgb), 0.12), transparent 34%),
    linear-gradient(180deg, rgba(42, 34, 24, 0.92), rgba(28, 24, 19, 0.92));
  box-shadow: 0 18px 34px rgba(2, 6, 23, 0.24);
}

html[data-theme="dark"] .admin-attendance-pagination__actions {
  border-color: rgba(148, 163, 184, 0.14);
  background: rgba(255, 255, 255, 0.04);
  box-shadow: none;
}

html[data-theme="dark"] .admin-attendance-pagination__button {
  color: #e2e8f0;
}

html[data-theme="dark"] .admin-attendance-pagination__button:hover,
html[data-theme="dark"] .admin-attendance-pagination__button:focus,
html[data-theme="dark"] .admin-attendance-pagination__button:active {
  border-color: rgba(134, 239, 172, 0.18);
  background: rgba(34, 197, 94, 0.1);
  color: #86efac;
}

html[data-theme="dark"] .admin-attendance-pagination__button.is-disabled {
  color: rgba(226, 232, 240, 0.42);
}

html[data-theme="dark"] .admin-attendance-pagination__status {
  border-color: rgba(134, 239, 172, 0.2);
  background: rgba(34, 197, 94, 0.12);
  color: #cbd5e1;
}

html[data-theme="dark"] .admin-attendance-pagination__status strong {
  color: #86efac;
}

html[data-theme="dark"] .admin-attendance-item {
  border-color: rgba(148, 163, 184, 0.14);
  box-shadow: 0 18px 38px rgba(2, 6, 23, 0.3);
}

html[data-theme="dark"] .admin-staff-member--card {
  background: transparent;
}

html[data-theme="dark"] .admin-staff-member__name,
html[data-theme="dark"] .admin-shift-item__name,
html[data-theme="dark"] .admin-attendance-item__name {
  color: #f8fafc;
}

html[data-theme="dark"] .admin-staff-guide .card-body {
  background:
    radial-gradient(circle at right top, rgba(34, 197, 94, 0.16), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.02));
}

html[data-theme="dark"] .admin-staff-member__subcopy,
html[data-theme="dark"] .admin-staff-member__details,
html[data-theme="dark"] .admin-shift-item__details,
html[data-theme="dark"] .admin-attendance-item__details {
  color: #cbd5e1;
}

html[data-theme="dark"] .admin-staff-member__shift-card {
  border-color: rgba(134, 239, 172, 0.16);
  background:
    radial-gradient(circle at top right, rgba(34, 197, 94, 0.12), transparent 44%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.03));
}

html[data-theme="dark"] .admin-staff-member__shift-label {
  color: #94a3b8;
}

html[data-theme="dark"] .admin-staff-member__shift-value {
  color: #f8fafc;
}

html[data-theme="dark"] .admin-staff-member__shift-meta {
  color: #cbd5e1;
}

html[data-theme="dark"] .admin-staff-member__detail {
  border-color: rgba(148, 163, 184, 0.14);
  background: rgba(255, 255, 255, 0.03);
}

html[data-theme="dark"] .admin-shift-item__detail {
  border-color: rgba(148, 163, 184, 0.14);
  background: rgba(255, 255, 255, 0.03);
}

html[data-theme="dark"] .admin-shift-item__details--flush .admin-shift-item__detail {
  border: 0;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
  background: transparent;
}

html[data-theme="dark"] .admin-staff-member__details--flush .admin-staff-member__detail {
  border: 0;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
  background: transparent;
}

html[data-theme="dark"] .admin-staff-member__detail-label {
  color: #94a3b8;
}

html[data-theme="dark"] .admin-shift-item__detail-label {
  color: #94a3b8;
}

html[data-theme="dark"] .admin-staff-member__detail-value {
  color: #f8fafc;
}

html[data-theme="dark"] .admin-shift-item__detail-value {
  color: #f8fafc;
}

html[data-theme="dark"] .admin-shift-item__sequence-shift {
  color: #86efac;
}

html[data-theme="dark"] .admin-shift-item__sequence-arrow {
  color: #fca5a5;
}

html[data-theme="dark"] .admin-staff-member__action {
  border-color: rgba(148, 163, 184, 0.16);
  background: rgba(255, 255, 255, 0.04);
  color: #e2e8f0;
}

html[data-theme="dark"] .admin-staff-member__action--neutral:hover,
html[data-theme="dark"] .admin-staff-member__action--neutral:focus,
html[data-theme="dark"] .admin-staff-member__action--neutral:active {
  border-color: rgba(148, 163, 184, 0.26);
  background: rgba(255, 255, 255, 0.08);
  color: #f8fafc;
}

html[data-theme="dark"] .admin-staff-member__action--primary {
  border-color: rgba(134, 239, 172, 0.2);
  background: rgba(34, 197, 94, 0.1);
  color: #86efac;
}

html[data-theme="dark"] .admin-staff-member__action--primary:hover,
html[data-theme="dark"] .admin-staff-member__action--primary:focus,
html[data-theme="dark"] .admin-staff-member__action--primary:active {
  border-color: rgba(134, 239, 172, 0.3);
  background: rgba(34, 197, 94, 0.16);
  color: #bbf7d0;
}

html[data-theme="dark"] .admin-user-item__role.is-admin {
  background: rgba(var(--bs-primary-rgb), 0.18);
  border-color: rgba(185, 243, 199, 0.28);
  color: #b9f3c7;
}

html[data-theme="dark"] .admin-user-item__role.is-staff {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.12);
  color: #d6d3d1;
}

html[data-theme="dark"] .admin-user-item__status.is-active {
  background: rgba(34, 197, 94, 0.18);
  border-color: rgba(34, 197, 94, 0.32);
  color: #b7f7c7;
}

html[data-theme="dark"] .admin-user-item__status.is-inactive {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.12);
  color: #d6d3d1;
}

html[data-theme="dark"] .admin-user-item__edit {
  color: #ffd27a;
  background: rgba(var(--bs-warning-rgb), 0.16);
  border-color: rgba(255, 210, 122, 0.32);
}

html[data-theme="dark"] .admin-user-item__edit:hover,
html[data-theme="dark"] .admin-user-item__edit:focus,
html[data-theme="dark"] .admin-user-item__edit:active {
  color: #ffd27a;
  background: rgba(var(--bs-warning-rgb), 0.24);
  border-color: rgba(255, 210, 122, 0.44);
}

html[data-theme="dark"] .admin-shift-item__edit {
  color: #ffd27a;
  background: rgba(var(--bs-warning-rgb), 0.16);
  border-color: rgba(255, 210, 122, 0.32);
}

html[data-theme="dark"] .admin-shift-item__delete {
  color: #fca5a5;
  background: rgba(var(--bs-danger-rgb), 0.16);
  border-color: rgba(252, 165, 165, 0.3);
}

html[data-theme="dark"] .admin-shift-item__edit:hover,
html[data-theme="dark"] .admin-shift-item__edit:focus,
html[data-theme="dark"] .admin-shift-item__edit:active {
  color: #ffd27a;
  background: rgba(var(--bs-warning-rgb), 0.24);
  border-color: rgba(255, 210, 122, 0.44);
}

html[data-theme="dark"] .admin-shift-item__delete:hover,
html[data-theme="dark"] .admin-shift-item__delete:focus,
html[data-theme="dark"] .admin-shift-item__delete:active {
  color: #fecaca;
  background: rgba(var(--bs-danger-rgb), 0.24);
  border-color: rgba(254, 202, 202, 0.42);
}

html[data-theme="dark"] .admin-shift-item__delete[disabled] {
  opacity: 1;
  filter: none;
  transform: none;
  color: rgba(252, 165, 165, 0.78);
  background: rgba(var(--bs-danger-rgb), 0.1);
  border-color: rgba(252, 165, 165, 0.24);
}

html[data-theme="dark"] .admin-transaction-item__amount {
  color: #ffd27a;
  background: rgba(var(--bs-warning-rgb), 0.15);
  border-color: rgba(var(--bs-warning-rgb), 0.24);
}

html[data-theme="dark"] .admin-transaction-modal__hero {
  border-color: rgba(251, 191, 36, 0.14);
  background:
    radial-gradient(circle at top right, rgba(251, 191, 36, 0.2), transparent 42%),
    radial-gradient(circle at top left, rgba(var(--bs-primary-rgb), 0.22), transparent 44%),
    linear-gradient(180deg, rgba(42, 34, 24, 0.96), rgba(24, 21, 16, 0.96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

html[data-theme="dark"] .admin-transaction-modal__fuel-chip {
  color: #ffd27a;
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(251, 191, 36, 0.18);
}

html[data-theme="dark"] .admin-transaction-modal__meta-chip {
  color: #d6d3d1;
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .admin-transaction-modal__details {
  color: #cbd5e1;
}

html[data-theme="dark"] .admin-transaction-modal__detail {
  border: 0;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
  background: transparent;
}

html[data-theme="dark"] .admin-transaction-modal__label {
  color: #94a3b8;
}

.auth-card,
.lookup-card {
  max-width: 440px;
  margin: 0 auto;
}

.home-header {
  align-items: flex-end;
}

.home-header .eyebrow {
  color: var(--fl-primary);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.home-grid {
  align-items: stretch;
}

.home-lookup-card,
.home-actions-card {
  border: 1px solid var(--fl-gray-200);
  border-radius: 1rem;
}

.home-lookup-card {
  background:
    radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.12), transparent 38%),
    var(--fl-surface-elevated);
}

.home-card-icon {
  width: 2.75rem;
  height: 2.75rem;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.9rem;
  color: var(--fl-primary);
  background: var(--fl-primary-soft);
  font-size: 1.25rem;
}

.home-actions-card .btn {
  min-height: 2.8rem;
}

.loyalty-lookup-shell {
  padding-top: 0;
  padding-bottom: 3rem;
}

.lookup-card-shell {
  width: min(100%, 520px);
}

.lookup-card {
  max-width: 520px;
}

.loyalty-language-switcher {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.75rem;
}

.loyalty-language-switcher--lookup {
  margin-bottom: 0.55rem;
}

.loyalty-language-switcher--lookup .loyalty-language-form {
  width: 100%;
  justify-content: space-between;
  padding-inline: 1rem;
}

.loyalty-language-switcher--result {
  margin-bottom: 0.85rem;
}

.loyalty-language-form {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.32rem 0.42rem;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.14);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 0.35rem 0.95rem rgba(12, 16, 13, 0.04);
}

.loyalty-language-form__label {
  margin-bottom: 0;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--fl-gray-600);
}

.loyalty-language-form__select {
  min-width: 7.2rem;
  border: 0;
  background-color: transparent;
  box-shadow: none;
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--fl-gray-800);
  width: auto;
  flex: 0 1 auto;
  padding-top: 0.15rem;
  padding-bottom: 0.15rem;
}

.loyalty-language-switcher--lookup .loyalty-language-form__select {
  min-width: 0;
  flex: 0 1 6.4rem;
}

.loyalty-language-form__select:focus {
  box-shadow: none;
}

.redemption-customer-shell .card-body {
  display: grid;
  gap: 1rem;
}

.redemption-customer-shell__header h2 {
  margin-bottom: 0.2rem;
}

.redemption-customer-card {
  border: 1px solid var(--fl-gray-200);
  border-radius: 1rem;
  background:
    radial-gradient(circle at top, rgba(var(--bs-primary-rgb), 0.12), transparent 48%),
    linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
  overflow: hidden;
}

.redemption-customer-card--placeholder {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 0.72rem;
  min-height: 15rem;
  padding: 1.4rem 1.15rem;
  text-align: center;
}

.redemption-customer-card__placeholder-icon {
  width: 2.8rem;
  height: 2.8rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--fl-primary);
  background: var(--fl-primary-soft);
  font-size: 1.22rem;
}

.redemption-customer-card__hero {
  display: grid;
  justify-items: center;
  gap: 0.32rem;
  padding: 1.2rem 1rem 0.95rem;
  text-align: center;
  background:
    radial-gradient(circle at 50% 12%, rgba(255, 255, 255, 0.62), transparent 28%),
    linear-gradient(180deg, rgba(var(--bs-primary-rgb), 0.12), rgba(255, 255, 255, 0));
}

.redemption-customer-card__eyebrow {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--fl-gray-500);
}

.redemption-customer-card__value {
  display: inline-block;
  font-size: clamp(2.5rem, 9vw, 4rem);
  line-height: 1;
  letter-spacing: -0.05em;
  color: #f59e0b;
  background: linear-gradient(180deg, #fde68a 0%, #fbbf24 42%, #f59e0b 76%, #d97706 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow:
    0 0.1rem 0.32rem rgba(120, 53, 15, 0.12),
    0 0 0.9rem rgba(253, 224, 71, 0.24);
}

.redemption-customer-card__note {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.9rem;
  padding: 0.3rem 0.8rem;
  border-radius: 999px;
  border: 1px solid var(--fl-gray-200);
  background: rgba(255, 255, 255, 0.74);
  color: var(--fl-gray-700);
  font-size: 0.8rem;
  font-weight: 600;
  text-align: center;
}

.redemption-customer-card__note.is-redeemable {
  color: #166534;
  background: rgba(134, 239, 172, 0.18);
  border-color: rgba(34, 197, 94, 0.24);
}

.redemption-customer-card__note.is-pending {
  color: #92400e;
  background: rgba(253, 224, 71, 0.18);
  border-color: rgba(245, 158, 11, 0.28);
}

.redemption-customer-card__identity {
  display: grid;
  gap: 0.24rem;
  padding: 0.95rem 1rem 0.9rem;
  border-top: 1px solid rgba(255, 255, 255, 0.72);
  background:
    linear-gradient(90deg, rgba(var(--bs-primary-rgb), 0.1), rgba(255, 255, 255, 0.62) 55%, rgba(251, 191, 36, 0.12)),
    linear-gradient(180deg, rgba(255, 255, 255, 0.74), rgba(255, 255, 255, 0.44));
}

.redemption-customer-card__identity-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  flex-wrap: wrap;
}

.redemption-customer-card__name {
  font-size: 1.28rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--fl-gray-800);
}

.redemption-customer-card__phone {
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--fl-gray-500);
}

.redemption-customer-card__status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.8rem;
  padding: 0.28rem 0.72rem;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border: 1px solid var(--fl-gray-200);
  background: rgba(255, 255, 255, 0.74);
  color: var(--fl-gray-700);
}

.redemption-customer-card__status.is-active {
  color: #166534;
  background: rgba(134, 239, 172, 0.18);
  border-color: rgba(34, 197, 94, 0.24);
}

.redemption-customer-card__status.is-inactive {
  color: #92400e;
  background: rgba(253, 224, 71, 0.18);
  border-color: rgba(245, 158, 11, 0.28);
}

.redemption-customer-card__stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin-top: 0.5rem;
  padding: 0 1rem 1rem;
}

.redemption-customer-card__stat {
  display: grid;
  gap: 0.18rem;
  padding: 0.78rem 0.82rem;
  border: 1px solid var(--fl-gray-200);
  border-radius: 0.88rem;
  background: rgba(255, 255, 255, 0.7);
}

.redemption-customer-card__stat-label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--fl-gray-500);
}

.redemption-customer-card__stat-value {
  font-size: 1rem;
  font-weight: 700;
  color: var(--fl-gray-800);
}

html[data-theme="dark"] .redemption-customer-shell__header .text-muted {
  color: var(--fl-gray-400) !important;
}

html[data-theme="dark"] .loyalty-language-form {
  border-color: rgba(255, 255, 255, 0.08);
  background: rgba(18, 15, 10, 0.5);
  box-shadow: none;
}

html[data-theme="dark"] .loyalty-language-form__label {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .loyalty-language-form__select {
  color: #fff2d7;
}

html[data-theme="dark"] .redemption-customer-card {
  border-color: rgba(255, 255, 255, 0.08);
  background:
    radial-gradient(circle at top, rgba(var(--bs-primary-rgb), 0.18), transparent 52%),
    linear-gradient(180deg, rgba(42, 34, 24, 0.96), rgba(24, 21, 16, 0.96));
}

html[data-theme="dark"] .redemption-customer-card--placeholder {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .redemption-customer-card__placeholder-icon {
  color: #ffd27a;
  background: rgba(var(--bs-warning-rgb), 0.18);
}

html[data-theme="dark"] .redemption-customer-card__hero {
  background:
    radial-gradient(circle at 50% 14%, rgba(255, 238, 185, 0.14), transparent 30%),
    linear-gradient(180deg, rgba(var(--bs-primary-rgb), 0.12), rgba(15, 12, 8, 0));
}

html[data-theme="dark"] .redemption-customer-card__eyebrow {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .redemption-customer-card__value {
  text-shadow:
    0 0.1rem 0.32rem rgba(0, 0, 0, 0.3),
    0 0 1rem rgba(253, 224, 71, 0.18);
}

html[data-theme="dark"] .redemption-customer-card__note {
  border-color: rgba(255, 255, 255, 0.08);
  background: rgba(15, 12, 8, 0.5);
  color: var(--fl-gray-300);
}

html[data-theme="dark"] .redemption-customer-card__note.is-redeemable {
  color: #bff1cb;
  background: rgba(var(--bs-success-rgb), 0.16);
  border-color: rgba(var(--bs-success-rgb), 0.28);
}

html[data-theme="dark"] .redemption-customer-card__note.is-pending {
  color: #f6d889;
  background: rgba(var(--bs-warning-rgb), 0.16);
  border-color: rgba(var(--bs-warning-rgb), 0.26);
}

html[data-theme="dark"] .redemption-customer-card__identity {
  border-top-color: rgba(255, 255, 255, 0.08);
  background:
    linear-gradient(90deg, rgba(var(--bs-primary-rgb), 0.14), rgba(22, 18, 13, 0.92) 55%, rgba(var(--bs-warning-rgb), 0.12)),
    linear-gradient(180deg, rgba(32, 28, 22, 0.9), rgba(22, 19, 15, 0.78));
}

html[data-theme="dark"] .redemption-customer-card__name,
html[data-theme="dark"] .redemption-customer-card__stat-value {
  color: #fff2d7;
}

html[data-theme="dark"] .redemption-customer-card__phone,
html[data-theme="dark"] .redemption-customer-card__stat-label {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .redemption-customer-card__status {
  border-color: rgba(255, 255, 255, 0.08);
  background: rgba(15, 12, 8, 0.52);
  color: var(--fl-gray-300);
}

html[data-theme="dark"] .redemption-customer-card__status.is-active {
  color: #bff1cb;
  background: rgba(var(--bs-success-rgb), 0.16);
  border-color: rgba(var(--bs-success-rgb), 0.28);
}

html[data-theme="dark"] .redemption-customer-card__status.is-inactive {
  color: #f6d889;
  background: rgba(var(--bs-warning-rgb), 0.16);
  border-color: rgba(var(--bs-warning-rgb), 0.26);
}

html[data-theme="dark"] .redemption-customer-card__stat {
  border-color: rgba(255, 255, 255, 0.08);
  background: rgba(15, 12, 8, 0.48);
}

.transaction-customer-card__stats {
  margin-top: 0.5rem;
}

.transaction-customer-card__stat-value {
  font-size: 0.96rem;
  line-height: 1.25;
}

.transaction-customer-card__vehicles {
  display: grid;
  gap: 0.75rem;
  padding: 0 1rem 1rem;
}

.transaction-customer-card__vehicles-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.transaction-customer-card__vehicle-list {
  overflow: hidden;
}

.transaction-customer-card__vehicle-row {
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: background-color 0.18s ease, transform 0.18s ease;
}

.transaction-customer-card__vehicle-row:hover,
.transaction-customer-card__vehicle-row:focus-visible {
  background: rgba(var(--bs-primary-rgb), 0.08);
}

.transaction-customer-card__vehicle-row:focus-visible {
  outline: 0;
}

.transaction-customer-card__vehicle-row.is-selected {
  background: rgba(var(--bs-primary-rgb), 0.12);
}

.transaction-customer-card__vehicle-row.is-selected .customer-details-vehicle-row__number {
  color: var(--fl-primary);
}

.transaction-customer-card__vehicles-empty {
  padding: 0.95rem 1rem;
  text-align: center;
  color: var(--fl-gray-500);
  font-size: 0.86rem;
}

.transaction-customer-error {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  text-align: center;
}

.transaction-entry-panel {
  display: grid;
  gap: 0;
}

.transaction-customer-error:not(.d-none) {
  margin-top: 0 !important;
  margin-bottom: 0.75rem !important;
}

.transaction-customer-register-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  min-height: 2.15rem;
  padding: 0.45rem 0.95rem;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.22);
  border-radius: 999px;
  background: linear-gradient(180deg, var(--fl-primary), var(--fl-primary-strong));
  color: var(--fl-primary-contrast);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  box-shadow: 0 0.55rem 1.1rem rgba(var(--bs-primary-rgb), 0.2);
  transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.transaction-customer-register-link:hover,
.transaction-customer-register-link:focus-visible,
.transaction-customer-register-link:active {
  color: var(--fl-primary-contrast);
  transform: translateY(-1px);
  filter: brightness(1.04);
  box-shadow: 0 0.7rem 1.35rem rgba(var(--bs-primary-rgb), 0.26);
}

.transaction-customer-register-link:focus-visible {
  outline: 0;
}

.transaction-customer-error > span {
  max-width: 26rem;
}

html[data-theme="dark"] .transaction-customer-card__vehicle-row:hover,
html[data-theme="dark"] .transaction-customer-card__vehicle-row:focus-visible {
  background: rgba(var(--bs-primary-rgb), 0.16);
}

html[data-theme="dark"] .transaction-customer-card__vehicle-row.is-selected {
  background: rgba(var(--bs-primary-rgb), 0.2);
}

html[data-theme="dark"] .transaction-customer-card__vehicle-row.is-selected .customer-details-vehicle-row__number {
  color: #9dd6ff;
}

html[data-theme="dark"] .transaction-customer-card__vehicles-empty {
  color: var(--fl-gray-400);
}

html[data-theme="dark"] .transaction-customer-register-link {
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 0.65rem 1.35rem rgba(0, 0, 0, 0.24);
}

html[data-theme="dark"] .transaction-customer-register-link:hover,
html[data-theme="dark"] .transaction-customer-register-link:focus-visible,
html[data-theme="dark"] .transaction-customer-register-link:active {
  color: #041108;
  box-shadow: 0 0.8rem 1.5rem rgba(0, 0, 0, 0.3);
}

.template-form-card {
  max-width: 460px;
  width: 100%;
}

.template-form-card .card-body,
.lookup-card .card-body {
  padding: 1.75rem !important;
}

.install-app-panel {
  border: 1px solid rgba(var(--bs-primary-rgb), 0.22);
  border-radius: 1rem;
  padding: 1rem;
  background:
    linear-gradient(135deg, rgba(var(--bs-primary-rgb), 0.12), transparent 65%),
    var(--fl-surface-elevated);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.install-app-icon {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 0.95rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: linear-gradient(135deg, var(--fl-primary), var(--fl-primary-accent));
  color: var(--fl-primary-contrast);
  box-shadow: 0 0.75rem 1.5rem rgba(var(--bs-primary-rgb), 0.18);
}

.install-app-icon .ti {
  font-size: 1.2rem;
}

.install-app-panel .btn {
  min-height: 2.75rem;
}

.install-app-panel .btn[disabled] {
  opacity: 0.72;
}

.border-dashed {
  border-style: dashed !important;
}

.small-muted {
  color: var(--fl-gray-500);
  font-size: 0.85rem;
}

.form-control,
.form-select {
  display: block;
  width: 100%;
  max-width: 100%;
  background: var(--fl-surface);
  background-color: var(--fl-surface);
  background-clip: padding-box;
  border-color: var(--fl-gray-200);
  color: var(--fl-gray-800);
  font-size: 0.875rem;
  min-height: 2.45rem;
  padding: 0.45rem 0.75rem;
}

.form-select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--fl-surface);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%237A6C57' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.75' d='m4 6 4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.8rem center;
  background-size: 0.9rem 0.9rem;
  padding-right: 2.25rem;
}

.form-select[data-vehicle-select] {
  background-color: var(--fl-surface);
}

.form-control::placeholder {
  color: var(--fl-gray-500);
}

.form-control:disabled,
.form-control[readonly],
.form-select:disabled {
  background: var(--fl-surface-muted);
  background-color: var(--fl-surface-muted);
  border-color: var(--fl-gray-200);
  color: var(--fl-gray-500);
  opacity: 1;
}

.form-control:disabled,
.form-control[readonly] {
  -webkit-text-fill-color: var(--fl-gray-500);
  -webkit-box-shadow: 0 0 0 1000px var(--fl-surface-muted) inset;
}

.form-select:disabled {
  -webkit-text-fill-color: var(--fl-gray-500);
  -webkit-box-shadow: 0 0 0 1000px var(--fl-surface-muted) inset;
}

html[data-theme="dark"] .form-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23C0B08D' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.75' d='m4 6 4 4 4-4'/%3E%3C/svg%3E");
}

html[data-theme="dark"] input.form-control,
html[data-theme="dark"] textarea.form-control,
html[data-theme="dark"] select.form-select {
  background-color: var(--fl-surface) !important;
  color: var(--fl-gray-800);
}

html[data-theme="dark"] input.form-control:disabled,
html[data-theme="dark"] input.form-control[readonly],
html[data-theme="dark"] textarea.form-control:disabled,
html[data-theme="dark"] textarea.form-control[readonly],
html[data-theme="dark"] select.form-select:disabled {
  background-color: var(--fl-surface-muted) !important;
  color: var(--fl-gray-500) !important;
  border-color: var(--fl-gray-200) !important;
}

.form-select option,
.form-select optgroup {
  background: var(--fl-surface-elevated);
  color: var(--fl-gray-800);
}

.form-control-color {
  padding: 0.35rem;
  background: var(--fl-surface);
  border-color: var(--fl-gray-200);
}

.form-control-color::-webkit-color-swatch {
  border: 1px solid var(--fl-gray-200);
  border-radius: 0.55rem;
}

.form-control-color::-moz-color-swatch {
  border: 1px solid var(--fl-gray-200);
  border-radius: 0.55rem;
}

.form-control:-webkit-autofill,
.form-control:-webkit-autofill:hover,
.form-control:-webkit-autofill:focus,
.form-select:-webkit-autofill,
.form-select:-webkit-autofill:hover,
.form-select:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--fl-gray-800);
  -webkit-box-shadow: 0 0 0 1000px var(--fl-surface) inset;
  transition: background-color 9999s ease-out;
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
  border-color: var(--fl-primary);
  box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.18);
}

.form-check-input {
  background-color: var(--fl-surface);
  border-color: var(--fl-gray-400);
}

.form-label {
  font-size: 0.8125rem;
  font-weight: 500;
  margin-bottom: 0.35rem;
}

.form-text,
.small {
  font-size: 0.8125rem;
}

.form-check-input:checked {
  background-color: var(--fl-primary);
  border-color: var(--fl-primary);
}

html[data-theme="dark"] .form-switch .form-check-input {
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23f8fafc'/%3e%3c/svg%3e");
  background-image: var(--bs-form-switch-bg);
}

.input-group-text {
  background: var(--fl-surface-muted);
  border-color: var(--fl-gray-200);
  color: var(--fl-gray-700);
  font-size: 0.8125rem;
}

.phone-prefix {
  min-width: 3.4rem;
  justify-content: center;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.admin-users-form__phone-group {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  width: 100%;
}

.customer-form__phone-group {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  width: 100%;
}

.admin-users-form__phone-group > .form-control {
  width: 100% !important;
  min-width: 0;
}

.customer-form__phone-group > .form-control {
  width: 100% !important;
  min-width: 0;
}

.customer-form__vehicle-kind-block {
  margin-bottom: 0.45rem;
}

.commercial-vehicle-fields {
  display: grid;
  gap: 0.9rem;
  padding: 0.95rem 1rem;
  border: 1px dashed rgba(var(--bs-primary-rgb), 0.22);
  border-radius: 1rem;
  background: linear-gradient(180deg, rgba(var(--bs-primary-rgb), 0.05), rgba(var(--bs-primary-rgb), 0.02));
}

.commercial-vehicle-fields__header {
  display: grid;
  gap: 0.22rem;
}

.commercial-vehicle-fields__title {
  margin: 0;
  color: var(--fl-gray-800);
  font-size: 0.95rem;
  font-weight: 700;
}

.commercial-vehicle-fields__hint {
  color: var(--fl-gray-500);
  font-size: 0.8rem;
  line-height: 1.45;
}

.reward-rates-form {
  gap: 0.85rem !important;
}

.reward-rate-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(132px, 168px);
  gap: 1rem;
  align-items: center;
  padding: 0.95rem 1rem;
  border: 1px solid var(--fl-gray-200);
  border-radius: 1rem;
  background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
}

.reward-rates-form--vehicle-types .reward-rate-row {
  grid-template-columns: minmax(0, 1fr) minmax(204px, 248px);
}

.reward-rate-copy {
  min-width: 0;
}

.reward-rate-title {
  display: block;
  margin: 0;
  color: var(--fl-gray-800);
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.3;
}

.reward-rate-meta {
  color: var(--fl-gray-500);
  font-size: 0.8rem;
  line-height: 1.45;
}

.reward-rate-field,
.reward-rate-input-group {
  width: 100%;
}

.reward-rate-field .form-control {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.reward-rate-toggle {
  justify-content: flex-end;
}

.reward-rate-toggle__label {
  font-size: 0.82rem;
  color: var(--fl-gray-600);
}

.fuel-type-radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.fuel-type-radio-group .btn {
  flex: 1 1 120px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  --bs-btn-color: var(--fl-gray-700);
  --bs-btn-border-color: var(--fl-gray-200);
  --bs-btn-hover-color: var(--fl-gray-800);
  --bs-btn-hover-bg: var(--fl-surface-muted);
  --bs-btn-hover-border-color: var(--fl-gray-200);
  --bs-btn-active-color: var(--bs-white);
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary);
  --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
}

.fuel-type-radio-group__icon {
  font-size: 1.05rem;
  line-height: 1;
}

.fuel-type-radio-group__icon .vehicle-type-custom-icon,
.vehicle-type-icon-picker__icon .vehicle-type-custom-icon,
.vehicle-type-admin-icon .vehicle-type-custom-icon {
  width: 1em;
  height: 1em;
  display: block;
}

.fuel-type-radio-group__text {
  line-height: 1.2;
}

.vehicle-type-icon-picker {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 0.5rem;
}

.vehicle-type-icon-picker__option {
  min-height: 5.5rem;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  text-align: center;
}

.vehicle-type-icon-picker__icon {
  font-size: 1.35rem;
  line-height: 1;
}

.vehicle-type-icon-picker__label {
  font-size: 0.78rem;
  font-weight: 500;
  line-height: 1.25;
}

.vehicle-type-admin-icon {
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.7rem;
  background: var(--fl-primary-soft);
  color: var(--bs-primary);
  flex-shrink: 0;
}

.vehicle-type-admin-icon .ti {
  font-size: 1.05rem;
}

.fuel-type-radio-group__icon .ti-car,
.fuel-type-radio-group__icon .ti-truck,
.fuel-type-radio-group__icon .ti-tractor,
.fuel-type-radio-group__icon .ti-bus,
.vehicle-type-icon-picker__icon .ti-car,
.vehicle-type-icon-picker__icon .ti-truck,
.vehicle-type-icon-picker__icon .ti-tractor,
.vehicle-type-icon-picker__icon .ti-bus,
.vehicle-type-admin-icon .ti-car,
.vehicle-type-admin-icon .ti-truck,
.vehicle-type-admin-icon .ti-tractor,
.vehicle-type-admin-icon .ti-bus {
  display: inline-block;
  transform: scale(1.34);
  transform-origin: center;
}

.vehicle-type-custom-icon {
  display: block;
  background-color: currentColor;
  -webkit-mask-image: var(--vehicle-type-icon-url);
  mask-image: var(--vehicle-type-icon-url);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.vehicle-type-custom-icon--pickup-truck {
  transform: scale(1.84);
  transform-origin: center;
  filter:
    drop-shadow(0.35px 0 0 currentColor)
    drop-shadow(-0.35px 0 0 currentColor)
    drop-shadow(0 0.35px 0 currentColor)
    drop-shadow(0 -0.35px 0 currentColor);
}

.vehicle-type-custom-icon--big-truck {
  transform: scale(1.54);
  transform-origin: center;
  filter:
    drop-shadow(0.35px 0 0 currentColor)
    drop-shadow(-0.35px 0 0 currentColor)
    drop-shadow(0 0.35px 0 currentColor)
    drop-shadow(0 -0.35px 0 currentColor);
}

.btn {
  --bs-btn-font-size: 0.875rem;
  --bs-btn-padding-y: 0.45rem;
  --bs-btn-padding-x: 0.85rem;
  --bs-btn-border-radius: 0.7rem;
}

.btn-sm {
  --bs-btn-font-size: 0.78rem;
  --bs-btn-padding-y: 0.3rem;
  --bs-btn-padding-x: 0.65rem;
  --bs-btn-border-radius: 0.6rem;
}

.badge {
  font-size: 0.72rem;
  border: 1px solid rgba(148, 163, 184, 0.22);
}

.badge.text-bg-light {
  border-color: rgba(148, 163, 184, 0.24);
}

.badge.text-bg-success {
  border-color: rgba(var(--bs-success-rgb), 0.34);
}

.badge.text-bg-secondary {
  border-color: rgba(var(--bs-secondary-rgb), 0.32);
}

html[data-theme="dark"] .badge {
  border-color: rgba(255, 255, 255, 0.14);
}

html[data-theme="dark"] .badge.text-bg-light {
  border-color: rgba(255, 255, 255, 0.14);
}

html[data-theme="dark"] .badge.text-bg-success {
  border-color: rgba(var(--bs-success-rgb), 0.4);
}

html[data-theme="dark"] .badge.text-bg-secondary {
  border-color: rgba(255, 255, 255, 0.2);
}

.btn-primary {
  --bs-btn-color: var(--fl-primary-contrast);
  --bs-btn-bg: var(--fl-primary);
  --bs-btn-border-color: var(--fl-primary);
  --bs-btn-hover-color: var(--fl-primary-contrast);
  --bs-btn-hover-bg: var(--fl-primary-strong);
  --bs-btn-hover-border-color: var(--fl-primary-strong);
  --bs-btn-active-color: var(--fl-primary-contrast);
  --bs-btn-active-bg: var(--fl-primary-strong);
  --bs-btn-active-border-color: var(--fl-primary-strong);
  --bs-btn-disabled-color: rgba(var(--fl-primary-contrast-rgb), 0.72);
  --bs-btn-disabled-bg: rgba(var(--bs-primary-rgb), 0.58);
  --bs-btn-disabled-border-color: rgba(var(--bs-primary-rgb), 0.58);
}

.btn-outline-primary {
  --bs-btn-color: var(--fl-primary);
  --bs-btn-border-color: rgba(var(--bs-primary-rgb), 0.58);
  --bs-btn-hover-color: var(--fl-primary-contrast);
  --bs-btn-hover-bg: var(--fl-primary);
  --bs-btn-hover-border-color: var(--fl-primary);
  --bs-btn-active-color: var(--fl-primary-contrast);
  --bs-btn-active-bg: var(--fl-primary);
  --bs-btn-active-border-color: var(--fl-primary);
}

.btn-light,
.text-bg-light {
  background: var(--fl-surface-muted) !important;
  color: var(--fl-gray-800) !important;
  border-color: var(--fl-gray-200) !important;
}

.btn-outline-secondary {
  --bs-btn-color: var(--fl-gray-700);
  --bs-btn-border-color: var(--fl-gray-200);
  --bs-btn-hover-color: var(--fl-gray-800);
  --bs-btn-hover-bg: var(--fl-surface-muted);
  --bs-btn-hover-border-color: var(--fl-gray-200);
}

.dropdown-menu {
  --bs-dropdown-bg: var(--fl-surface-elevated);
  --bs-dropdown-color: var(--fl-gray-800);
  --bs-dropdown-link-color: var(--fl-gray-800);
  --bs-dropdown-link-hover-color: var(--fl-primary-strong);
  --bs-dropdown-link-hover-bg: var(--fl-primary-soft);
  --bs-dropdown-link-active-color: var(--fl-primary-contrast);
  --bs-dropdown-link-active-bg: var(--fl-primary);
  --bs-dropdown-border-color: var(--fl-gray-200);
  --bs-dropdown-divider-bg: var(--fl-gray-200);
  --bs-dropdown-box-shadow: var(--fl-shadow);
  background: var(--fl-surface-elevated);
  border-color: var(--fl-gray-200);
  color: var(--fl-gray-800);
}

.dropdown-divider {
  border-top-color: var(--fl-gray-200);
}

.dropdown-item {
  color: var(--fl-gray-800);
}

.dropdown-item:hover,
.dropdown-item:focus {
  background: var(--fl-primary-soft);
  color: var(--fl-primary-strong);
}

.navbar.bg-white {
  background: var(--fl-surface) !important;
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] .dropdown-menu {
  color-scheme: dark;
}

.bg-primary {
  background-color: var(--fl-primary) !important;
}

.bg-primary-subtle {
  background-color: var(--fl-primary-soft) !important;
}

.text-primary {
  color: var(--fl-primary) !important;
}

.border-primary {
  border-color: rgba(var(--bs-primary-rgb), 0.35) !important;
}

.bg-info {
  background-color: var(--fl-info) !important;
}

.text-info {
  color: var(--fl-info) !important;
}

.border-info {
  border-color: rgba(var(--bs-info-rgb), 0.35) !important;
}

.table-light {
  --bs-table-bg: var(--fl-gray-100);
  --bs-table-color: var(--fl-gray-500);
}

.alert {
  border-radius: 0.9rem;
  padding: 0.7rem 0.9rem;
  font-size: 0.875rem;
  margin-top: 1rem !important;
}

.alert-success {
  background: rgba(var(--bs-success-rgb), 0.14);
  color: var(--fl-gray-800);
}

.alert-danger {
  background: rgba(var(--bs-danger-rgb), 0.16);
  color: var(--fl-gray-800);
}

.alert-warning {
  background: rgba(var(--bs-warning-rgb), 0.18);
  color: var(--fl-gray-800);
}

.content .container-fluid.has-flash > .alert:first-child {
  margin-top: 0 !important;
}

.text-muted {
  color: var(--fl-gray-500) !important;
}

.display-6 {
  font-size: 2.2rem;
}

.h3,
h3,
.card h1.h3 {
  font-size: 1.3rem;
}

.h4,
h4 {
  font-size: 1.1rem;
}

.list-group-item {
  padding: 0.75rem 0.9rem;
  background: transparent;
  color: var(--fl-gray-800);
  border-color: var(--fl-gray-200);
}

.dropdown-item {
  font-size: 0.85rem;
  padding: 0.45rem 0.7rem;
}

.modal-header,
.modal-body,
.modal-footer {
  padding-left: 1rem;
  padding-right: 1rem;
}

@media (max-width: 991.98px) {
  .app-shell-body .theme-switch-floating {
    display: none;
  }

  .customer-details-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-toolbar {
    align-items: stretch;
  }

  .dashboard-filter-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .dashboard-filter-chip {
    padding-inline: 0.75rem;
  }

  .dashboard-kpi-grid,
  .dashboard-chart-grid,
  .dashboard-leaderboard-grid,
  .dashboard-rewards-grid,
  .dashboard-export-summary__grid {
    grid-template-columns: 1fr;
  }

  .sidebar {
    width: min(74vw, 280px);
    left: min(-74vw, -280px);
    box-shadow: 0 1.5rem 3rem rgba(38, 38, 38, 0.18);
  }

  html.mobile-sidebar-rail-enabled .sidebar,
  .sidebar.mobile-rail {
    left: 0;
    width: var(--fl-shell-width-collapsed);
    box-shadow: 0 1rem 2.2rem rgba(38, 38, 38, 0.12);
    transition: none;
  }

  html.mobile-sidebar-rail-enabled .sidebar .nav-link,
  .sidebar.mobile-rail .nav-link {
    margin: 0;
    padding: 7px 10px;
    justify-content: center;
  }

  html.mobile-sidebar-rail-enabled .sidebar .nav-text,
  html.mobile-sidebar-rail-enabled .sidebar .logo-text,
  html.mobile-sidebar-rail-enabled .sidebar .nav-section-label,
  .sidebar.mobile-rail .nav-text,
  .sidebar.mobile-rail .logo-text,
  .sidebar.mobile-rail .nav-section-label {
    display: none;
  }

  html.mobile-sidebar-rail-enabled .sidebar .logo-area,
  .sidebar.mobile-rail .logo-area {
    justify-content: center;
    padding: 0 10px;
  }

  html.mobile-sidebar-rail-enabled .sidebar .brand-lockup,
  .sidebar.mobile-rail .brand-lockup {
    justify-content: center;
    width: 100%;
  }

  .sidebar.mobile-show {
    left: 0;
  }

  .topbar,
  .topbar.full,
  .content,
  .content.full {
    margin-left: 0 !important;
  }

  html.mobile-sidebar-rail-enabled .topbar,
  html.mobile-sidebar-rail-enabled .content,
  .topbar.mobile-rail,
  .content.mobile-rail {
    margin-left: var(--fl-shell-width-collapsed) !important;
    transition: none;
  }

  html.mobile-sidebar-rail-enabled .topbar #mobileBtn,
  .topbar.mobile-rail #mobileBtn {
    display: none !important;
  }

  .content .container-fluid,
  .public-main .container {
    padding-left: 0.9rem;
    padding-right: 0.9rem;
  }

  .py-10 {
    padding-top: 4.2rem !important;
    padding-bottom: 3rem !important;
  }

  .page-header,
  .summary-header {
    flex-direction: column;
    align-items: stretch !important;
  }

  .page-actions,
  .summary-actions {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.6rem;
    align-items: stretch;
  }

  .page-actions > *,
  .summary-actions > *,
  .summary-actions .button_to,
  .summary-actions .btn,
  .page-actions .btn {
    width: 100%;
  }

  .summary-actions .summary-metric {
    grid-column: 1 / -1;
    padding: 0.8rem 0.95rem;
    border: 1px solid var(--fl-gray-200);
    border-radius: 0.85rem;
    background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
  }

  .loyalty-result-hero__body {
    gap: 0.72rem;
    padding: 1.05rem 0.9rem 0.98rem;
  }

  .loyalty-result-points {
    justify-items: center;
  }

  .loyalty-result-points__status {
    font-size: 0.75rem;
    padding-inline: 0.72rem;
  }

  .loyalty-result-hero__value {
    font-size: clamp(3.8rem, 24vw, 5.8rem);
  }

  .loyalty-result-hero__name {
    font-size: 1.22rem;
  }

  .loyalty-result-hero__phone {
    font-size: 0.92rem;
  }

  .loyalty-result-hero__identity {
    gap: 0.28rem;
    width: calc(100% + 1.8rem);
    margin: 0 -0.9rem -0.98rem;
    padding: 0.74rem 0.9rem 0.82rem;
  }

  .vehicle-row {
    flex-direction: column;
    align-items: stretch !important;
  }

  .vehicle-action-group {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
  }

  .vehicle-action-group > *,
  .vehicle-action-group .button_to,
  .vehicle-action-group .btn {
    width: 100%;
  }

  .display-6 {
    font-size: 1.85rem;
  }

  .page-intro h1 {
    font-size: 1.3rem;
  }

  .card {
    border-radius: 0.82rem;
  }

  .topbar {
    padding-left: 0.85rem !important;
    padding-right: 0.85rem !important;
  }
}

@media (max-width: 767.98px) {
  .customer-details-hero__transaction-summary {
    width: 100%;
  }

  .customer-details-hero__meta {
    gap: 0.45rem;
  }

  .customer-details-hero__chip {
    justify-content: center;
  }

  .customer-details-hero__identity {
    grid-template-columns: 1fr;
    text-align: center;
    gap: 0.78rem;
  }

  .customer-details-hero__identity-heading {
    justify-content: center;
  }

  .customer-details-hero__menu {
    top: 0.85rem;
    right: 0.85rem;
  }

  .customer-details-hero__actions {
    justify-content: flex-end;
    justify-self: end;
  }

  .customer-details-hero__actions > *,
  .customer-details-hero__actions .button_to,
  .customer-details-hero__actions .btn {
    width: auto;
  }

  .customer-details-section .card-body {
    gap: 0.85rem;
  }

  .customer-details-section__header {
    flex-direction: column;
  }

  .customer-details-section__header--with-action {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }

  .customer-details-section__header-actions {
    width: auto;
    justify-content: flex-end;
  }

  .customer-details-section__header-actions .btn {
    width: auto;
  }

  .customer-details-list-item {
    padding: 0.68rem 0.74rem;
  }

  .customer-details-vehicle-row--registered {
    padding-right: 4.75rem;
  }

  .customer-details-history-item__amount {
    min-width: 0;
  }

  .customer-details-history-row {
    align-items: flex-start;
  }

  .customer-details-history-row__rewards {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
  }

  .customer-details-history-row__side {
    justify-items: start;
  }

  .customer-search-results__row {
    align-items: flex-start;
  }

  .customer-search-results__heading {
    align-items: flex-start;
  }

  .customer-search-results__name {
    font-size: 1.15rem;
  }

  .customer-search-results__details {
    justify-content: space-between;
  }

  .customer-search-results__side {
    top: 0.68rem;
    right: 0.72rem;
    width: auto;
    justify-content: center;
  }

  .customer-details-pill {
    width: 100%;
    justify-content: space-between;
  }

  .customer-details-ledger-pagination {
    flex-direction: column;
    align-items: stretch;
  }

  .customer-details-ledger-pagination__actions {
    justify-content: stretch;
  }

  .customer-details-ledger-pagination__actions .btn {
    flex: 1 1 0;
  }

  .admin-attendance-pagination__actions {
    width: 100%;
    margin-left: 0;
    justify-content: stretch;
  }

  .admin-attendance-pagination__button,
  .admin-attendance-pagination__status {
    flex: 1 1 0;
    min-width: 0;
  }

  .dashboard-root {
    gap: 0.95rem;
  }

  .dashboard-filter-form {
    grid-template-columns: 1fr;
    gap: 0.6rem;
    padding: 0.78rem;
    border-radius: 0.86rem;
  }

  .dashboard-filter-form__actions {
    display: flex;
    justify-content: flex-end;
  }

  .dashboard-meta-row {
    gap: 0.45rem;
  }

  .dashboard-filter-form__header-actions {
    width: 100%;
    justify-content: stretch;
  }

  .dashboard-filter-form__header-actions .btn {
    flex: 1 1 auto;
  }

  .dashboard-section {
    gap: 0.72rem;
  }

  .dashboard-section__header h2 {
    font-size: 0.95rem;
  }

  .dashboard-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
  }

  .dashboard-kpi-card .card-body {
    min-height: 118px;
    gap: 0.7rem;
  }

  .dashboard-kpi-card__icon {
    width: 2.45rem;
    height: 2.45rem;
    border-radius: 0.82rem;
    font-size: 1rem;
  }

  .dashboard-kpi-card__title {
    font-size: 0.72rem;
  }

  .dashboard-kpi-card__value {
    font-size: 1.2rem;
  }

  .dashboard-kpi-card__breakdown {
    grid-template-columns: 1fr;
  }

  .dashboard-kpi-card__change {
    font-size: 0.7rem;
  }

  .dashboard-chart-grid,
  .dashboard-leaderboard-grid,
  .dashboard-rewards-grid,
  .dashboard-export-summary__grid {
    gap: 0.72rem;
  }

  .dashboard-chart-card__header,
  .dashboard-insight-card__header {
    margin-bottom: 0.72rem;
  }

  .dashboard-chart-card__stage {
    min-height: 230px;
  }

  .dashboard-chart-card canvas {
    height: 230px !important;
  }

  .dashboard-leaderboard-row {
    padding: 0.72rem 0.78rem;
    gap: 0.72rem;
  }

  .dashboard-leaderboard-row__rank {
    width: 1.9rem;
    height: 1.9rem;
    font-size: 0.72rem;
  }

  .dashboard-leaderboard-row__name {
    font-size: 0.82rem;
  }

  .dashboard-leaderboard-row__value,
  .dashboard-leaderboard-row__change {
    font-size: 0.72rem;
  }

  .dashboard-leaderboard-row__trend {
    min-width: 164px;
    grid-template-columns: 108px minmax(48px, auto);
    gap: 0.4rem;
  }

  .dashboard-leaderboard-row canvas {
    width: 108px !important;
    height: 38px !important;
  }

  .dashboard-leaderboard-row__change {
    min-width: 3.4rem;
    padding-inline: 0.42rem;
  }

  .dashboard-redemption-rate {
    gap: 0.72rem;
  }

  .dashboard-redemption-rate__value {
    font-size: 1.8rem;
  }

  .dashboard-redemption-rate__meta {
    gap: 0.5rem;
  }

  .dashboard-redemption-rate__meta div {
    padding: 0.68rem 0.72rem;
    border-radius: 0.78rem;
  }

  .loyalty-activity-item__summary {
    padding: 0.75rem 0.82rem;
  }

  .loyalty-activity-item__date {
    font-size: 0.8rem;
  }

  .loyalty-activity-item__points {
    min-width: 4rem;
    font-size: 0.72rem;
  }

  .loyalty-activity-item__details {
    grid-template-columns: 1fr;
    gap: 0.28rem;
    padding: 0 0.82rem 0.78rem;
  }

  .loyalty-activity-item__details-header {
    top: 0.62rem;
    right: 0.82rem;
  }

  .loyalty-activity-item__detail {
    padding-top: 0.62rem;
  }

  .dashboard-export-summary {
    padding: 0.82rem;
    border-radius: 0.86rem;
  }

  .dashboard-export-summary__item,
  .dashboard-export-summary__item--wide {
    grid-column: auto;
  }

  body {
    font-size: 0.9rem;
  }

  .topbar-role-badge {
    display: none;
  }

  .topbar .ms-auto {
    min-width: 0;
  }

  .topbar {
    padding-left: 0.7rem !important;
    padding-right: 0.7rem !important;
  }

  .content .container-fluid,
  .public-main .container {
    padding-left: 0.78rem;
    padding-right: 0.78rem;
  }

  .dashboard-filter-form {
    grid-template-columns: 1fr;
    gap: 0.65rem;
    padding: 0.82rem;
  }

  .dashboard-filter-chips {
    gap: 0.4rem;
  }

  .dashboard-filter-chip {
    min-height: 2rem;
    padding: 0.42rem 0.72rem;
    font-size: 0.76rem;
  }

  .py-10 {
    padding-top: 3.95rem !important;
    padding-bottom: 2.35rem !important;
  }

  .brand-lockup {
    gap: 0.55rem;
  }

  .theme-switch-floating {
    right: 0.85rem;
    bottom: 0.85rem;
  }

  .theme-switch-shell {
    padding: 0.42rem 0.62rem;
  }

  .theme-switch-text {
    display: none;
  }

  .brand-mark {
    width: 2rem;
    height: 2rem;
    border-radius: 0.75rem;
  }

  .logo-text {
    font-size: 0.9rem;
  }

  .page-intro {
    margin-bottom: 0.85rem;
  }

  .page-intro h1 {
    font-size: 1.16rem;
  }

  .page-intro p,
  .small-muted,
  .form-text,
  .small {
    font-size: 0.76rem;
  }

  .h3,
  h3,
  .card h1.h3 {
    font-size: 1.12rem;
  }

  .h4,
  h4 {
    font-size: 1rem;
  }

  .card {
    border-radius: 0.78rem;
  }

  .card-body {
    padding: 0.8rem;
  }

  .admin-staff-card--member .card-body {
    padding: 0.95rem;
  }

  .admin-staff-member.admin-staff-member--card {
    padding: 0;
  }

  .template-form-card .card-body,
  .lookup-card .card-body {
    padding: 1.1rem !important;
  }

  .loyalty-lookup-shell {
    padding-bottom: 2rem;
  }

  .lookup-card-shell {
    width: 100%;
  }

  .loyalty-language-switcher {
    margin-bottom: 0.5rem;
  }

  .loyalty-language-form {
    width: auto;
    max-width: 100%;
    justify-content: flex-end;
    border-radius: 0.88rem;
  }

  .loyalty-language-form__select {
    min-width: 0;
    flex: 0 1 6.4rem;
  }

  .loyalty-language-switcher--lookup .loyalty-language-form {
    width: 100%;
    justify-content: space-between;
    padding-inline: 1rem;
  }

  .loyalty-language-switcher--lookup .loyalty-language-form__select {
    flex: 0 1 5.9rem;
  }

  .redemption-customer-shell .card-body {
    gap: 0.85rem;
  }

  .redemption-customer-card--placeholder {
    min-height: 11.5rem;
    padding: 1.05rem 0.95rem;
  }

  .redemption-customer-card__hero {
    padding: 1rem 0.9rem 0.78rem;
  }

  .redemption-customer-card__value {
    font-size: clamp(2.15rem, 12vw, 3.1rem);
  }

  .redemption-customer-card__note,
  .redemption-customer-card__status {
    font-size: 0.74rem;
  }

  .redemption-customer-card__identity {
    padding: 0.85rem 0.9rem 0.82rem;
  }

  .redemption-customer-card__identity-heading {
    align-items: flex-start;
  }

  .redemption-customer-card__name {
    font-size: 1.08rem;
  }

  .redemption-customer-card__phone {
    font-size: 0.85rem;
  }

  .redemption-customer-card__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
    padding: 0 0.9rem 0.9rem;
  }

  .redemption-customer-card__stat {
    padding: 0.72rem 0.76rem;
  }

  .redemption-customer-card__stat-label {
    font-size: 0.68rem;
  }

  .transaction-customer-card__stat-value {
    font-size: 0.88rem;
  }

  .transaction-customer-card__vehicles {
    gap: 0.62rem;
    padding: 0 0.9rem 0.9rem;
  }

  .transaction-customer-card__vehicles-header {
    display: block;
  }

  .transaction-customer-card__vehicle-row {
    padding: 0.68rem 0.74rem;
  }

  .transaction-customer-card__vehicles-empty {
    padding: 0.82rem 0.88rem;
    font-size: 0.8rem;
  }

  .install-app-panel {
    padding: 0.82rem;
    border-radius: 0.88rem;
  }

  .install-app-icon {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 0.78rem;
  }

  .install-app-icon .ti {
    font-size: 1.02rem;
  }

  .install-app-panel .btn {
    min-height: 2.45rem;
  }

  .alert {
    border-radius: 0.78rem;
    padding: 0.52rem 0.68rem;
    font-size: 0.8125rem;
    line-height: 1.35;
    margin-bottom: 0.6rem;
  }

  .content .container-fluid > .alert:first-child,
  .public-main .container > .alert:first-child {
    margin-top: 0.25rem;
  }

  .form-label {
    font-size: 0.77rem;
    margin-bottom: 0.28rem;
  }

  .form-control,
  .form-select {
    min-height: 2.25rem;
    padding: 0.4rem 0.68rem;
    font-size: 0.84rem;
  }

  .form-select {
    background-position: right 0.72rem center;
    padding-right: 2rem;
  }

  .input-group-text {
    padding: 0.35rem 0.62rem;
    font-size: 0.76rem;
  }

  .phone-prefix {
    min-width: 3rem;
  }

  .btn {
    --bs-btn-font-size: 0.82rem;
    --bs-btn-padding-y: 0.4rem;
    --bs-btn-padding-x: 0.72rem;
    --bs-btn-border-radius: 0.64rem;
  }

  .btn-sm {
    --bs-btn-font-size: 0.74rem;
    --bs-btn-padding-y: 0.26rem;
    --bs-btn-padding-x: 0.56rem;
    --bs-btn-border-radius: 0.55rem;
  }

  .badge {
    font-size: 0.67rem;
  }

  .table > :not(caption) > * > * {
    padding-top: 0.58rem;
    padding-bottom: 0.58rem;
    font-size: 0.82rem;
  }

  .table-responsive {
    overflow: visible;
  }

  .responsive-table thead {
    display: none;
  }

  .responsive-table,
  .responsive-table tbody,
  .responsive-table tr,
  .responsive-table td {
    display: block;
    width: 100%;
  }

  .responsive-table tbody tr {
    padding: 0.76rem 0.82rem;
    border: 1px solid var(--fl-gray-200);
    border-radius: 0.85rem;
    background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
    box-shadow: 0 0.55rem 1.2rem rgba(12, 16, 13, 0.06);
    margin-bottom: 0.55rem;
  }

  .responsive-table tbody tr:last-child {
    margin-bottom: 0;
  }

  .responsive-table td {
    border: 0;
    padding: 0.3rem 0;
    text-align: right !important;
    display: grid;
    grid-template-columns: minmax(82px, 34%) 1fr;
    gap: 0.58rem;
    align-items: start;
  }

  .responsive-table td::before {
    content: attr(data-label);
    display: inline-flex;
    align-items: center;
    margin-bottom: 0;
    color: var(--fl-gray-500);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-align: left;
  }

  .responsive-table td[data-label="Actions"],
  .responsive-table td[data-label="Action"] {
    grid-template-columns: 1fr;
    text-align: left !important;
    padding-top: 0.58rem;
    border-top: 1px dashed var(--fl-gray-200);
    margin-top: 0.28rem;
  }

  .responsive-table .table-action-group {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
  }

  .responsive-table .table-action-group > *,
  .responsive-table .table-action-group .button_to,
  .responsive-table .table-action-group .btn {
    width: 100%;
  }

  .admin-transactions-header,
  .admin-customers-header,
  .admin-users-header,
  .admin-staff-header,
  .admin-shifts-header,
  .admin-attendance-header {
    grid-template-columns: minmax(0, 1fr);
    align-items: start !important;
  }

  .admin-transactions-header {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .admin-users-header {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .admin-transactions-header .page-actions,
  .admin-customers-header .page-actions,
  .admin-users-header .page-actions,
  .admin-staff-header .page-actions,
  .admin-shifts-header .page-actions,
  .admin-attendance-header .page-actions {
    width: 100%;
    display: flex;
    grid-template-columns: none;
    justify-content: flex-end;
    justify-self: stretch;
  }

  .admin-transactions-header .page-actions {
    width: auto;
    justify-self: end;
  }

  .admin-users-header .page-actions {
    width: auto;
    justify-self: end;
  }

  .admin-transactions-header .page-actions > *,
  .admin-transactions-header .page-actions .btn,
  .admin-customers-header .page-actions > *,
  .admin-customers-header .page-actions .btn,
  .admin-users-header .page-actions > *,
  .admin-users-header .page-actions .btn,
  .admin-staff-header .page-actions > *,
  .admin-staff-header .page-actions .btn,
  .admin-shifts-header .page-actions > *,
  .admin-shifts-header .page-actions .btn,
  .admin-attendance-header .page-actions > *,
  .admin-attendance-header .page-actions .btn {
    width: auto;
  }

  .admin-shifts-create-action {
    width: 1.58rem;
    height: 1.58rem;
    min-width: 1.58rem;
    min-height: 1.58rem;
    flex-basis: 1.58rem;
  }

  .admin-customers-create-action,
  .admin-transactions-create-action,
  .admin-users-create-action,
  .admin-shift-templates-create-action {
    width: auto;
    height: 1.86rem;
    min-width: 1.86rem;
    min-height: 1.86rem;
    flex-basis: auto;
    padding: 0 0.72rem;
  }

  .admin-shift-templates-create-action {
    height: 1.82rem;
    min-width: 1.82rem;
    min-height: 1.82rem;
    padding: 0 0.72rem;
  }

  .admin-customer-item,
  .admin-user-item,
  .admin-staff-member,
  .admin-shift-item,
  .admin-attendance-item {
    align-items: flex-start;
    padding: 0.72rem 0.76rem;
  }

  .admin-customer-item__name,
  .admin-user-item__name,
  .admin-staff-member__name,
  .admin-shift-item__name,
  .admin-attendance-item__name {
    font-size: 0.92rem;
  }

  .admin-customer-item__details,
  .admin-user-item__details,
  .admin-shift-item__details,
  .admin-attendance-item__details {
    gap: 0.1rem;
  }

  .admin-customer-item__phone,
  .admin-customer-item__vehicles,
  .admin-user-item__phone,
  .admin-user-item__email,
  .admin-shift-item__details,
  .admin-attendance-item__details {
    font-size: 0.76rem;
  }

  .admin-shift-item__top {
    gap: 0.7rem;
  }

  .admin-attendance-planner__form,
  .admin-attendance-entry__grid {
    grid-template-columns: 1fr;
  }

  .admin-attendance-card__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }

  .admin-attendance-card__side {
    justify-items: end;
  }

  .admin-attendance-card__summary {
    text-align: right;
  }

  .transaction-plate-scanner__field-header {
    align-items: stretch;
  }

  .transaction-plate-scanner__toggle {
    width: 100%;
    justify-content: center;
  }

  .transaction-plate-scanner__preview-shell {
    aspect-ratio: 4 / 3;
  }

  .transaction-plate-scanner__result-header {
    flex-direction: column;
    align-items: start;
  }

  .transaction-plate-scanner__actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
    min-width: 0;
  }

  .transaction-plate-scanner__actions .btn {
    min-width: 0;
    padding: 0.38rem 0.5rem;
    font-size: 0.72rem;
    line-height: 1.15;
  }

  .transaction-plate-scanner__preview-shell {
    max-height: 11rem;
  }

  .admin-attendance-status-list {
    grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
    gap: 0.55rem;
  }

  .admin-attendance-status-card .card-body {
    min-width: 80px;
    min-height: 80px;
    padding: 0.65rem 0.7rem;
  }

  .admin-staff-list {
    grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 360px));
    justify-content: flex-start;
  }

  .admin-staff-summary {
    gap: 0.55rem;
  }

  .admin-staff-summary__item .card-body {
    padding: 0.8rem 0.7rem;
  }

  .admin-staff-summary__item .small-muted {
    font-size: 0.68rem;
  }

  .admin-staff-summary__item h2 {
    font-size: 1.5rem;
  }

  .admin-staff-member__top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    column-gap: 0.7rem;
    row-gap: 0.4rem;
  }

  .admin-staff-member__identity {
    width: auto;
    min-width: 0;
  }

  .admin-staff-member__subcopy {
    max-width: none;
  }

  .admin-staff-member__side {
    width: auto;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 0.35rem;
  }

  .admin-staff-member__actions {
    justify-content: flex-end;
  }

  .admin-staff-member__action {
    width: auto;
    min-width: 4.8rem;
    justify-content: center;
  }

  .admin-staff-member__details {
    grid-template-columns: 1fr;
    gap: 0;
    font-size: 0.8rem;
  }

  .admin-staff-member__detail-value {
    font-size: 0.82rem;
  }

  .admin-transactions-filter__form {
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 0.82rem;
  }

  .admin-transactions-filter__topline {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 0.82rem;
  }

  .admin-attendance-filter__topline {
    grid-template-columns: 1fr;
  }

  .admin-transactions-filter__range {
    min-width: 0;
    width: 100%;
  }

  .admin-transactions-filter__range-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
  }

  .admin-transactions-filter__sort,
  .admin-transactions-filter__date,
  .admin-transactions-filter__select {
    min-width: 0;
    width: 100%;
  }

  .admin-customers-filter__form {
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 0.82rem;
  }

  .admin-customers-filter__actions {
    justify-content: stretch;
  }

  .admin-customers-filter__actions > * {
    flex: 1 1 0;
  }

  .transaction-entry-launch-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .transaction-entry-launch-actions > * {
    width: 100%;
  }

  .transaction-entry-page-error > * {
    width: 100%;
  }

  .transaction-entry-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
  }

  .transaction-entry-stepper {
    display: flex;
    gap: 0.6rem;
    overflow-x: auto;
    padding-bottom: 0.12rem;
    margin-bottom: 0.8rem;
    scrollbar-width: none;
  }

  .transaction-entry-stepper::-webkit-scrollbar {
    display: none;
  }

  .transaction-entry-step {
    flex: 0 0 14rem;
    padding: 0.78rem 0.82rem;
  }

  .transaction-entry-titlebar__heading {
    gap: 0.42rem;
  }

  .transaction-entry-titlebar__hint-toggle {
    width: 1.7rem;
    height: 1.7rem;
    min-width: 1.7rem;
    min-height: 1.7rem;
    font-size: 0.92rem;
  }

  .transaction-entry-titlebar__hint-card {
    padding: 0.66rem 0.78rem;
    font-size: 0.76rem;
  }

  .transaction-entry-modal__content {
    border-radius: 0;
  }

  .transaction-entry-modal__dialog {
    width: 100%;
    max-width: none;
    margin: 0;
  }

  .transaction-entry-modal__header {
    padding-top: 0.75rem;
    padding-bottom: 0.1rem;
  }

  .transaction-entry-modal__body {
    padding-top: 0.4rem;
    padding-bottom: 0;
  }

  .transaction-entry-step-modal {
    gap: 0.65rem;
  }

  .transaction-entry-step-card .card-body {
    padding: 0.78rem 0.78rem 0;
  }

  .transaction-entry-tabs .nav-link {
    width: 100%;
    height: 100%;
    grid-template-columns: 1fr;
    align-content: start;
    text-align: left;
    padding: 0.82rem 0.88rem;
    gap: 0.5rem;
  }

  .transaction-entry-tabs__icon {
    width: 1.9rem;
    height: 1.9rem;
    border-radius: 0.68rem;
    font-size: 0.95rem;
  }

  .transaction-entry-tabs__header {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.62rem;
  }

  .transaction-entry-tabs__title {
    font-size: 0.84rem;
  }

  .transaction-entry-tabs__description {
    padding: 0.68rem 0.76rem;
  }

  .transaction-entry-tabs__description-text {
    font-size: 0.7rem;
    line-height: 1.3;
  }

  .transaction-entry-step__title {
    font-size: 0.84rem;
  }

  .transaction-entry-step__text,
  .transaction-entry-step-card__summary {
    font-size: 0.74rem;
  }

  .transaction-entry-step-card__header {
    flex-direction: column;
    align-items: start;
  }

  .transaction-entry-step-card__footer {
    position: sticky;
    bottom: 0;
    z-index: 2;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin: 0.55rem -0.78rem 0;
    padding: 0.55rem 0.78rem calc(0.78rem + env(safe-area-inset-bottom, 0px));
    border-top: 0;
    border-bottom-left-radius: 0.78rem;
    border-bottom-right-radius: 0.78rem;
    background: rgb(248, 250, 252);
    box-shadow: 0 -10px 24px rgba(15, 23, 42, 0.06);
  }

  .transaction-entry-step-card__actions {
    width: auto;
    justify-content: center;
  }

  .transaction-entry-step-card__actions > * {
    flex: 0 1 auto;
    min-width: min(10.5rem, 100%);
  }

  .transaction-entry-step-card__footer-note {
    text-align: center;
  }

  html[data-theme="dark"] .transaction-entry-step-card__footer {
    background: rgb(24, 21, 16);
    box-shadow: 0 -10px 24px rgba(0, 0, 0, 0.22);
  }

  .my-pump-nozzle-grid,
  .transaction-pump-card__nozzles {
    grid-template-columns: minmax(0, 1fr);
  }

  .transaction-pump-card__header {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }

  .admin-transaction-item {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: flex-start;
    padding: 0.72rem 0.76rem;
  }

  .admin-transaction-item__name {
    font-size: 0.92rem;
  }

  .admin-transaction-item__time {
    font-size: 0.74rem;
  }

  .admin-transaction-item__side {
    gap: 0.42rem;
    justify-self: end;
    align-self: start;
  }

  .admin-transaction-item__amount {
    min-width: 0;
    padding: 0.32rem 0.56rem;
    font-size: 0.76rem;
  }

  .admin-transaction-modal__hero {
    margin-bottom: 0.75rem;
    padding: 0.88rem 0.88rem 0.82rem;
  }

  .admin-transaction-modal__hero-top {
    flex-direction: column;
    align-items: stretch;
  }

  .admin-transaction-modal__amount {
    font-size: 1.6rem;
  }

  .admin-transaction-modal__fuel-chip {
    align-self: flex-start;
  }

  .admin-transaction-modal__details {
    grid-template-columns: 1fr;
    gap: 0.55rem;
  }

  .admin-transaction-modal__detail {
    padding: 0.72rem 0;
  }

  .reward-rate-row {
    grid-template-columns: minmax(0, 1fr) minmax(112px, 42%);
    gap: 0.68rem;
    padding: 0.74rem 0.78rem;
  }

  .reward-rates-form--vehicle-types .reward-rate-row {
    grid-template-columns: minmax(0, 1fr) minmax(156px, 54%);
  }

  .reward-rate-title {
    font-size: 0.86rem;
  }

  .reward-rate-meta {
    font-size: 0.73rem;
  }

  .responsive-table td[colspan] {
    grid-template-columns: 1fr;
    text-align: center !important;
    padding: 0.35rem 0;
  }

  .responsive-table td[colspan]::before {
    content: none;
  }

  .summary-metric {
    text-align: left !important;
  }

  .stack-mobile {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch !important;
    gap: 0.42rem !important;
  }

  .stack-mobile > * {
    width: 100%;
  }

  .list-group {
    display: grid;
    gap: 0.5rem;
  }

  .list-group-item {
    border: 1px solid var(--fl-gray-200);
    border-radius: 0.82rem !important;
    background: linear-gradient(180deg, var(--fl-surface-elevated), var(--fl-surface));
    box-shadow: 0 0.45rem 1rem rgba(12, 16, 13, 0.05);
    padding: 0.62rem 0.72rem;
  }

  .detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.4rem 0.5rem;
  }

  .detail-grid dt,
  .detail-grid dd {
    margin: 0;
    padding: 0.56rem 0.62rem;
    border: 1px solid var(--fl-gray-200);
    border-radius: 0.74rem;
    background: var(--fl-surface);
  }

  .detail-grid dt {
    font-size: 0.68rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--fl-gray-500) !important;
  }

  .detail-grid dd {
    font-weight: 600;
    font-size: 0.82rem;
  }

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

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

  .lookup-card,
  .auth-card,
  .template-form-card {
    max-width: 100%;
  }
}

@page {
  size: A4 portrait;
  margin: 12mm;
}

@media print {
  html,
  body {
    background: #fff !important;
  }

  body {
    font-size: 11px;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .topbar,
  .sidebar,
  .theme-switch-floating,
  #overlay,
  .modal,
  .modal-backdrop,
  .alert,
  .dashboard-filter-form,
  [data-dashboard-download] {
    display: none !important;
  }

  .content,
  .content.full,
  .topbar,
  .topbar.full {
    margin-left: 0 !important;
  }

  .content,
  .content.py-10,
  .py-10 {
    padding: 0 !important;
  }

  .content .container-fluid {
    padding: 0 !important;
  }

  .dashboard-root {
    gap: 0.8rem;
  }

  .dashboard-toolbar {
    display: block;
  }

  .dashboard-export-summary {
    display: grid !important;
    break-inside: avoid;
    page-break-inside: avoid;
    box-shadow: none;
  }

  .dashboard-meta-row {
    margin-top: -0.15rem;
  }

  .dashboard-section,
  .dashboard-kpi-card,
  .dashboard-chart-card,
  .dashboard-insight-card {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .dashboard-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-chart-grid,
  .dashboard-leaderboard-grid,
  .dashboard-rewards-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-chart-card,
  .dashboard-insight-card,
  .dashboard-kpi-card,
  .card {
    box-shadow: none !important;
    border: 1px solid rgba(52, 52, 52, 0.14) !important;
  }

  .dashboard-chart-card canvas {
    height: 240px !important;
  }

  .dashboard-leaderboard-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .admin-customers-header,
  .admin-users-header {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .admin-transactions-header .page-actions,
  .admin-customers-header .page-actions,
  .admin-users-header .page-actions,
  .admin-staff-header .page-actions,
  .admin-shifts-header .page-actions,
  .admin-attendance-header .page-actions {
    width: 100%;
    display: flex;
    grid-template-columns: none;
    justify-content: flex-end;
    justify-self: stretch;
  }

  .admin-transactions-header .page-actions > *,
  .admin-transactions-header .page-actions .btn,
  .admin-customers-header .page-actions > *,
  .admin-customers-header .page-actions .btn,
  .admin-users-header .page-actions > *,
  .admin-users-header .page-actions .btn,
  .admin-staff-header .page-actions > *,
  .admin-staff-header .page-actions .btn,
  .admin-shifts-header .page-actions > *,
  .admin-shifts-header .page-actions .btn,
  .admin-attendance-header .page-actions > *,
  .admin-attendance-header .page-actions .btn {
    width: auto;
  }

  .admin-users-header .page-actions {
    width: auto;
    justify-self: end;
  }

  .admin-shifts-create-action {
    width: 1.65rem;
    height: 1.65rem;
    min-width: 1.65rem;
    min-height: 1.65rem;
    flex-basis: 1.65rem;
  }

  .admin-customers-create-action,
  .admin-transactions-create-action,
  .admin-users-create-action,
  .admin-shift-templates-create-action {
    width: auto;
    height: 1.86rem;
    min-width: 1.86rem;
    min-height: 1.86rem;
    flex-basis: auto;
    padding: 0 0.72rem;
  }

  .admin-shift-templates-create-action {
    height: 1.82rem;
    min-width: 1.82rem;
    min-height: 1.82rem;
    padding: 0 0.72rem;
  }

  .admin-staff-header .page-intro h1,
  .admin-shifts-header .page-intro h1,
  .admin-attendance-header .page-intro h1 {
    font-size: 1.45rem;
  }

  .admin-shift-item {
    padding: 0.72rem 0.85rem;
  }

  .admin-shift-item__name {
    font-size: 1.02rem;
  }

  .admin-shift-item__details {
    gap: 0.72rem;
    margin-top: 0.28rem;
    font-size: 0.82rem;
  }

  .admin-shift-item__top {
    gap: 1rem;
  }
}
