:root {
  --tz-ink: #171447;
  --tz-ink-2: #242064;
  --tz-violet: #6d28d9;
  --tz-violet-soft: #f1ebff;
  --tz-emerald: #00bd7e;
  --tz-emerald-dark: #008f64;
  --tz-emerald-soft: #e7fbf4;
  --tz-canvas: #f6f7fb;
  --tz-surface: #ffffff;
  --tz-border: #e4e7f0;
  --tz-text: #25243a;
  --tz-muted: #6f7287;
  --tz-shadow: 0 10px 28px rgba(23, 20, 71, .08);
  --tz-sidebar-width: 260px;
  --tz-sidebar-mini: 76px;
  --tz-radius: 14px;
}

html, body { background: var(--tz-canvas); color: var(--tz-text); }
body { font-family: Roboto, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
a { color: var(--tz-violet); }
a:hover, a:focus { color: var(--tz-emerald-dark); }
::selection { background: rgba(0, 189, 126, .2); color: var(--tz-ink); }

.main-panel { background: var(--tz-canvas); }
.navbar { background: rgba(255,255,255,.92) !important; border-bottom: 1px solid var(--tz-border); backdrop-filter: blur(14px); }
.navbar .navbar-brand, .navbar .nav-link, .navbar .material-icons { color: var(--tz-ink) !important; }
.card { border: 1px solid var(--tz-border); border-radius: var(--tz-radius); box-shadow: var(--tz-shadow); }
.card .card-header { border-radius: var(--tz-radius) var(--tz-radius) 0 0; }
.card-header-primary, .bg-primary, .badge-primary { background: linear-gradient(135deg, var(--tz-ink), var(--tz-violet)) !important; }
.card-header-success, .bg-success, .badge-success { background: linear-gradient(135deg, var(--tz-emerald-dark), var(--tz-emerald)) !important; }
.btn { border-radius: 9px; text-transform: none; font-weight: 600; letter-spacing: .01em; }
.btn.btn-primary { background: linear-gradient(135deg, var(--tz-violet), #7c3aed); box-shadow: 0 6px 16px rgba(109,40,217,.2); }
.btn.btn-primary:hover, .btn.btn-primary:focus { background: linear-gradient(135deg, #5b21b6, var(--tz-violet)); box-shadow: 0 8px 20px rgba(109,40,217,.28); }
.btn.btn-success { background: linear-gradient(135deg, var(--tz-emerald-dark), var(--tz-emerald)); box-shadow: 0 6px 16px rgba(0,189,126,.2); }
.form-control:focus, .custom-select:focus { border-color: var(--tz-violet); box-shadow: 0 0 0 3px rgba(109,40,217,.12); }
.form-group.is-focused .form-control { background-image: linear-gradient(0deg,var(--tz-violet) 2px,rgba(109,40,217,0) 0),linear-gradient(0deg,#d2d2d2 1px,transparent 0); }
.text-primary { color: var(--tz-violet) !important; }
.text-success { color: var(--tz-emerald-dark) !important; }
.table thead th { color: var(--tz-ink); border-bottom-color: var(--tz-border); }
.table tbody tr:hover { background: rgba(109,40,217,.035); }
.progress-bar { background: linear-gradient(90deg, var(--tz-violet), var(--tz-emerald)); }

/* Material Dashboard legacy palette normalization. Keep danger/warning/P&L semantics untouched. */
.bg-purple, .badge-purple,
.nav-pills .nav-item .nav-link.active,
.nav-pills .nav-item .nav-link.active:focus,
.nav-pills .nav-item .nav-link.active:hover,
.pagination > .page-item.active > a,
.pagination > .page-item.active > a:focus,
.pagination > .page-item.active > a:hover,
.pagination > .page-item.active > span,
.pagination > .page-item.active > span:focus,
.pagination > .page-item.active > span:hover,
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus,
.dropdown-menu a:active,
.dropdown-menu a:focus,
.dropdown-menu a:hover {
  background-color: var(--tz-violet) !important;
  color:#fff !important;
}
.card-header-primary,
.card .card-header-primary,
.card.bg-primary,
.card .card-header-primary:not(.card-header-icon):not(.card-header-text),
.card-header.card-header-tabs.card-header-primary {
  background: linear-gradient(125deg,var(--tz-ink),var(--tz-violet) 62%,var(--tz-emerald-dark)) !important;
  box-shadow:0 8px 20px rgba(23,20,71,.2) !important;
}
.btn.btn-primary,
.btn-primary,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
  color:#fff !important;
  background:linear-gradient(135deg,var(--tz-violet),#4f46a5) !important;
  border-color:transparent !important;
}
.btn.btn-primary.btn-link, .btn-primary.btn-link { color:var(--tz-violet) !important; background:transparent !important; box-shadow:none !important; }
.btn.btn-success, .btn-success { color:#fff !important; background:linear-gradient(135deg,var(--tz-emerald-dark),var(--tz-emerald)) !important; border-color:transparent !important; }
.text-primary, a.text-primary { color:var(--tz-violet) !important; }
.text-info { color:#0f7490 !important; }
.badge-primary { color:#fff; background:var(--tz-violet) !important; }
.badge-info { color:#fff; background:#0f7490 !important; }
.custom-control-input:checked ~ .custom-control-label::before,
.form-check .form-check-input:checked + .form-check-sign .check,
.togglebutton label input[type=checkbox]:checked + .toggle,
.togglebutton label input[type=checkbox]:checked + .toggle::after {
  background-color:var(--tz-emerald) !important;
  border-color:var(--tz-emerald) !important;
}
.bmd-form-group.is-focused .bmd-label-floating,
.bmd-form-group.is-filled .bmd-label-floating { color:var(--tz-violet) !important; }
.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover,
.bootstrap-datetimepicker-widget table td span.active { background-color:var(--tz-violet) !important; }

/* Cross-product polish for legacy and modern templates. */
.content { padding:16px 0 28px !important; }
.content > .container-fluid { max-width:1920px; padding-right:18px !important; padding-left:18px !important; }
.card { margin-bottom:18px; overflow:visible; }
.card .card-header { margin:0 14px; padding:14px 18px; }
.card .card-header:first-child { margin-top:-10px; }
.card .card-body { padding:18px; }
.card-title { color:var(--tz-ink); font-weight:700 !important; letter-spacing:-.015em; }
.card-header-primary .card-title, .card-header-primary .card-category,
.card-header-success .card-title, .card-header-success .card-category { color:#fff !important; }
.card-category, .text-muted { color:var(--tz-muted) !important; }
h1,h2,h3,h4,h5,h6 { color:var(--tz-ink); }
.page-title, .content h2:first-child { font-weight:750; letter-spacing:-.025em; }
.table-responsive { border:1px solid var(--tz-border); border-radius:12px; background:#fff; }
.table { color:var(--tz-text); margin-bottom:0; }
.table > thead > tr > th { background:#f7f7fb; color:var(--tz-ink); font-size:.72rem; font-weight:700; letter-spacing:.035em; text-transform:uppercase; white-space:nowrap; border-top:0; }
.table > tbody > tr > td { border-color:#eceef4; vertical-align:middle; }
.table-striped tbody tr:nth-of-type(odd) { background:rgba(109,40,217,.025); }
.table-hover tbody tr:hover { background:linear-gradient(90deg,rgba(109,40,217,.045),rgba(0,189,126,.035)); }
.form-control, .custom-select, select.form-control, textarea.form-control { color:var(--tz-text); border-radius:8px; }
.input-group-text { border-color:var(--tz-border); background:#f7f7fb; color:var(--tz-muted); }
.modal-content { border:0; border-radius:16px; box-shadow:0 24px 70px rgba(23,20,71,.22); overflow:hidden; }
.modal-header { background:linear-gradient(135deg,var(--tz-ink),var(--tz-ink-2)); color:#fff; border:0; }
.modal-header .modal-title, .modal-header .close { color:#fff; }
.modal-footer { border-top:1px solid var(--tz-border); background:#fafafe; }
.alert { border:1px solid transparent; border-radius:11px; box-shadow:none; }
.alert-info { color:#155e75; background:#ecfeff; border-color:#a5f3fc; }
.alert-success { color:#066a4a; background:var(--tz-emerald-soft); border-color:#a7f3d0; }
.alert-primary { color:#4c1d95; background:var(--tz-violet-soft); border-color:#ddd6fe; }
.breadcrumb { border-radius:10px; background:#f2f3f8; }
.dropdown-menu { border:1px solid var(--tz-border); border-radius:11px; box-shadow:var(--tz-shadow); }
.dropdown-menu .dropdown-item { border-radius:7px; margin:2px 5px; width:calc(100% - 10px); }
.badge { border-radius:999px; padding:.35em .65em; font-weight:650; }
.nav-tabs { border-bottom:1px solid var(--tz-border); }
.nav-tabs .nav-link { color:var(--tz-muted); border:0; border-bottom:2px solid transparent; font-weight:600; }
.nav-tabs .nav-link.active { color:var(--tz-violet); background:transparent; border-bottom-color:var(--tz-emerald); }
.list-group-item { border-color:var(--tz-border); }
.footer { border-top:1px solid var(--tz-border); background:transparent; }

@media (max-width:767px) {
  .content { padding-top:8px !important; }
  .content > .container-fluid { padding-right:10px !important; padding-left:10px !important; }
  .card { margin-bottom:13px; border-radius:12px; }
  .card .card-header { margin:0 8px; padding:12px 14px; }
  .card .card-body { padding:13px; }
  .card-title { font-size:1.05rem; }
  h1 { font-size:1.65rem; } h2 { font-size:1.4rem; } h3 { font-size:1.2rem; }
  .table-responsive { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .table > thead > tr > th, .table > tbody > tr > td { padding:9px 8px; }
  .btn { min-height:38px; }
  .modal-dialog { margin:10px; }
  .footer { display:none; }
}

.tz-login-page { min-height:calc(100vh - 150px); align-items:center; padding:28px 0; }
.tz-login-page .card { overflow:hidden; }
.tz-login-brand { padding:24px 28px 12px; text-align:center; background:linear-gradient(145deg,#fff,var(--tz-violet-soft)); }
.tz-login-brand img { width:min(100%,340px); height:auto; }
.tz-login-brand p { margin:5px 0 0; color:var(--tz-muted); font-size:.86rem; }
.tz-login-page .card-header { margin:0 18px; }

/* Shared desktop navigation */
.tz-sidebar {
  position: fixed; inset: 0 auto 0 0; z-index: 1040; width: var(--tz-sidebar-width);
  display: flex; flex-direction: column; background: linear-gradient(180deg,#171447 0%,#211d5e 60%,#171447 100%);
  color: #fff; box-shadow: 12px 0 32px rgba(23,20,71,.14); transition: width .25s ease, transform .25s ease;
}
.tz-sidebar__brand { height: 78px; display:flex; align-items:center; gap:8px; padding: 8px 12px 7px 12px; border-bottom:1px solid rgba(255,255,255,.09); }
.tz-brand { min-width:0; flex:1; display:flex; align-items:center; gap:10px; color:#fff !important; text-decoration:none !important; }
.tz-brand__logo { width:55px; height:55px; object-fit:contain; flex:0 0 55px; filter: drop-shadow(0 4px 9px rgba(0,0,0,.18)); }
.tz-brand__name { font-size:1.22rem; font-weight:800; letter-spacing:-.025em; white-space:nowrap; }
.tz-brand__name::first-letter { color:#fff; }
.tz-icon-button { border:0; background:rgba(255,255,255,.09); color:#fff; width:34px; height:34px; border-radius:10px; display:inline-grid; place-items:center; cursor:pointer; }
.tz-icon-button:hover { background:rgba(0,189,126,.2); }
.tz-icon-button .material-icons { font-size:20px; }
.tz-user-card { display:flex; align-items:center; gap:10px; margin:12px; padding:10px; border:1px solid rgba(255,255,255,.1); border-radius:12px; background:rgba(255,255,255,.055); color:#fff !important; text-decoration:none !important; }
.tz-user-card img { width:34px; height:34px; border-radius:10px; object-fit:cover; }
.tz-user-card__copy { min-width:0; display:flex; flex-direction:column; line-height:1.25; }
.tz-user-card__copy strong { overflow:hidden; text-overflow:ellipsis; }
.tz-user-card__copy small { color:rgba(255,255,255,.58); }
.tz-sidebar__nav { flex:1; overflow-y:auto; padding:0 10px 12px; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.18) transparent; }
.tz-nav-link, .tz-nav-group__toggle { width:100%; min-height:43px; display:flex; align-items:center; gap:11px; border:0; border-radius:10px; padding:9px 11px; color:rgba(255,255,255,.78) !important; background:transparent; text-decoration:none !important; font-size:.88rem; font-weight:500; text-align:left; }
.tz-nav-link:hover, .tz-nav-group__toggle:hover { color:#fff !important; background:rgba(255,255,255,.07); }
.tz-nav-link.is-active { color:#fff !important; background:linear-gradient(90deg,rgba(109,40,217,.72),rgba(0,189,126,.27)); box-shadow: inset 3px 0 0 var(--tz-emerald); }
.tz-nav-link > .material-icons, .tz-nav-group__toggle .material-icons { font-size:20px; color:var(--tz-emerald); }
.tz-nav-group { margin:3px 0; }
.tz-nav-group__toggle { justify-content:space-between; cursor:pointer; }
.tz-nav-group__toggle > span { display:flex; align-items:center; gap:11px; }
.tz-nav-group__chevron { color:rgba(255,255,255,.45) !important; transition:transform .2s ease; }
.tz-nav-group__items { display:none; padding:2px 0 5px 42px; }
.tz-nav-group.is-open .tz-nav-group__items { display:block; }
.tz-nav-group.is-open .tz-nav-group__chevron { transform:rotate(180deg); }
.tz-nav-group__items a { position:relative; display:block; padding:7px 8px; color:rgba(255,255,255,.62); border-radius:7px; font-size:.79rem; text-decoration:none; }
.tz-nav-group__items a::before { content:""; position:absolute; left:-12px; top:13px; width:4px; height:4px; border-radius:50%; background:rgba(255,255,255,.24); }
.tz-nav-group__items a:hover, .tz-nav-group__items a.is-active { color:#fff; background:rgba(255,255,255,.07); }
.tz-nav-group__items a.is-active::before { width:6px; height:6px; top:12px; background:var(--tz-emerald); box-shadow:0 0 0 4px rgba(0,189,126,.13); }
.tz-sidebar__footer { display:grid; grid-template-columns:1fr 1fr; gap:5px; padding:10px; border-top:1px solid rgba(255,255,255,.09); }
.tz-sidebar__footer .tz-nav-link { justify-content:center; font-size:.76rem; padding:7px; }
.tz-nav-link--danger > .material-icons { color:#fb7185 !important; }

.tz-sidebar.collapsed { width:var(--tz-sidebar-mini); }
.tz-sidebar.collapsed .tz-brand__name, .tz-sidebar.collapsed .tz-user-card__copy, .tz-sidebar.collapsed .tz-nav-link span, .tz-sidebar.collapsed .tz-nav-group__toggle span span, .tz-sidebar.collapsed .tz-nav-group__chevron, .tz-sidebar.collapsed .tz-nav-group__items { display:none; }
.tz-sidebar.collapsed .tz-sidebar__brand { padding-left:12px; }
.tz-sidebar.collapsed .tz-brand__logo { width:38px; height:38px; flex-basis:38px; }
.tz-sidebar.collapsed .tz-sidebar__toggle { position:absolute; left:57px; top:21px; width:27px; height:27px; background:var(--tz-emerald); }
.tz-sidebar.collapsed .tz-user-card, .tz-sidebar.collapsed .tz-nav-link, .tz-sidebar.collapsed .tz-nav-group__toggle { justify-content:center; padding:9px; }
.tz-sidebar.collapsed .tz-sidebar__footer { grid-template-columns:1fr; }

/* Mobile navigation */
.tz-mobile-nav, .tz-mobile-sheet { display:none; }
@media (max-width: 991px) {
  body { padding-bottom:72px; }
  .tz-sidebar { display:none; }
  .main-panel, .wrapper.sidebar-mini .main-panel { width:100% !important; margin-left:0 !important; }
  .tz-mobile-nav { position:fixed; z-index:1060; left:10px; right:10px; bottom:max(8px,env(safe-area-inset-bottom)); height:62px; display:grid; grid-template-columns:repeat(5,1fr); align-items:center; padding:5px; border:1px solid rgba(228,231,240,.9); border-radius:18px; background:rgba(255,255,255,.94); box-shadow:0 14px 36px rgba(23,20,71,.18); backdrop-filter:blur(16px); }
  .tz-mobile-nav a, .tz-mobile-nav button { border:0; background:transparent; color:var(--tz-muted); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; height:50px; border-radius:13px; font-size:.64rem; font-weight:600; text-decoration:none; }
  .tz-mobile-nav .material-icons { font-size:21px; }
  .tz-mobile-nav a.is-active { color:var(--tz-ink); background:linear-gradient(135deg,var(--tz-violet-soft),var(--tz-emerald-soft)); }
  .tz-mobile-nav a.is-active .material-icons { color:var(--tz-emerald-dark); }
  .tz-mobile-nav button { color:#fff; background:linear-gradient(135deg,var(--tz-violet),var(--tz-emerald)); transform:translateY(-8px); box-shadow:0 7px 18px rgba(23,20,71,.22); }
  .tz-mobile-sheet { position:fixed; inset:0; z-index:1080; }
  .tz-mobile-sheet.is-open { display:block; }
  .tz-mobile-sheet__backdrop { position:absolute; inset:0; width:100%; border:0; background:rgba(15,12,48,.55); backdrop-filter:blur(3px); }
  .tz-mobile-sheet__panel { position:absolute; left:0; right:0; bottom:0; max-height:86vh; overflow:auto; padding:18px 16px calc(22px + env(safe-area-inset-bottom)); border-radius:24px 24px 0 0; background:#fff; box-shadow:0 -15px 45px rgba(23,20,71,.18); }
  .tz-mobile-sheet__header { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
  .tz-mobile-sheet__header div { display:flex; flex-direction:column; }
  .tz-mobile-sheet__header strong { color:var(--tz-ink); font-size:1.05rem; }
  .tz-mobile-sheet__header small { color:var(--tz-muted); }
  .tz-mobile-sheet__header .tz-icon-button { color:var(--tz-ink); background:var(--tz-violet-soft); }
  .tz-mobile-sheet__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
  .tz-mobile-sheet__grid a { min-height:76px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:8px; border:1px solid var(--tz-border); border-radius:13px; background:#fff; color:var(--tz-text); text-align:center; font-size:.72rem; font-weight:600; text-decoration:none; }
  .tz-mobile-sheet__grid a:hover { border-color:rgba(109,40,217,.35); background:var(--tz-violet-soft); }
  .tz-mobile-sheet__grid .material-icons { color:var(--tz-emerald-dark); }
  .tz-mobile-sheet__logout { display:flex; justify-content:center; align-items:center; gap:7px; margin-top:12px; padding:11px; border-radius:11px; background:#fff1f2; color:#be123c; font-weight:600; }
}

@media (max-width: 480px) {
  .content .container-fluid { padding-left:10px; padding-right:10px; }
  .tz-mobile-sheet__grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

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