body {
  margin:0;
  font-family:"Manrope", "Segoe UI", Tahoma, sans-serif;
  background:#f4f6f9;
}

.auth-boot-screen {
  position:fixed;
  inset:0;
  z-index:2100;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    radial-gradient(circle at 14% 10%, rgba(198,168,75,0.22), transparent 36%),
    radial-gradient(circle at 90% 90%, rgba(198,168,75,0.12), transparent 38%),
    linear-gradient(135deg, #16372d, #234a3c 48%, #183c31);
}

.auth-boot-card {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  padding:24px 22px 20px;
  border:1px solid rgba(210,230,220,0.3);
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,0.1), rgba(255,255,255,0.04));
  backdrop-filter:blur(8px);
  box-shadow:0 24px 48px rgba(5,15,12,0.34);
}

.auth-boot-logo {
  width:54px;
  height:54px;
  object-fit:contain;
  filter:drop-shadow(0 6px 14px rgba(0,0,0,0.22));
}

.auth-boot-spinner {
  width:30px;
  height:30px;
  border-radius:50%;
  border:3px solid rgba(255,255,255,0.22);
  border-top-color:#C6A84B;
  animation:authBootSpin 0.82s linear infinite;
}

.auth-boot-message {
  color:#eaf5f0;
  font-size:13px;
  font-weight:700;
  letter-spacing:0.25px;
}

@keyframes authBootSpin {
  to { transform:rotate(360deg); }
}

*,
*::before,
*::after {
  box-sizing:border-box;
}

/* LOGIN */
.login-container {
  display:flex;
  justify-content:center;
  align-items:center;
  height:100vh;
  background:radial-gradient(circle at 16% 8%, rgba(198,168,75,0.28), transparent 38%),
             radial-gradient(circle at 88% 90%, rgba(255,255,255,0.12), transparent 42%),
             linear-gradient(130deg,#16372d,#255143 50%,#1a3e33);
  position:relative;
  overflow:hidden;
  animation:loginBgShift 16s ease-in-out infinite alternate;
}

.login-container::before {
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,0.2);
  top:-165px;
  right:-120px;
  animation:floatOrbOne 10s ease-in-out infinite;
}

.login-container::after {
  content:"";
  position:absolute;
  width:310px;
  height:310px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,0.14);
  bottom:-150px;
  left:-90px;
  animation:floatOrbTwo 12s ease-in-out infinite;
}

.login-card {
  background:linear-gradient(180deg, rgba(255,255,255,0.99), rgba(247,250,248,0.98));
  backdrop-filter: blur(7px);
  padding:40px 36px 30px;
  width:min(92vw, 456px);
  text-align:center;
  border:1px solid rgba(198,168,75,0.52);
  border-radius:22px;
  box-shadow:0 30px 62px rgba(6,19,15,0.34);
  position:relative;
  z-index:2;
  overflow:hidden;
  animation:loginCardIn 0.8s cubic-bezier(.22,.61,.36,1) both;
}

.login-card::before {
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:10px;
  background:linear-gradient(90deg,#C6A84B 0%,#d9bf6f 45%,#C6A84B 100%);
}

.login-card::after {
  content:"";
  position:absolute;
  width:220px;
  height:220px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 35%, rgba(198,168,75,0.16), rgba(198,168,75,0));
  top:-145px;
  right:-115px;
}

.login-logo img {
  height:64px;
  margin-bottom:6px;
  filter:drop-shadow(0 5px 12px rgba(30,55,45,0.16));
  animation:logoPulse 3.2s ease-in-out infinite;
}

.login-title {
  margin:0 0 14px;
  color:#173a2f;
  font-family:"Cormorant Garamond", "Manrope", serif;
  font-size:42px;
  font-weight:700;
  letter-spacing:0.6px;
  line-height:0.96;
  text-transform:none;
  animation:titleFadeIn 0.65s ease-out both;
  animation-delay:0.08s;
}

#email {
  font-family:"Orbitron", "Manrope", sans-serif;
  letter-spacing:0.8px;
}

.login-subtitle {
  margin:0 auto 14px;
  color:#5a6a64;
  font-size:13px;
  max-width:280px;
  line-height:1.4;
  font-weight:600;
  letter-spacing:0.2px;
}

.remember-wrap {
  margin-top:8px;
  margin-bottom:4px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  color:#355046;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  user-select:none;
}

.remember-wrap input[type="checkbox"] {
  width:16px;
  height:16px;
  margin:0;
  accent-color:#2E5E4E;
  cursor:pointer;
}

