/* Global no-shadow override theme */

*,
*::before,
*::after {
  text-shadow: none !important;
  box-shadow: none !important;
}

/* Bootstrap/common shadow utility classes */
.shadow,
.shadow-sm,
.shadow-lg,
.shadow-none {
  box-shadow: none !important;
}

/* Common UI components */
.card,
.btn,
.form-control,
.custom-select,
.dropdown-menu,
.modal-content,
.navbar,
.topnav,
.sidenav,
.page-header,
.footer,
.input-group-text,
.alert,
.badge,
.toast,
.popover,
.tooltip {
  box-shadow: none !important;
  text-shadow: none !important;
}

/* Page title on light backgrounds (dark header uses white below — see theme load order) */
.page-header .page-header-content .page-header-title,
.page-header-compact .page-header-content .page-header-title,
.page-header.page-header-light .page-header-content .page-header-title {
  color: var(--page-header-title-color) !important;
}

.page-header.page-header-dark .page-header-content .page-header-title {
  color: #fff !important;
}

.page-header .page-header-content .page-header-title .page-header-icon,
.page-header-compact .page-header-content .page-header-title .page-header-icon,
.page-header.page-header-light
  .page-header-content
  .page-header-title
  .page-header-icon {
  color: var(--page-header-title-color) !important;
}

.page-header.page-header-dark
  .page-header-content
  .page-header-title
  .page-header-icon {
  color: rgba(255, 255, 255, 0.85) !important;
}

.page-header
  .page-header-content
  .page-header-title
  .page-header-icon
  .feather {
  color: inherit !important;
}

/* Top bar: inside main content column — transparent */
.topnav,
.topnav.navbar,
#sidenavAccordion.topnav {
  background-color: transparent !important;
  background: transparent !important;
  border-bottom: none !important;
}

/* Top bar variant: match sidebar gradient */
.topnav.topnav-gradient,
.topnav.topnav-gradient.navbar,
#sidenavAccordion.topnav.topnav-gradient {
  background-color: var(--primary-color, #1f2d41) !important;
  background-image: var(--sidenav-gradient) !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  border-bottom: none !important;
}

.topnav.topnav-gradient .navbar-brand {
  color: #fff !important;
}

.topnav.topnav-gradient .nav-link,
.topnav.topnav-gradient .dropdown-user-details-name,
.topnav.topnav-gradient .dropdown-user-details-email {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* Top nav lives inside #layoutSidenav_content (scrolls with main column) */
.nav-fixed .topnav {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  width: 100%;
  flex-shrink: 0;
  z-index: 1039;
}

/* Content column fills viewport; main grows between top nav and footer */
.nav-fixed #layoutSidenav #layoutSidenav_content {
  min-height: 100vh !important;
  justify-content: flex-start !important;
}

.nav-fixed #layoutSidenav #layoutSidenav_content > .layout-main {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

/* Top nav home/icon button: remove rollover effect */
.topnav .btn.btn-icon.btn-transparent-dark:hover,
.topnav .btn.btn-icon.btn-transparent-dark:focus,
.topnav .btn.btn-icon.btn-transparent-dark:active {
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Primary buttons: gradient style */
.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:disabled,
.btn-primary.disabled,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  color: #fff !important;
  background-color: var(--primary-color, #1f2d41) !important;
  background-image: linear-gradient(
    135deg,
    var(--primary-color, #1f2d41) 0%,
    var(--secondary-color, #0f172a) 100%
  ) !important;
  border-color: var(--primary-color, #1f2d41) !important;
}

.btn-primary:focus,
.btn-primary.focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(31, 45, 65, 0.5) !important;
}

/* Back buttons: consistent grey style */
.btn-back {
  color: #fff !important;
  background-color: #6c757d !important;
  border-color: #6c757d !important;
  background-image: none !important;
}

.btn-back:hover,
.btn-back:focus,
.btn-back:active,
.btn-back.active,
.show > .btn-back.dropdown-toggle {
  color: #fff !important;
  background-color: #5a6268 !important;
  border-color: #5a6268 !important;
  text-decoration: none !important;
}

.btn-back:focus,
.btn-back:not(:disabled):not(.disabled):active:focus {
  box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.35) !important;
}

.btn-back.btn-link {
  color: #6c757d !important;
  background-color: transparent !important;
  border-color: transparent !important;
}

/* Top nav dropdown: match side navi styling */
.topnav .dropdown-menu,
#sidenavAccordion .dropdown-menu {
  background-color: var(--primary-color, #1f2d41) !important;
  background-image: var(--sidenav-gradient-soft-top);
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 0.75rem !important;
  padding: 0.25rem 0 !important;
}

.topnav .dropdown-item,
#sidenavAccordion .dropdown-item {
  color: rgba(255, 255, 255, 0.5) !important;
  border-radius: 0.5rem;
  cursor: pointer;
}

.topnav .dropdown-item:hover,
.topnav .dropdown-item:focus,
#sidenavAccordion .dropdown-item:hover,
#sidenavAccordion .dropdown-item:focus {
  background-color: rgba(255, 255, 255, 0.08) !important;
  color: #fff !important;
  text-decoration: none !important;
}

