:root {
  --tb-ink: #172033;
  --tb-muted: #647087;
  --tb-brand: #5b5bd6;
  --tb-brand-dark: #4141aa;
  --tb-brand-soft: rgba(91, 91, 214, .09);
  --tb-mint: #22a67a;
  --tb-mint-soft: rgba(34, 166, 122, .1);
  --tb-danger: #cf4b5c;
  --tb-warning: #bd7a1d;
  --tb-line: rgba(91, 91, 214, .14);
  --tb-surface: rgba(255, 255, 255, .9);
  --tb-surface-solid: #fff;
  --tb-shadow-sm: 0 10px 30px rgba(39, 39, 92, .08);
  --tb-shadow: 0 24px 70px rgba(39, 39, 92, .13);
  --tb-radius-sm: 14px;
  --tb-radius: 22px;
  --tb-radius-lg: 30px;
}

/* Icon-only row action button (e.g. "view" on admin dashboard list rows).
   Several older stylesheets set conflicting height/padding on .btn — this
   forces a clean, uniform circle regardless of what else is loaded. */
.icon-action-btn {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  width: 34px !important; height: 34px !important; padding: 0 !important;
  border: 1px solid var(--tb-line) !important; border-radius: 50% !important;
  background: var(--tb-surface-solid, #fff) !important; color: var(--tb-brand) !important;
  font-size: .95rem; line-height: 1 !important; flex: 0 0 auto;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.icon-action-btn:hover, .icon-action-btn:focus-visible {
  background: var(--tb-brand) !important; color: #fff !important; border-color: var(--tb-brand) !important;
}

html { background: #f5f6ff; }

body.app-canvas {
  color: var(--tb-ink);
  background:
    radial-gradient(circle at 8% 6%, rgba(91, 91, 214, .14), transparent 25rem),
    radial-gradient(circle at 92% 72%, rgba(34, 166, 122, .1), transparent 28rem),
    linear-gradient(145deg, #f8f8ff 0%, #f8fbfa 54%, #eff1ff 100%);
  background-attachment: fixed;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.app-canvas::before,
.app-canvas::after {
  content: "";
  position: fixed;
  z-index: -1;
  border-radius: 999px;
  pointer-events: none;
}
.app-canvas::before { width: 15rem; height: 15rem; right: -5rem; top: 8rem; border: 2.5rem solid rgba(91, 91, 214, .05); }
.app-canvas::after { width: 9rem; height: 9rem; left: -3rem; bottom: 8rem; border: 1.4rem solid rgba(34, 166, 122, .06); }

.navbar-enhanced {
  border-bottom: 1px solid rgba(255,255,255,.85) !important;
  background: rgba(255,255,255,.82) !important;
  box-shadow: 0 10px 35px rgba(39,39,92,.07) !important;
  backdrop-filter: blur(20px);
  gap: 1rem;
}
/* At in-between widths (past the mobile breakpoint, but too narrow for the
   full desktop nav - the admin nav in particular has a lot of items) the nav
   has nowhere to shrink to and was overflowing left into the brand text with
   zero gap between them. Keep the brand at its natural size and guarantee a
   minimum gap so the nav can only ever overflow off to the right, never
   overlap the logo/tagline. */
.navbar-enhanced .navbar-brand { flex-shrink: 0; }
.brand-circle { background: linear-gradient(145deg, var(--tb-brand), #7777e8) !important; box-shadow: 0 8px 22px rgba(91,91,214,.25); }
.brand-name { color: var(--tb-ink) !important; letter-spacing: -.025em; }
.brand-tagline { color: var(--tb-muted) !important; }
.brand-mark { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(145deg, var(--tb-brand), #7777e8); box-shadow: 0 8px 22px rgba(39,39,92,.25); font-size: .82rem; font-weight: 800; letter-spacing: .08em; }
.company-review-art { position: relative; overflow: hidden; background: linear-gradient(145deg,#4b4bc2,#6969df 52%,#4646a9); }
.company-review-art::after { content: ""; position: absolute; width: 12rem; height: 12rem; right: -5rem; bottom: -4rem; border: 1.8rem solid rgba(255,255,255,.08); border-radius: 50%; }
.company-review-eyebrow { letter-spacing: .12em; }

/* Keep KYB approval and rejection actions aligned even when their fields differ in height. */
.kyb-review-grid > [class*="col-"] { display: flex; }
.kyb-review-form { display: flex; flex: 1 1 auto; flex-direction: column; width: 100%; }
.kyb-review-form .form-control { width: 100%; }
.kyb-review-actions { margin-top: auto; padding-top: 1rem; }
.kyb-review-actions .btn { min-height: 3.25rem; }
@media (max-width: 991.98px) {
  .kyb-review-grid > [class*="col-"] { display: block; }
  .kyb-review-actions { margin-top: 0; }
}

/* Admin company details: clear label/value hierarchy without heavy inline bolding. */
.company-detail-label { margin: 0 0 .35rem; color: #667085; font-size: .9rem; font-weight: 600; letter-spacing: .01em; }
.company-detail-value { margin: 0 0 1.1rem; padding-left: .9rem; color: #25324b; font-size: 1.08rem; font-weight: 500; line-height: 1.45; overflow-wrap: anywhere; }
.company-detail-badge { padding-left: .9rem; }
.company-description-text { color: #4b5870; font-size: 1rem; font-weight: 400; }

/* Audit event metadata: only nested hash/array values fall back to raw JSON. */
.audit-metadata-raw { margin: 0; padding: .75rem .9rem; border-radius: 10px; background: #f7f7fc; color: #4b5870; font-size: .85rem; white-space: pre-wrap; word-break: break-word; }

.invoice-stat-card { min-width: 0; }
.invoice-stat-card .card-body { display: flex; flex-direction: column; justify-content: center; min-height: 10.5rem; padding: 1.5rem 1.35rem; }
.invoice-stat-label { margin: 0 0 .55rem; color: #667085; font-size: 1rem; font-weight: 600; line-height: 1.35; }
.invoice-stat-value { margin: 0; color: #25324b; font-size: 1.5rem; font-weight: 700; line-height: 1.25; overflow-wrap: anywhere; }
.notification-stat-card { height: 100%; min-width: 0; }
.notification-stat-card .card-body { min-height: 10rem; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1.25rem .75rem; }
.notification-stat-card h2 { font-size: clamp(1.65rem, 2.2vw, 2.25rem); line-height: 1.15; overflow-wrap: anywhere; }
.notification-stat-card p { max-width: 100%; white-space: normal !important; text-align: center; line-height: 1.3; }

.app-main { width: 100%; padding-top: clamp(1.5rem, 3vw, 3rem) !important; padding-bottom: clamp(3rem, 7vw, 6rem) !important; }
.app-main > .container { position: relative; }
.app-main h1:not(.text-white), .app-main h2:not(.text-white), .app-main h3:not(.text-white), .app-main h4:not(.text-white), .app-main h5:not(.text-white), .app-main h6:not(.text-white) { color: var(--tb-ink); letter-spacing: -.025em; }
.app-main h1 { letter-spacing: -.045em; }
.app-main p:not(.text-white):not(.text-light), .app-main .text-muted, .app-main .text-secondary { color: var(--tb-muted) !important; }
.app-main a:not(.btn):not(.nav-link):not(.dropdown-item) { color: var(--tb-brand-dark); }
.app-main .bg-primary p, .app-main .bg-primary h1, .app-main .bg-primary h2, .app-main .bg-primary h3,
.app-main .bg-success p, .app-main .bg-success h1, .app-main .bg-success h2, .app-main .bg-success h3,
.app-main .bg-danger p, .app-main .bg-danger h1, .app-main .bg-danger h2, .app-main .bg-danger h3,
.app-main [class*="gradient"] .text-white { color: #fff !important; }

.card,
.dashboard-card,
.stat-card,
.content-card,
.filter-card,
.form-section,
.auth-card,
.notification-item,
.list-group,
.modal-content {
  border: 1px solid rgba(255,255,255,.92) !important;
  border-radius: var(--tb-radius) !important;
  background: var(--tb-surface) !important;
  box-shadow: var(--tb-shadow-sm) !important;
  backdrop-filter: blur(16px);
}
.card-header, .card-footer { border-color: var(--tb-line) !important; background: rgba(247,247,255,.62) !important; }
.card-header:first-child { border-radius: calc(var(--tb-radius) - 1px) calc(var(--tb-radius) - 1px) 0 0 !important; }
.card:hover, .dashboard-card:hover, .stat-card:hover { box-shadow: var(--tb-shadow) !important; }

.table-responsive { border: 1px solid var(--tb-line); border-radius: var(--tb-radius); background: var(--tb-surface); box-shadow: var(--tb-shadow-sm); overflow-x: auto; overflow-y: hidden; }
.email-log-table-wrap { width: 100%; border: 0; border-radius: 0 0 var(--tb-radius) var(--tb-radius); box-shadow: none; }
.email-log-table { min-width: 1240px; table-layout: fixed; }
.email-log-table th, .email-log-table td { vertical-align: middle; padding: 1rem .75rem; }
.email-log-table th:nth-child(1), .email-log-table td:nth-child(1) { width: 6%; }
.email-log-table th:nth-child(2), .email-log-table td:nth-child(2) { width: 20%; overflow-wrap: anywhere; }
.email-log-table th:nth-child(3), .email-log-table td:nth-child(3) { width: 22%; }
.email-log-table th:nth-child(4), .email-log-table td:nth-child(4) { width: 16%; overflow-wrap: anywhere; }
.email-log-table th:nth-child(5), .email-log-table td:nth-child(5) { width: 9%; }
.email-log-table th:nth-child(6), .email-log-table td:nth-child(6) { width: 14%; }
.email-log-table th:nth-child(7), .email-log-table td:nth-child(7) { width: 5%; text-align: center; }
.email-log-table th:nth-child(8), .email-log-table td:nth-child(8) { width: 8%; text-align: center; }
.email-log-type { display: inline-block; max-width: 100%; white-space: normal; overflow-wrap: anywhere; line-height: 1.25; text-align: left; }
.table { --bs-table-bg: transparent; --bs-table-striped-bg: rgba(91,91,214,.025); margin-bottom: 0; color: var(--tb-ink); }
.table thead th { padding-top: 1rem; padding-bottom: 1rem; border-bottom-color: var(--tb-line); color: var(--tb-muted); background: rgba(91,91,214,.045); font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; }
.table td { padding-top: .9rem; padding-bottom: .9rem; border-color: rgba(91,91,214,.08); vertical-align: middle; }
.table tbody tr { transition: background .18s ease; }
.table tbody tr:hover { background: rgba(91,91,214,.035); }

.form-control, .form-select, .input-group-text, input[type="date"], input[type="file"] {
  min-height: 48px;
  border-color: rgba(91,91,214,.18) !important;
  border-radius: var(--tb-radius-sm) !important;
  color: var(--tb-ink) !important;
  background-color: rgba(255,255,255,.9) !important;
}
.input-group > :not(:first-child) { border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; }
.input-group > :not(:last-child) { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; }
.form-control:focus, .form-select:focus { border-color: rgba(91,91,214,.6) !important; box-shadow: 0 0 0 .25rem rgba(91,91,214,.1) !important; }
.form-label, label { color: #33405a; font-weight: 650; }
.form-text { color: var(--tb-muted); }
.form-check-input:checked { border-color: var(--tb-brand); background-color: var(--tb-brand); }
.consent-check { align-items: flex-start; }
.consent-check .form-check-input { flex: 0 0 auto; margin-top: .2rem; }
.consent-check .form-check-label { display: block; flex: 1 1 auto; line-height: 1.55; }

.btn { min-height: 44px; border-radius: var(--tb-radius-sm) !important; font-weight: 700; letter-spacing: -.01em; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { border-color: transparent !important; background: linear-gradient(135deg, var(--tb-brand), #6d6dde) !important; box-shadow: 0 9px 22px rgba(91,91,214,.22); }
.btn-success { border-color: transparent !important; background: linear-gradient(135deg, var(--tb-mint), #3ab88e) !important; box-shadow: 0 9px 22px rgba(34,166,122,.18); }
.btn-outline-primary { border-color: rgba(91,91,214,.3) !important; color: var(--tb-brand-dark) !important; background: rgba(255,255,255,.76) !important; }
.btn-outline-danger { background: rgba(255,255,255,.76) !important; }
.btn-link { color: var(--tb-brand-dark); }

/* Solid colour surfaces own their foreground colour. Keep late global link and
   heading rules from turning selected controls and headers dark-on-dark. */
.app-main .tb-segmented-control__item.is-active,
.app-main .tb-segmented-control__item.active,
.navbar-enhanced .nav-link-enhanced.active,
.mobile-menu .nav-link-enhanced.active,
.btn-primary,
.btn-success,
.btn-danger,
.btn-dark,
.active > .page-link,
.badge-primary,
.badge.bg-primary:not(.bg-opacity-10),
.badge.bg-success:not(.bg-opacity-10),
.badge.bg-danger:not(.bg-opacity-10),
.badge.bg-secondary:not(.bg-opacity-10),
.badge.bg-dark:not(.bg-opacity-10),
.card-header.bg-primary,
.card-header.bg-success,
.card-header.bg-danger,
.card-header.bg-gradient-primary,
.card-header.bg-gradient-success {
  color: #fff !important;
}

/* Icons and nested labels must follow the foreground of their solid parent.
   This prevents utility classes or inline icon defaults from reintroducing
   dark text inside active navigation, buttons, and status badges. */
.app-main .tb-segmented-control__item.is-active *,
.app-main .tb-segmented-control__item.active *,
.navbar-enhanced .nav-link-enhanced.active *,
.mobile-menu .nav-link-enhanced.active *,
.btn-primary *,
.btn-success *,
.btn-danger *,
.btn-dark *,
.badge-primary *,
.badge.bg-primary:not(.bg-opacity-10) *,
.badge.bg-success:not(.bg-opacity-10) *,
.badge.bg-danger:not(.bg-opacity-10) *,
.badge.bg-secondary:not(.bg-opacity-10) *,
.badge.bg-dark:not(.bg-opacity-10) * {
  color: inherit !important;
}

.card-header.bg-primary,
.card-header.bg-gradient-primary {
  background: linear-gradient(135deg, var(--tb-brand), #6d6dde) !important;
}

.card-header.bg-success,
.card-header.bg-gradient-success {
  background: linear-gradient(135deg, var(--tb-mint), #15936d) !important;
}

.card-header.bg-danger {
  background: linear-gradient(135deg, var(--tb-danger), #b83449) !important;
}

.card-header.bg-primary *,
.card-header.bg-success *,
.card-header.bg-danger *,
.card-header.bg-gradient-primary *,
.card-header.bg-gradient-success * {
  color: inherit !important;
}

.badge, .status-badge, .status-pill, .skill-tag { border-radius: 999px !important; padding: .48em .78em; font-weight: 700; letter-spacing: .01em; }

/* Circular UI must remain circular inside constrained flex rows. Equal width
   and height alone is not enough: flexbox may shrink only the inline axis and
   turn step numbers, avatars, and profile icons into ovals. */
.tb-circle,
.d-flex.rounded-circle,
.d-inline-flex.rounded-circle,
.avatar.rounded-circle,
.user-avatar,
.profile-avatar,
.professional-avatar,
.activity-avatar,
.step-number {
  flex: 0 0 auto !important;
  aspect-ratio: 1 / 1;
}

.nav-tabs, .custom-tabs { gap: .35rem; padding: .35rem; border: 1px solid var(--tb-line) !important; border-radius: 16px; background: rgba(255,255,255,.68); }
.nav-tabs .nav-link { border: 0 !important; border-radius: 12px !important; color: var(--tb-muted); font-weight: 700; }
.nav-tabs .nav-link.active { color: var(--tb-brand-dark) !important; background: #fff !important; box-shadow: 0 5px 16px rgba(39,39,92,.09); }

.app-flash-region { position: relative; z-index: 1020; padding-bottom: 0 !important; }
.app-flash { display: flex; align-items: center; gap: .75rem; min-height: 58px; margin: 0; padding: .85rem 3.25rem .85rem 1rem; border: 1px solid var(--tb-line) !important; border-radius: 17px !important; color: var(--tb-ink) !important; background: rgba(255,255,255,.94) !important; box-shadow: var(--tb-shadow-sm); backdrop-filter: blur(18px); }
.app-flash-mark { flex: 0 0 auto; width: 10px; height: 10px; border-radius: 50%; background: var(--tb-brand); box-shadow: 0 0 0 6px var(--tb-brand-soft); }
.app-flash.alert-success .app-flash-mark { background: var(--tb-mint); box-shadow: 0 0 0 6px var(--tb-mint-soft); }
.app-flash.alert-danger .app-flash-mark { background: var(--tb-danger); box-shadow: 0 0 0 6px rgba(207,75,92,.1); }
.app-flash-message { line-height: 1.45; }
.app-flash .btn-close { top: 50%; transform: translateY(-50%); }

.alert:not(.app-flash) { border: 1px solid var(--tb-line) !important; border-radius: 17px !important; box-shadow: 0 8px 24px rgba(39,39,92,.06); }
.alert-success { color: #176f55 !important; background: #effaf6 !important; }
.alert-danger { color: #963645 !important; background: #fff3f5 !important; }
.alert-warning { color: #815617 !important; background: #fff9ed !important; }
.alert-info { color: var(--tb-brand-dark) !important; background: #f2f2ff !important; }

.pagination { gap: .35rem; }
.page-link { border-color: var(--tb-line); border-radius: 11px !important; color: var(--tb-brand-dark); background: rgba(255,255,255,.82); }
.active > .page-link { border-color: transparent; background: var(--tb-brand); }
.dropdown-menu { padding: .55rem; border: 1px solid var(--tb-line); border-radius: 16px; box-shadow: var(--tb-shadow); }
.user-dropdown-menu { min-width: 290px; margin-top: .7rem !important; padding: .7rem; border-radius: 20px; background: rgba(255,255,255,.97); box-shadow: 0 18px 50px rgba(39,52,92,.16); }
.user-dropdown-menu .dropdown-header { padding: .8rem .75rem; color: var(--tb-ink); }
.user-dropdown-menu .dropdown-item { display: flex; align-items: center; gap: .35rem; padding: .8rem .75rem; color: var(--tb-ink); font-weight: 650; }
.user-dropdown-menu .dropdown-item:hover { background: var(--tb-brand-soft); color: var(--tb-brand-dark); }
.dropdown-item { border-radius: 10px; }
.dropdown-item:hover, .dropdown-item:focus { background: var(--tb-brand-soft); color: var(--tb-brand-dark); }

.app-footer { margin-top: auto; border-color: rgba(91,91,214,.12) !important; background: rgba(255,255,255,.52); backdrop-filter: blur(14px); }

.legal-hero { position: relative; overflow: hidden; padding: clamp(2rem, 5vw, 4rem); border: 1px solid rgba(91,91,214,.14); border-radius: 28px; background: radial-gradient(circle at 90% 10%, rgba(112,103,255,.2), transparent 34%), linear-gradient(145deg,#fff 0%,#f3f4ff 100%); box-shadow: 0 20px 60px rgba(45,52,89,.1); }
.legal-hero h1 { max-width: 850px; margin: .8rem 0; color: #172033; font-size: clamp(2.3rem,6vw,4.5rem); font-weight: 800; letter-spacing: -.05em; }
.legal-hero p { max-width: 780px; margin-bottom: .75rem; color: #5e6b85; font-size: clamp(1rem,2vw,1.25rem); }
.legal-kicker,.legal-back-link { display: inline-flex; align-items: center; gap: .5rem; color: #4b46d8; font-weight: 700; text-decoration: none; }
.legal-meta { color: #718096; font-size: .875rem; }
.legal-card { display: flex; align-items: center; gap: 1rem; padding: 1.4rem; border: 1px solid rgba(91,91,214,.14); border-radius: 20px; background: #fff; color: #172033; box-shadow: 0 12px 36px rgba(45,52,89,.08); transition: transform .2s ease,box-shadow .2s ease; }
.legal-card:hover { transform: translateY(-3px); box-shadow: 0 18px 44px rgba(45,52,89,.13); }
.legal-card-icon { display: grid; flex: 0 0 48px; width: 48px; height: 48px; place-items: center; border-radius: 15px; background: #eeefff; color: #514bea; font-size: 1.25rem; }
.legal-card strong,.legal-card small { display: block; }.legal-card small { margin-top: .25rem; color: #68758d; }
.legal-document { border-radius: 24px !important; }.legal-document h2 { margin: 2rem 0 .7rem; color: #202b43; font-size: 1.25rem; font-weight: 800; }.legal-document h2:first-child { margin-top: 0; }.legal-document p,.legal-document li { color: #4d5b73; line-height: 1.75; }
.legal-review-note { display: flex; gap: .8rem; padding: 1rem 1.2rem; border: 1px solid #f1cf71; border-radius: 16px; background: #fff9e8; color: #5e4a14; }
.signature-pad-wrap { padding: 1rem; border: 1px solid rgba(91,91,214,.18); border-radius: 16px; background: #fafaff; transition: border-color .18s ease, background .18s ease; }
.signature-pad-wrap.has-signature { border-color: rgba(34,166,122,.45); background: rgba(34,166,122,.04); }
.signature-canvas-frame { position: relative; border: 1px dashed #9aa5bd; border-radius: 12px; background: #fff; overflow: hidden; transition: border-color .18s ease; }
.signature-pad-wrap.has-signature .signature-canvas-frame { border-style: solid; border-color: rgba(34,166,122,.5); }
.signature-guide { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.signature-guide__hint { font-size: 22px; font-family: 'Brush Script MT', cursive; fill: #c3cbdb; }
.signature-guide__mark { stroke: #c3cbdb; stroke-width: 2; stroke-linecap: round; }
.signature-guide__line { stroke: #c3cbdb; stroke-width: 1.5; }
.signature-pad-wrap.has-signature .signature-guide { opacity: 0; transition: opacity .12s ease; }
.signature-canvas { position: relative; display: block; width: 100%; height: 150px; background: transparent; touch-action: none; cursor: crosshair; }
.signature-type-toggle { border: none; background: none; padding: 0; font-size: .78rem; font-weight: 600; color: var(--tb-brand); text-decoration: underline; text-underline-offset: 2px; }
.signature-type-toggle:hover { color: var(--tb-brand-dark); }
.signature-type-panel { display: flex; gap: .5rem; margin-top: .75rem; }
.signature-type-panel input { flex: 1 1 auto; }
.agreement-consent { display: flex; align-items: flex-start; gap: .8rem; padding: 1.15rem 1.25rem; border: 1px solid rgba(91,91,214,.16); border-radius: 14px; background: rgba(255,255,255,.72); }
.agreement-consent .form-check-input { flex: 0 0 auto; width: 1.35rem; height: 1.35rem; margin: .15rem 0 0; }
.agreement-consent__label { display: block; margin: 0; color: var(--tb-ink) !important; font-size: clamp(.9rem, 1.35vw, 1.05rem) !important; font-weight: 500 !important; line-height: 1.55; }
.agreement-consent__label strong { font-weight: 750; }
.devise-links { width: min(100%, 34rem); margin: 1.25rem auto 0; padding: .35rem 0; }
.devise-link { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: .35rem .9rem; border-radius: 10px; color: var(--tb-brand-dark) !important; font-size: .95rem; font-weight: 650; text-decoration: none !important; transition: background .18s ease, color .18s ease; }
.devise-link:hover, .devise-link:focus-visible { background: var(--tb-brand-soft); color: var(--tb-brand) !important; text-decoration: none !important; }
.stat-detail { display: block; margin-top: .35rem; color: var(--tb-muted) !important; font-size: .9rem; line-height: 1.55; }

/* Record tables: the whole row opens its detail view without stealing nested controls. */
.table tbody tr.tb-clickable-row { cursor: pointer; outline: 0; }
.table tbody tr.tb-clickable-row > td { position: relative; transition: background-color .18s ease, color .18s ease; }
.table tbody tr.tb-clickable-row > td:first-child::before { position: absolute; top: 12%; bottom: 12%; left: 0; width: 3px; border-radius: 0 4px 4px 0; background: var(--tb-brand); content: ""; opacity: 0; transform: scaleY(.55); transition: opacity .18s ease, transform .18s ease; }
.table tbody tr.tb-clickable-row:hover > td { background-color: rgba(91,91,214,.045); }
.table tbody tr.tb-clickable-row:hover > td:first-child::before { opacity: 1; transform: scaleY(1); }
.table tbody tr.tb-clickable-row:focus-visible > td { background-color: var(--tb-brand-soft); box-shadow: inset 0 2px 0 rgba(91,91,214,.36), inset 0 -2px 0 rgba(91,91,214,.36); }
.table tbody tr.tb-clickable-row:focus-visible > td:first-child { box-shadow: inset 2px 0 0 rgba(91,91,214,.36), inset 0 2px 0 rgba(91,91,214,.36), inset 0 -2px 0 rgba(91,91,214,.36); }
.table tbody tr.tb-clickable-row:focus-visible > td:last-child { box-shadow: inset -2px 0 0 rgba(91,91,214,.36), inset 0 2px 0 rgba(91,91,214,.36), inset 0 -2px 0 rgba(91,91,214,.36); }
.table tbody tr.tb-clickable-row .btn, .table tbody tr.tb-clickable-row .icon-action-btn { position: relative; z-index: 1; }

/* Admin dashboard activity lists */
.admin-activity-grid > [class*="col-"] { display: flex; }
.admin-activity-card { width: 100%; overflow: hidden; }
.admin-activity-card__header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 76px; padding: 1.25rem 1.5rem; }
.admin-activity-card__all { flex: 0 0 auto; padding: .4rem .7rem; border-radius: 9px; color: var(--tb-brand-dark); font-size: .82rem; font-weight: 750; text-decoration: none; }
.admin-activity-card__all:hover, .admin-activity-card__all:focus-visible { background: var(--tb-brand-soft); color: var(--tb-brand); }
.admin-activity-card__body { padding: .65rem 1.25rem; }
.admin-activity-list { display: grid; }
.admin-activity-item { display: grid; grid-template-columns: 42px minmax(0, 1fr) 38px; align-items: center; gap: .85rem; min-height: 82px; padding: 1rem .25rem; border-bottom: 1px solid var(--tb-line); }
.admin-activity-item:last-child { border-bottom: 0; }
.admin-activity-item__icon { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 13px; font-size: .76rem; font-weight: 800; letter-spacing: -.02em; }
.admin-activity-item__icon--user { background: var(--tb-brand-soft); color: var(--tb-brand-dark); }
.admin-activity-item__icon--company { background: #eafaf5; color: #12805f; font-size: 1rem; }
.admin-activity-item__content { min-width: 0; }
.admin-activity-item__title { margin: 0 0 .38rem; overflow-wrap: anywhere; color: var(--tb-ink); font-size: .96rem; font-weight: 750; line-height: 1.3; }
.admin-activity-item__meta { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .65rem; color: var(--tb-muted); font-size: .78rem; line-height: 1.35; }
.admin-activity-item__badge { display: inline-flex; align-items: center; min-height: 24px; padding: .2rem .55rem; border-radius: 999px; background: #f1f3f8; color: #3e4a61; font-weight: 700; }
.admin-activity-item__action { display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid var(--tb-line); border-radius: 12px; background: #fff; color: var(--tb-brand); text-decoration: none; transition: background .18s ease, border-color .18s ease, transform .18s ease; }
.admin-activity-item__action:hover, .admin-activity-item__action:focus-visible { border-color: rgba(91,91,214,.32); background: var(--tb-brand-soft); color: var(--tb-brand-dark); transform: translateX(2px); }

@media (prefers-reduced-motion: no-preference) {
  .app-main > .container { animation: tb-arrive .45s cubic-bezier(.2,.75,.3,1) both; }
  @keyframes tb-arrive { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
}
@media (max-width: 767px) {
  .app-main { padding-top: 1.25rem !important; }
  .card, .dashboard-card, .stat-card, .content-card, .filter-card, .form-section, .auth-card, .modal-content { border-radius: 18px !important; }
  .table-responsive { border-radius: 18px; }
  .app-flash-region { padding-left: .85rem; padding-right: .85rem; }
  .admin-dashboard { padding-right: .85rem; padding-left: .85rem; }
  .admin-activity-card__header { min-height: 66px; padding: 1rem; }
  .admin-activity-card__header h2 { font-size: 1.05rem; }
  .admin-activity-card__body { padding: .35rem .85rem; }
  .admin-activity-item { grid-template-columns: 38px minmax(0, 1fr) 34px; gap: .65rem; min-height: 76px; padding: .85rem 0; }
  .admin-activity-item__icon { width: 38px; height: 38px; border-radius: 11px; }
  .admin-activity-item__title { font-size: .9rem; }
  .admin-activity-item__meta { gap: .3rem .5rem; font-size: .74rem; }
  .admin-activity-item__action { width: 34px; height: 34px; }
}