.login-card input {
  padding:14px 12px;
  border:1px solid #cfdcd6;
  border-radius:12px;
  margin:7px 0;
  background:#f9fcfb;
  transition:border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.login-input-group {
  position:relative;
  margin:8px 0;
  animation:fieldFadeUp 0.55s ease both;
}

.login-input-group:nth-of-type(1) {
  animation-delay:0.14s;
}

.login-input-group:nth-of-type(2) {
  animation-delay:0.22s;
}

.login-input-group input {
  margin:0;
  padding-left:42px;
}

.login-input-icon {
  position:absolute;
  left:13px;
  top:50%;
  transform:translateY(-50%);
  width:18px;
  height:18px;
  color:#607872;
  pointer-events:none;
}

.login-input-icon svg {
  width:100%;
  height:100%;
}

.password-toggle {
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  width:34px;
  height:34px;
  border:none;
  border-radius:10px;
  background:transparent;
  color:#5d746e;
  cursor:pointer;
}

.password-toggle:hover {
  background:#edf3f0;
  color:#304c43;
}

.password-toggle svg {
  width:18px;
  height:18px;
}

.password-group input {
  padding-right:44px;
}

.login-card input::placeholder {
  color:#7b8a84;
}

.login-card input:focus {
  border-color:#2E5E4E;
  outline:none;
  background:#fff;
  box-shadow:0 0 0 3px rgba(46,94,78,0.15);
}

.login-card .primary {
  width:100%;
  margin-top:12px;
  padding:13px;
  border-radius:12px;
  border:1px solid #22483b;
  background:linear-gradient(135deg,#1f4c3e,#2E5E4E);
  font-weight:700;
  letter-spacing:0.25px;
  box-shadow:0 10px 20px rgba(32,75,62,0.32);
  transition:transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease;
  position:relative;
  overflow:hidden;
}

.login-card .primary::after {
  content:"";
  position:absolute;
  top:0;
  left:-140%;
  width:120%;
  height:100%;
  background:linear-gradient(105deg, transparent 20%, rgba(255,255,255,0.28) 50%, transparent 80%);
  pointer-events:none;
}

.login-card .primary:hover {
  transform:translateY(-1px);
  box-shadow:0 14px 24px rgba(32,75,62,0.36);
  filter:brightness(1.03);
}

.login-card .primary:hover::after {
  animation:btnSweep 0.7s ease;
}

.login-card .primary:active {
  transform:translateY(0);
}

.login-divider {
  position:relative;
  margin:14px 0 10px;
  height:18px;
}

.login-divider::before {
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:50%;
  border-top:1px solid #d8e2dd;
  transform:translateY(-50%);
}

.login-divider span {
  position:relative;
  z-index:1;
  padding:0 10px;
  font-size:12px;
  color:#6c7b75;
  text-transform:uppercase;
  background:rgba(255,255,255,0.97);
}

.login-google-btn {
  width:100%;
  border:1px solid #d2ddd8;
  background:#ffffff;
  color:#263a33;
  border-radius:12px;
  padding:12px;
  font-weight:700;
  cursor:pointer;
  transition:background 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
}

.login-google-btn:hover {
  background:#f5f8f6;
  border-color:#bfcdc7;
  transform:translateY(-1px);
}

.login-google-btn:active {
  transform:translateY(0);
}

.login-footnote {
  margin:16px 0 0;
  padding-top:12px;
  border-top:1px dashed #dbe4e0;
  font-size:11px;
  color:#667771;
  letter-spacing:0.5px;
  text-transform:uppercase;
}

input, select, textarea {
  width:100%;
  padding:10px;
  margin:8px 0;
  border:1px solid #ccc;
}

button.primary {
  background:#2E5E4E;
  color:white;
  border:none;
  padding:10px;
  cursor:pointer;
}

button {
  font-family:"Orbitron", "Manrope", sans-serif;
}

button.primary:hover {
  background:#234A3D;
}

/* HEADER */
.top-header {
  height:68px;
  background:linear-gradient(180deg, rgba(255,255,255,0.95), rgba(244,249,246,0.92));
  backdrop-filter:blur(14px);
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:0 20px;
  border-bottom:1px solid #d5e2db;
  position:sticky;
  top:0;
  z-index:1200;
  box-shadow:0 8px 22px rgba(14,39,30,0.08);
}

.left-header {
  display:flex;
  align-items:center;
  gap:8px;
}

.header-menu-group {
  display:inline-flex;
  align-items:center;
  gap:0;
  padding:3px;
  background:rgba(255,255,255,0.9);
  border:1px solid #d6e4dd;
  border-radius:14px;
  box-shadow:0 6px 16px rgba(18,46,36,0.1);
}

.logo { height:38px; }

.logo-home-link {
  cursor:pointer;
}

.app-heading {
  display:flex;
  align-items:center;
}

.app-title {
  font-size:15px;
  font-weight:700;
  color:#1f4034;
  letter-spacing:0.15px;
}

.menu-toggle {
  width:36px;
  height:36px;
  border:1px solid #d7e5de;
  border-radius:10px;
  background:#ffffff;
  color:#1f4034;
  box-shadow:0 3px 10px rgba(16,44,34,0.09);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.menu-toggle:hover {
  border-color:#c2d6cc;
  background:#f7fbf9;
  box-shadow:0 6px 16px rgba(16,44,34,0.12);
}

.menu-toggle:active {
  transform:translateY(0);
}

.menu-toggle-lines {
  width:15px;
  height:11px;
  display:inline-flex;
  flex-direction:column;
  justify-content:space-between;
}

.menu-toggle-lines span {
  height:1.8px;
  border-radius:10px;
  background:#214a3c;
  transform-origin:center;
  transition:transform 0.22s ease, opacity 0.22s ease;
}

.menu-toggle.menu-toggle-open .menu-toggle-lines span:nth-child(1) {
  transform:translateY(6px) rotate(45deg);
}

.menu-toggle.menu-toggle-open .menu-toggle-lines span:nth-child(2) {
  opacity:0;
}

.menu-toggle.menu-toggle-open .menu-toggle-lines span:nth-child(3) {
  transform:translateY(-6px) rotate(-45deg);
}

.header-right {
  display:flex;
  align-items:center;
  gap:8px;
}

.settings-menu-wrap {
  position:relative;
}

.settings-menu-btn {
  width:34px;
  height:34px;
  border-radius:999px;
  border:1px solid #c7d8cf;
  background:#f3f8f5;
  color:#23493c;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
  transition:border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.settings-menu-btn svg {
  width:17px;
  height:17px;
}

.settings-menu-btn:hover {
  border-color:#9fb9ad;
  box-shadow:0 0 0 3px rgba(46,94,78,0.12);
}

.settings-menu-btn:active {
  transform:translateY(1px);
}

.profile-avatar-wrap {
  display:flex;
  align-items:center;
  position:relative;
}

.profile-avatar-btn {
  width:34px;
  height:34px;
  border-radius:999px;
  border:1px solid #c7d8cf;
  background:#f3f8f5;
  color:#23493c;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  cursor:pointer;
  padding:0;
  flex-shrink:0;
  transition:border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.profile-avatar-btn:hover {
  border-color:#9fb9ad;
  box-shadow:0 0 0 3px rgba(46,94,78,0.12);
}

.profile-avatar-btn:active {
  transform:translateY(1px);
}

.profile-avatar-large {
  width:108px;
  height:108px;
  border-width:2px;
  border-color:#a9c4b8;
  box-shadow:0 8px 22px rgba(18,52,40,0.2);
}

#profileAvatarImg,
#profilePageAvatarImg {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  border-radius:inherit;
  display:block;
}

#profilePageAvatarImg {
  transform:scale(1.03);
}

#profileAvatarFallback,
#profilePageAvatarFallback {
  font-size:12px;
  font-weight:700;
  letter-spacing:0.4px;
}

.profile-card {
  background:
    radial-gradient(circle at 88% 6%, rgba(198,168,75,0.2), transparent 34%),
    radial-gradient(circle at 2% 96%, rgba(46,94,78,0.11), transparent 34%),
    linear-gradient(145deg, #ffffff 0%, #f7fbf9 52%, #f5faf7 100%);
  border:1px solid #d9e7e0;
  border-radius:18px;
  box-shadow:0 18px 34px rgba(18,45,35,0.09);
  padding:16px;
}

.profile-hero {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
  padding:4px 4px 16px;
  border-bottom:1px solid #dfeae5;
  margin-bottom:16px;
}

.profile-avatar-block {
  display:flex;
  align-items:center;
  gap:14px;
  background:linear-gradient(145deg, #ffffff, #f4f8f6);
  border:1px solid #d9e5df;
  border-radius:14px;
  padding:10px 12px;
  box-shadow:0 8px 20px rgba(16,41,32,0.08);
}

.profile-avatar-actions {
  display:flex;
  flex-direction:column;
  gap:6px;
}

.profile-grid {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px 12px;
}

.profile-field-full {
  grid-column:1 / -1;
}

.profile-grid .field-group input {
  background:#fbfefd;
  border-color:#cfe0d8;
  border-radius:12px;
  min-height:44px;
  font-weight:600;
  color:#2d4b40;
}

.profile-grid .field-group input:disabled {
  color:#3f534b;
  opacity:1;
}

.profile-actions {
  margin-top:12px;
}

#profile .profile-card h3 {
  margin:0 0 6px;
  font-family:"Orbitron", "Manrope", sans-serif;
  letter-spacing:0.5px;
  font-size:28px;
  color:#163d31;
}

#profile .profile-card .muted {
  color:#5a6e66;
  font-weight:500;
}

#profilePhotoHint {
  font-size:12px;
  color:#6b7f77;
  line-height:1.35;
  max-width:220px;
}

#profile .profile-actions .modal-btn {
  min-width:124px;
}

