/* Upkeep Theme Design Tokens */
:root {
  /* Core Palette */
  --up-soft-charcoal: #2c2c2c; /* Soft Charcoal */
  --up-warm-grey: #7d7d7d;     /* Warm Grey */
  --up-offwhite: #f2f3f5;      /* Off-White */

  --up-slate-blue: #4a5d7c;    /* Slate Blue */
  --up-steel-teal: #4e7d7c;    /* Steel Teal */
  --up-forest: #3e5e4e;        /* Muted Forest Green */
  --up-dusty-gold: #c9a663;    /* Dusty Gold */

  /* Derived Shades */
  --up-steel-teal-dark: #436a6a;
  --up-forest-light: #5a7c68;
  --up-dusty-gold-strong: #b38a49;
  --up-dusty-gold-soft: rgba(201, 166, 99, 0.18);

  /* Legacy token compatibility */
  --up-black: var(--up-soft-charcoal);
  --up-graphite: var(--up-slate-blue);
  --up-slate-900: var(--up-slate-blue);
  --up-slate-800: var(--up-steel-teal);
  --up-slate-700: var(--up-forest);
  --up-slate-500: var(--up-warm-grey);
  --up-slate-300: #a3a8af;
  --up-slate-200: #d6dadd;
  --up-slate-100: var(--up-offwhite);

  --up-accent: var(--up-dusty-gold);
  --up-accent-strong: var(--up-dusty-gold-strong);
  --up-accent-soft: var(--up-dusty-gold-soft);

  --up-blue: var(--up-slate-blue);
  --up-blue-2: var(--up-steel-teal);
  --up-green: var(--up-forest);
  --up-green-2: var(--up-forest-light);
  --up-orange: var(--up-dusty-gold);
  --up-orange-2: var(--up-dusty-gold-strong);
  --up-purple: var(--up-slate-blue);
  --up-purple-2: var(--up-steel-teal);
  --up-charcoal: var(--up-soft-charcoal);
  --up-charcoal-2: #3b3b3b;
  --up-crimson: var(--up-steel-teal);
  --up-crimson-2: var(--up-slate-blue);

  /* Neutrals */
  --up-bg: var(--up-offwhite);
  --up-surface: #ffffff;
  --up-text: var(--up-soft-charcoal);
  --up-text-muted: var(--up-warm-grey);

  /* Typography */
  --up-font-sans: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji';
  --up-h1: 2rem;
  --up-h2: 1.5rem;
  --up-h3: 1.25rem;
  --up-body: 0.95rem;
  --up-radius: 0.75rem;
  --up-shadow: 0 18px 48px rgba(44, 44, 44, 0.08);
  --up-border: var(--up-slate-200);
}

/* Base */
body { background-color: var(--up-bg); color: var(--up-text); font-family: var(--up-font-sans); }
.card {
  border-radius: var(--up-radius);
  box-shadow: var(--up-shadow);
  border: 1px solid var(--up-border);
  background-color: var(--up-surface);
}

