/* E-TEL Design System 1.0.0 — generated from design-tokens.json.
   Do not independently edit generated token copies.
   Add .etel-app to the admin body; load after Bootstrap and relevant legacy CSS.
   This is an integration foundation, not an automatic full-platform migration.
   -rgb values are generated companions to hex colors, not independent tokens. */
:root {
  --etel-brand-red: #ED1C24;
  --etel-brand-red-rgb: 237, 28, 36;
  --etel-brand-cyan: #AFE8F2;
  --etel-brand-cyan-rgb: 175, 232, 242;
  --etel-action: #D71920;
  --etel-action-rgb: 215, 25, 32;
  --etel-action-hover: #CF121B;
  --etel-action-hover-rgb: 207, 18, 27;
  --etel-action-pressed: #B50F18;
  --etel-action-pressed-rgb: 181, 15, 24;
  --etel-on-action: #FFFFFF;
  --etel-on-action-rgb: 255, 255, 255;
  --etel-sidebar-ink: #E6EDF7;
  --etel-sidebar-ink-rgb: 230, 237, 247;
  --etel-sidebar-muted: #A4AFC0;
  --etel-sidebar-muted-rgb: 164, 175, 192;
  --etel-sidebar-hover: #1D2531;
  --etel-sidebar-hover-rgb: 29, 37, 49;
  --etel-sidebar-active: #30212B;
  --etel-sidebar-active-rgb: 48, 33, 43;
  --etel-sidebar-indicator: #FF646C;
  --etel-sidebar-indicator-rgb: 255, 100, 108;
  --etel-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --etel-font-bn: "Hind Siliguri", "Noto Sans Bengali", sans-serif;
  --etel-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --etel-font-micro: 0.6875rem;
  --etel-font-small: 0.75rem;
  --etel-font-ui: 0.8125rem;
  --etel-font-body: 0.875rem;
  --etel-font-section: 1.125rem;
  --etel-font-page: 1.25rem;
  --etel-font-workspace: 1.5rem;
  --etel-font-metric: 1.75rem;
  --etel-line-body: 1.5;
  --etel-line-heading: 1.25;
  --etel-space-0: 0;
  --etel-space-1: 4px;
  --etel-space-2: 8px;
  --etel-space-3: 12px;
  --etel-space-4: 16px;
  --etel-space-5: 20px;
  --etel-space-6: 24px;
  --etel-space-8: 32px;
  --etel-space-10: 40px;
  --etel-space-12: 48px;
  --etel-radius-control: 7px;
  --etel-radius-badge: 6px;
  --etel-radius-card: 12px;
  --etel-radius-overlay: 12px;
  --etel-radius-circle: 50%;
  --etel-sidebar-width: 210px;
  --etel-sidebar-collapsed: 64px;
  --etel-sidebar-mobile: 280px;
  --etel-topbar-height: 68px;
  --etel-topbar-mobile: 60px;
  --etel-control-height: 36px;
  --etel-control-compact: 32px;
  --etel-control-touch: 44px;
  --etel-table-row: 56px;
  --etel-table-row-compact: 44px;
  --etel-table-head: 40px;
  --etel-border-width: 1px;
  --etel-focus-width: 3px;
  --etel-focus-offset: 2px;
  --etel-duration-fast: 150ms;
  --etel-duration-normal: 200ms;
  --etel-ease: cubic-bezier(0.2, 0, 0, 1);
  --etel-z-topbar: 1020;
  --etel-z-desktop-sidebar: 1030;
  --etel-z-offcanvas-backdrop: 1040;
  --etel-z-offcanvas: 1045;
  --etel-z-modal-backdrop: 1050;
  --etel-z-modal: 1055;
  --etel-z-popover: 1070;
  --etel-z-tooltip: 1080;
  --etel-z-toast: 1090;
  --etel-chart-1: #D71920;
  --etel-chart-1-rgb: 215, 25, 32;
  --etel-chart-2: #17788B;
  --etel-chart-2-rgb: 23, 120, 139;
  --etel-chart-3: #147D52;
  --etel-chart-3-rgb: 20, 125, 82;
  --etel-chart-4: #2563EB;
  --etel-chart-4-rgb: 37, 99, 235;
  --etel-chart-5: #7C3AED;
  --etel-chart-5-rgb: 124, 58, 237;
  --etel-chart-6: #626F83;
  --etel-chart-6-rgb: 98, 111, 131;
}
:root, [data-bs-theme="light"] {
  color-scheme: light;
  --etel-canvas: #F0F3F8;
  --etel-canvas-rgb: 240, 243, 248;
  --etel-surface: #FFFFFF;
  --etel-surface-rgb: 255, 255, 255;
  --etel-surface-soft: #F8FAFC;
  --etel-surface-soft-rgb: 248, 250, 252;
  --etel-text: #222C3C;
  --etel-text-rgb: 34, 44, 60;
  --etel-muted: #626F83;
  --etel-muted-rgb: 98, 111, 131;
  --etel-border: #E7ECF3;
  --etel-border-rgb: 231, 236, 243;
  --etel-control-border: #808B9E;
  --etel-control-border-rgb: 128, 139, 158;
  --etel-sidebar: #101620;
  --etel-sidebar-rgb: 16, 22, 32;
  --etel-primary-ink: #B50F18;
  --etel-primary-ink-rgb: 181, 15, 24;
  --etel-accent-ink: #17788B;
  --etel-accent-ink-rgb: 23, 120, 139;
  --etel-accent-soft: #EAF8FB;
  --etel-accent-soft-rgb: 234, 248, 251;
  --etel-red-soft: #FFF0F1;
  --etel-red-soft-rgb: 255, 240, 241;
  --etel-focus: #17788B;
  --etel-focus-rgb: 23, 120, 139;
  --etel-link: #1D4ED8;
  --etel-link-rgb: 29, 78, 216;
  --etel-link-hover: #173FAF;
  --etel-link-hover-rgb: 23, 63, 175;
  --etel-selected: #EAF8FB;
  --etel-selected-rgb: 234, 248, 251;
  --etel-hover: #F8FAFC;
  --etel-hover-rgb: 248, 250, 252;
  --etel-disabled-bg: #EEF1F5;
  --etel-disabled-bg-rgb: 238, 241, 245;
  --etel-disabled-ink: #626F83;
  --etel-disabled-ink-rgb: 98, 111, 131;
  --etel-success-bg: #E8F6EF;
  --etel-success-bg-rgb: 232, 246, 239;
  --etel-success-ink: #11663E;
  --etel-success-ink-rgb: 17, 102, 62;
  --etel-warning-bg: #FFF4DB;
  --etel-warning-bg-rgb: 255, 244, 219;
  --etel-warning-ink: #855300;
  --etel-warning-ink-rgb: 133, 83, 0;
  --etel-danger-bg: #FFF0F1;
  --etel-danger-bg-rgb: 255, 240, 241;
  --etel-danger-ink: #B42318;
  --etel-danger-ink-rgb: 180, 35, 24;
  --etel-info-bg: #EAF1FF;
  --etel-info-bg-rgb: 234, 241, 255;
  --etel-info-ink: #2459B8;
  --etel-info-ink-rgb: 36, 89, 184;
  --etel-neutral-bg: #EEF1F5;
  --etel-neutral-bg-rgb: 238, 241, 245;
  --etel-neutral-ink: #566176;
  --etel-neutral-ink-rgb: 86, 97, 118;
  --etel-skeleton: #E7ECF3;
  --etel-skeleton-rgb: 231, 236, 243;
  --etel-overlay: rgba(11, 16, 24, 0.55);
  --etel-shadow-card: 0 4px 24px rgba(26, 43, 69, 0.045);
  --etel-shadow-overlay: 0 12px 36px rgba(26, 43, 69, 0.16);
}
[data-bs-theme="dark"] {
  color-scheme: dark;
  --etel-canvas: #10151E;
  --etel-canvas-rgb: 16, 21, 30;
  --etel-surface: #181F2B;
  --etel-surface-rgb: 24, 31, 43;
  --etel-surface-soft: #1D2634;
  --etel-surface-soft-rgb: 29, 38, 52;
  --etel-text: #ECF0F7;
  --etel-text-rgb: 236, 240, 247;
  --etel-muted: #9BA8BB;
  --etel-muted-rgb: 155, 168, 187;
  --etel-border: #2A3445;
  --etel-border-rgb: 42, 52, 69;
  --etel-control-border: #738399;
  --etel-control-border-rgb: 115, 131, 153;
  --etel-sidebar: #0B1018;
  --etel-sidebar-rgb: 11, 16, 24;
  --etel-primary-ink: #FF7D84;
  --etel-primary-ink-rgb: 255, 125, 132;
  --etel-accent-ink: #A6E4ED;
  --etel-accent-ink-rgb: 166, 228, 237;
  --etel-accent-soft: #193842;
  --etel-accent-soft-rgb: 25, 56, 66;
  --etel-red-soft: #3A212B;
  --etel-red-soft-rgb: 58, 33, 43;
  --etel-focus: #AFE8F2;
  --etel-focus-rgb: 175, 232, 242;
  --etel-link: #9DBDFF;
  --etel-link-rgb: 157, 189, 255;
  --etel-link-hover: #BCD2FF;
  --etel-link-hover-rgb: 188, 210, 255;
  --etel-selected: #193842;
  --etel-selected-rgb: 25, 56, 66;
  --etel-hover: #1D2634;
  --etel-hover-rgb: 29, 38, 52;
  --etel-disabled-bg: #253142;
  --etel-disabled-bg-rgb: 37, 49, 66;
  --etel-disabled-ink: #9BA8BB;
  --etel-disabled-ink-rgb: 155, 168, 187;
  --etel-success-bg: #173B2D;
  --etel-success-bg-rgb: 23, 59, 45;
  --etel-success-ink: #8CE0B2;
  --etel-success-ink-rgb: 140, 224, 178;
  --etel-warning-bg: #3D321B;
  --etel-warning-bg-rgb: 61, 50, 27;
  --etel-warning-ink: #F6CF7B;
  --etel-warning-ink-rgb: 246, 207, 123;
  --etel-danger-bg: #3A212B;
  --etel-danger-bg-rgb: 58, 33, 43;
  --etel-danger-ink: #FFADB1;
  --etel-danger-ink-rgb: 255, 173, 177;
  --etel-info-bg: #202E49;
  --etel-info-bg-rgb: 32, 46, 73;
  --etel-info-ink: #A9C7FF;
  --etel-info-ink-rgb: 169, 199, 255;
  --etel-neutral-bg: #253142;
  --etel-neutral-bg-rgb: 37, 49, 66;
  --etel-neutral-ink: #BECADF;
  --etel-neutral-ink-rgb: 190, 202, 223;
  --etel-skeleton: #2A3445;
  --etel-skeleton-rgb: 42, 52, 69;
  --etel-overlay: rgba(0, 0, 0, 0.65);
  --etel-shadow-card: 0 4px 24px rgba(0, 0, 0, 0.12);
  --etel-shadow-overlay: 0 12px 36px rgba(0, 0, 0, 0.36);
}