.profile-menu {
  position:absolute;
  right:0;
  top:40px;
  min-width:140px;
  background:#ffffff;
  border:1px solid #d2e1d9;
  border-radius:10px;
  box-shadow:0 12px 22px rgba(21,48,38,0.16);
  padding:6px;
  z-index:1200;
}

.profile-menu-item {
  width:100%;
  border:none;
  border-radius:8px;
  background:transparent;
  color:#214a3c;
  font-size:13px;
  text-align:left;
  padding:8px 10px;
  cursor:pointer;
}

.profile-menu-item:hover {
  background:#edf4f1;
}

.session-badge {
  display:flex;
  align-items:center;
  gap:6px;
  background:rgba(242,248,245,0.96);
  border:1px solid #d2e1d9;
  border-radius:999px;
  padding:6px 10px;
}

.session-label {
  font-size:12px;
  color:#56645e;
}

.session-role {
  font-size:12px;
  font-weight:700;
  color:#1f4034;
  text-transform:capitalize;
}

/* LAYOUT */
.container {
  display:flex;
  min-height:calc(100vh - 76px);
  align-items:stretch;
  position:relative;
}

.sidebar {
  width:272px;
  background:linear-gradient(180deg,#f8fbf9 0%, #f2f7f4 100%);
  padding:16px 12px;
  border-right:1px solid #d5e2dc;
  min-height:100%;
  transition:width 0.25s ease, padding 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
  overflow-x:hidden;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  box-shadow:inset -1px 0 0 #ffffff, 8px 0 20px rgba(20,47,37,0.08);
}

@media (min-width:769px){
  .sidebar {
    position:sticky;
    top:68px;
    height:calc(100vh - 68px);
    align-self:flex-start;
  }
}

.sidebar-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  margin-bottom:12px;
}

