/* Bar GMT HRGA - sama persis dengan bar GMT PLANT (navy + garis emas). */
:root {
  /* Font mengikuti FLEETMAN */
  --plant-font-sans: 'Inter','SF Pro Text',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --plant-font-display: 'Inter','SF Pro Display',-apple-system,sans-serif;
  --plant-font-mono: 'JetBrains Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --pb-h: 46px;
  --pb-navy: #071a35;
  --pb-navy-2: #16355f;
  --pb-gold: #f5b800;
  --pb-gold-2: #ffc61a;
  --pb-ink: #102847;
  --pb-muted: #5b6b82;
  --pb-border: #e0e6ee;
  --pb-danger: #b42318;
  --pb-ok: #3f7a1c;
}

body.plant-has-bar { padding-top: var(--pb-h); }

.plant-bar {
  position: fixed; inset: 0 0 auto 0; height: var(--pb-h); z-index: 1000;
  display: flex; align-items: center; gap: 18px; padding: 0 14px 0 12px;
  background: var(--pb-navy); color: #fff;
  border-bottom: 2px solid var(--pb-gold);
  font: 500 13px/1 var(--plant-font-sans); font-feature-settings: 'ss01', 'cv11';
}
.plant-bar a { color: inherit; text-decoration: none; }
.pb-brand { display: flex; align-items: center; gap: 9px; flex-shrink: 0; }
.pb-brand img { width: 26px; height: 26px; }
.pb-brand b { font: 700 15px/1 var(--plant-font-display); letter-spacing: -.01em; }
.pb-brand b span { color: var(--pb-gold); }

