/*
 * KPT Assets Register - sidebar, header and dashboard theme.
 *
 * Loaded after style.css (CoreUI 3) and overrides it. The palette is the one
 * the app already used - brand green #008000 plus the CoreUI semantic colours -
 * so nothing here introduces a new hue.
 */

:root {
  --kpt-green: #008000;
  --kpt-green-deep: #005c00;
  --kpt-hover: rgba(255, 255, 255, 0.10);
  --kpt-active: rgba(255, 255, 255, 0.18);
  --kpt-idle-text: rgba(255, 255, 255, 0.82);
  --kpt-muted-text: rgba(255, 255, 255, 0.52);
}

/* ---------------------------------------------------------------- sidebar */

.c-sidebar {
  background: var(--kpt-green);
}

.c-sidebar-brand {
  flex: 0 0 56px;
  justify-content: flex-start;
  padding: 0 12px;
  background: var(--kpt-green-deep);
  color: #fff;
}

.kpt-brand-mark {
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  border-radius: 4px;
  background: #fff;
  color: var(--kpt-green-deep);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.kpt-brand-text {
  min-width: 0;
  margin-left: 10px;
  line-height: 1.2;
}

.kpt-brand-text .kpt-brand-name {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.kpt-brand-text .kpt-brand-sub {
  font-size: 10px;
  opacity: 0.72;
  line-height: 1.3;
  white-space: nowrap;
}

/* Nav rows ---------------------------------------------------------------- */

.c-sidebar .c-sidebar-nav-link,
.c-sidebar .c-sidebar-nav-dropdown-toggle {
  height: 38px;
  padding: 0 12px 0 0;
  color: var(--kpt-idle-text);
  font-size: 13.5px;
  font-weight: 400;
  background: transparent;
  transition: background 0.16s ease, color 0.16s ease;
}

/* The app previously jumped to near-black on hover; stay inside the palette. */
.c-sidebar .c-sidebar-nav-link:hover,
.c-sidebar .c-sidebar-nav-dropdown-toggle:hover {
  background: var(--kpt-hover) !important;
  color: #fff;
}

.c-sidebar .c-sidebar-nav-link.c-active,
.c-sidebar .c-sidebar-nav-link.c-active:hover {
  background: var(--kpt-active) !important;
  color: #fff;
  font-weight: 600;
  box-shadow: inset 3px 0 0 #fff;
}

.c-sidebar .c-sidebar-nav-dropdown.c-show {
  background: rgba(0, 0, 0, 0.10);
}

.c-sidebar .c-sidebar-nav-dropdown.c-show > .c-sidebar-nav-dropdown-toggle {
  color: #fff;
  font-weight: 600;
}

/* Child rows sit shallower than CoreUI's default and lose the icon gutter. */
.c-sidebar .c-sidebar-nav-dropdown-items .c-sidebar-nav-link {
  height: 34px;
  padding-left: 8px;
  font-size: 13px;
}

.c-sidebar .c-sidebar-nav-dropdown-items .c-sidebar-nav-icon {
  flex: 0 0 42px;
  opacity: 0.6;
}

.c-sidebar .c-sidebar-nav-dropdown-items .c-sidebar-nav-link.c-active .c-sidebar-nav-icon {
  opacity: 0.95;
}

.c-sidebar-nav-title {
  padding: 14px 16px 6px;
  margin-top: 0;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--kpt-muted-text);
}

.kpt-nav-badge {
  margin-left: auto;
  flex-shrink: 0;
  background: #f9b115;
  color: #2f2000;
  font-size: 10px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 10px;
  font-variant-numeric: tabular-nums;
}

/* Signed-in user, pinned to the bottom of the sidebar */

.kpt-sidebar-user {
  margin-top: auto;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.kpt-avatar {
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.22);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
}

.kpt-sidebar-user .kpt-user-name {
  font-size: 12px;
  font-weight: 600;
  color: #fff;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.kpt-sidebar-user .kpt-user-role {
  font-size: 10px;
  color: rgba(255, 255, 255, 0.68);
  line-height: 1.3;
}

/* Rail (minimized) state -------------------------------------------------- */

.c-sidebar-minimized .kpt-brand-text,
.c-sidebar-minimized .kpt-nav-badge,
.c-sidebar-minimized .kpt-sidebar-user > div:last-child {
  display: none;
}

.c-sidebar-minimized .c-sidebar-brand {
  justify-content: center;
  padding: 0;
}

.c-sidebar-minimized .kpt-sidebar-user {
  justify-content: center;
  padding: 10px 0;
}

/* ----------------------------------------------------------------- header */

.c-header.kpt-header {
  min-height: 56px;
  background: var(--kpt-green);
  color: #fff;
  border-bottom: 0;
}

.kpt-header .c-header-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba%28255,255,255,0.9%29' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.kpt-header .kpt-header-title {
  font-size: 15px;
  font-weight: 600;
}