/* Semantic Bootstrap bridge: component variables matter as well as --bs-primary. */
.etel-app {
  --bs-primary: var(--etel-action); --bs-primary-rgb: var(--etel-action-rgb);
  --bs-primary-text-emphasis: var(--etel-primary-ink);
  --bs-primary-bg-subtle: var(--etel-red-soft);
  --bs-primary-border-subtle: var(--etel-control-border);
  --bs-body-bg: var(--etel-canvas); --bs-body-color: var(--etel-text);
  --bs-body-bg-rgb: var(--etel-canvas-rgb); --bs-body-color-rgb: var(--etel-text-rgb);
  --bs-emphasis-color-rgb: var(--etel-text-rgb); --bs-secondary-color-rgb: var(--etel-muted-rgb);
  --bs-tertiary-color-rgb: var(--etel-muted-rgb);
  --bs-secondary-bg-rgb: var(--etel-surface-soft-rgb); --bs-tertiary-bg-rgb: var(--etel-surface-soft-rgb);
  --bs-link-color-rgb: var(--etel-link-rgb); --bs-link-hover-color-rgb: var(--etel-link-hover-rgb);
  --bs-body-font-family: var(--etel-font-sans); --bs-body-font-size: var(--etel-font-body);
  --bs-body-line-height: var(--etel-line-body); --bs-heading-color: var(--etel-text);
  --bs-secondary-color: var(--etel-muted); --bs-tertiary-color: var(--etel-muted);
  --bs-secondary-bg: var(--etel-surface-soft); --bs-tertiary-bg: var(--etel-surface-soft);
  --bs-border-color: var(--etel-border); --bs-emphasis-color: var(--etel-text);
  --bs-link-color: var(--etel-link); --bs-link-hover-color: var(--etel-link-hover);
  --bs-border-radius: var(--etel-radius-control); --bs-border-radius-lg: var(--etel-radius-card);
  --bs-form-valid-color: var(--etel-success-ink); --bs-form-valid-border-color: var(--etel-success-ink);
  --bs-form-invalid-color: var(--etel-danger-ink); --bs-form-invalid-border-color: var(--etel-danger-ink);
  font-family: var(--etel-font-sans); font-size: var(--etel-font-body);
  line-height: var(--etel-line-body); color: var(--etel-text); background: var(--etel-canvas);
}
.etel-app :lang(bn) { font-family: var(--etel-font-bn); line-height: 1.6; letter-spacing: normal; }
.etel-app [data-density="compact"] { --etel-control-height: var(--etel-control-compact); --etel-table-row: var(--etel-table-row-compact); }
.etel-app :focus-visible { outline: var(--etel-focus-width) solid var(--etel-focus); outline-offset: var(--etel-focus-offset); }
.etel-app .btn {
  min-height: var(--etel-control-height); border-radius: var(--etel-radius-control);
  padding: var(--etel-space-2) var(--etel-space-3); font-size: var(--etel-font-ui); font-weight: 600;
  line-height: 1.25; display: inline-flex; align-items: center; justify-content: center; gap: var(--etel-space-2);
  transition: background-color var(--etel-duration-fast) var(--etel-ease), border-color var(--etel-duration-fast) var(--etel-ease), color var(--etel-duration-fast) var(--etel-ease);
}
.etel-app .btn-primary {
  --bs-btn-bg: var(--etel-action); --bs-btn-color: var(--etel-on-action); --bs-btn-border-color: var(--etel-action);
  --bs-btn-hover-bg: var(--etel-action-hover); --bs-btn-hover-color: var(--etel-on-action); --bs-btn-hover-border-color: var(--etel-action-hover);
  --bs-btn-active-bg: var(--etel-action-pressed); --bs-btn-active-color: var(--etel-on-action); --bs-btn-active-border-color: var(--etel-action-pressed);
  --bs-btn-disabled-bg: var(--etel-disabled-bg); --bs-btn-disabled-color: var(--etel-disabled-ink); --bs-btn-disabled-border-color: var(--etel-control-border); --bs-btn-disabled-opacity: 1;
  --bs-btn-focus-shadow-rgb: 23, 120, 139;
}
.etel-app .btn-outline-secondary, .etel-app .btn-secondary {
  --bs-btn-bg: var(--etel-surface); --bs-btn-color: var(--etel-text); --bs-btn-border-color: var(--etel-control-border);
  --bs-btn-hover-bg: var(--etel-surface-soft); --bs-btn-hover-color: var(--etel-text); --bs-btn-hover-border-color: var(--etel-accent-ink);
  --bs-btn-active-bg: var(--etel-accent-soft); --bs-btn-active-color: var(--etel-accent-ink); --bs-btn-active-border-color: var(--etel-accent-ink);
  --bs-btn-disabled-bg: var(--etel-disabled-bg); --bs-btn-disabled-color: var(--etel-disabled-ink); --bs-btn-disabled-border-color: var(--etel-control-border); --bs-btn-disabled-opacity: 1;
}
.etel-app .btn-outline-danger {
  --bs-btn-bg: var(--etel-surface); --bs-btn-color: var(--etel-danger-ink); --bs-btn-border-color: var(--etel-danger-ink);
  --bs-btn-hover-bg: var(--etel-danger-bg); --bs-btn-hover-color: var(--etel-danger-ink); --bs-btn-hover-border-color: var(--etel-danger-ink);
  --bs-btn-active-bg: var(--etel-danger-bg); --bs-btn-active-color: var(--etel-danger-ink); --bs-btn-active-border-color: var(--etel-danger-ink);
}
.etel-app .icon-button { width: var(--etel-control-height); min-width: var(--etel-control-height); padding: 0; }
.etel-app .form-control, .etel-app .form-select {
  min-height: var(--etel-control-height); background-color: var(--etel-surface); color: var(--etel-text);
  border-color: var(--etel-control-border); border-radius: var(--etel-radius-control); font-size: var(--etel-font-ui);
  padding: var(--etel-space-2) var(--etel-space-3);
}
.etel-app .form-select { padding-right: var(--etel-space-8); }
.etel-app .form-label { font-size: var(--etel-font-ui); font-weight: 600; margin-bottom: var(--etel-space-2); }
.etel-app .form-text, .etel-app .text-muted { color: var(--etel-muted) !important; }
.etel-app .form-text { font-size: var(--etel-font-small); }
.etel-app .text-primary { color: var(--etel-primary-ink) !important; }
.etel-app .form-control::placeholder { color: var(--etel-muted); opacity: 1; }
.etel-app .form-control:focus, .etel-app .form-select:focus { border-color: var(--etel-focus); box-shadow: none; outline: var(--etel-focus-width) solid var(--etel-focus); outline-offset: var(--etel-focus-offset); }
.etel-app .form-control:disabled, .etel-app .form-select:disabled { background: var(--etel-disabled-bg); color: var(--etel-disabled-ink); }
.etel-app .form-control.is-invalid, .etel-app .form-select.is-invalid { border-color: var(--etel-danger-ink); }
.etel-app .invalid-feedback { color: var(--etel-danger-ink); font-size: var(--etel-font-small); }
.etel-app .form-check-input { border-color: var(--etel-control-border); }
.etel-app .form-check-input:checked { background-color: var(--etel-action); border-color: var(--etel-action); }
.etel-app .card { --bs-card-bg: var(--etel-surface); --bs-card-color: var(--etel-text); --bs-card-border-color: var(--etel-border); --bs-card-border-radius: var(--etel-radius-card); box-shadow: var(--etel-shadow-card); }
.etel-app .card-body { padding: var(--etel-space-5); }
.etel-app .table {
  --bs-table-color: var(--etel-text); --bs-table-bg: var(--etel-surface); --bs-table-border-color: var(--etel-border);
  --bs-table-hover-bg: var(--etel-hover); --bs-table-hover-color: var(--etel-text);
  --bs-table-active-bg: var(--etel-selected); --bs-table-active-color: var(--etel-text);
  --bs-table-striped-bg: var(--etel-surface-soft); --bs-table-striped-color: var(--etel-text);
  font-size: var(--etel-font-ui); margin-bottom: 0;
}
.etel-app .table th, .etel-app .table td { padding: var(--etel-space-2) var(--etel-space-4); vertical-align: middle; }
.etel-app .table tbody tr { height: var(--etel-table-row); }
.etel-app [data-density="compact"] .table th, .etel-app [data-density="compact"] .table td { padding-top: var(--etel-space-1); padding-bottom: var(--etel-space-1); }
.etel-app .table thead { --bs-table-bg: var(--etel-surface-soft); }
.etel-app .table thead th { height: var(--etel-table-head); font-size: var(--etel-font-micro); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--etel-muted); white-space: nowrap; }
.etel-app .table .numeric { text-align: right; font-variant-numeric: tabular-nums; }
.etel-app .status { display: inline-flex; align-items: center; gap: var(--etel-space-1); padding: var(--etel-space-1) var(--etel-space-2); border-radius: var(--etel-radius-badge); font-size: var(--etel-font-small); font-weight: 600; line-height: 1.3; white-space: nowrap; }
.etel-app .status-success { color: var(--etel-success-ink); background: var(--etel-success-bg); }
.etel-app .status-warning { color: var(--etel-warning-ink); background: var(--etel-warning-bg); }
.etel-app .status-danger { color: var(--etel-danger-ink); background: var(--etel-danger-bg); }
.etel-app .status-info { color: var(--etel-info-ink); background: var(--etel-info-bg); }
.etel-app .status-neutral { color: var(--etel-neutral-ink); background: var(--etel-neutral-bg); }
.etel-app .status-accent { color: var(--etel-accent-ink); background: var(--etel-accent-soft); }
.etel-app .pagination { --bs-pagination-color: var(--etel-muted); --bs-pagination-bg: var(--etel-surface); --bs-pagination-border-color: var(--etel-control-border); --bs-pagination-hover-color: var(--etel-text); --bs-pagination-hover-bg: var(--etel-hover); --bs-pagination-hover-border-color: var(--etel-control-border); --bs-pagination-focus-bg: var(--etel-hover); --bs-pagination-active-color: var(--etel-on-action); --bs-pagination-active-bg: var(--etel-action); --bs-pagination-active-border-color: var(--etel-action); --bs-pagination-disabled-color: var(--etel-disabled-ink); --bs-pagination-disabled-bg: var(--etel-disabled-bg); --bs-pagination-disabled-border-color: var(--etel-control-border); }
.etel-app .page-link { min-width: var(--etel-control-height); min-height: var(--etel-control-height); display: grid; place-items: center; font-size: var(--etel-font-ui); }
.etel-app .modal-content { background: var(--etel-surface); color: var(--etel-text); border-color: var(--etel-border); border-radius: var(--etel-radius-overlay); box-shadow: var(--etel-shadow-overlay); }
.etel-app .offcanvas { --bs-offcanvas-bg: var(--etel-surface); --bs-offcanvas-color: var(--etel-text); --bs-offcanvas-border-color: var(--etel-border); }
.etel-app .dropdown-menu { --bs-dropdown-bg: var(--etel-surface); --bs-dropdown-color: var(--etel-text); --bs-dropdown-border-color: var(--etel-border); --bs-dropdown-link-color: var(--etel-text); --bs-dropdown-link-hover-color: var(--etel-text); --bs-dropdown-link-hover-bg: var(--etel-hover); --bs-dropdown-link-active-color: var(--etel-accent-ink); --bs-dropdown-link-active-bg: var(--etel-accent-soft); }
@media (max-width: 767.98px), (pointer: coarse) {
  .etel-app, .etel-app [data-density] { --etel-control-height: var(--etel-control-touch); --etel-table-row: 56px; }
  .etel-app .form-control, .etel-app .form-select { font-size: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .etel-app *, .etel-app *::before, .etel-app *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}