:root {
  --ta-page: #f5f7fa;
  --ta-surface: #ffffff;
  --ta-sidebar: #14213d;
  --ta-sidebar-muted: #b4c0d4;
  --ta-primary: #2563eb;
  --ta-primary-dark: #1d4ed8;
  --ta-ready: #15803d;
  --ta-attention: #b45309;
  --ta-critical: #b91c1c;
  --ta-border: #dbe3ef;
  --ta-text: #172033;
  --ta-muted: #64748b;
  --ta-sidebar-width: 248px;
  --ta-sidebar-collapsed-width: 72px;
}

body.ta-admin-body { min-width: 0; min-height: 100vh; color: var(--ta-text); background: var(--ta-page); }
body.ta-admin-body .cfm-admin-shell-header { display: none; }

.ta-app-layout {
  --ta-sidebar-current-width: var(--ta-sidebar-width);
  display: grid;
  grid-template-columns: var(--ta-sidebar-current-width) minmax(0, 1fr);
  min-height: 100vh;
  transition: grid-template-columns .18s ease;
}
.ta-app-layout.is-sidebar-collapsed,
html.ta-sidebar-collapsed .ta-app-layout { --ta-sidebar-current-width: var(--ta-sidebar-collapsed-width); }

.ta-sidebar {
  position: sticky;
  top: 0;
  z-index: 1040;
  display: flex;
  width: var(--ta-sidebar-current-width);
  height: 100vh;
  min-width: 0;
  flex-direction: column;
  overflow-x: hidden;
  overflow-y: auto;
  background: var(--ta-sidebar);
  box-shadow: 2px 0 18px rgba(15, 23, 42, .12);
  transition: width .18s ease, transform .18s ease;
}
.ta-sidebar-brand-row { display: flex; min-height: 64px; align-items: center; gap: .4rem; padding: .7rem .75rem .7rem 1rem; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.ta-sidebar-brand { display: flex; min-width: 0; flex: 1 1 auto; align-items: center; color: #fff; text-decoration: none; }
.ta-brand-mark { display: grid; width: 2rem; height: 2rem; flex: 0 0 auto; place-items: center; border-radius: .58rem; background: #fff; color: var(--ta-sidebar); font-size: .67rem; font-weight: 850; letter-spacing: -.05em; }
.ta-brand-name { max-width: 10rem; overflow: hidden; font-size: .9rem; font-weight: 750; letter-spacing: -.015em; opacity: 1; text-overflow: ellipsis; transition: max-width .18s ease, opacity .12s ease; white-space: nowrap; }

.ta-sidebar-toggle,
.ta-mobile-toggle { display: inline-grid; width: 2.15rem; height: 2.15rem; flex: 0 0 auto; place-items: center; border: 1px solid rgba(255, 255, 255, .18); border-radius: .52rem; background: rgba(255, 255, 255, .06); color: #fff; }
.ta-sidebar-toggle { width: auto; min-width: 3rem; grid-auto-flow: column; gap: .32rem; padding: .12rem; border: 0; background: transparent; }
.ta-sidebar-toggle:hover,
.ta-sidebar-toggle:focus-visible { background: rgba(255, 255, 255, .12); }
.ta-sidebar-toggle-chevron { width: .5rem; height: .5rem; border-bottom: 2px solid currentColor; border-left: 2px solid currentColor; transform: rotate(45deg); transition: transform .18s ease; }
.ta-app-layout.is-sidebar-collapsed .ta-sidebar-toggle-chevron,
html.ta-sidebar-collapsed .ta-app-layout .ta-sidebar-toggle-chevron { transform: rotate(225deg); }

.ta-sidebar-nav { display: grid; gap: .18rem; padding: .85rem .55rem; }
.ta-sidebar-nav--secondary { margin-top: auto; border-top: 1px solid rgba(255, 255, 255, .1); }
.ta-nav-link,
.ta-logout { position: relative; display: grid; min-width: 0; min-height: 42px; grid-template-columns: 1.35rem minmax(0, 1fr); align-items: center; gap: .75rem; padding: .58rem .7rem; border: 1px solid transparent; border-radius: .56rem; color: var(--ta-sidebar-muted); font-size: .89rem; font-weight: 650; line-height: 1.2; text-align: left; text-decoration: none; }
.ta-nav-link:hover,
.ta-nav-link:focus-visible,
.ta-logout:hover,
.ta-logout:focus-visible { border-color: rgba(255, 255, 255, .16); background: rgba(255, 255, 255, .08); color: #fff; }
.ta-nav-link.is-active { background: rgba(59, 130, 246, .24); box-shadow: inset 3px 0 0 #93c5fd; color: #fff; }
.ta-nav-icon-svg { width: 1.25rem; height: 1.25rem; overflow: visible; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.ta-nav-label,
.ta-user-copy,
.ta-logout-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.ta-sidebar-footer { padding: 0 .55rem .85rem; color: var(--ta-sidebar-muted); }
.ta-user-context { display: grid; min-width: 0; grid-template-columns: 1.35rem minmax(0, 1fr); align-items: center; gap: .75rem; padding: .7rem; font-size: .78rem; line-height: 1.35; }
.ta-user-context .ta-nav-icon-svg,
.ta-logout .ta-nav-icon-svg { color: #dbeafe; }
.ta-user-copy strong { color: #fff; font-size: .82rem; }
.ta-logout { width: 100%; margin-top: .2rem; background: transparent; }

.ta-main-shell { min-width: 0; }
.ta-topbar { position: sticky; top: 0; z-index: 1030; display: grid; min-height: 58px; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1rem; padding: .55rem clamp(1rem, 2.2vw, 1.75rem); border-bottom: 1px solid var(--ta-border); background: rgba(255, 255, 255, .94); backdrop-filter: blur(12px); }
.ta-topbar-context,
.ta-topbar-utilities,
.ta-topbar-utility,
.ta-topbar-user { display: flex; min-width: 0; align-items: center; }
.ta-topbar-context { gap: .5rem; }
.ta-topbar-product { color: var(--ta-text); font-size: .88rem; font-weight: 760; }
.ta-topbar-separator,
.ta-topbar-title,
.ta-topbar-date { color: var(--ta-muted); font-size: .82rem; }
.ta-topbar-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ta-topbar-utilities { justify-content: flex-end; gap: .85rem; }
.ta-topbar-utility { gap: .4rem; color: #334155; font-size: .82rem; font-weight: 650; text-decoration: none; }
.ta-topbar-utility .ta-nav-icon-svg { width: 1rem; height: 1rem; color: var(--ta-primary); }
.ta-topbar-utility:hover { color: var(--ta-primary-dark); }
.ta-topbar-user { gap: .42rem; color: #334155; font-size: .82rem; font-weight: 650; }
.ta-user-avatar { display: grid; width: 1.72rem; height: 1.72rem; place-items: center; border-radius: 50%; background: #e2e8f0; color: #334155; font-size: .68rem; font-weight: 800; }
.ta-mobile-toggle { display: none; }
.ta-admin-content { min-width: 0; padding: clamp(1rem, 2.3vw, 1.75rem); }

.ta-app-layout.is-sidebar-collapsed .ta-sidebar-brand-row,
.ta-sidebar-collapsed .ta-app-layout .ta-sidebar-brand-row { justify-content: center; padding-left: .45rem; padding-right: .45rem; }
.ta-app-layout.is-sidebar-collapsed .ta-sidebar-brand,
.ta-sidebar-collapsed .ta-app-layout .ta-sidebar-brand { display: flex; flex: 0 1 0; overflow: hidden; }
.ta-app-layout.is-sidebar-collapsed .ta-sidebar-toggle,
.ta-sidebar-collapsed .ta-app-layout .ta-sidebar-toggle { display: inline-grid; min-width: 3rem; }
.ta-app-layout.is-sidebar-collapsed .ta-nav-label,
.ta-sidebar-collapsed .ta-app-layout .ta-nav-label,
.ta-app-layout.is-sidebar-collapsed .ta-user-copy,
.ta-sidebar-collapsed .ta-app-layout .ta-user-copy,
.ta-app-layout.is-sidebar-collapsed .ta-logout-label { display: none; }
.ta-sidebar-collapsed .ta-app-layout .ta-logout-label { display: none; }
.ta-app-layout.is-sidebar-collapsed .ta-brand-name,
.ta-sidebar-collapsed .ta-app-layout .ta-brand-name { display: block; max-width: 0; opacity: 0; pointer-events: none; }
.ta-app-layout.is-sidebar-collapsed .ta-nav-link,
.ta-app-layout.is-sidebar-collapsed .ta-logout,
.ta-sidebar-collapsed .ta-app-layout .ta-nav-link,
.ta-sidebar-collapsed .ta-app-layout .ta-logout { grid-template-columns: 1.35rem; justify-content: center; padding-left: .45rem; padding-right: .45rem; text-align: center; }
.ta-app-layout.is-sidebar-collapsed .ta-user-context,
.ta-sidebar-collapsed .ta-app-layout .ta-user-context { grid-template-columns: 1.35rem; justify-content: center; padding-left: .45rem; padding-right: .45rem; }
.ta-sidebar-tooltip { position: fixed; z-index: 1080; padding: .38rem .56rem; border: 1px solid rgba(255, 255, 255, .14); border-radius: .38rem; background: #0f172a; box-shadow: 0 5px 15px rgba(15, 23, 42, .22); color: #fff; font-size: .76rem; font-weight: 650; line-height: 1.2; pointer-events: none; transform: translateY(-50%); white-space: nowrap; }

.ta-icon-well { background: #edf5ff; color: #3475ad; }
.ta-icon-well--amber { background: #fff4df; color: #9a6418; }
.ta-icon-well--red { background: #fdf0f1; color: #aa5258; }
.ta-icon-well--green { background: #ebf8f0; color: #397f5a; }
.ta-icon-well--violet { background: #f3efff; color: #7557ae; }
.ta-icon-well--teal { background: #e9f8f7; color: #287a78; }

.ta-admin-body :focus-visible { outline: 3px solid rgba(37, 99, 235, .55); outline-offset: 2px; }
.ta-admin-body .btn { border-radius: .52rem; }
.ta-admin-body .btn-primary { --bs-btn-bg: var(--ta-primary); --bs-btn-border-color: var(--ta-primary); --bs-btn-hover-bg: var(--ta-primary-dark); --bs-btn-hover-border-color: var(--ta-primary-dark); }
.ta-admin-body .card,
.ta-admin-body .data-card,
.ta-admin-body .metric-card,
.ta-admin-body .filter-card { border-color: var(--ta-border); box-shadow: 0 1px 3px rgba(15,23,42,.05); }
.ta-admin-body .section-label { color: var(--ta-primary); }
.ta-sidebar-backdrop { display: none; }

@media (max-width: 991.98px) {
  .ta-app-layout { display: block; }
  .ta-sidebar { position: fixed; left: 0; width: min(260px, 86vw); transform: translateX(-100%); }
  .ta-app-layout.is-sidebar-open .ta-sidebar { transform: translateX(0); }
  .ta-app-layout.is-sidebar-open .ta-sidebar-backdrop { position: fixed; z-index: 1035; inset: 0; display: block; width: 100%; border: 0; background: rgba(15, 23, 42, .42); }
  .ta-app-layout.is-sidebar-open { overflow: hidden; }
  .ta-sidebar-toggle { display: none; }
  .ta-app-layout.is-sidebar-collapsed .ta-sidebar-brand,
  .ta-sidebar-collapsed .ta-app-layout .ta-sidebar-brand { display: flex; flex: 1 1 auto; }
  .ta-app-layout.is-sidebar-collapsed .ta-sidebar-brand-row,
  .ta-sidebar-collapsed .ta-app-layout .ta-sidebar-brand-row { justify-content: flex-start; padding-left: 1rem; padding-right: .75rem; }
  .ta-app-layout.is-sidebar-collapsed .ta-brand-name,
  .ta-sidebar-collapsed .ta-app-layout .ta-brand-name,
  .ta-app-layout.is-sidebar-collapsed .ta-nav-label,
  .ta-sidebar-collapsed .ta-app-layout .ta-nav-label,
  .ta-app-layout.is-sidebar-collapsed .ta-user-copy,
  .ta-sidebar-collapsed .ta-app-layout .ta-user-copy,
  .ta-app-layout.is-sidebar-collapsed .ta-logout-label,
  .ta-sidebar-collapsed .ta-app-layout .ta-logout-label { display: block; }
  .ta-app-layout.is-sidebar-collapsed .ta-brand-name,
  .ta-sidebar-collapsed .ta-app-layout .ta-brand-name { max-width: 10rem; opacity: 1; pointer-events: auto; }
  .ta-app-layout.is-sidebar-collapsed .ta-nav-link,
  .ta-sidebar-collapsed .ta-app-layout .ta-nav-link,
  .ta-app-layout.is-sidebar-collapsed .ta-logout,
  .ta-sidebar-collapsed .ta-app-layout .ta-logout { grid-template-columns: 1.35rem minmax(0, 1fr); justify-content: initial; padding-left: .7rem; padding-right: .7rem; text-align: left; }
  .ta-app-layout.is-sidebar-collapsed .ta-user-context,
  .ta-sidebar-collapsed .ta-app-layout .ta-user-context { grid-template-columns: 1.35rem minmax(0, 1fr); justify-content: initial; padding-left: .7rem; padding-right: .7rem; }
  .ta-mobile-toggle { display: inline-grid; border-color: var(--ta-border); background: var(--ta-surface); color: var(--ta-text); }
  .ta-mobile-toggle span,
  .ta-mobile-toggle span::before,
  .ta-mobile-toggle span::after { display: block; width: 1rem; height: 2px; border-radius: 2px; background: currentColor; content: ''; }
  .ta-mobile-toggle span { position: relative; }
  .ta-mobile-toggle span::before { position: absolute; top: -.32rem; }
  .ta-mobile-toggle span::after { position: absolute; top: .32rem; }
  .ta-topbar { grid-template-columns: auto minmax(0, 1fr) auto; }
  .ta-topbar-context { grid-column: 2; }
  .ta-topbar-utilities { grid-column: 3; }
  .ta-admin-content { padding: 1rem; }
  .ta-sidebar-tooltip { display: none; }
}
@media (max-width: 575.98px) {
  .ta-topbar { gap: .6rem; padding: .55rem .8rem; }
  .ta-topbar-product,
  .ta-topbar-separator,
  .ta-topbar-date,
  .ta-topbar-user-name { display: none; }
  .ta-topbar-utilities { gap: .6rem; }
  .ta-topbar-utility span { display: none; }
}