.pb-tabs { display: flex; align-items: stretch; height: 100%; gap: 2px; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.pb-tabs::-webkit-scrollbar { display: none; }
.pb-tab {
  display: flex; align-items: center; gap: 7px; padding: 0 12px; white-space: nowrap;
  color: rgba(255, 255, 255, .72); border-bottom: 3px solid transparent; margin-bottom: -2px;
}
.pb-tab svg { width: 16px; height: 16px; flex-shrink: 0; }
.pb-tab:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.pb-tab:focus-visible { outline: 2px solid var(--pb-gold); outline-offset: -2px; }
.pb-tab.active { color: #fff; border-bottom-color: var(--pb-gold); font-weight: 600; }

.pb-right { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.pb-user { position: relative; }
.pb-user-btn {
  display: flex; align-items: center; gap: 8px; height: 32px; padding: 0 8px 0 4px;
  background: none; border: 1px solid transparent; border-radius: 6px; color: #fff; font: inherit; cursor: pointer;
}
.pb-user-btn:hover, .pb-user.open .pb-user-btn { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .12); }
.pb-user-btn:focus-visible { outline: 2px solid var(--pb-gold); outline-offset: 1px; }
.pb-avatar {
  width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center;
  background: var(--pb-gold); color: var(--pb-navy); font-weight: 800; font-size: 12px;
}
.pb-user-name { max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-caret { width: 12px; height: 12px; opacity: .7; }
.pb-menu {
  position: absolute; right: 0; top: calc(100% + 6px); min-width: 250px; display: none;
  background: #fff; color: var(--pb-ink); border: 1px solid var(--pb-border); border-radius: 8px;
  box-shadow: 0 16px 40px rgba(7, 26, 53, .18); padding: 6px; font-weight: 400;
}
.pb-user.open .pb-menu { display: block; }
.pb-menu-head { padding: 8px 10px 10px; border-bottom: 1px solid var(--pb-border); margin-bottom: 4px; }
.pb-menu-head b { display: block; font-size: 14px; }
.pb-menu-head span { color: var(--pb-muted); font-size: 12px; word-break: break-all; }
.pb-roles { margin-top: 8px; display: flex; flex-direction: column; gap: 3px; font-size: 12px; color: var(--pb-muted); }
.pb-roles div { display: flex; justify-content: space-between; gap: 10px; }
.pb-roles b { color: var(--pb-ink); font-weight: 600; font-size: 12px; display: inline; }
.pb-menu button, .pb-menu a {
  display: flex; width: 100%; align-items: center; gap: 9px; padding: 8px 10px; border-radius: 5px;
  background: none; border: 0; font: inherit; font-size: 13px; color: var(--pb-ink); cursor: pointer; text-align: left;
}
.pb-menu button:hover, .pb-menu a:hover { background: #f1f4f9; }
.pb-menu button:focus-visible, .pb-menu a:focus-visible { outline: 2px solid var(--pb-navy-2); outline-offset: -2px; }
.pb-menu svg { width: 16px; height: 16px; color: var(--pb-muted); }
.pb-menu .pb-sep { height: 1px; background: var(--pb-border); margin: 4px 0; }

/* Dialog Ganti Password */
.pb-dialog-back {
  position: fixed; inset: 0; background: rgba(7, 26, 53, .45); z-index: 1100;
  display: grid; place-items: center; padding: 16px;
}
.pb-dialog {
  width: 100%; max-width: 400px; background: #fff; color: var(--pb-ink); border-radius: 10px;
  box-shadow: 0 24px 60px rgba(7, 26, 53, .3); font: 400 13px/1.5 var(--plant-font-sans); font-feature-settings: 'ss01', 'cv11';
}
.pb-dialog h2 { margin: 0; padding: 16px 18px 4px; font: 700 17px/1.3 var(--plant-font-display); letter-spacing: -.02em; }
.pb-dialog p.pb-note { margin: 0; padding: 0 18px 8px; color: var(--pb-muted); font-size: 13px; }
.pb-dialog form { padding: 8px 18px 18px; display: flex; flex-direction: column; gap: 12px; }
.pb-dialog label { display: flex; flex-direction: column; gap: 5px; font-size: 13px; font-weight: 600; }
.pb-dialog input {
  font: inherit; font-weight: 400; padding: 8px 10px; border: 1px solid #cfd8e4; border-radius: 6px; width: 100%;
}
.pb-dialog input:focus { outline: 2px solid rgba(245, 184, 0, .5); border-color: var(--pb-gold); }
.pb-msg { min-height: 18px; margin: 0; font-size: 13px; color: var(--pb-danger); }
.pb-msg.ok { color: var(--pb-ok); font-weight: 600; }
.pb-actions { display: flex; justify-content: flex-end; gap: 8px; }
.pb-btn {
  font: 600 13px/1 "Inter", sans-serif; padding: 9px 14px; border-radius: 6px; cursor: pointer;
  border: 1px solid #cfd8e4; background: #fff; color: var(--pb-ink);
}
.pb-btn.primary { background: var(--pb-navy-2); border-color: var(--pb-navy-2); color: #fff; }
.pb-btn.primary:hover { background: var(--pb-navy); }
.pb-btn:disabled { opacity: .6; cursor: default; }
.pb-btn.primary.danger { background: var(--pb-danger); border-color: var(--pb-danger); }
.pb-btn.primary.danger:hover { background: #8f1c13; }
.pb-btn:focus-visible { outline: 2px solid var(--pb-gold); outline-offset: 2px; }
.pb-ask-msg { margin: 0; white-space: pre-line; font-size: 14px; color: var(--pb-ink); }
.pb-dialog form .pb-ask-msg + label { margin-top: 2px; }

/* Tombol mata pada field password (dipakai di semua halaman GMT PLANT) */
.pw-wrap { position: relative; display: block; width: 100%; }
.pw-wrap > input { padding-right: 38px !important; width: 100%; }
.pw-eye {
  position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
  width: 30px; height: 30px; display: grid; place-items: center; padding: 0;
  background: none; border: 0; border-radius: 5px; color: #6b7a90; cursor: pointer;
}
.pw-eye:hover { color: var(--pb-ink); background: rgba(16, 40, 71, .06); }
.pw-eye:focus-visible { outline: 2px solid var(--pb-navy-2); outline-offset: 0; }
.pw-eye svg { width: 18px; height: 18px; }

@media (max-width: 720px) {
  .pb-brand b { display: none; }
  .pb-user-name { display: none; }
  .pb-tab span { display: none; }
}

/* Chip modul baru (manifest.badge): kecil, agak naik seperti pangkat, oranye muda */
.pb-new {
  position: relative; top: -7px; overflow: hidden; display: inline-flex; align-items: center; margin-left: 3px; padding: 1px 4px;
  border-radius: 3px; background: #ffe2c4; color: #c2410c;
  font: 800 7.5px/1.2 var(--plant-font-sans); font-style: normal; letter-spacing: .06em; vertical-align: middle;
}
.pb-new::after {
  content: ''; position: absolute; inset: 0; transform: translateX(-120%);
  background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .8) 50%, transparent 70%);
  animation: pb-shine 3.2s ease-in-out infinite;
}
h2 .pb-new { top: -10px; font-size: 8.5px; }
@keyframes pb-shine { 0%, 55% { transform: translateX(-120%); } 85%, 100% { transform: translateX(120%); } }
@media (prefers-reduced-motion: reduce) { .pb-new::after { animation: none; } }