/* Utilities */
.text-muted-ux { color: var(--up-text-muted) !important; }
.badge-gradient-blue { background: linear-gradient(135deg, var(--up-slate-blue), var(--up-steel-teal)); color: #fff; }
.badge-gradient-orange { background: linear-gradient(135deg, var(--up-dusty-gold), var(--up-dusty-gold-strong)); color: #fff; }
.badge-gradient-green { background: linear-gradient(135deg, var(--up-forest), var(--up-forest-light)); color: #fff; }
.badge-gradient-purple { background: linear-gradient(135deg, var(--up-slate-blue), var(--up-steel-teal)); color: #fff; }
.badge-gradient-charcoal { background: linear-gradient(135deg, var(--up-soft-charcoal), #3b3b3b); color: #fff; }
.badge-gradient-crimson { background: linear-gradient(135deg, var(--up-steel-teal), var(--up-slate-blue)); color: #fff; }

.icon-gradient-blue { background: linear-gradient(135deg, var(--up-slate-blue), var(--up-steel-teal)); }
.icon-gradient-orange { background: linear-gradient(135deg, var(--up-dusty-gold), var(--up-dusty-gold-strong)); }
.icon-gradient-green { background: linear-gradient(135deg, var(--up-forest), var(--up-forest-light)); }
.icon-gradient-purple { background: linear-gradient(135deg, var(--up-slate-blue), var(--up-steel-teal)); }
.icon-gradient-charcoal { background: linear-gradient(135deg, var(--up-soft-charcoal), #3b3b3b); }
/* Navbar UI Improvements */
.navbar-main {
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  background: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid var(--up-border) !important;
  box-shadow: 0 12px 36px rgba(15, 17, 21, 0.12) !important;
}

.navbar-nav .nav-link {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  border-radius: 12px;
  position: relative;
  overflow: hidden;
}

.navbar-nav .nav-link:hover {
  background: rgba(15, 17, 21, 0.08) !important;
  color: var(--up-black) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 18px rgba(15, 17, 21, 0.12);
}

.navbar-nav .nav-link:hover i {
  color: var(--up-black) !important;
}

.navbar-nav .nav-link:hover span {
  color: var(--up-black) !important;
}

/* Hover lift effect */
.hover-lift {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.hover-lift:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

/* Theme dropdown improvements */
.dropdown-menu {
  border: 1px solid var(--up-border) !important;
  box-shadow: 0 10px 40px rgba(15, 17, 21, 0.15) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  background: rgba(255, 255, 255, 0.95) !important;
}

.dropdown-item {
  transition: all 0.2s ease;
  border-radius: 8px;
  margin: 2px 4px;
}

.dropdown-item:hover {
  background: rgba(15, 17, 21, 0.08) !important;
  color: var(--up-black) !important;
  transform: translateX(2px);
}

.dropdown-item:hover i {
  color: var(--up-black) !important;
}

.sidenav .nav-link {
  color: var(--up-slate-500) !important;
  border-radius: calc(var(--up-radius) - 0.25rem);
  padding: 0.65rem 1rem;
  transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.sidenav .nav-link .nav-link-text {
  color: inherit !important;
}

.sidenav .nav-link .icon {
  background: rgba(15, 17, 21, 0.08) !important;
  color: var(--up-slate-300) !important;
  transition: background 0.2s ease, color 0.2s ease;
}

.sidenav .nav-link .icon .ni {
  color: inherit !important;
}

.sidenav .nav-link:hover,
.sidenav .nav-link:focus {
  background: rgba(15, 17, 21, 0.05) !important;
  color: var(--up-black) !important;
  box-shadow: inset 0 0 0 1px rgba(15, 17, 21, 0.04);
}

.sidenav .nav-link:hover .nav-link-text,
.sidenav .nav-link:focus .nav-link-text {
  color: var(--up-black) !important;
}

.sidenav .nav-link:hover .icon,
.sidenav .nav-link:focus .icon {
  background: var(--up-slate-200) !important;
  color: var(--up-black) !important;
}

.sidenav .nav-link.active {
  color: var(--up-black) !important;
  background: rgba(15, 17, 21, 0.06) !important;
  box-shadow: inset 2px 0 0 var(--up-accent);
}

.sidenav .nav-link.active .nav-link-text {
  color: var(--up-black) !important;
}

.sidenav .nav-link.active .icon {
  background: linear-gradient(135deg, var(--up-accent), var(--up-accent-strong)) !important;
  color: var(--up-black) !important;
}

.sidenav .nav-link.active .icon .ni {
  color: var(--up-black) !important;
}

/* Breadcrumb improvements */
.breadcrumb-item a {
  transition: all 0.2s ease;
  border-radius: 6px;
  padding: 4px 8px;
}

.breadcrumb-item a:hover {
  background: rgba(15, 17, 21, 0.08);
  color: var(--up-black) !important;
}

.breadcrumb-item.active {
  color: var(--up-slate-blue) !important;
  font-weight: 600;
}

/* Mobile menu toggler improvements */
.sidenav-toggler a {
  transition: all 0.3s ease;
  border-radius: 50%;
  padding: 8px;
}

.sidenav-toggler a:hover {
  background: rgba(0, 0, 0, 0.05);
  transform: scale(1.05);
}

/* Icon improvements */
.navbar-nav .nav-link i {
  transition: all 0.3s ease;
  font-size: 1.1rem;
}

.navbar-nav .nav-link:hover i {
  transform: scale(1.1);
}

/* Responsive improvements */
@media (max-width: 768px) {
  .navbar-nav .nav-link {
    padding: 8px 12px;
    margin: 2px;
  }

  .navbar-nav .nav-link span {
    display: none;
  }

  .breadcrumb-item span {
    display: none;
  }
}

/* Focus states for accessibility */
.navbar-nav .nav-link:focus,
.dropdown-item:focus {
  outline: 2px solid var(--up-accent);
  outline-offset: 2px;
}
/* Override Bootstrap primary color */
:root {
  --bs-primary: var(--up-slate-blue) !important;
  --bs-primary-rgb: 74, 93, 124 !important;
}

.text-primary {
  color: var(--up-slate-blue) !important;
}

.btn-primary {
  background-color: var(--up-slate-blue) !important;
  border-color: var(--up-slate-blue) !important;
  color: #fff !important;
}

.btn-primary:hover {
  background-color: var(--up-steel-teal) !important;
  border-color: var(--up-steel-teal) !important;
  color: #fff !important;
}

/* Dashboard KPI Card Icons - Default Theme Colors */
.dashboard-page .row .col-xl-2:nth-child(1) .card .card-body .row .col-4 .icon.icon-shape,
.dashboard-page .row .col-sm-4:nth-child(1) .card .card-body .row .col-4 .icon.icon-shape {
  background: linear-gradient(135deg, var(--up-slate-blue), var(--up-steel-teal)) !important;
}

.dashboard-page .row .col-xl-2:nth-child(2) .card .card-body .row .col-4 .icon.icon-shape,
.dashboard-page .row .col-sm-4:nth-child(2) .card .card-body .row .col-4 .icon.icon-shape {
  background: linear-gradient(135deg, var(--up-dusty-gold), var(--up-dusty-gold-strong)) !important;
}

.dashboard-page .row .col-xl-2:nth-child(3) .card .card-body .row .col-4 .icon.icon-shape,
.dashboard-page .row .col-sm-4:nth-child(3) .card .card-body .row .col-4 .icon.icon-shape {
  background: linear-gradient(135deg, var(--up-forest), var(--up-forest-light)) !important;
}

.dashboard-page .row .col-xl-2:nth-child(4) .card .card-body .row .col-4 .icon.icon-shape,
.dashboard-page .row .col-sm-4:nth-child(4) .card .card-body .row .col-4 .icon.icon-shape {
  background: linear-gradient(135deg, var(--up-soft-charcoal), #3b3b3b) !important;
}

.dashboard-page .row .col-xl-2:nth-child(5) .card .card-body .row .col-4 .icon.icon-shape,
.dashboard-page .row .col-sm-4:nth-child(5) .card .card-body .row .col-4 .icon.icon-shape {
  background: linear-gradient(135deg, var(--up-warm-grey), var(--up-soft-charcoal)) !important;
}

.dashboard-page .row .col-xl-2:nth-child(6) .card .card-body .row .col-4 .icon.icon-shape,
.dashboard-page .row .col-sm-4:nth-child(6) .card .card-body .row .col-4 .icon.icon-shape {
  background: linear-gradient(135deg, var(--up-steel-teal), var(--up-slate-blue)) !important;
}

/* Dashboard KPI Card Icons - Icon Colors */
.dashboard-page .row .col-xl-2:nth-child(1) .card .card-body .row .col-4 .icon.icon-shape .ni,
.dashboard-page .row .col-sm-4:nth-child(1) .card .card-body .row .col-4 .icon.icon-shape .ni,
.dashboard-page .row .col-xl-2:nth-child(2) .card .card-body .row .col-4 .icon.icon-shape .ni,
.dashboard-page .row .col-sm-4:nth-child(2) .card .card-body .row .col-4 .icon.icon-shape .ni,
.dashboard-page .row .col-xl-2:nth-child(3) .card .card-body .row .col-4 .icon.icon-shape .ni,
.dashboard-page .row .col-sm-4:nth-child(3) .card .card-body .row .col-4 .icon.icon-shape .ni,
.dashboard-page .row .col-xl-2:nth-child(4) .card .card-body .row .col-4 .icon.icon-shape .ni,
.dashboard-page .row .col-sm-4:nth-child(4) .card .card-body .row .col-4 .icon.icon-shape .ni,
.dashboard-page .row .col-xl-2:nth-child(5) .card .card-body .row .col-4 .icon.icon-shape .ni,
.dashboard-page .row .col-sm-4:nth-child(5) .card .card-body .row .col-4 .icon.icon-shape .ni,
.dashboard-page .row .col-xl-2:nth-child(6) .card .card-body .row .col-4 .icon.icon-shape .ni,
.dashboard-page .row .col-sm-4:nth-child(6) .card .card-body .row .col-4 .icon.icon-shape .ni {
  color: #fff !important;
}

/* Status Badge Colors - Default Theme */
.badge.badge-sm {
  background: linear-gradient(135deg, var(--up-slate-blue), var(--up-steel-teal)) !important;
  color: #fff !important;
  font-weight: 600 !important;
}

.badge.badge-sm[style*="FF8C00"],
.badge.badge-sm[style*="FFA500"] {
  background: linear-gradient(135deg, var(--up-dusty-gold), var(--up-dusty-gold-strong)) !important;
}

.badge.badge-sm[style*="00C851"],
.badge.badge-sm[style*="00E676"] {
  background: linear-gradient(135deg, var(--up-forest), var(--up-forest-light)) !important;
}

.badge.badge-sm[style*="8E44AD"],
.badge.badge-sm[style*="9B59B6"] {
  background: linear-gradient(135deg, var(--up-slate-blue), var(--up-steel-teal)) !important;
}

.badge.badge-sm[style*="2C3E50"],
.badge.badge-sm[style*="34495E"] {
  background: linear-gradient(135deg, var(--up-soft-charcoal), #3b3b3b) !important;
}

.badge.badge-sm[style*="DC3545"],
.badge.badge-sm[style*="E74C3C"] {
  background: linear-gradient(135deg, var(--up-steel-teal), var(--up-slate-blue)) !important;
}
/* Text color overrides for status indicators */
.text-success {
  color: var(--up-forest) !important;
}

.text-warning {
  color: var(--up-dusty-gold) !important;
}

.text-info {
  color: var(--up-steel-teal) !important;
}

.text-danger {
  color: var(--up-soft-charcoal) !important;
}

/* Fix navbar links that go white */
.navbar-nav .nav-link {
  color: var(--up-text) !important;
}

.navbar-nav .nav-link:hover {
  color: var(--up-black) !important;
}

/* Ensure icons maintain their colors */
.icon.icon-shape .ni {
  color: white !important;
}

/* Dropdown menu text colors */
.dropdown-item {
  color: var(--up-text) !important;
}

.dropdown-item:hover {
  color: var(--up-black) !important;
}

/* Upkeep Buttons */
.btn-up {
  color: #fff !important;
  border: 0;
  box-shadow: 0 4px 14px rgba(0,0,0,.12);
  transition: transform .06s ease, box-shadow .15s ease, filter .15s ease;
}
.btn-up:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,.16); filter: brightness(1.02); }
.btn-up:active { transform: translateY(0); box-shadow: 0 3px 10px rgba(0,0,0,.12); }
.btn-up-blue {
  background-image: linear-gradient(135deg, var(--up-slate-blue), var(--up-steel-teal));
  color: #fff !important;
}
.btn-up-orange {
  background-image: linear-gradient(135deg, var(--up-dusty-gold), var(--up-dusty-gold-strong));
  color: var(--up-soft-charcoal) !important;
}
.btn-up-green {
  background-image: linear-gradient(135deg, var(--up-forest), var(--up-forest-light));
  color: #fff !important;
}
.btn-up-purple {
  background-image: linear-gradient(135deg, var(--up-steel-teal), var(--up-slate-blue));
  color: #fff !important;
}
.btn-up-charcoal {
  background-image: linear-gradient(135deg, var(--up-soft-charcoal), #1f1f1f);
  color: #fff !important;
}
.btn-up-crimson {
  background-image: linear-gradient(135deg, var(--up-warm-grey), var(--up-soft-charcoal));
  color: #fff !important;
}
.btn-up-accent {
  background-image: linear-gradient(135deg, var(--up-accent), var(--up-accent-strong));
  color: var(--up-soft-charcoal) !important;
}

.btn-up-accent:hover {
  filter: brightness(1.04);
}

/* Status */
.status-quotation { background: linear-gradient(135deg, var(--up-dusty-gold), var(--up-dusty-gold-strong)); color: var(--up-soft-charcoal); }
.status-approval { background: linear-gradient(135deg, var(--up-forest), var(--up-forest-light)); color: #fff; }
.status-inprogress { background: linear-gradient(135deg, var(--up-slate-blue), var(--up-steel-teal)); color: #fff; }
.status-ready { background: linear-gradient(135deg, var(--up-warm-grey), var(--up-soft-charcoal)); color: #fff; }
.status-overdue { background: linear-gradient(135deg, var(--up-soft-charcoal), #1f1f1f); color: #fff; }

/* Animations */
@keyframes pulse {
  0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(166, 255, 108, 0.45); }
  70% { transform: scale(1.02); box-shadow: 0 0 0 10px rgba(166, 255, 108, 0); }
  100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(166, 255, 108, 0); }
}
.pulse { animation: pulse 2s infinite; }

/* UI Improvements */
/* Hide collapse arrows/icons in vertical navbar */
.navbar-vertical .navbar-nav .nav-link[data-bs-toggle="collapse"]:after {
  content: none !important;
}

/* Fix dropdown arrow rotation for ni-bold-right icons */
.navbar-vertical .navbar-nav .nav-link[data-bs-toggle="collapse"] .ni-bold-right,
.navbar-vertical .navbar-nav .nav-link[data-bs-toggle="collapse"] i.ni-bold-right {
  transition: all 0.3s ease-in-out;
  transform: rotate(0deg);
  transform-origin: 50% 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1em;
  height: 1em;
}

.navbar-vertical .navbar-nav .nav-link[data-bs-toggle="collapse"][aria-expanded="true"] .ni-bold-right,
.navbar-vertical .navbar-nav .nav-link[data-bs-toggle="collapse"][aria-expanded="true"] i.ni-bold-right {
  transform: rotate(90deg);
}

/* More specific targeting if needed */
.sidenav .navbar-nav .nav-link[data-bs-toggle="collapse"] .ni-bold-right {
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  transform: rotate(0deg);
  transform-origin: center;
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

.sidenav .navbar-nav .nav-link[data-bs-toggle="collapse"][aria-expanded="true"] .ni-bold-right {
  transform: rotate(90deg);
}

/* ============================================
   MOBILE RESPONSIVE - Global Card Headers
   ============================================ */

/* Sidenav Toggler - Make visible on mobile */
.sidenav-toggler {
  cursor: pointer;
  padding: 8px;
  border-radius: 8px;
  transition: background 0.2s ease;
}

.sidenav-toggler:hover {
  background: rgba(0, 0, 0, 0.05);
}

.sidenav-toggler-line {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--up-soft-charcoal);
  margin: 4px 0;
  border-radius: 2px;
  transition: all 0.3s ease;
}

/* Card Header Responsive Layout */
@media (max-width: 991.98px) {
  .card-header .d-flex.justify-content-between {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 1rem;
  }
  
  .card-header .d-flex.align-items-center.gap-2.ms-auto {
    margin-left: 0 !important;
    width: 100%;
    flex-wrap: wrap;
  }
}

@media (max-width: 767.98px) {
  /* Smaller buttons on tablet/mobile */
  .card-header .btn {
    padding: 0.5rem 0.75rem;
    font-size: 0.8rem;
  }
  
  .card-header .d-flex.gap-2 {
    gap: 0.5rem !important;
  }
}

@media (max-width: 575.98px) {
  /* Even smaller on phones */
  .card-header .btn {
    padding: 0.4rem 0.6rem;
    font-size: 0.75rem;
  }
  
  .card-header h6 {
    font-size: 1rem;
  }
  
  /* Stack buttons vertically if too many */
  .card-header .d-flex.flex-wrap {
    justify-content: flex-start;
  }
}

/* Ensure navbar is usable on mobile */
@media (max-width: 1199.98px) {
  .navbar-main {
    padding: 0.5rem 1rem;
  }
  
  .navbar-main .breadcrumb {
    font-size: 0.8rem;
  }
  
  .navbar-main .nav-link {
    padding: 0.4rem 0.6rem !important;
  }
  
  /* Mobile Sidenav - Always show full sidebar with text when visible */
  .g-sidenav-pinned .sidenav,
  .g-sidenav-pinned .navbar-vertical {
    max-width: 15.625rem !important;
    width: 15.625rem !important;
  }
  
  .g-sidenav-pinned .sidenav .nav-link-text,
  .g-sidenav-pinned .navbar-vertical .nav-link-text,
  .g-sidenav-pinned .sidenav .sidenav-normal,
  .g-sidenav-pinned .navbar-vertical .sidenav-normal {
    opacity: 1 !important;
    width: auto !important;
    display: inline !important;
  }
  
  .g-sidenav-pinned .sidenav .navbar-nav .nav-item h6,
  .g-sidenav-pinned .navbar-vertical .navbar-nav .nav-item h6 {
    opacity: 1 !important;
    display: block !important;
  }
  
  /* Force show sidenav when pinned */
  .g-sidenav-pinned.g-sidenav-show .sidenav {
    transform: translateX(0) !important;
  }
}

/* Fix sidenav text on all mobile screens */
@media (max-width: 767.98px) {
  /* When sidebar is shown (pinned), ensure text is visible */
  .g-sidenav-show.g-sidenav-pinned .sidenav .nav-link .nav-link-text,
  .g-sidenav-show.g-sidenav-pinned .navbar-vertical .nav-link .nav-link-text {
    opacity: 1 !important;
    width: auto !important;
    visibility: visible !important;
  }
  
  /* Section headers */
  .g-sidenav-show.g-sidenav-pinned .sidenav h6,
  .g-sidenav-show.g-sidenav-pinned .navbar-vertical h6 {
    opacity: 1 !important;
    visibility: visible !important;
  }
  
  /* Ensure proper sidenav width when open */
  .g-sidenav-show.g-sidenav-pinned .sidenav {
    max-width: 15.625rem !important;
    transform: translateX(0) !important;
  }
}

/* CRITICAL: Force sidenav text to show on mobile when sidebar is open */
/* This overrides the soft-ui-dashboard hidden states */
@media (max-width: 1199.98px) {
  /* When sidenav is visible (any pinned state), show text */
  body.g-sidenav-pinned .sidenav .nav-link-text,
  body.g-sidenav-pinned .sidenav .sidenav-normal,
  body.g-sidenav-pinned #sidenav-main .nav-link-text,
  body.g-sidenav-pinned #sidenav-main .sidenav-normal {
    opacity: 1 !important;
    width: auto !important;
    display: inline !important;
    visibility: visible !important;
  }
  
  /* Show section headers */
  body.g-sidenav-pinned .sidenav h6,
  body.g-sidenav-pinned #sidenav-main h6 {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
  }
  
  /* Ensure sidenav has proper width */
  body.g-sidenav-pinned .sidenav,
  body.g-sidenav-pinned #sidenav-main {
    max-width: 15.625rem !important;
    width: 15.625rem !important;
  }
  
  /* Override g-sidenav-hidden which may still be applied */
  body.g-sidenav-pinned.g-sidenav-hidden .sidenav .nav-link-text,
  body.g-sidenav-pinned.g-sidenav-hidden #sidenav-main .nav-link-text {
    opacity: 1 !important;
    width: auto !important;
  }
}

/* Override for when g-sidenav-hidden is applied but we still want text */
/* This handles the case when sidebar is visible but in "hidden/mini" mode */
.g-sidenav-show:not(.g-sidenav-hidden) .sidenav .nav-link-text,
.g-sidenav-show:not(.g-sidenav-hidden) #sidenav-main .nav-link-text,
.g-sidenav-show.g-sidenav-pinned .sidenav .nav-link-text,
.g-sidenav-show.g-sidenav-pinned #sidenav-main .nav-link-text {
  opacity: 1 !important;
  width: auto !important;
}

/* Force full sidenav on mobile devices */
@media (max-width: 991.98px) {
  /* Always show full width sidenav with text on small screens when open */
  .g-sidenav-show .sidenav,
  .g-sidenav-show #sidenav-main,
  body.g-sidenav-show .sidenav,
  body.g-sidenav-show #sidenav-main {
    max-width: 15.625rem !important;
  }
  
  .g-sidenav-show .sidenav .nav-link-text,
  .g-sidenav-show #sidenav-main .nav-link-text,
  body.g-sidenav-show .sidenav .nav-link-text,
  body.g-sidenav-show #sidenav-main .nav-link-text {
    opacity: 1 !important;
    width: auto !important;
    display: inline !important;
  }
  
  .g-sidenav-show .sidenav h6,
  .g-sidenav-show #sidenav-main h6,
  body.g-sidenav-show .sidenav h6,
  body.g-sidenav-show #sidenav-main h6 {
    opacity: 1 !important;
    display: block !important;
  }
}