.sidebar-brand {
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.sidebar-logo {
  width:auto;
  height:42px;
  max-width:170px;
  object-fit:contain;
}

.sidebar-brand-text {
  color:#1f4034;
  font-family:"Orbitron", "Manrope", sans-serif;
  letter-spacing:0.8px;
  font-size:13px;
  font-weight:700;
  white-space:nowrap;
}

.sidebar-close {
  width:36px;
  height:36px;
  border:1px solid #d3e0da;
  background:#ffffff;
  color:#2d4c42;
  border-radius:8px;
  cursor:pointer;
  font-size:15px;
}

.sidebar-close:hover {
  background:#f1f6f3;
}

.nav-btn {
  width:100%;
  padding:12px 14px;
  background:transparent;
  border:1px solid transparent;
  color:#2b443a;
  text-align:left;
  cursor:pointer;
  border-radius:12px;
  font-weight:600;
  font-size:14px;
  margin-bottom:8px;
  transition:background 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
  white-space:nowrap;
  display:flex;
  align-items:center;
}

.nav-btn.has-counter {
  justify-content:space-between;
}

.nav-btn:hover {
  background:#edf4f0;
  border-color:#d8e5de;
  transform:translateX(1px);
}

.nav-btn.active {
  background:#dbeee5;
  color:#163d31;
  border-color:#bfd9cb;
  box-shadow:0 3px 10px rgba(27,67,51,0.1);
}

.nav-counter {
  min-width:22px;
  height:22px;
  padding:0 7px;
  border-radius:999px;
  background:#2f6b55;
  color:#ffffff;
  border:1px solid #275745;
  font-size:11px;
  font-weight:700;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}

.nav-btn.has-notify {
  border-color:#bfd9cb;
}

.danger-nav {
  margin-top:6px;
  border-color:#f2cece;
  color:#8d3232;
  background:#fff8f8;
}

.danger-nav:not(.active) {
  color:#8d3232;
}

.sidebar-bottom {
  margin-top:auto;
  padding-top:10px;
  border-top:1px solid #dce7e2;
  padding-bottom:8px;
  position:sticky;
  bottom:0;
  z-index:5;
  background:linear-gradient(180deg, rgba(242,247,244,0.7) 0%, rgba(242,247,244,0.96) 32%, #f2f7f4 100%);
  backdrop-filter:blur(3px);
}

.nav-logout-btn {
  background:#ffffff;
  border-color:#d2e0d9;
}

.nav-submenu-group {
  margin-bottom:8px;
}

.nav-submenu-toggle {
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.nav-submenu-label {
  display:flex;
  align-items:center;
  gap:8px;
}

.nav-submenu-icon {
  width:18px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#2b4f41;
  transition:transform 0.2s ease, filter 0.2s ease;
}

.nav-submenu-icon svg {
  width:100%;
  height:100%;
}

.nav-submenu-caret {
  font-size:12px;
  color:#507065;
  transition:transform 0.22s ease;
}

.nav-submenu-items {
  display:grid;
  gap:6px;
  padding-left:10px;
  margin-top:6px;
  max-height:0;
  opacity:0;
  overflow:hidden;
  transform:translateY(-4px);
  transition:max-height 0.24s ease, opacity 0.22s ease, transform 0.22s ease;
}

.nav-submenu-group.open .nav-submenu-items {
  max-height:140px;
  opacity:1;
  transform:translateY(0);
}

.nav-submenu-group.open .nav-submenu-caret {
  transform:rotate(180deg);
}

.nav-sub-btn {
  padding:10px 12px;
  margin-bottom:0;
  border-radius:10px;
  font-size:13px;
  background:#ffffff;
  border-color:#dde8e3;
}

.nav-item-content {
  display:inline-flex;
  align-items:center;
  gap:10px;
}

.nav-item-icon {
  width:18px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:inherit;
  flex:0 0 auto;
  transform:translateZ(0);
  transition:transform 0.24s ease, filter 0.24s ease;
}

.nav-item-icon svg {
  width:100%;
  height:100%;
  transform-origin:center;
  transition:transform 0.24s ease;
}

.nav-btn:hover .nav-item-icon {
  transform:translateY(-1px) scale(1.08);
  filter:drop-shadow(0 4px 8px rgba(32,79,63,0.22));
}

.nav-btn:hover .nav-item-icon svg {
  animation:navIconNudge 0.46s ease;
}

.nav-btn.active .nav-item-icon {
  transform:scale(1.06);
  filter:drop-shadow(0 4px 10px rgba(24,64,50,0.24));
}

.nav-submenu-toggle:hover .nav-submenu-icon {
  transform:translateY(-1px) rotate(-8deg) scale(1.1);
  filter:brightness(1.1);
}

.nav-sub-btn:hover .nav-item-icon {
  transform:translateX(1px) scale(1.08);
}

@keyframes navIconNudge {
  0% { transform:scale(1) rotate(0deg); }
  35% { transform:scale(1.13) rotate(-9deg); }
  70% { transform:scale(1.08) rotate(5deg); }
  100% { transform:scale(1) rotate(0deg); }
}

@media (prefers-reduced-motion: reduce) {
  .nav-item-icon,
  .nav-item-icon svg,
  .nav-submenu-icon {
    transition:none;
    animation:none;
  }
  .nav-btn:hover .nav-item-icon,
  .nav-submenu-toggle:hover .nav-submenu-icon,
  .nav-sub-btn:hover .nav-item-icon {
    transform:none;
    filter:none;
  }
}

.nav-submenu-toggle:active .nav-submenu-icon {
  transform:scale(0.92) rotate(-10deg);
  filter:brightness(1.12);
}

.main {
  flex:1;
  padding:26px;
  min-width:0;
}

#system.sidebar-collapsed .sidebar {
  width:0;
  min-width:0;
  padding:0;
  border-right-color:transparent;
}

#system.sidebar-collapsed .sidebar .nav-btn {
  opacity:0;
  transform:translateX(-8px);
  pointer-events:none;
}

#system.sidebar-collapsed .sidebar .sidebar-top {
  margin:0;
}

.card {
  background:white;
  padding:24px;
  border:1px solid #e0e9e4;
  border-radius:16px;
  box-shadow:0 8px 24px rgba(17,36,29,0.06);
}

.settings-card {
  background:
    radial-gradient(circle at 96% 6%, rgba(198,168,75,0.18), transparent 34%),
    radial-gradient(circle at 4% 96%, rgba(46,94,78,0.12), transparent 36%),
    linear-gradient(145deg, #ffffff 0%, #f7fbf9 100%);
  border-color:#d6e5de;
}

.settings-head h3 {
  margin:0;
  font-family:"Orbitron", "Manrope", sans-serif;
  font-size:28px;
  letter-spacing:0.45px;
  color:#173f32;
}

.settings-head .muted {
  margin:6px 0 0;
}

.settings-section {
  margin-top:18px;
  padding:14px;
  border:1px solid #d9e6df;
  border-radius:14px;
  background:rgba(255,255,255,0.86);
}

.settings-label {
  font-size:13px;
  font-weight:700;
  color:#1f4034;
  margin-bottom:10px;
}

.settings-theme-options {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.theme-option-btn {
  border:1px solid #cbdcd4;
  background:#f8fcfa;
  color:#24473b;
  border-radius:12px;
  padding:10px 14px;
  min-width:128px;
  font-weight:700;
  cursor:pointer;
  transition:all 0.18s ease;
}

.theme-option-btn:hover {
  border-color:#a8c2b6;
  background:#edf6f1;
}

.theme-option-btn.active {
  color:#ffffff;
  border-color:#1f4c3e;
  background:linear-gradient(135deg,#1f4c3e,#2E5E4E);
  box-shadow:0 8px 16px rgba(22,61,49,0.24);
}

.settings-current-theme {
  margin-top:10px;
}

.centered-heading {
  text-align:center;
}

.admin-card {
  border-color:#f2c4c1;
}

.admin-warning {
  margin:10px 0;
  color:#7a0f0f;
  font-weight:600;
}

.admin-list {
  margin:8px 0 16px 18px;
  padding:0;
  color:#333;
}

.admin-actions {
  display:grid;
  gap:10px;
  max-width:480px;
}

.sheet-tools {
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-bottom:8px;
}

.sheet-controls {
  display:grid;
  grid-template-columns:minmax(220px, 1fr) 150px 150px 140px 46px;
  gap:10px;
  margin-bottom:8px;
}

.sheet-controls input,
.sheet-controls select {
  margin:0;
}

.icon-btn {
  border:1px solid #d9d9d9;
  background:#fff;
  color:#555;
  border-radius:6px;
  cursor:pointer;
  height:42px;
  align-self:end;
}

.icon-btn:hover {
  background:#f6f6f6;
}

.sheet-table-wrap {
  width:100%;
  overflow:auto;
  border:1px solid #e6e6e6;
}

.sheet-results-bar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:6px;
}

.sheet-page-controls {
  display:flex;
  align-items:center;
  gap:8px;
}

.sheet-page-controls select {
  width:auto;
  margin:0;
}

.sheet-detail-modal-card {
  width:min(96vw, 760px);
  max-height:86vh;
  display:flex;
  flex-direction:column;
}

.sheet-detail-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid #e6e6e6;
  padding:10px;
}

.sheet-detail-head h4 {
  margin:0;
}

.sheet-detail-body {
  padding:10px;
  overflow:auto;
  max-height:65vh;
}

.sheet-detail-row {
  display:grid;
  gap:3px;
  padding:8px 0;
  border-bottom:1px dashed #dde8e3;
}

.sheet-detail-label {
  font-size:12px;
  color:#4b5b54;
  font-weight:700;
  text-transform:uppercase;
}

.sheet-detail-value {
  color:#1f2d28;
  white-space:pre-wrap;
  word-break:break-word;
}

.dashboard-card {
  display:grid;
  gap:18px;
}

.dashboard-head {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
}

.dashboard-head h3 {
  margin:0;
  font-size:26px;
  color:#17382e;
}

.dashboard-head p {
  margin:6px 0 0;
  color:#5f6d67;
  font-family:"Orbitron", "Manrope", sans-serif;
  letter-spacing:0.8px;
}

.dashboard-actions {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.mini-action {
  border:1px solid #d1ddd7;
  background:#fff;
  color:#24493d;
  border-radius:10px;
  padding:8px 12px;
  font-weight:700;
  cursor:pointer;
}

.mini-action:hover {
  background:#f3f8f5;
}

.kpi-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(190px, 1fr));
  gap:14px;
}