.kpt-header .kpt-user-name {
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.25;
}

.kpt-header .kpt-user-role {
  font-size: 10.5px;
  opacity: 0.75;
  line-height: 1.25;
}

.kpt-subheader {
  min-height: 38px;
  background: #fff;
  border-bottom: 1px solid #d8dbe0;
  padding: 0 24px;
  display: flex;
  align-items: center;
}

.kpt-subheader .breadcrumb {
  margin: 0;
  padding: 0;
  background: transparent;
  font-size: 12.5px;
}

.kpt-subheader .breadcrumb-item,
.kpt-subheader .breadcrumb-item a {
  color: #768192;
}

.kpt-subheader .breadcrumb-item.active {
  color: #3c4b64;
  font-weight: 500;
}

/* -------------------------------------------------------------- dashboard */

.kpt-num {
  font-variant-numeric: tabular-nums;
}

.kpt-page-title {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.25;
}

.kpt-page-sub {
  font-size: 12.5px;
  color: #768192;
}

.kpt-hero {
  background: #321fdb;
  color: #fff;
  border: 0;
  border-radius: 0.25rem;
  height: 100%;
}

.kpt-hero .kpt-hero-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  opacity: 0.78;
}

.kpt-hero .kpt-hero-value {
  font-size: 34px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.18;
  margin-top: 6px;
}

.kpt-hero .kpt-hero-value small {
  font-size: 19px;
  font-weight: 600;
  opacity: 0.82;
}

.kpt-hero .kpt-hero-exact {
  font-size: 12px;
  opacity: 0.72;
}

.kpt-hero-split {
  background: rgba(255, 255, 255, 0.13);
  border-radius: 4px;
  padding: 8px 10px;
}

.kpt-hero-split .kpt-split-label {
  font-size: 10.5px;
  opacity: 0.78;
}

.kpt-hero-split .kpt-split-value {
  font-size: 14px;
  font-weight: 600;
}

.kpt-stat {
  height: 100%;
}

.kpt-stat .kpt-stat-icon {
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.kpt-stat .kpt-stat-icon .c-icon {
  width: 17px;
  height: 17px;
}

.kpt-stat .kpt-stat-label {
  font-size: 12.5px;
  color: #768192;
  font-weight: 500;
}

.kpt-stat .kpt-stat-value {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  margin-top: 12px;
}

.kpt-stat .kpt-stat-sub {
  font-size: 11.5px;
  color: #768192;
}

.kpt-tint-info    { background: #e6f2ff; color: #3399ff; }
.kpt-tint-success { background: #e5f7ec; color: #2eb85c; }
.kpt-tint-dark    { background: #ebedef; color: #636f83; }

.kpt-card-title {
  font-size: 14px;
  font-weight: 600;
}

.kpt-condition {
  border-left: 3px solid transparent;
  padding: 2px 0 2px 10px;
}

.kpt-condition .kpt-condition-label {
  font-size: 11.5px;
  color: #768192;
}

.kpt-condition .kpt-condition-value {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.kpt-bar-track {
  height: 6px;
  background: #ebedef;
  border-radius: 3px;
  overflow: hidden;
}

.kpt-bar-fill {
  height: 100%;
  border-radius: 3px;
}

.kpt-table th {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #768192;
  border-top: 0;
  border-bottom: 1px solid #d8dbe0;
  padding: 11px 12px 9px;
}

.kpt-table td {
  padding: 10px 12px;
  border-top: 1px solid #ebedef;
  font-size: 13px;
  vertical-align: middle;
}

.kpt-table tbody tr:hover {
  background: #f6f7f9;
}

.kpt-chip {
  font-size: 11px;
  font-weight: 600;
  background: #ebedef;
  color: #4f5d73;
  padding: 2px 8px;
  border-radius: 10px;
  white-space: nowrap;
}