/* =====================================================================
   LDP / JPM Learning Center — UI Fix v8.0
   Perbaikan komposisi tampilan: header web profil (logo terlihat jelas)
   dan penyederhanaan Panel Admin (tabel, aksi, navigasi).
   Berkas ini dimuat PALING AKHIR sehingga menimpa gaya sebelumnya.
   ===================================================================== */

:root {
  --jpm-burgundy: #7A1220;
  --jpm-red:      #C8102E;
  --jpm-gold:     #C9A227;
  --jpm-navy:     #0B1F3B;
  --jpm-line:     #e6e9f0;
}

/* =====================================================================
   1) HEADER WEB PROFIL — latar terang agar logo JPM terbaca
   ===================================================================== */
body.v6-public .v6-header {
  position: sticky;
  top: 0;
  z-index: 80;
  background: #ffffff;
  border-bottom: 1px solid var(--jpm-line);
  box-shadow: 0 10px 26px -24px rgba(11, 31, 59, .55);
}
body.v6-public .v6-header::after {
  content: "";
  display: block;
  height: 3px;
  background: linear-gradient(90deg, var(--jpm-burgundy), var(--jpm-red) 55%, var(--jpm-gold));
}
body.v6-public .v6-header-in {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  min-height: 84px;
}
body.v6-public .v6-brand {
  display: flex;
  align-items: center;
  gap: .85rem;
  min-width: 0;
  color: var(--jpm-navy);
}
body.v6-public .v6-brand img {
  max-height: 56px;
  width: auto;
  display: block;
  background: #fff;
  padding: 2px;
  border-radius: 8px;
}
body.v6-public .v6-brand-text strong {
  color: var(--jpm-navy);
  font-size: 1.08rem;
  font-weight: 800;
  letter-spacing: -.01em;
}
body.v6-public .v6-brand-text small { color: #6b7386; }
body.v6-public .v6-brand-mark {
  background: linear-gradient(140deg, var(--jpm-burgundy), var(--jpm-red));
  color: #fff;
}

body.v6-public .v6-nav { gap: .2rem; }
body.v6-public .v6-nav a.v6-link {
  color: #33405a;
  font-weight: 600;
  border-radius: 10px;
  padding: .55rem .9rem;
}
body.v6-public .v6-nav a.v6-link:hover {
  background: rgba(122, 18, 32, .07);
  color: var(--jpm-burgundy);
}
body.v6-public .v6-nav a.v6-link.is-active {
  background: rgba(122, 18, 32, .10);
  color: var(--jpm-burgundy);
  box-shadow: inset 0 -2px 0 var(--jpm-gold);
}
body.v6-public .v6-nav .v6-cta.btn-gold {
  background: linear-gradient(135deg, var(--jpm-burgundy), var(--jpm-red));
  color: #fff;
  border: 0;
  font-weight: 700;
  padding: .62rem 1.1rem;
  box-shadow: 0 12px 26px -18px rgba(122, 18, 32, .9);
}
body.v6-public .v6-burger span { background: var(--jpm-navy); }

@media (max-width: 900px) {
  body.v6-public .v6-header-in { min-height: 72px; }
  body.v6-public .v6-brand img { max-height: 44px; }
  body.v6-public .v6-nav {
    inset: 75px 0 auto 0;
    background: #fff;
    border-bottom: 1px solid var(--jpm-line);
    box-shadow: 0 18px 40px -28px rgba(11, 31, 59, .8);
  }
}

/* Sidebar app karyawan: logo juga perlu kontras di latar gelap */
.v6-side-brand img { max-height: 42px; width: auto; background: #fff; padding: 4px 6px; border-radius: 8px; }

/* =====================================================================
   2) PANEL ADMIN — sidebar lebih ringkas & mudah dipindai
   ===================================================================== */
body.admin { --adm-side-w: 256px; }

.adm-brand img { max-height: 40px; background: #fff; padding: 4px 6px; border-radius: 8px; }

.adm-navsearch { padding: .6rem .75rem 0; }
.adm-navsearch input {
  width: 100%;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, .16);
  background: rgba(255, 255, 255, .08);
  color: #fff;
  padding: .5rem .7rem;
  font-size: .82rem;
}
.adm-navsearch input::placeholder { color: rgba(255, 255, 255, .55); }
.adm-navsearch input:focus { outline: 2px solid var(--jpm-gold); outline-offset: 1px; }

#adm-nav .nav-group {
  font-size: .66rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  opacity: .62;
  margin: .85rem .75rem .25rem;
}
#adm-nav a {
  padding: .5rem .75rem;
  font-size: .855rem;
  border-radius: 9px;
  gap: .55rem;
}
#adm-nav a.active { box-shadow: inset 3px 0 0 var(--jpm-gold); }
#adm-nav a[hidden] { display: none !important; }

/* =====================================================================
   3) PANEL ADMIN — tabel rapi, tidak terpotong
   ===================================================================== */
.adm-content .table-wrap {
  overflow-x: auto;
  border: 1px solid var(--jpm-line);
  border-radius: 12px;
  background: #fff;
}
.adm-content table.data,
.adm-content table.table {
  width: 100%;
  border-collapse: collapse;
  font-size: .875rem;
}
.adm-content table.data th,
.adm-content table.table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f6f8fc;
  font-size: .7rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #5b6379;
  white-space: nowrap;
  padding: .7rem .8rem;
}
.adm-content table.data td,
.adm-content table.table td {
  padding: .7rem .8rem;
  vertical-align: middle;
  border-top: 1px solid var(--jpm-line);
}
.adm-content table.data tbody tr:hover,
.adm-content table.table tbody tr:hover { background: #fafbfe; }

/* Kolom aksi: tombol kecil sejajar, tidak menumpuk besar-besar */
.adm-content table td:last-child { white-space: nowrap; }
.adm-content table td .btn,
.adm-content table td button,
.adm-content table td form { display: inline-flex; }
.adm-content table td .btn {
  min-height: 30px;
  padding: .28rem .62rem;
  font-size: .76rem;
  border-radius: 8px;
  margin: .12rem .18rem .12rem 0;
}
.adm-content table td form { margin: 0; }

/* Badge status seragam */
.adm-content .pill,
.adm-content .badge {
  font-size: .68rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-weight: 700;
}

/* Panel & toolbar lebih tenang */
.adm-content .adm-panel {
  border: 1px solid var(--jpm-line);
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(11, 31, 59, .04);
}
.adm-content .toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
}
.adm-content .toolbar input[type="search"],
.adm-content .toolbar input[type="text"] { min-width: 200px; }

/* Header atas admin tetap terlihat saat menggulir */
.adm-top {
  position: sticky;
  top: 0;
  z-index: 40;
  background: #fff;
  border-bottom: 1px solid var(--jpm-line);
}

@media (max-width: 720px) {
  .adm-content table.data th,
  .adm-content table.table th { position: static; }
  .adm-content .table-wrap > table { min-width: 640px; }
}