.kpi-card {
  border:1px solid #dbe6e0;
  border-radius:12px;
  background:linear-gradient(180deg,#fbfdfc,#f2f7f5);
  padding:16px;
}

.kpi-label {
  color:#666;
  font-size:13px;
}

.kpi-value {
  margin-top:4px;
  font-size:30px;
  font-weight:700;
  color:#17372d;
}

.dashboard-panels {
  display:grid;
  grid-template-columns:repeat(2, minmax(220px, 1fr));
  gap:14px;
}

.dashboard-panel {
  border:1px solid #dfe8e3;
  border-radius:12px;
  padding:14px;
  background:#fbfdfc;
}

.dashboard-panel h4 {
  margin:0 0 10px;
  color:#21463a;
}

.dashboard-panel p {
  margin:0;
  color:#556761;
}

.dashboard-metrics {
  display:grid;
  gap:8px;
}

.metric-row {
  display:grid;
  gap:8px;
  border:1px solid #dde7e2;
  background:#fff;
  border-radius:10px;
  padding:8px 10px;
  font-size:13px;
}

.metric-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}

.metric-head span:first-child {
  color:#3f5650;
  font-weight:600;
}

.metric-head span:last-child {
  color:#1f473b;
  font-weight:700;
}

.metric-progress {
  height:8px;
  border-radius:999px;
  background:#e8f0ec;
  overflow:hidden;
  border:1px solid #d7e3dc;
}

.metric-progress-fill {
  height:100%;
  width:0%;
  border-radius:999px;
  transition:width 0.6s ease;
}

