/* TFD 2026 product UI layer
   High-trust institutional command center. Loaded last so it can safely refine legacy modules. */
:root{
  --nx-bg:#f5f4ef;
  --nx-surface:#fffefa;
  --nx-surface-2:#faf8f1;
  --nx-ink:#1d2523;
  --nx-muted:#68716e;
  --nx-line:#e5e4dc;
  --nx-line-strong:#d6d4c8;
  --nx-green:#255f56;
  --nx-green-2:#1c4e47;
  --nx-gold:#b9832f;
  --nx-gold-soft:#f8ecd7;
  --nx-danger:#a44538;
  --nx-info:#345f82;
  --nx-shadow:0 10px 30px rgba(31,42,39,.055);
  --nx-shadow-strong:0 22px 55px rgba(31,42,39,.10);
  --nx-radius:16px;
}

html{background:var(--nx-bg)}
body.td-v40-body{background:var(--nx-bg)!important;color:var(--nx-ink)!important}
.td-v40-main{background:var(--nx-bg)!important}
.td-v40-content{max-width:1680px!important;padding:24px 26px 44px!important}

/* Accessibility */
.td-skip-link{position:fixed;left:14px;top:10px;z-index:99999;transform:translateY(-160%);background:#111a18;color:#fff;padding:10px 14px;border-radius:10px;font-weight:800;box-shadow:var(--nx-shadow-strong)}
.td-skip-link:focus{transform:translateY(0)}
:focus-visible{outline:3px solid rgba(185,131,47,.35)!important;outline-offset:2px!important}

/* Shell */
.td-v40-topbar{background:rgba(255,254,250,.92)!important;border-bottom:1px solid var(--nx-line)!important;box-shadow:0 6px 24px rgba(31,42,39,.035)!important;backdrop-filter:blur(16px)}
.td-v40-topbar-inner{min-height:72px!important;padding-left:18px!important;padding-right:18px!important}
.td-v40-page-title{font-size:17px!important;letter-spacing:-.018em!important;color:var(--nx-ink)!important}
.td-v40-mini-label{color:#7b7f78!important;letter-spacing:.105em!important}

.td-v40-sidebar{background:#17201e!important;border-right:1px solid rgba(255,255,255,.07)!important;box-shadow:10px 0 32px rgba(19,27,25,.10)!important}
.td-v50-brand{padding:18px 16px 14px!important}
.td-v50-brand-copy strong{letter-spacing:-.015em!important}
.td-v50-user-card{margin:10px 12px 14px!important;padding:10px!important;background:rgba(255,255,255,.045)!important}
.td-v50-menu-heading{padding-left:18px!important;color:#8e9a96!important}
.td-v50-sidebar{padding:0 10px 18px!important}
.td-v50-group-title,.td-v50-single{min-height:43px!important;border-radius:10px!important;padding-top:8px!important;padding-bottom:8px!important}
.td-v50-group-title.active,.td-v50-single.active{background:#26332f!important;border-color:rgba(185,131,47,.26)!important;box-shadow:inset 3px 0 0 #c39343!important}
.td-v50-group-icon{background:rgba(255,255,255,.055)!important;color:#d5ac65!important}
.td-v50-submenu{margin:4px 0 8px 17px!important;padding-left:10px!important}
.td-v50-subitem{min-height:36px!important;padding:8px 10px!important;color:#c7cfcc!important}
.td-v50-subitem:hover{background:rgba(255,255,255,.055)!important;color:#fff!important}
.td-v50-subitem.active{background:#f4ead6!important;color:#2d342f!important;box-shadow:none!important}

/* Top search: actual interactive navigator */
.td-v40-search{position:relative!important;max-width:560px!important;height:44px!important;background:#f8f7f2!important;border:1px solid var(--nx-line)!important;box-shadow:none!important}
.td-v40-search:focus-within{background:#fff!important;border-color:#c9b88f!important;box-shadow:0 0 0 4px rgba(185,131,47,.09)!important}
.td-v40-search input{font-size:13px!important;font-weight:650!important}
.td-v40-search kbd{font-size:10px!important;border-radius:7px!important;background:#efede5!important;color:#73756e!important}
.td-global-results{position:absolute;left:0;right:0;top:calc(100% + 10px);z-index:70;background:#fffefa;border:1px solid var(--nx-line);border-radius:14px;box-shadow:var(--nx-shadow-strong);padding:7px;max-height:410px;overflow:auto}
.td-global-results[hidden]{display:none!important}
.td-global-result{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 11px;border-radius:10px;text-decoration:none;color:var(--nx-ink);font-size:13px;font-weight:760}
.td-global-result:hover,.td-global-result.is-active{background:#f4efe3;color:#1e332e}
.td-global-result small{display:block;color:var(--nx-muted);font-size:10px;font-weight:650;margin-top:2px}
.td-global-result .go{color:#9b8a65;font-size:12px}
.td-global-empty{padding:17px 14px;color:var(--nx-muted);font-size:13px;font-weight:650;text-align:center}

.td-v40-icon-btn,.td-v40-install,.td-v40-logout,.td-personal-dashboard-link,.td-active-session-pill{min-height:40px!important}
.td-v40-icon-btn{background:#fffefa!important;border-color:var(--nx-line)!important}
.td-v40-user{background:#fffefa!important;border-color:var(--nx-line)!important}
.td-v40-logout{background:#26302d!important;color:#fff!important;border:0!important;padding:10px 13px!important}
.td-v40-logout:hover{background:#121a18!important}

/* Shared surfaces */
.td-v40-card,.td-v40-table-wrap,.tz-card,.td-card,.td-smart-panel,.ss-panel,.report-card,.settings-card,.lms-card,.hr-card,.kh-card,.td-training-card,.td-att-card,.exam-card{
  background:var(--nx-surface)!important;
  border-color:var(--nx-line)!important;
  border-radius:var(--nx-radius)!important;
  box-shadow:var(--nx-shadow)!important;
}
.td-v40-card:hover{border-color:var(--nx-line-strong)!important}
.td-v40-card-head{padding:17px 18px!important;border-bottom:1px solid var(--nx-line)!important}
.td-v40-card-title{font-size:14px!important;letter-spacing:-.012em!important;color:var(--nx-ink)!important}
.td-v40-card-body{padding:18px!important}
.td-v40-btn{min-height:36px!important;border-radius:9px!important;padding:8px 11px!important;background:#fff!important;border:1px solid var(--nx-line-strong)!important;color:#34403c!important;box-shadow:none!important}
.td-v40-btn:hover{background:#f7f5ee!important;border-color:#c8c5b8!important;transform:none!important}
.td-v40-btn.primary{background:var(--nx-green)!important;color:#fff!important;border-color:var(--nx-green)!important;box-shadow:none!important}
.td-v40-btn.primary:hover{background:var(--nx-green-2)!important}

/* Dashboard hero */
.td-v6-dash-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;background:linear-gradient(120deg,#20312d 0%,#2d4942 62%,#4f675f 100%);border:1px solid rgba(28,78,71,.35);border-radius:20px;padding:24px 26px;color:#fff;box-shadow:0 18px 50px rgba(31,57,51,.13)}
.td-v6-dash-hero:after{content:"";position:absolute;right:-60px;top:-120px;width:320px;height:320px;border:1px solid rgba(255,255,255,.08);border-radius:50%;box-shadow:0 0 0 44px rgba(255,255,255,.028),0 0 0 90px rgba(255,255,255,.018);pointer-events:none}
.td-v6-dash-hero .eyebrow{font-size:10px;letter-spacing:.13em;text-transform:uppercase;font-weight:900;color:#d7c499}
.td-v6-dash-hero h2{margin-top:5px;font-size:25px;line-height:1.2;font-weight:900;letter-spacing:-.035em;color:#fff!important}
.td-v6-dash-hero p{margin-top:8px;max-width:700px;color:rgba(255,255,255,.72)!important;font-size:13px;font-weight:550}
.td-v6-hero-actions{position:relative;z-index:2;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.td-v6-hero-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:39px;padding:9px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.09);color:#fff!important;text-decoration:none;font-size:12px;font-weight:820;backdrop-filter:blur(8px)}
.td-v6-hero-btn:hover{background:rgba(255,255,255,.16)}
.td-v6-hero-btn.primary{background:#f3e3bd;color:#26342f!important;border-color:#f3e3bd}
.td-v6-date{margin-top:14px;display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:750;color:rgba(255,255,255,.68)}
.td-v6-date i{width:6px;height:6px;border-radius:50%;background:#e0b866;box-shadow:0 0 0 4px rgba(224,184,102,.12)}

/* KPI row */
.td-v6-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.td-v6-kpi{position:relative;display:block;min-width:0;padding:17px 18px 16px;background:var(--nx-surface);border:1px solid var(--nx-line);border-radius:15px;box-shadow:var(--nx-shadow);text-decoration:none;color:var(--nx-ink);overflow:hidden}
.td-v6-kpi:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--nx-green)}
.td-v6-kpi.gold:before{background:var(--nx-gold)}
.td-v6-kpi.blue:before{background:var(--nx-info)}
.td-v6-kpi.danger:before{background:var(--nx-danger)}
.td-v6-kpi:hover{transform:translateY(-2px);border-color:#cfcdc2;box-shadow:0 16px 32px rgba(31,42,39,.08)}
.td-v6-kpi-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.td-v6-kpi-label{font-size:10px;letter-spacing:.075em;text-transform:uppercase;font-weight:900;color:#7b827f}
.td-v6-kpi-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:#edf3f0;color:var(--nx-green);font-size:15px}
.td-v6-kpi.gold .td-v6-kpi-icon{background:#faf0de;color:#94631c}
.td-v6-kpi.blue .td-v6-kpi-icon{background:#eaf1f6;color:#345f82}
.td-v6-kpi.danger .td-v6-kpi-icon{background:#f8ebe7;color:#a44538}
.td-v6-kpi-value{margin-top:6px;font-size:28px;line-height:1;font-weight:900;letter-spacing:-.045em;color:#1d2825}
.td-v6-kpi-meta{margin-top:8px;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;font-weight:650;color:var(--nx-muted)}
.td-v6-kpi-meta b{font-weight:800;color:#4f5e59}

/* Action center */
.td-v6-action-row{display:flex;align-items:center;gap:12px;padding:11px 8px;border-bottom:1px solid #efeee8;text-decoration:none;color:var(--nx-ink);border-radius:9px}
.td-v6-action-row:last-child{border-bottom:0}
.td-v6-action-row:hover{background:#f8f6ef}
.td-v6-action-dot{width:9px;height:9px;border-radius:50%;background:var(--nx-gold);box-shadow:0 0 0 4px rgba(185,131,47,.10);flex:0 0 auto}
.td-v6-action-row.green .td-v6-action-dot{background:var(--nx-green);box-shadow:0 0 0 4px rgba(37,95,86,.10)}
.td-v6-action-row.red .td-v6-action-dot{background:var(--nx-danger);box-shadow:0 0 0 4px rgba(164,69,56,.09)}
.td-v6-action-main{min-width:0;flex:1}
.td-v6-action-main strong{display:block;font-size:12.5px;font-weight:850;color:#2a3431}
.td-v6-action-main small{display:block;margin-top:2px;font-size:10.5px;font-weight:600;color:#7c8582}
.td-v6-action-count{min-width:34px;text-align:center;padding:5px 8px;border-radius:999px;background:#f1eee5;color:#574f3d;font-size:11px;font-weight:900}

/* Utility cards under primary KPIs */
.td-v6-mini-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.td-v6-mini{display:flex;align-items:center;gap:10px;padding:12px 13px;border:1px solid var(--nx-line);border-radius:12px;background:#faf9f5;text-decoration:none;color:var(--nx-ink);min-width:0}
.td-v6-mini:hover{background:#fff;border-color:#d5d1c3}
.td-v6-mini .ico{width:29px;height:29px;border-radius:8px;display:grid;place-items:center;background:#eeeee8;font-size:14px;flex:0 0 auto}
.td-v6-mini strong{display:block;font-size:17px;line-height:1;font-weight:900}
.td-v6-mini small{display:block;margin-top:3px;font-size:9.8px;font-weight:700;color:#78807d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Tables */
.td-v40-table-wrap{overflow:hidden!important}
.td-v40-table-toolbar{padding:15px 17px!important;background:#fffefa!important;border-bottom:1px solid var(--nx-line)!important}
.td-v40-table-title{font-size:14px!important}
table,.td-v40-table{border-radius:12px!important;border-color:var(--nx-line)!important;box-shadow:none!important}
table th,.td-v40-table th{background:#f4f3ee!important;color:#616a67!important;font-size:10px!important;letter-spacing:.075em!important;padding:11px 13px!important}
table td,.td-v40-table td{padding:12px 13px!important;border-color:#efeee8!important}
table tbody tr:hover td{background:#faf9f4!important}

/* Login */
.td-auth-shell{min-height:calc(100vh - 24px);display:grid;place-items:center;padding:24px}
.td-auth-card{width:min(980px,100%);display:grid;grid-template-columns:1.04fr .96fr;overflow:hidden;background:#fffefa;border:1px solid var(--nx-line);border-radius:24px;box-shadow:0 28px 75px rgba(26,37,34,.14)}
.td-auth-brand{position:relative;overflow:hidden;padding:48px;background:linear-gradient(145deg,#182420 0%,#29453e 100%);color:#fff;display:flex;flex-direction:column;justify-content:space-between;min-height:540px}
.td-auth-brand:after{content:"";position:absolute;width:410px;height:410px;border-radius:50%;border:1px solid rgba(255,255,255,.08);right:-220px;bottom:-130px;box-shadow:0 0 0 55px rgba(255,255,255,.025),0 0 0 115px rgba(255,255,255,.018)}
.td-auth-brand-logo{width:74px;height:74px;border-radius:18px;background:#fff;padding:7px;box-shadow:0 14px 32px rgba(0,0,0,.18)}
.td-auth-brand-logo img{width:100%;height:100%;object-fit:contain}
.td-auth-brand h1{margin-top:26px;font-size:31px;line-height:1.08;font-weight:900;letter-spacing:-.04em;color:#fff!important;max-width:360px}
.td-auth-brand p{margin-top:12px;color:rgba(255,255,255,.69)!important;max-width:390px;line-height:1.65;font-size:13.5px}
.td-auth-brand-foot{position:relative;z-index:1;display:flex;align-items:center;gap:8px;font-size:10.5px;font-weight:700;color:rgba(255,255,255,.62)}
.td-auth-brand-foot span{width:7px;height:7px;border-radius:50%;background:#d9b66e}
.td-auth-form{padding:52px 48px;display:flex;flex-direction:column;justify-content:center}
.td-auth-form .eyebrow{font-size:10px;letter-spacing:.13em;text-transform:uppercase;font-weight:900;color:#9a7740}
.td-auth-form h2{margin-top:7px;font-size:27px;font-weight:900;letter-spacing:-.035em;color:var(--nx-ink)}
.td-auth-form .intro{margin-top:7px;margin-bottom:25px;color:var(--nx-muted);font-size:13px}
.td-auth-label{display:block;margin-bottom:7px;color:#3c4743!important;font-size:11.5px!important;font-weight:850!important}
.td-auth-input-wrap{position:relative}
.td-auth-input{width:100%;min-height:46px!important;border:1px solid var(--nx-line-strong)!important;border-radius:11px!important;background:#fff!important;padding:11px 13px!important;font-size:13px!important}
.td-auth-input:focus{border-color:#9e8960!important;box-shadow:0 0 0 4px rgba(185,131,47,.10)!important}
.td-auth-password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0!important;background:transparent!important;color:#6c7773!important;padding:7px 8px!important;font-size:11px!important;box-shadow:none!important}
.td-auth-submit{width:100%;min-height:46px;border:0;border-radius:11px;background:var(--nx-green);color:#fff;font-size:13px;font-weight:900;box-shadow:0 10px 24px rgba(37,95,86,.16)}
.td-auth-submit:hover{background:var(--nx-green-2);transform:none!important}
.td-auth-note{margin-top:18px;padding:11px 12px;border-radius:10px;background:#f6f4ed;border:1px solid #ece9df;color:#717a76;font-size:10.5px;font-weight:650;line-height:1.5}

/* Loading / feedback */
.td-page-loading{position:fixed;left:0;top:0;z-index:9999;height:2px;width:0;background:#bd8d3e;box-shadow:0 1px 8px rgba(189,141,62,.35);transition:width .18s ease,opacity .25s ease}
.td-page-loading.is-loading{width:72%}.td-page-loading.is-done{width:100%;opacity:0}

/* Mobile */
@media(max-width:1280px){
  .td-v6-mini-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:1024px){
  .td-v6-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .td-v6-dash-hero{grid-template-columns:1fr}
  .td-v6-hero-actions{justify-content:flex-start}
}
@media(max-width:900px){
  .td-v40-content{padding:14px 14px 34px!important}
  .td-v40-topbar-inner{min-height:62px!important;padding-left:10px!important;padding-right:10px!important}
  .td-v6-dash-hero{padding:20px;border-radius:16px}
  .td-v6-dash-hero h2{font-size:22px}
  .td-auth-shell{padding:12px;min-height:100vh}
  .td-auth-card{grid-template-columns:1fr;border-radius:18px}
  .td-auth-brand{min-height:auto;padding:28px 26px}
  .td-auth-brand h1{font-size:25px}.td-auth-brand p{font-size:12.5px}
  .td-auth-brand-foot{margin-top:28px}
  .td-auth-form{padding:30px 26px 34px}
}
@media(max-width:640px){
  .td-v6-kpi-grid{grid-template-columns:1fr 1fr;gap:9px}
  .td-v6-kpi{padding:14px 13px}.td-v6-kpi-value{font-size:24px}.td-v6-kpi-meta{font-size:10px}
  .td-v6-mini-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .td-v6-mini{padding:10px}.td-v6-mini strong{font-size:15px}
  .td-v6-hero-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .td-v6-hero-btn{width:100%}
  .td-v40-card-head{padding:14px!important}.td-v40-card-body{padding:14px!important}
}
@media(max-width:420px){
  .td-v6-kpi-grid{grid-template-columns:1fr}
  .td-v6-mini-grid{grid-template-columns:1fr 1fr}
}

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