.topnav .dropdown-item.active,
#sidenavAccordion .dropdown-item.active {
  background-color: rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
}

.topnav .dropdown-divider,
#sidenavAccordion .dropdown-divider {
  border-top-color: rgba(255, 255, 255, 0.12) !important;
}

.topnav .dropdown-header,
#sidenavAccordion .dropdown-header {
  color: rgba(255, 255, 255, 0.65) !important;
}

.topnav .dropdown-user-details-name,
.topnav .dropdown-user-details-email,
#sidenavAccordion .dropdown-user-details-name,
#sidenavAccordion .dropdown-user-details-email {
  color: rgba(255, 255, 255, 0.5) !important;
}

/* Email template listing "More" dropdown: match side navi colors */
.email-template-more-dropdown .email-template-more-toggle {
  color: #000 !important;
}

.email-template-more-dropdown .email-template-more-toggle:hover,
.email-template-more-dropdown .email-template-more-toggle:focus {
  color: #000 !important;
  text-decoration: none !important;
}

.email-template-more-dropdown .dropdown-menu {
  background-color: var(--primary-color, #1f2d41) !important;
  background-image: var(--sidenav-gradient-soft-top);
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 0.75rem !important;
}

.email-template-more-dropdown .dropdown-item {
  color: #fff !important;
  border-radius: 0.5rem;
}

.email-template-more-dropdown .dropdown-item:hover,
.email-template-more-dropdown .dropdown-item:focus {
  background-color: rgba(255, 255, 255, 0.08) !important;
  color: #fff !important;
  text-decoration: none !important;
}

.email-template-more-dropdown .dropdown-item .btn,
.email-template-more-dropdown .dropdown-item span,
.email-template-more-dropdown .dropdown-item i,
.email-template-more-dropdown .dropdown-item:hover .btn,
.email-template-more-dropdown .dropdown-item:hover span,
.email-template-more-dropdown .dropdown-item:hover i,
.email-template-more-dropdown .dropdown-item:focus .btn,
.email-template-more-dropdown .dropdown-item:focus span,
.email-template-more-dropdown .dropdown-item:focus i {
  color: #fff !important;
}

/* ---- Left nav “island” (desktop only): detached card, not fused with top nav ---- */
:root {
  --page-header-title-color: var(--primary-color, #1f2d41);
  --nav-island-gap: 0.75rem;
  --nav-island-radius: 0.75rem;
  /* Left nav gradient (navy primary → deep navy) */
  --sidenav-gradient: linear-gradient(
    165deg,
    var(--primary-color, #1f2d41) 0%,
    var(--secondary-color, #0f172a) 42%,
    #0c1220 72%,
    var(--navy-dark-color, #020617) 100%
  );
  --sidenav-gradient-soft-top: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.06) 0%,
    rgba(255, 255, 255, 0) 55%
  );
}

/* Elegant dark gradient sidebar */
#layoutSidenav_nav .sidenav.sidenav-dark {
  background-color: var(--primary-color, #1f2d41) !important;
  background-image: var(--sidenav-gradient) !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

.sidenav-dark .sidenav-menu-nested {
  border-left-color: rgba(148, 163, 184, 0.2) !important;
}

.sidenav-dark .sidenav-menu .nav-link:hover {
  background-color: rgba(255, 255, 255, 0.08) !important;
  border-radius: 0.5rem;
  color: #fff !important;
  text-decoration: none !important;
}

.sidenav-dark .sidenav-menu .nav-link.active {
  background-color: rgba(255, 255, 255, 0.12) !important;
  border-radius: 0.5rem;
  color: #fff !important;
  text-decoration: none !important;
}

.sidenav-dark .sidenav-menu .nav .nav-link.active .nav-icon {
  color: #fff !important;
}

.sidenav-dark .sidenav-menu .nav-link:hover .nav-link-icon,
.sidenav-dark .sidenav-menu .nav-link:hover .sidenav-collapse-arrow {
  color: #fff !important;
}

.sidenav-dark .sidenav-footer {
  background: rgba(0, 0, 0, 0.2) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

/* Logo at top of sidebar (desktop island + mobile drawer) */
.sidenav-island-brand {
  flex-shrink: 0;
  padding: 1rem 0.75rem 0.875rem;
  text-align: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  background-image: var(--sidenav-gradient-soft-top);
}

.sidenav-island-brand-link {
  display: block;
}

.sidenav-island-logo-img {
  height: 44px;
  width: auto;
  max-width: 100%;
  display: inline-block;
  vertical-align: middle;
  object-fit: contain;
}

/* ---- Profile card at bottom of left sidebar ---- */
.sidenav-profile-card {
  flex-shrink: 0;
  margin: 0.75rem -1rem 0;
  width: calc(100% + 2rem);
  box-sizing: border-box;
  padding: 0.85rem 0.85rem 0.75rem;
  border-radius: 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(2, 6, 23, 0.35);
  background-image: var(--sidenav-gradient-soft-top);
  box-shadow: 0 8px 26px rgba(2, 6, 23, 0.35);
}

.sidenav-profile-main {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.sidenav-profile-toggle {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.6);
  padding: 0;
  cursor: pointer;
  transition: background-color 0.15s ease, transform 0.15s ease, color 0.15s ease;
}

.sidenav-profile-toggle:hover,
.sidenav-profile-toggle:focus {
  outline: none;
  background: rgba(255, 255, 255, 0.10);
  color: #fff;
}

.sidenav-profile-toggle .feather {
  width: 18px;
  height: 18px;
}

.sidenav-profile-avatar {
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  object-fit: cover;
  background: rgba(255, 255, 255, 0.06);
}

.sidenav-profile-details {
  min-width: 0;
}

.sidenav-profile-name {
  color: rgba(255, 255, 255, 0.5);
  font-weight: 600;
  font-size: 0.95rem;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sidenav-profile-email {
  color: rgba(255, 255, 255, 0.5);
  font-size: 0.83rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sidenav-profile-actions {
  /* Animated expand/collapse */
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin-top: 0.7rem;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  transform: translateY(-4px);
  transition: max-height 220ms ease, opacity 180ms ease, transform 220ms ease;
}

.sidenav-profile-card.is-open .sidenav-profile-actions {
  max-height: 220px; /* enough room for all action links */
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.sidenav-profile-card.is-open .sidenav-profile-toggle {
  transform: rotate(180deg);
}

.sidenav-profile-action {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.42rem 0.55rem;
  border-radius: 0.5rem;
  color: rgba(255, 255, 255, 0.5);
  text-decoration: none;
}

.sidenav-profile-action i {
  width: 1.1rem;
  height: 1.1rem;
}

.sidenav-profile-action:hover {
  background-color: rgba(255, 255, 255, 0.08);
  color: #fff;
  text-decoration: none !important;
}

.sidenav-profile-action:focus,
.sidenav-profile-action:active {
  color: #fff;
  text-decoration: none !important;
}

.sidenav-profile-card:hover .sidenav-profile-email {
  color: #fff;
}

/* Stack logo + scrollable menu inside sidebar */
.nav-fixed #layoutSidenav #layoutSidenav_nav .sidenav {
  display: flex !important;
  flex-direction: column !important;
}

.nav-fixed #layoutSidenav #layoutSidenav_nav .sidenav-menu {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}

@media (min-width: 992px) {
  /* Island: full viewport height (inset by gap on all sides) */
  .nav-fixed #layoutSidenav #layoutSidenav_nav {
    top: var(--nav-island-gap) !important;
    left: var(--nav-island-gap) !important;
    width: 17rem !important;
    height: calc(100vh - 2 * var(--nav-island-gap)) !important;
    border-radius: var(--nav-island-radius) !important;
    overflow: hidden !important;
    border: 1px solid rgba(15, 23, 42, 0.1) !important;
    box-shadow: 0 4px 24px rgba(15, 23, 42, 0.08) !important;
    background-color: transparent !important;
    z-index: 1038;
  }

  .nav-fixed #layoutSidenav #layoutSidenav_nav .sidenav {
    padding-top: 0 !important;
    height: 100% !important;
    min-height: 100% !important;
    border-radius: var(--nav-island-radius) !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: column !important;
  }

  /* Room for island + gutters beside main content */
  .nav-fixed #layoutSidenav #layoutSidenav_content {
    top: 0 !important;
    padding-left: calc(17rem + 2 * var(--nav-island-gap)) !important;
  }

  .layout-rtl.nav-fixed #layoutSidenav #layoutSidenav_nav {
    left: auto !important;
    right: var(--nav-island-gap) !important;
  }

  .layout-rtl.nav-fixed #layoutSidenav #layoutSidenav_content {
    padding-left: 0 !important;
    padding-right: calc(17rem + 2 * var(--nav-island-gap)) !important;
  }

  /* Sidebar toggled closed on desktop */
  .nav-fixed.sidenav-toggled #layoutSidenav #layoutSidenav_content {
    padding-left: 0 !important;
  }

  .layout-rtl.nav-fixed.sidenav-toggled #layoutSidenav #layoutSidenav_content {
    padding-right: 0 !important;
  }
}

/* Mobile / tablet: classic full-bleed drawer (no island) */
@media (max-width: 991.98px) {
  .nav-fixed #layoutSidenav #layoutSidenav_nav {
    top: 0 !important;
    left: 0 !important;
    height: 100vh !important;
    width: 17rem !important;
    border-radius: 0 !important;
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
  }

  .nav-fixed #layoutSidenav #layoutSidenav_nav .sidenav {
    padding-top: 0 !important;
    border-radius: 0 !important;
  }

  .nav-fixed #layoutSidenav #layoutSidenav_content {
    top: 0 !important;
  }
}

.white-bg {
  background-color: #fff !important;
}