.metric-fill-good {
  background:linear-gradient(90deg,#2f7a5f,#3f9b79);
}

.metric-fill-warn {
  background:linear-gradient(90deg,#d79b2d,#e9bb58);
}

.metric-fill-bad {
  background:linear-gradient(90deg,#c4564f,#d96a64);
}

.flow-track {
  display:grid;
  grid-template-columns:repeat(4,minmax(80px,1fr));
  gap:8px;
}

.flow-step {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  background:#eef5f1;
  border:1px solid #d6e4dd;
  color:#2b4b41;
  border-radius:12px;
  min-height:52px;
  cursor:pointer;
  transition:0.16s ease;
}

.flow-step:hover {
  background:#e6f0eb;
}

.flow-step span {
  font-size:12px;
  font-weight:700;
}

.flow-step small {
  margin-top:2px;
  font-size:11px;
  color:#4f665f;
}

.flow-step.flow-active {
  background:#2E5E4E;
  border-color:#2E5E4E;
  color:#f2faf6;
}

.flow-step.flow-active small {
  color:#d8ece3;
}

.inventory-form, .request-form {
  display:grid;
  gap:10px;
  margin-bottom:15px;
}

.request-sheet {
  display:grid;
  gap:10px;
  margin-bottom:15px;
}

.request-meta-grid {
  display:grid;
  grid-template-columns:repeat(2, minmax(180px, 1fr));
  gap:10px;
}

.request-line-grid {
  display:grid;
  grid-template-columns: minmax(220px, 1fr) 140px;
  gap:8px;
  align-items:center;
}

.request-line-head {
  font-size:12px;
  font-weight:700;
  color:#2d3b35;
  margin-top:4px;
}

.request-line-grid input,
.request-line-grid select {
  margin:0;
}

.inventory-controls {
  display:grid;
  grid-template-columns: 1fr 200px;
  gap:10px;
  margin-bottom:10px;
}

.inventory-table {
  width:100%;
  border-collapse:collapse;
}

.inventory-table th {
  background:#2E5E4E;
  color:white;
  padding:8px;
}

.inventory-table td {
  padding:8px;
  border-bottom:1px solid #ddd;
}

.low-stock {
  color:red;
  font-weight:bold;
}

.hidden { display:none; }

.mobile-nav-overlay {
  position:fixed;
  inset:70px 0 0 0;
  background:rgba(0,0,0,0.3);
  z-index:1000;
}

@media (min-width:769px){
  .mobile-nav-overlay {
    display:none !important;
  }
}

@media (max-width:768px){
  #system.sidebar-collapsed .sidebar {
    width:272px;
    min-width:272px;
    padding:16px 12px;
    border-right:1px solid #d5e2dc;
  }
  #system.sidebar-collapsed .sidebar .nav-btn {
    opacity:1;
    transform:none;
    pointer-events:auto;
  }
  .sidebar{
    position:fixed;
    left:0;
    top:70px;
    height:calc(100vh - 70px);
    width:272px;
    transform:translateX(-100%);
    transition:transform 0.25s ease;
    z-index:1100;
  }
  .sidebar.active{
    transform:translateX(0);
  }
  .sidebar-top {
    padding-right:2px;
  }
  .main {
    padding:16px;
  }
  .top-header {
    height:70px;
    padding:0 10px;
  }
  .left-header {
    gap:6px;
  }
  .header-menu-group {
    gap:0;
    padding:2px;
    border-radius:12px;
  }
  .logo {
    height:30px;
  }
  .sidebar-logo {
    height:38px;
    max-width:150px;
  }
  .app-title {
    display:none;
  }
  .header-right {
    gap:6px;
  }
  .profile-avatar-btn {
    width:30px;
    height:30px;
  }
  .settings-menu-btn {
    width:30px;
    height:30px;
  }
  .profile-avatar-large {
    width:86px;
    height:86px;
  }
  .profile-menu {
    top:36px;
    min-width:128px;
  }
  .profile-hero {
    flex-direction:column;
    align-items:flex-start;
  }
  .profile-avatar-block {
    width:100%;
    justify-content:flex-start;
  }
  .profile-grid {
    grid-template-columns:1fr;
  }
  .session-badge {
    padding:4px 8px;
  }
  .session-label {
    display:none;
  }
  .session-role {
    font-size:11px;
  }
  .theme-option-btn {
    width:100%;
  }
  .login-card {
    padding:30px 18px 22px;
  }
  .login-title {
    font-size:26px;
    letter-spacing:1.2px;
    margin-bottom:12px;
  }
  .login-subtitle {
    margin-bottom:14px;
    font-size:13px;
  }
  .password-toggle {
    right:7px;
    width:32px;
    height:32px;
  }
  .dashboard-head {
    flex-direction:column;
  }
  .dashboard-panels {
    grid-template-columns:1fr;
  }
  .flow-track {
    grid-template-columns:repeat(2,minmax(90px,1fr));
  }
  .menu-toggle {
    width:34px;
    height:34px;
    border-radius:10px;
  }
}

@keyframes loginCardIn {
  0% {
    opacity:0;
    transform:translateY(16px) scale(0.98);
  }
  100% {
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@keyframes fieldFadeUp {
  0% {
    opacity:0;
    transform:translateY(8px);
  }
  100% {
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes titleFadeIn {
  0% {
    opacity:0;
    transform:translateY(8px);
  }
  100% {
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes logoPulse {
  0%, 100% {
    transform:translateY(0);
  }
  50% {
    transform:translateY(-2px);
  }
}

@keyframes floatOrbOne {
  0%, 100% {
    transform:translate3d(0, 0, 0);
  }
  50% {
    transform:translate3d(-18px, 14px, 0);
  }
}

@keyframes floatOrbTwo {
  0%, 100% {
    transform:translate3d(0, 0, 0);
  }
  50% {
    transform:translate3d(16px, -12px, 0);
  }
}

@keyframes loginBgShift {
  0% {
    filter:saturate(1);
  }
  100% {
    filter:saturate(1.08);
  }
}

@keyframes btnSweep {
  0% {
    left:-140%;
  }
  100% {
    left:130%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .login-container,
  .login-container::before,
  .login-container::after,
  .login-card,
  .login-logo img,
  .login-title,
  .login-input-group,
  .login-card .primary:hover::after {
    animation:none !important;
    transition:none !important;
  }
}

/* Toast Notification */
.toast {
  position: fixed;
  top: 20px;
  right: 20px;
  background: #2E5E4E;
  color: white;
  padding: 15px 20px;
  border-left: 5px solid #C6A84B;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  transition: 0.3s ease;
  z-index: 2000;
}

.toast.show {
  opacity: 1;
}

.toast.hidden {
  opacity: 0;
  pointer-events: none;
}

.inventory-form {
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(180px,1fr));
  gap:15px;
  margin-bottom:20px;
}

.inventory-form input {
  padding:12px;
  border:1px solid #ddd;
  transition:0.2s;
}

.inventory-form input:focus {
  border-color:#2E5E4E;
  outline:none;
  box-shadow:0 0 0 2px rgba(46,94,78,0.2);
}

.inventory-table {
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  margin-top:15px;
}

.inventory-table th {
  background:#2E5E4E;
  color:white;
  padding:12px;
  text-align:left;
}

.inventory-table td {
  padding:12px;
  background:white;
}

.inventory-table tr:nth-child(even) td {
  background:#f9f9f9;
}

.status-badge {
  display:inline-block;
  padding:4px 10px;
  border-radius:20px;
  font-size:12px;
  font-weight:600;
}

.status-ok {
  background:#e6f4ea;
  color:#1e7e34;
}

.status-low-stock {
  background:#fdecea;
  color:#c82333;
}

.status-pending {
  background:#fff6dd;
  color:#8a6d1d;
}

.status-approved {
  background:#e8f2fd;
  color:#1d5ca8;
}

.status-rejected {
  background:#fdecea;
  color:#b42318;
}

.status-released {
  background:#e6f4ea;
  color:#1e7e34;
}

.status-badge[class*="status-track-"] {
  text-transform:uppercase;
  letter-spacing:0.2px;
  background:#eef2f0;
  color:#2b4740;
}

.status-track-pending {
  background:#f8dfdf !important;
  color:#c13a36 !important;
}

.status-track-done {
  background:#245f1f !important;
  color:#dcffd5 !important;
}

.status-track-rejected {
  background:#b30000 !important;
  color:#ffffff !important;
}

.status-track-for-approval {
  background:#1f5ea8 !important;
  color:#ffffff !important;
}

.status-track-not-released {
  background:#f8dfdf !important;
  color:#c13a36 !important;
}

.status-track-approved {
  background:#2a7b43 !important;
  color:#e8ffe7 !important;
}

.status-track-cancelled {
  background:#ff7a00 !important;
  color:#1f1f1f !important;
}

.hr-controls {
  display:grid;
  grid-template-columns: 170px 1fr 170px 170px 170px;
  gap:10px;
  margin-bottom:12px;
}

.logs-controls {
  display:grid;
  grid-template-columns: 200px 1fr 170px 170px 170px;
  gap:10px;
  margin-bottom:12px;
}

.action-btn {
  border:none;
  color:white;
  padding:6px 10px;
  margin-right:6px;
  border-radius:4px;
  cursor:pointer;
  font-size:12px;
}

.approve-btn {
  background:#2E5E4E;
}

.reject-btn {
  background:#b42318;
}

.release-btn {
  background:#1d5ca8;
}

.edit-btn {
  background:#6b7280;
}

.delete-btn {
  background:#9b1c1c;
}

.action-btn:disabled {
  opacity:0.55;
  cursor:not-allowed;
}

.muted {
  color:#999;
}

#logsTableBody .muted {
  text-align:center;
  padding:16px;
}

.modal {
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.45);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:3000;
}

.modal.hidden {
  display:none;
}

.modal-card {
  width:min(94vw, 520px);
  background:#fff;
  border-top:6px solid #C6A84B;
  padding:20px;
  box-shadow:0 14px 35px rgba(0,0,0,0.2);
}

.modal-card h3 {
  margin:0 0 8px 0;
}

.modal-card p {
  margin:0 0 18px 0;
  color:#444;
}

.modal-note {
  margin-bottom:14px !important;
  font-size:13px;
  color:#6b7280 !important;
}

.confirm-check {
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:6px;
  font-size:13px;
  color:#3f4c47;
}

.confirm-check input[type="checkbox"] {
  width:auto;
  margin:0;
}

.edit-form input:disabled {
  background:#f3f4f6;
  color:#68727f;
  border-color:#d8dde5;
}

.modal-actions {
  display:flex;
  justify-content:flex-end;
  gap:10px;
}

.modal-btn {
  border:none;
  padding:9px 14px;
  border-radius:4px;
  cursor:pointer;
}

.modal-btn.secondary {
  background:#ececec;
  color:#333;
}

.modal-btn.reject-btn {
  color:#fff;
}

.modal-btn.danger {
  background:#b9261a;
  color:#fff;
}

.edit-form {
  display:grid;
  gap:8px;
  margin-bottom:12px;
}

.edit-form input {
  margin:0;
}

.field-group {
  display:grid;
  gap:4px;
}

.field-group label {
  font-size:12px;
  font-weight:600;
  color:#2d3b35;
}

.checkbox-inline {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:5px;
  font-size:12px;
  font-weight:500;
  color:#3b4a43;
  line-height:1.1;
  width:max-content;
  max-width:100%;
}

.checkbox-below-date {
  margin-top:2px;
  align-self:flex-start;
}

.checkbox-inline input[type="checkbox"] {
  margin:0;
  width:auto;
  min-width:0;
  flex:0 0 auto;
}

.tracking-readonly {
  background:#f3f4f6;
  color:#5f6b67;
  border-color:#d8dde5;
}

#freebiesTrackNotes {
  resize:vertical;
  min-height:74px;
}

#sheetTrackNotes {
  resize:vertical;
  min-height:74px;
}

.freebies-sales-items {
  display:grid;
  gap:8px;
}

.freebies-sales-item-row {
  display:grid;
  grid-template-columns: minmax(220px, 1fr) 96px auto;
  gap:8px;
  align-items:center;
}

.freebies-sales-item-row select,
.freebies-sales-item-row input {
  margin:0;
}

.freebies-sales-add-btn {
  width:38px;
  height:38px;
  padding:0;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #d3dce8;
}

.freebies-sales-add-btn .plus-icon {
  font-size:22px;
  line-height:1;
  font-weight:700;
}

.freebies-sales-add-btn:hover {
  transform:translateY(-1px);
}

body.theme-dark {
  background:#050607;
  color:#e4efea;
}

body.theme-dark .top-header {
  background:linear-gradient(180deg, rgba(10,12,13,0.96), rgba(7,9,10,0.98));
  border-bottom-color:#20272b;
  box-shadow:0 10px 24px rgba(0,0,0,0.45);
}

body.theme-dark .menu-toggle,
body.theme-dark .header-menu-group,
body.theme-dark .profile-avatar-btn,
body.theme-dark .settings-menu-btn,
body.theme-dark .session-badge {
  background:#0f1518;
  border-color:#2c3a42;
  color:#e2ece8;
}

body.theme-dark .session-label {
  color:#9fb3aa;
}

body.theme-dark .session-role {
  color:#e2efe9;
}

body.theme-dark .profile-menu {
  background:#0f1417;
  border-color:#253039;
  box-shadow:0 12px 24px rgba(0,0,0,0.4);
}

body.theme-dark .profile-menu-item {
  color:#d8e6e0;
}

body.theme-dark .profile-menu-item:hover {
  background:#182126;
}

body.theme-dark .sidebar {
  background:linear-gradient(180deg,#0a0e10 0%, #070a0c 100%);
  border-right-color:#1d252a;
  box-shadow:inset -1px 0 0 rgba(255,255,255,0.02), 8px 0 20px rgba(0,0,0,0.35);
}

body.theme-dark .sidebar-bottom {
  border-top-color:#253138;
  background:linear-gradient(180deg, rgba(7,10,12,0.75) 0%, rgba(7,10,12,0.94) 40%, #070a0c 100%);
}

body.theme-dark .nav-btn {
  color:#d3e3dc;
}

body.theme-dark .nav-btn:hover {
  background:#162027;
  border-color:#2a3a45;
}

body.theme-dark .nav-btn.active {
  color:#f2f7f5;
  background:#20303a;
  border-color:#2f4656;
}

body.theme-dark .nav-sub-btn,
body.theme-dark .nav-logout-btn {
  background:#10171c;
  border-color:#2a3a45;
  color:#d3e3dc;
}

body.theme-dark .nav-sub-btn:hover,
body.theme-dark .nav-logout-btn:hover {
  background:#182229;
  border-color:#344957;
  color:#e8f3ef;
}

body.theme-dark .nav-sub-btn.active {
  background:#223340;
  border-color:#355064;
  color:#f2f7f5;
}

body.theme-dark .nav-submenu-toggle .nav-submenu-caret,
body.theme-dark .nav-submenu-icon {
  color:#9fb9ad;
}

body.theme-dark .card,
body.theme-dark .profile-card,
body.theme-dark .settings-card {
  background:#0d1215;
  border-color:#222d34;
  box-shadow:0 14px 26px rgba(0,0,0,0.32);
}

body.theme-dark h3,
body.theme-dark .settings-head h3,
body.theme-dark #profile .profile-card h3 {
  color:#e3f0ea;
}

body.theme-dark .muted {
  color:#b1c0c8 !important;
}

body.theme-dark input,
body.theme-dark select,
body.theme-dark textarea,
body.theme-dark .profile-grid .field-group input {
  background:#11181d;
  color:#edf6f2;
  border-color:#33434d;
}

body.theme-dark .checkbox-inline {
  color:#c8d6cf;
}

body.theme-dark .freebies-sales-add-btn {
  border-color:#32424e;
  background:#141d24;
  color:#e8f4ef;
}

body.theme-dark select option {
  background:#0f1519;
  color:#edf6f2;
}

body.theme-dark .modal-btn.secondary,
body.theme-dark .theme-option-btn {
  background:#151d22;
  color:#dce8e3;
  border-color:#2e3e49;
}

body.theme-dark .modal-btn.danger {
  background:#a62921;
  color:#fff;
}

body.theme-dark .theme-option-btn.active {
  background:linear-gradient(135deg,#3e9f80,#2a725c);
  border-color:#4aa388;
  color:#ffffff;
}

body.theme-dark th {
  background:#11191e;
  color:#edf7f3;
}

body.theme-dark td {
  border-color:#222e36;
  color:#d8e4de;
}

body.theme-dark .inventory-table th,
body.theme-dark .inventory-table td,
body.theme-dark #sheetTableBody td,
body.theme-dark #freebiesTableBody td,
body.theme-dark #freebiesSalesTableBody td,
body.theme-dark #inventoryTableBody td,
body.theme-dark #logsTableBody td,
body.theme-dark #hrRequestTable td,
body.theme-dark #myRequestTable td {
  color:#edf6f2 !important;
  font-weight:500;
}

body.theme-dark .inventory-table th {
  color:#f4fbf8 !important;
  border-color:#2a3640;
}

body.theme-dark .inventory-table td {
  background:#0f161a !important;
  border-color:#243039 !important;
}

body.theme-dark .inventory-table tr:nth-child(even) td,
body.theme-dark #sheetTableBody tr:nth-child(even) td,
body.theme-dark #freebiesTableBody tr:nth-child(even) td,
body.theme-dark #freebiesSalesTableBody tr:nth-child(even) td,
body.theme-dark #inventoryTableBody tr:nth-child(even) td,
body.theme-dark #logsTableBody tr:nth-child(even) td,
body.theme-dark #hrRequestTable tr:nth-child(even) td,
body.theme-dark #myRequestTable tr:nth-child(even) td {
  background:#101920 !important;
}

body.theme-dark .inventory-table tr:nth-child(odd) td,
body.theme-dark #sheetTableBody tr:nth-child(odd) td,
body.theme-dark #freebiesTableBody tr:nth-child(odd) td,
body.theme-dark #freebiesSalesTableBody tr:nth-child(odd) td,
body.theme-dark #inventoryTableBody tr:nth-child(odd) td,
body.theme-dark #logsTableBody tr:nth-child(odd) td,
body.theme-dark #hrRequestTable tr:nth-child(odd) td,
body.theme-dark #myRequestTable tr:nth-child(odd) td {
  background:#0b1116 !important;
}

body.theme-dark .inventory-table td .muted,
body.theme-dark .inventory-table .muted,
body.theme-dark #sheetStatusText,
body.theme-dark #freebiesStatusText,
body.theme-dark #sheetRangeText,
body.theme-dark #freebiesRangeText {
  color:#d1dfe6 !important;
}

body.theme-dark tr:nth-child(even) {
  background:#0f161a;
}

body.theme-dark tr:nth-child(odd) {
  background:#0b1115;
}

body.theme-dark .inventory-table tr:hover td {
  background:#18242d !important;
}

body.theme-dark .inventory-table {
  border-color:#202b32;
}

body.theme-dark .sheet-table-wrap,
body.theme-dark .sheet-detail-body,
body.theme-dark .sheet-results-bar,
body.theme-dark .dashboard-panel,
body.theme-dark .kpi-card,
body.theme-dark .metric-progress {
  background:#0b1013;
  border-color:#243038;
}

body.theme-dark .action-btn {
  background:#162027;
  color:#e9f2ee;
  border-color:#2b3a45;
}

body.theme-dark .action-btn:hover {
  filter:brightness(1.08);
}

body.theme-dark .approve-btn {
  background:#144838;
  border-color:#1f624d;
}

body.theme-dark .reject-btn,
body.theme-dark .delete-btn {
  background:#5b2026;
  border-color:#7d3139;
}

body.theme-dark .release-btn {
  background:#1b4563;
  border-color:#2a638d;
}

body.theme-dark .modal-card {
  background:#0c1216;
  border-color:#24303a;
}

body.theme-dark .status-badge {
  border-color:rgba(255,255,255,0.18);
  color:#f7fffb !important;
  text-shadow:0 1px 0 rgba(0,0,0,0.2);
}

body.theme-dark .status-track-pending,
body.theme-dark .status-pending {
  background:#6b530f;
}

body.theme-dark .status-track-done,
body.theme-dark .status-released,
body.theme-dark .status-approved {
  background:#1f5a45;
}

body.theme-dark .status-track-rejected,
body.theme-dark .status-rejected,
body.theme-dark .status-cancelled {
  background:#6a232d;
}

body.theme-dark .status-track-for-approval,
body.theme-dark .status-approved,
body.theme-dark .status-track-approved {
  background:#1f4564;
}

body.theme-dark .status-track-not-released {
  background:#6b4c1e;
}

body.theme-dark .status-low-stock {
  background:#6a232d !important;
  color:#ffe6e6 !important;
}

body.theme-dark .status-ok {
  background:#1f5a45 !important;
  color:#dfffee !important;
}

body.theme-dark .status-pending {
  background:#6b530f !important;
  color:#fff4c9 !important;
}

@media (max-width:900px) {
  .hr-controls {
    grid-template-columns:1fr;
  }
  .logs-controls {
    grid-template-columns:1fr;
  }
  .inventory-controls {
    grid-template-columns:1fr;
  }
  .sheet-controls {
    grid-template-columns:1fr;
  }
  .sheet-tools {
    justify-content:stretch;
  }
  .sheet-results-bar {
    flex-direction:column;
    align-items:flex-start;
  }
  .sheet-page-controls {
    flex-wrap:wrap;
  }
  .sheet-tools .action-btn {
    width:100%;
  }
  .sheet-detail-body {
    max-height:360px;
  }
  .request-meta-grid {
    grid-template-columns:1fr;
  }
  .request-line-head {
    display:none;
  }
  .request-line-grid {
    grid-template-columns:1fr;
    background:#f7faf9;
    border:1px solid #dce9e3;
    border-radius:8px;
    padding:8px;
  }
}

