/* VKS Refresh V2 — visual layer only. No business logic. */
:root{
  --vks-bg:#0a0c10;
  --vks-bg-2:#0d1015;
  --vks-panel:#11151b;
  --vks-panel-2:#151a21;
  --vks-panel-3:#1a2028;
  --vks-line:rgba(255,255,255,.075);
  --vks-line-strong:rgba(255,255,255,.12);
  --vks-text:#f3f5f7;
  --vks-muted:#8f98a5;
  --vks-red:#ff3647;
  --vks-red-2:#d91f31;
  --vks-green:#2ecc8a;
  --vks-amber:#f1b84b;
  --vks-blue:#67a4ff;
  --vks-radius:16px;
  --vks-shadow:0 18px 55px rgba(0,0,0,.28);
}

html[data-bs-theme="dark"],html[data-bs-theme="dark"] body,
body.vks-app{
  background:
    radial-gradient(900px 420px at 8% -10%,rgba(255,54,71,.085),transparent 58%),
    radial-gradient(700px 380px at 100% 8%,rgba(103,164,255,.045),transparent 60%),
    var(--vks-bg) !important;
  color:var(--vks-text) !important;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
body.vks-app{min-height:100vh;}

/* slim service status */
.vks-servicebar{
  min-height:40px;
  display:flex;
  align-items:center;
  background:#080a0d !important;
  border-bottom:1px solid rgba(255,255,255,.045) !important;
  color:#cbd1d8;
  font-size:.88rem;
}
.vks-servicebar strong{color:#fff;font-size:.9rem;}
.vks-servicebar .text-muted{color:#7e8793 !important;}

/* top navigation */
html[data-bs-theme="dark"] .vks-topnav,
.vks-topnav{
  min-height:76px;
  background:rgba(16,20,26,.94) !important;
  border-bottom:1px solid var(--vks-line) !important;
  box-shadow:0 10px 35px rgba(0,0,0,.18) !important;
  backdrop-filter:blur(18px) saturate(135%);
}
.vks-topnav .navbar-brand{display:flex;align-items:center;margin-right:28px;}
.vks-topnav .brand-logo{height:46px !important;width:auto;border-radius:0 !important;filter:drop-shadow(0 6px 12px rgba(0,0,0,.25));}

html[data-bs-theme="dark"] .vks-topnav .nav-chip,
.vks-topnav .nav-chip{
  min-height:40px;
  padding:.55rem .82rem !important;
  border-radius:11px !important;
  border:1px solid transparent !important;
  background:transparent !important;
  color:#aeb6c1 !important;
  box-shadow:none !important;
  font-size:.94rem;
  font-weight:650;
  transform:none !important;
}
.vks-topnav .nav-chip i{font-size:.94rem;color:#818b98;transition:.18s ease;}
.vks-topnav .nav-chip:hover{
  background:rgba(255,255,255,.045) !important;
  border-color:rgba(255,255,255,.055) !important;
  color:#fff !important;
}
.vks-topnav .nav-chip:hover i{color:#d7dce2;}
html[data-bs-theme="dark"] .vks-topnav .nav-chip.active,
.vks-topnav .nav-chip.active{
  background:linear-gradient(180deg,rgba(255,54,71,.16),rgba(255,54,71,.085)) !important;
  border-color:rgba(255,54,71,.28) !important;
  color:#ff6976 !important;
}
.vks-topnav .nav-chip.active i{color:var(--vks-red) !important;}
.vks-topnav .badge.bg-danger{background:var(--vks-red) !important;border:0 !important;box-shadow:0 0 0 3px rgba(255,54,71,.1);}

html[data-bs-theme="dark"] .vks-topnav .user-chip,
.vks-topnav .user-chip{
  min-height:40px;
  padding:.48rem .72rem !important;
  border-radius:11px !important;
  background:#12171d !important;
  border:1px solid var(--vks-line) !important;
  color:#e7eaee !important;
  box-shadow:none !important;
}
.vks-topnav .user-chip .badge{background:#252b33 !important;border:1px solid var(--vks-line-strong) !important;color:#b9c0c9 !important;}
html[data-bs-theme="dark"] .vks-topnav .icon-btn,
.vks-topnav .icon-btn{
  width:40px;height:40px;border-radius:11px !important;
  background:#12171d !important;border:1px solid var(--vks-line) !important;color:#b7bec8 !important;box-shadow:none !important;
}
.vks-topnav .icon-btn:hover{background:#1a2027 !important;color:#fff !important;border-color:var(--vks-line-strong) !important;}

.vks-topnav .lang-switch{gap:3px;padding:3px;border:1px solid var(--vks-line);background:#0e1217;border-radius:11px;}
.vks-topnav .lang-pill{padding:.38rem .55rem !important;border:0 !important;border-radius:8px !important;background:transparent !important;color:#7f8996 !important;}
.vks-topnav .lang-pill.active{background:#1c222a !important;color:#fff !important;}
.vks-topnav .lang-flag{width:16px;height:16px;}

.vks-topnav .dropdown-menu{
  margin-top:10px !important;padding:8px !important;min-width:220px;
  background:#11161c !important;border:1px solid var(--vks-line-strong) !important;
  border-radius:14px !important;box-shadow:0 18px 50px rgba(0,0,0,.38) !important;
}
.vks-topnav .dropdown-item{padding:.62rem .72rem;border-radius:9px;color:#bec5ce !important;font-size:.92rem;}
.vks-topnav .dropdown-item:hover{background:#1b2129 !important;color:#fff !important;}
.vks-topnav .dropdown-divider{border-color:var(--vks-line) !important;}

/* main canvas */
.vks-main{min-height:calc(100vh - 116px);}
.vks-main>.container-fluid{max-width:1500px;margin:0 auto;}
.vks-pagehead{padding:8px 0 2px;}
.vks-page-title{font-size:1.72rem;font-weight:800;letter-spacing:-.035em;color:#f7f8fa;}
.vks-page-subtitle{margin-top:3px;color:var(--vks-muted);font-size:.92rem;}

/* buttons */
.btn{border-radius:10px;font-weight:650;transition:all .16s ease;}
.btn:hover{transform:translateY(-1px);}
.btn-brand-soft,
.btn-outline-primary{
  color:#ff5c69 !important;background:rgba(255,54,71,.06) !important;border:1px solid rgba(255,54,71,.28) !important;
}
.btn-brand-soft:hover,.btn-outline-primary:hover{background:rgba(255,54,71,.14) !important;border-color:rgba(255,54,71,.5) !important;color:#ff7b86 !important;}
.btn-primary,.btn-brand{background:linear-gradient(135deg,var(--vks-red),var(--vks-red-2)) !important;border-color:transparent !important;color:white !important;box-shadow:0 8px 24px rgba(255,54,71,.16) !important;}
.btn-outline-secondary{background:#12171d !important;border-color:var(--vks-line-strong) !important;color:#aeb6c0 !important;}
.btn-outline-secondary:hover{background:#1b2129 !important;color:#fff !important;}

/* dashboard stats */
.vks-stat-grid{--bs-gutter-x:14px;--bs-gutter-y:14px;}
html[data-bs-theme="dark"] .vks-stat-card,.vks-stat-card{
  position:relative;overflow:hidden;
  background:linear-gradient(145deg,#12171d 0%,#10141a 100%) !important;
  border:1px solid var(--vks-line) !important;
  border-radius:var(--vks-radius) !important;
  box-shadow:none !important;
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.vks-stat-card:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--vks-red);opacity:.85;}
.vks-stat-grid .col-6:nth-child(2) .vks-stat-card:before,.vks-stat-grid .col-md-4:nth-child(2) .vks-stat-card:before{background:var(--vks-amber);}
.vks-stat-grid .col-6:nth-child(3) .vks-stat-card:before,.vks-stat-grid .col-md-4:nth-child(3) .vks-stat-card:before{background:var(--vks-blue);}
.vks-stat-grid .col-6:nth-child(4) .vks-stat-card:before{background:var(--vks-green);}
.vks-stat-card:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.13) !important;background:linear-gradient(145deg,#151b22,#11161c) !important;}
html[data-bs-theme="dark"] .vks-stat-label,.vks-stat-label{
  text-align:left !important;padding:15px 18px 0 !important;background:transparent !important;border:0 !important;color:#8e98a5 !important;font-size:.82rem;font-weight:700 !important;text-transform:uppercase;letter-spacing:.065em;
}
.vks-stat-body{position:relative;min-height:110px;padding:12px 18px 19px !important;text-align:left !important;display:flex;align-items:flex-end;justify-content:space-between;}
.vks-stat-body .fs-3{font-size:2.15rem !important;line-height:1;font-weight:800 !important;letter-spacing:-.045em;color:#f6f7f9;order:1;}
.vks-stat-icon{order:2;margin:0 !important;font-size:1.2rem !important;width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#1b2129;color:#7f8996 !important;border:1px solid var(--vks-line);}
.vks-stat-grid .col-6:nth-child(1) .vks-stat-icon{color:#ff6572 !important;background:rgba(255,54,71,.09);}
.vks-stat-grid .col-6:nth-child(2) .vks-stat-icon{color:#f3bf5b !important;background:rgba(241,184,75,.08);}
.vks-stat-grid .col-6:nth-child(3) .vks-stat-icon{color:#76adff !important;background:rgba(103,164,255,.08);}
.vks-stat-grid .col-6:nth-child(4) .vks-stat-icon{color:#45d99d !important;background:rgba(46,204,138,.08);}
.vks-stat-grid-secondary .vks-stat-card:before{background:#5c6672 !important;}

/* cards globally */
html[data-bs-theme="dark"] .card,.card{
  background:#10151b !important;border:1px solid var(--vks-line) !important;border-radius:var(--vks-radius) !important;box-shadow:none !important;
}
html[data-bs-theme="dark"] .card-header,.card-header{background:#0f1318 !important;border-bottom:1px solid var(--vks-line) !important;color:#d5dae0;}

/* recent tickets */
.vks-recent-card{overflow:hidden;}
.vks-section-head{padding:15px 18px !important;font-weight:750;font-size:.96rem;display:flex;align-items:center;justify-content:space-between;}
.vks-ticket-row{padding:15px 18px !important;background:transparent !important;border-color:var(--vks-line) !important;transition:background .14s ease;}
.vks-ticket-row:hover{background:rgba(255,255,255,.018) !important;}
.vks-ticket-row .fw-semibold{font-size:.98rem;color:#e9edf1;}
.vks-ticket-row .text-muted{color:#7f8995 !important;}
.vks-ticket-row .label-pill{color:#6f7884;font-size:.78rem;}
.vks-open-ticket{min-width:90px;}

/* badges */
.badge{border:0 !important;border-radius:999px !important;padding:.36em .66em;font-weight:750;}
.badge.text-bg-success,.bg-success{background:rgba(46,204,138,.16) !important;color:#6ee7b7 !important;}
.badge.text-bg-danger,.bg-danger{background:rgba(255,54,71,.16) !important;color:#ff7180 !important;}
.badge.text-bg-secondary,.bg-secondary{background:rgba(142,152,165,.14) !important;color:#aeb6c0 !important;}
.badge.bg-warning-subtle{background:rgba(241,184,75,.14) !important;color:#f4c96d !important;}

/* tables / admin pages */
.table-responsive{border:1px solid var(--vks-line);border-radius:14px;overflow:hidden;}
.table{--bs-table-bg:transparent !important;--bs-table-color:#cfd5dc !important;margin-bottom:0 !important;}
.table thead th{background:#0d1116 !important;color:#7f8995 !important;font-size:.76rem;text-transform:uppercase;letter-spacing:.055em;font-weight:750;border-color:var(--vks-line) !important;padding:.82rem .9rem;}
.table tbody td{border-color:var(--vks-line) !important;padding:.86rem .9rem;vertical-align:middle;}
.table-hover>tbody>tr:hover>*{background:rgba(255,255,255,.018) !important;color:#fff !important;}

/* forms */
.form-control,.form-select,.input-group-text,textarea.form-control{
  min-height:42px;background:#0d1217 !important;border:1px solid var(--vks-line-strong) !important;color:#e5e9ed !important;border-radius:10px !important;box-shadow:none !important;
}
.form-control::placeholder,textarea.form-control::placeholder{color:#59626e !important;}
.form-control:focus,.form-select:focus,textarea.form-control:focus{border-color:rgba(255,54,71,.5) !important;box-shadow:0 0 0 3px rgba(255,54,71,.08) !important;background:#0f141a !important;}
.form-check-input{background-color:#0e1318;border-color:#39414a;}
.form-check-input:checked{background-color:var(--vks-red);border-color:var(--vks-red);}

.alert{border-radius:13px !important;box-shadow:none !important;}
.list-group-item{background:#10151b;color:#dce1e6;border-color:var(--vks-line);}

.footer-bar{background:#080a0d !important;border-color:var(--vks-line) !important;}
.footer-bar .text-muted{color:#656e79 !important;}
.footer-bar a{color:#89929d;}

/* mobile */
@media(max-width:991.98px){
  .vks-topnav{min-height:64px;}
  .vks-topnav .navbar-collapse{padding:12px 0 6px;}
  .vks-topnav .navbar-nav{align-items:stretch !important;}
  .vks-topnav .nav-chip{width:100%;justify-content:flex-start;}
  .vks-topnav .lang-switch{width:max-content;margin-top:4px;}
  .vks-main>.container-fluid{padding-left:16px !important;padding-right:16px !important;}
  .vks-pagehead{align-items:flex-start !important;gap:14px;flex-direction:column;}
}
@media(max-width:575.98px){
  .vks-servicebar{font-size:.8rem;}
  .vks-page-title{font-size:1.45rem;}
  .vks-stat-body{min-height:96px;}
  .vks-stat-body .fs-3{font-size:1.8rem !important;}
}
