/* Global theme override: switch primary palette from purple to green */
:root,
[data-bs-theme='light'] {
  --bs-primary: #2ea44f;
  --bs-primary-rgb: 46, 164, 79;
  --bs-purple: #2ea44f;
  --bs-body-font-family: 'Be Vietnam Pro', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --bs-link-color: #2ea44f;
  --bs-link-hover-color: #278a43;
  --bs-primary-text-emphasis: #1d5f32;
  --bs-primary-bg-subtle: #dff4e6;
  --bs-primary-border-subtle: #bde8ca;
  --nd335-radius-sm: 0.5rem;
  --nd335-radius-md: 0.72rem;
  --nd335-radius-lg: 0.88rem;
  --nd335-control-height: 2.35rem;
  --nd335-transition: all 0.18s ease;
  --nd335-surface-soft: #f5f7fb;
  --nd335-surface-card: #ffffff;
  --nd335-surface-navbar: rgba(255, 255, 255, 0.78);
  --nd335-surface-menu: linear-gradient(180deg, #ffffff 0%, #f7f9fd 100%);
  --nd335-title-color: #2f2a44;
  --nd335-muted-color: #6d6782;
  --nd335-card-shadow: 0 0.25rem 0.8rem rgba(75, 70, 92, 0.08);
  --nd335-card-shadow-hover: 0 0.4rem 1rem rgba(75, 70, 92, 0.14);
  --nd335-card-shadow-soft: 0 0.08rem 0.3rem rgba(75, 70, 92, 0.08);
  --nd335-hero-bg: linear-gradient(135deg, #f3fbf6 0%, #eef8ff 100%);
  --nd335-border-color: rgba(75, 70, 92, 0.1);
  --nd335-table-head-bg: color-mix(in sRGB, #ffffff 78%, rgba(var(--bs-primary-rgb), 0.13));
  --nd335-table-row-hover: rgba(var(--bs-primary-rgb), 0.06);
  --nd335-menu-link-color: #24543d;
  --nd335-menu-link-hover-bg: rgba(var(--bs-primary-rgb), 0.1);
  --nd335-card-padding-y: 0.58rem;
  --nd335-card-padding-x: 0.7rem;
  --nd335-table-cell-py: 0.56rem;
}

[data-bs-theme='dark'] {
  --bs-primary: #36c266;
  --bs-primary-rgb: 54, 194, 102;
  --bs-purple: #36c266;
  --bs-body-font-family: 'Be Vietnam Pro', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --bs-link-color: #4ad679;
  --bs-link-hover-color: #65df8d;
  --bs-primary-text-emphasis: #9bf0b8;
  --bs-primary-bg-subtle: #123321;
  --bs-primary-border-subtle: #1f5a37;
  --nd335-radius-sm: 0.5rem;
  --nd335-radius-md: 0.72rem;
  --nd335-radius-lg: 0.88rem;
  --nd335-control-height: 2.35rem;
  --nd335-transition: all 0.18s ease;
  --nd335-surface-soft: #232132;
  --nd335-surface-card: #2b283f;
  --nd335-surface-navbar: rgba(35, 33, 50, 0.76);
  --nd335-surface-menu: linear-gradient(180deg, #2a283d 0%, #222034 100%);
  --nd335-title-color: #e8e6f0;
  --nd335-muted-color: #b7b2cb;
  --nd335-card-shadow: 0 0.25rem 0.8rem rgba(10, 9, 16, 0.3);
  --nd335-card-shadow-hover: 0 0.4rem 1rem rgba(10, 9, 16, 0.4);
  --nd335-card-shadow-soft: 0 0.08rem 0.3rem rgba(10, 9, 16, 0.34);
  --nd335-hero-bg: linear-gradient(135deg, #1f2b25 0%, #1d2232 100%);
  --nd335-border-color: rgba(231, 227, 252, 0.16);
  --nd335-table-head-bg: color-mix(in sRGB, #2b283f 80%, rgba(var(--bs-primary-rgb), 0.14));
  --nd335-table-row-hover: rgba(var(--bs-primary-rgb), 0.16);
  --nd335-menu-link-color: #b9efcd;
  --nd335-menu-link-hover-bg: rgba(var(--bs-primary-rgb), 0.2);
  --nd335-card-padding-y: 0.58rem;
  --nd335-card-padding-x: 0.7rem;
  --nd335-table-cell-py: 0.56rem;
}

@media (min-width: 1200px) {
  :root,
  [data-bs-theme='light'],
  [data-bs-theme='dark'] {
    --bs-menu-width: 20rem;
  }
}

html,
body {
  min-height: 100%;
}

body {
  font-family: var(--bs-body-font-family);
  min-height: 100vh;
  background: radial-gradient(circle at top right, rgba(var(--bs-primary-rgb), 0.05), transparent 42%),
    var(--nd335-surface-soft);
}

.layout-wrapper,
.layout-container,
.layout-page,
.content-wrapper {
  min-height: 100vh;
}

.layout-page {
  display: flex;
  flex-direction: column;
}

.content-wrapper {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}

.layout-menu {
  border-right: 1px solid var(--nd335-border-color);
  background: var(--nd335-surface-menu);
  box-shadow: 0.3rem 0 0.9rem rgba(75, 70, 92, 0.05);
}

.layout-menu .app-brand {
  height: auto;
  padding: 0.82rem 0.9rem 0.78rem;
  border-bottom: 1px solid var(--nd335-border-color);
}

.layout-menu .app-brand .app-brand-link {
  display: inline-flex;
  align-items: center;
  gap: 0.36rem;
}

.layout-menu .app-brand .app-brand-logo.demo {
  width: 4rem;
  height: 4rem;
  min-width: 4rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: width 0.2s ease, height 0.2s ease, min-width 0.2s ease, transform 0.2s ease;
}

.layout-menu .app-brand .app-brand-logo.demo .nd335-brand-mark svg,
.layout-menu .app-brand .app-brand-logo.demo svg {
  width: 3.55rem;
  height: 3.55rem;
  transition: width 0.2s ease, height 0.2s ease, transform 0.2s ease;
}

.layout-menu .app-brand .app-brand-text {
  font-size: clamp(0.87rem, 0.86rem + 0.24vw, 0.99rem);
  font-weight: 800;
  letter-spacing: 0.005em;
  line-height: 1.15;
  white-space: nowrap;
  color: var(--nd335-title-color);
  transition: opacity 0.2s ease, max-width 0.2s ease, margin 0.2s ease;
}

@media (min-width: 1200px) {
  .layout-menu-collapsed:not(.layout-menu-hover, .layout-menu-offcanvas, .layout-menu-fixed-offcanvas) .layout-menu .app-brand {
    padding: 0.62rem 0.48rem 0.58rem 0.72rem;
  }

  .layout-menu-collapsed:not(.layout-menu-hover, .layout-menu-offcanvas, .layout-menu-fixed-offcanvas) .layout-menu .app-brand .app-brand-link {
    gap: 0;
    min-inline-size: 0;
  }

  .layout-menu-collapsed:not(.layout-menu-hover, .layout-menu-offcanvas, .layout-menu-fixed-offcanvas) .layout-menu .app-brand .app-brand-text {
    opacity: 0;
    max-width: 0;
    margin: 0 !important;
    overflow: hidden;
    pointer-events: none;
  }

  .layout-menu-collapsed:not(.layout-menu-hover, .layout-menu-offcanvas, .layout-menu-fixed-offcanvas) .layout-menu .app-brand .app-brand-logo.demo {
    width: 2.7rem;
    height: 2.7rem;
    min-width: 2.7rem;
  }

  .layout-menu-collapsed:not(.layout-menu-hover, .layout-menu-offcanvas, .layout-menu-fixed-offcanvas) .layout-menu .app-brand .app-brand-logo.demo .nd335-brand-mark svg,
  .layout-menu-collapsed:not(.layout-menu-hover, .layout-menu-offcanvas, .layout-menu-fixed-offcanvas) .layout-menu .app-brand .app-brand-logo.demo svg {
    width: 2.28rem;
    height: 2.28rem;
  }
}

.nd335-brand-mark svg {
  display: block;
  filter: drop-shadow(0 0.15rem 0.3rem rgba(16, 128, 71, 0.25));
}

.layout-menu .menu-inner-shadow {
  height: 0.55rem;
  background: linear-gradient(180deg, rgba(75, 70, 92, 0.09), transparent);
}

.layout-menu .menu-inner {
  padding: 0.7rem 0.68rem 0.95rem;
}

.layout-menu .menu-inner > .menu-header {
  margin: 0.82rem 0.35rem 0.42rem;
}

.layout-menu .menu-header .menu-header-text {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: color-mix(in sRGB, var(--nd335-muted-color) 90%, #ffffff);
}

.layout-menu .menu-item {
  margin-bottom: 0.2rem;
}

.layout-menu .menu-link {
  min-height: 2.4rem;
  border-radius: var(--nd335-radius-md);
  padding-inline: 0.68rem;
  color: var(--nd335-menu-link-color);
  font-weight: 600;
  transition: var(--nd335-transition);
}

.layout-menu .menu-link:hover {
  background: var(--nd335-menu-link-hover-bg);
  color: var(--bs-primary);
}

.layout-menu .menu-item .menu-link .menu-icon {
  --bs-icon-size: 1.05rem;
  font-size: 1.12rem;
  width: 1.65rem;
  height: 1.65rem;
  min-width: 1.65rem;
  border-radius: 0.45rem;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  color: #fff !important;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.8);
  background: linear-gradient(
    150deg,
    color-mix(in sRGB, var(--bs-primary) 84%, #000) 0%,
    var(--bs-primary) 100%
  );
  box-shadow: 0 0.22rem 0.55rem rgba(var(--bs-primary-rgb), 0.34);
  opacity: 1 !important;
  margin-inline-end: 0.45rem !important;
  transition: var(--nd335-transition);
}

.layout-menu .menu-item .menu-link .menu-icon::before {
  font-size: 1.05rem !important;
  line-height: 1 !important;
  color: inherit !important;
  opacity: 1 !important;
  font-weight: 600;
}

.layout-menu .menu-link:hover .menu-icon,
.layout-menu .menu-link:focus .menu-icon {
  color: #fff !important;
  border-color: rgba(var(--bs-primary-rgb), 0.92);
  background: linear-gradient(
    150deg,
    color-mix(in sRGB, var(--bs-primary) 80%, #000) 0%,
    color-mix(in sRGB, var(--bs-primary) 95%, #072110) 100%
  );
  box-shadow: 0 0.28rem 0.65rem rgba(var(--bs-primary-rgb), 0.4);
}

.layout-menu .menu-item.active > .menu-link {
  color: #fff;
  box-shadow: 0 0.35rem 0.9rem rgba(var(--bs-primary-rgb), 0.28);
  background: linear-gradient(
    72deg,
    color-mix(in sRGB, var(--bs-primary) 86%, #000) 0%,
    var(--bs-primary) 100%
  );
}

.layout-menu .menu-item.active > .menu-link .menu-icon {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.28);
}

.layout-navbar {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.layout-navbar .dropdown-menu {
  border: 1px solid var(--nd335-border-color);
  border-radius: var(--nd335-radius-md);
  box-shadow: var(--nd335-card-shadow);
}

.content-wrapper > .container-xxl,
.content-wrapper > .container-fluid {
  flex: 1 0 auto;
  padding-top: 0.45rem;
}

.container-p-y {
  padding-top: 0.55rem !important;
  padding-bottom: 0.55rem !important;
}

.content-footer {
  margin-top: auto;
  border-top: 1px solid var(--nd335-border-color);
  background: color-mix(in sRGB, var(--nd335-surface-card) 92%, rgba(var(--bs-primary-rgb), 0.08));
}

.content-footer .footer-link {
  color: var(--nd335-muted-color);
  font-weight: 600;
}

.nd335-user-context {
  max-width: 32rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.2);
  background: rgba(var(--bs-primary-rgb), 0.08);
  color: color-mix(in sRGB, var(--bs-primary) 72%, #123f2a);
}

.nd335-user-role {
  font-weight: 600;
  white-space: nowrap;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.24);
  background: rgba(var(--bs-primary-rgb), 0.14) !important;
  color: color-mix(in sRGB, var(--bs-primary) 72%, #123f2a);
}

.nd335-user-login {
  max-width: 16rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border: 0;
  background: transparent !important;
  box-shadow: none;
  padding: 0.1rem 0.2rem;
  color: color-mix(in sRGB, var(--bs-primary) 72%, #123f2a);
  font-weight: 600;
}

.nd335-navbar-user-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.42rem;
  width: 100%;
  min-width: 0;
}

.nd335-navbar-user-row .nav-item {
  margin-right: 0 !important;
  flex-shrink: 0;
}

.nd335-navbar-user-row .nd335-user-context {
  max-width: 26rem;
}

.nd335-navbar-user-row .avatar {
  box-shadow: 0 0.25rem 0.8rem rgba(var(--bs-primary-rgb), 0.2);
}

#navbar-collapse.navbar-nav-right {
  width: 100%;
  flex: 1 1 auto;
  min-width: 0;
}

.nd335-navbar-user-shell {
  width: 100%;
  min-width: 0;
  gap: 0.42rem;
}

.nd335-navbar-context-row,
.nd335-navbar-actions-row {
  margin: 0;
  padding: 0;
  min-width: 0;
}

.nd335-navbar-context-row {
  flex: 1 1 auto;
  justify-content: flex-start;
}

.nd335-navbar-actions-row {
  flex: 0 0 auto;
  gap: 0.42rem;
}

.nd335-navbar-context-row .nav-item,
.nd335-navbar-actions-row .nav-item {
  margin-right: 0 !important;
  flex-shrink: 0;
}

.nd335-navbar-context-row .nd335-user-context {
  max-width: 26rem;
}

.nd335-navbar-actions-row .avatar {
  box-shadow: 0 0.25rem 0.8rem rgba(var(--bs-primary-rgb), 0.2);
}

.nd335-notification-toggle {
  position: relative;
  overflow: visible !important;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 999px !important;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.24);
  background: #fff !important;
  color: color-mix(in sRGB, var(--bs-primary) 72%, #123f2a) !important;
  box-shadow: 0 0.08rem 0.36rem rgba(var(--bs-primary-rgb), 0.12);
}

.nd335-notification-toggle .icon-base,
.nd335-notification-toggle i {
  color: inherit !important;
}

.nd335-notification-toggle:hover,
.nd335-notification-toggle:focus,
.nd335-notification-toggle.show {
  background: #fff !important;
  color: color-mix(in sRGB, var(--bs-primary) 72%, #123f2a) !important;
  border-color: rgba(var(--bs-primary-rgb), 0.36);
  box-shadow: 0 0 0 0.16rem rgba(var(--bs-primary-rgb), 0.12);
}

.nd335-notification-count {
  position: absolute;
  top: 0;
  right: 0;
  transform: translate(35%, -35%);
  z-index: 2;
  min-width: 1.1rem;
  height: 1.1rem;
  padding: 0 0.22rem;
  border-radius: 999px;
  background: #ff4c51;
  color: #fff;
  font-size: 0.64rem;
  font-weight: 700;
  line-height: 1.1rem;
  text-align: center;
  pointer-events: none;
}

.nd335-navbar-actions-row .nav-item.dropdown {
  overflow: visible;
}

.nd335-notification-menu {
  width: min(24rem, 92vw);
  border-radius: 0.85rem;
  border: 1px solid var(--nd335-border-color);
  box-shadow: var(--nd335-card-shadow);
}

.nd335-notification-list {
  max-height: 24rem;
  overflow: auto;
}

.nd335-notification-item {
  border-left: 0.2rem solid transparent;
}

.nd335-notification-item.nd335-notification-item-unread {
  border-left-color: var(--bs-primary);
  background-color: rgba(var(--bs-primary-rgb), 0.08);
}

/* Custom styles goes here */
.m01-page {
  --bs-card-spacer-y: var(--nd335-card-padding-y);
  --bs-card-spacer-x: var(--nd335-card-padding-x);
}

.m01-page .mb-4 {
  margin-bottom: 0.55rem !important;
}

.m01-page .mb-3 {
  margin-bottom: 0.42rem !important;
}

.m01-page .mt-4 {
  margin-top: 0.55rem !important;
}

.m01-page .row.g-4 {
  --bs-gutter-x: 0.62rem;
  --bs-gutter-y: 0.62rem;
}

.m01-page .row.g-3 {
  --bs-gutter-x: 0.48rem;
  --bs-gutter-y: 0.48rem;
}

.m01-page .card,
.m01-page .m01-card {
  border: 1px solid color-mix(in sRGB, var(--nd335-border-color) 92%, rgba(var(--bs-primary-rgb), 0.08));
  box-shadow: var(--nd335-card-shadow-soft);
  border-radius: var(--nd335-radius-lg);
  background: var(--nd335-surface-card);
}

.m01-page .nd335-page-header {
  padding: 0.05rem 0 0.3rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.m01-page .nd335-page-header p {
  color: var(--nd335-muted-color);
  margin-bottom: 0;
}

/* Hide context-description subtitles globally on main/sub forms */
.m01-page .nd335-page-header > div > p,
.m01-page .nd335-page-header > p,
.m01-page .card-header > p.text-body-secondary,
.m01-page .card-header > small,
.m01-page .m01-card > .card-header > p.text-body-secondary,
.m01-page .m01-card > .card-header > small,
.m01-page .card-header .text-body-secondary,
.m01-page .nd335-context-description {
  display: none !important;
}

.m01-page .m01-card .m01-card,
.m01-page .m01-card .card {
  border-color: transparent;
  box-shadow: none;
  background: transparent;
}

.m01-page .card-header {
  border-bottom: 1px solid var(--nd335-border-color);
  background: color-mix(in sRGB, var(--nd335-surface-card) 91%, rgba(var(--bs-primary-rgb), 0.06));
  padding: 0.52rem var(--nd335-card-padding-x);
}

.m01-page .card-body {
  padding: var(--nd335-card-padding-y) var(--nd335-card-padding-x);
}

.m01-page .card-footer {
  border-top: 1px solid var(--nd335-border-color);
  background: color-mix(in sRGB, var(--nd335-surface-card) 92%, rgba(var(--bs-primary-rgb), 0.06));
  padding: 0.5rem var(--nd335-card-padding-x);
}

.m01-page .card-header h4,
.m01-page .card-header h5,
.m01-page .card-header h6 {
  color: var(--nd335-title-color);
  font-weight: 700;
}

.m01-page .form-label {
  margin-bottom: 0.2rem;
  color: var(--nd335-muted-color);
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.m01-page .form-label.nd335-label-with-icon,
.m01-page .col-form-label.nd335-label-with-icon,
.modal .form-label.nd335-label-with-icon,
.modal .col-form-label.nd335-label-with-icon {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.nd335-label-icon {
  font-size: 0.86rem;
  line-height: 1;
  color: rgba(var(--bs-primary-rgb), 0.95);
  font-weight: 700;
}

.m01-page .form-control,
.m01-page .form-select {
  border-radius: var(--nd335-radius-sm);
  border-color: color-mix(in sRGB, var(--nd335-border-color) 72%, rgba(var(--bs-primary-rgb), 0.2));
  background: color-mix(in sRGB, var(--nd335-surface-card) 96%, rgba(var(--bs-primary-rgb), 0.03));
  transition: var(--nd335-transition);
}

.m01-page .form-select {
  padding-right: 2.2rem;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.45;
  padding-top: 0.45rem;
  padding-bottom: 0.45rem;
}

.m01-page .form-control:focus,
.m01-page .form-select:focus {
  border-color: rgba(var(--bs-primary-rgb), 0.56);
  box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.15);
}

.m01-page .form-control[readonly],
.m01-page .form-select[disabled] {
  background: color-mix(in sRGB, var(--nd335-surface-card) 84%, #e9edf5);
  color: color-mix(in sRGB, var(--nd335-muted-color) 94%, #ffffff);
}

.m01-page .btn {
  border-radius: var(--nd335-radius-sm);
  font-weight: 600;
  min-height: var(--nd335-control-height);
  transition: var(--nd335-transition);
}

.m01-page .btn.btn-sm {
  min-height: 1.82rem;
  border-radius: 0.5rem;
}

.m01-page .btn.btn-lg {
  border-radius: 0.72rem;
}

.m01-page .btn-primary {
  border-color: color-mix(in sRGB, var(--bs-primary) 88%, #0e2e19);
  background: linear-gradient(
    72deg,
    color-mix(in sRGB, var(--bs-primary) 86%, #000) 0%,
    var(--bs-primary) 100%
  );
  box-shadow: 0 0.25rem 0.65rem rgba(var(--bs-primary-rgb), 0.22);
}

.m01-page .btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 0.35rem 0.8rem rgba(var(--bs-primary-rgb), 0.26);
}

.m01-page .btn-outline-primary {
  border-color: rgba(var(--bs-primary-rgb), 0.5);
  color: color-mix(in sRGB, var(--bs-primary) 84%, #153f29);
  background: color-mix(in sRGB, var(--nd335-surface-card) 90%, rgba(var(--bs-primary-rgb), 0.08));
}

.m01-page .btn-outline-primary:hover,
.m01-page .btn-outline-primary:focus,
.m01-page .btn-outline-primary:active {
  border-color: var(--bs-primary);
  color: #fff;
  background: var(--bs-primary);
}

.m01-page .btn-outline-secondary {
  border-color: color-mix(in sRGB, var(--nd335-border-color) 68%, rgba(75, 70, 92, 0.25));
  color: color-mix(in sRGB, var(--nd335-muted-color) 92%, #ffffff);
  background: color-mix(in sRGB, var(--nd335-surface-card) 93%, #eef1f7);
}

.m01-page .btn-outline-secondary:hover {
  background: #eceff5;
  border-color: color-mix(in sRGB, var(--nd335-border-color) 52%, rgba(75, 70, 92, 0.38));
}

.m01-page .btn i[class^='ri-'],
.m01-page .btn i[class*=' ri-'] {
  font-size: 1rem;
  line-height: 1;
}

.m01-page .badge {
  border-radius: 999px;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.m01-page .bg-label-primary,
.m01-page .bg-label-success,
.m01-page .bg-label-info,
.m01-page .bg-label-warning,
.m01-page .bg-label-danger,
.m01-page .bg-label-secondary {
  border: 1px solid color-mix(in sRGB, var(--nd335-border-color) 62%, rgba(var(--bs-primary-rgb), 0.25));
}

.m01-page .table-responsive {
  border-radius: 0 0 var(--nd335-radius-lg) var(--nd335-radius-lg);
}

.m01-page .table {
  margin-bottom: 0;
}

.table thead th,
.table > :not(caption) > thead > tr > th {
  font-weight: 800 !important;
}

.table:not(.table-dark) thead th,
.table:not(.table-dark) > :not(caption) > thead > tr > th {
  color: var(--nd335-title-color);
}

.m01-page .table thead th {
  background: var(--nd335-table-head-bg);
  border-bottom: 1px solid var(--nd335-border-color);
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--nd335-muted-color);
}

.m01-page .table tbody tr > * {
  border-color: var(--nd335-border-color);
}

.m01-page .table-hover tbody tr:hover > * {
  background: var(--nd335-table-row-hover);
}

.m01-page .m01-subnav .nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.22);
  color: #6d6782;
  background-color: #fff;
}

.m01-page .m01-subnav .nav-link.active {
  color: #fff;
  border-color: var(--bs-primary);
  background: linear-gradient(
    72deg,
    color-mix(in sRGB, var(--bs-primary) 86%, #000) 0%,
    var(--bs-primary) 100%
  );
}

.m01-page .m01-title {
  color: var(--nd335-title-color);
  font-weight: 800;
  letter-spacing: 0.01em;
}

.m01-page .m01-title i {
  width: 2.05rem;
  height: 2.05rem;
  border-radius: 0.58rem;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.78);
  background: linear-gradient(
    145deg,
    color-mix(in sRGB, var(--bs-primary) 84%, #000) 0%,
    var(--bs-primary) 100%
  );
  color: #fff !important;
  box-shadow: 0 0.28rem 0.7rem rgba(var(--bs-primary-rgb), 0.32);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.m01-page .m01-title i::before {
  font-size: 1.02rem;
  line-height: 1;
}

.nd335-title-icon {
  width: 1.9rem;
  height: 1.9rem;
  border-radius: 0.52rem;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.74);
  background: linear-gradient(
    145deg,
    color-mix(in sRGB, var(--bs-primary) 84%, #000) 0%,
    var(--bs-primary) 100%
  );
  color: #fff !important;
  box-shadow: 0 0.24rem 0.62rem rgba(var(--bs-primary-rgb), 0.28);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.nd335-title-icon::before {
  font-size: 0.98rem;
  line-height: 1;
}

.m01-page .card-header i[class^='ri-'],
.m01-page .card-header i[class*=' ri-'] {
  font-size: 1.02rem;
}

.m01-page .m01-action-primary {
  min-width: 8.5rem;
  font-weight: 600;
  box-shadow: 0 0.25rem 0.55rem rgba(var(--bs-primary-rgb), 0.2);
}

.m01-page .m01-filter-card .card-body {
  padding-top: 0.45rem;
  padding-bottom: 0.45rem;
}

.m01-page .m01-filter-card .card-header {
  border-bottom: 1px solid var(--nd335-border-color);
  background: color-mix(in sRGB, var(--nd335-surface-card) 88%, rgba(var(--bs-primary-rgb), 0.08));
}

.m01-page .m01-inline-toolbar .form-control,
.m01-page .m01-inline-toolbar .form-select,
.m01-page .m01-inline-toolbar .btn {
  min-height: var(--nd335-control-height);
}

.m01-page .m01-table-filter {
  display: flex;
  align-items: center;
  gap: 0.32rem;
  flex-wrap: nowrap;
  margin-left: auto;
}

.m01-page .m01-table-filter-search {
  min-width: 13.5rem;
  width: 13.5rem;
}

.m01-page .m01-table-filter-sort {
  min-width: 7.4rem;
  width: 7.4rem;
}

.m01-page .m01-table-filter-btn {
  min-width: 5.4rem;
  width: 5.4rem;
}

.m01-page .m01-filter-card .form-control,
.m01-page .m01-filter-card .form-select,
.m01-page .m01-filter-card .btn,
.m01-page .m01-query-form .form-control,
.m01-page .m01-query-form .form-select,
.m01-page .m01-query-form .btn {
  min-height: var(--nd335-control-height);
}

.m01-page .m01-inline-toolbar.row {
  --nd335-filter-gap: 0.45rem;
  display: flex;
  flex-wrap: nowrap;
  align-items: center !important;
  gap: var(--nd335-filter-gap);
  margin: 0 !important;
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

.m01-page .m01-inline-toolbar.row > [class*='col-'] {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  flex: 1 1 0;
  min-width: 9.25rem;
  max-width: none;
  width: auto;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.m01-page .m01-inline-toolbar.row > [class*='col-'].nd335-inline-submit-group {
  flex: 0 0 8rem;
  min-width: 8rem;
}

.m01-page .m01-inline-toolbar.row > [class*='col-'].nd335-inline-overflow-group {
  flex: 0 0 10rem;
  min-width: 10rem;
}

.m01-page .m01-inline-toolbar.row > [class*='col-'] > .form-label {
  margin-bottom: 0;
  white-space: nowrap;
  flex: 0 0 auto;
  max-width: none;
  overflow: visible;
  text-overflow: clip;
}

.m01-page .m01-inline-toolbar.row > [class*='col-'] > .form-control,
.m01-page .m01-inline-toolbar.row > [class*='col-'] > .form-select,
.m01-page .m01-inline-toolbar.row > [class*='col-'] > .form-text,
.m01-page .m01-inline-toolbar.row > [class*='col-'] > .input-group {
  flex: 1 1 auto;
  min-width: 0;
  margin-bottom: 0;
}

.m01-page .m01-inline-toolbar.row > [class*='col-'] > .form-control,
.m01-page .m01-inline-toolbar.row > [class*='col-'] > .form-select {
  max-width: none;
  width: 100%;
}

.m01-page .m01-inline-toolbar.row > [class*='col-'] > .form-control,
.m01-page .m01-inline-toolbar.row > [class*='col-'] > .form-select,
.m01-page .m01-inline-toolbar.row > [class*='col-'] > .btn {
  min-height: var(--nd335-control-height);
}

.m01-page .m01-inline-toolbar.row > [class*='col-'] > .form-control,
.m01-page .m01-inline-toolbar.row > [class*='col-'] > .form-select {
  min-height: var(--nd335-control-height);
  height: auto;
  line-height: 1.45;
  padding-top: 0.45rem;
  padding-bottom: 0.45rem;
}

.m01-page .m01-inline-toolbar.row > [class*='col-'] > .btn {
  height: var(--nd335-control-height);
}

.m01-page .m01-inline-toolbar.row > [class*='col-'] > .btn,
.m01-page .m01-inline-toolbar.row > [class*='col-'] > .btn.w-100 {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.m11-page .m01-inline-toolbar.row > [class*='col-'].m11-cycle-filter-group {
  flex: 1.8 1 0;
  min-width: 16rem;
}

.m11-page .m01-inline-toolbar.row > [class*='col-'].m11-keyword-filter-group {
  flex: 1 1 0;
  min-width: 11rem;
}

.m01-page .m01-inline-toolbar .nd335-inline-overflow-menu {
  min-width: min(26rem, calc(100vw - 2.4rem));
  max-width: min(30rem, calc(100vw - 2.4rem));
  max-height: min(62vh, 28rem);
  overflow: auto;
}

.m01-page .m01-inline-toolbar .nd335-inline-overflow-menu > [class*='col-'] {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: none;
  padding: 0 !important;
  margin: 0 0 0.6rem;
}

.m01-page .m01-inline-toolbar .nd335-inline-overflow-menu > [class*='col-']:last-child {
  margin-bottom: 0;
}

.m01-page .m01-inline-toolbar .nd335-inline-overflow-menu > [class*='col-'] > .form-label {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin-bottom: 0.24rem;
  max-width: 100%;
}

.m01-page .m01-inline-toolbar .nd335-inline-overflow-menu > [class*='col-'] > .form-control,
.m01-page .m01-inline-toolbar .nd335-inline-overflow-menu > [class*='col-'] > .form-select,
.m01-page .m01-inline-toolbar .nd335-inline-overflow-menu > [class*='col-'] > .input-group {
  width: 100%;
  max-width: 100%;
}

.m14-report-page .nd335-report-advanced-filter-group {
  flex: 0 0 8.6rem !important;
  min-width: 8.6rem !important;
}

.m14-report-page .nd335-report-advanced-dropdown {
  width: min(28rem, calc(100vw - 2rem));
  max-width: min(28rem, calc(100vw - 2rem));
  max-height: min(66vh, 32rem);
  overflow: auto;
}

.m14-report-page .nd335-report-advanced-dropdown .form-label {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

.m14-report-page .m01-inline-toolbar.row {
  flex-wrap: wrap;
  overflow: visible;
}

.m14-report-page .m01-inline-toolbar.row > [class*='col-'] {
  flex: 1 1 13rem;
  min-width: 13rem;
}

.m14-report-page .m01-inline-toolbar.row > .nd335-report-advanced-filter-group {
  flex: 0 0 8.6rem !important;
  min-width: 8.6rem !important;
}

.m14-report-page .m01-inline-toolbar.row > [class*='col-']:last-child {
  flex: 0 0 8rem;
  min-width: 8rem;
}

.m14-report-page .nd335-chart-card .card-header {
  background: color-mix(in srgb, var(--nd335-surface-card) 90%, rgba(var(--bs-primary-rgb), 0.08));
}

.m14-report-page .nd335-chart {
  min-height: 320px;
}

.m14-report-page .nd335-chart.nd335-chart-tall {
  min-height: 360px;
}

.m14-report-page .nd335-chart-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px dashed color-mix(in srgb, var(--nd335-border-color) 70%, rgba(var(--bs-primary-rgb), 0.35));
  border-radius: 0.7rem;
  background: color-mix(in srgb, var(--nd335-surface-card) 92%, rgba(var(--bs-primary-rgb), 0.06));
}

.m14-report-page .nd335-chart-empty-text {
  color: var(--nd335-muted-color);
  font-size: 0.88rem;
  text-align: center;
  padding: 0.8rem;
}

@media (max-width: 1199.98px) {
  .m14-report-page .nd335-report-advanced-filter-group {
    flex: 0 0 8.1rem !important;
    min-width: 8.1rem !important;
  }

  .m14-report-page .m01-inline-toolbar.row > [class*='col-'] {
    flex: 1 1 100%;
    min-width: 0;
  }

  .m14-report-page .m01-inline-toolbar.row > [class*='col-']:last-child {
    flex: 0 0 100%;
    min-width: 0;
  }

  .m14-report-page .nd335-chart,
  .m14-report-page .nd335-chart.nd335-chart-tall {
    min-height: 300px;
  }
}

.m01-page .card-body > .row.g-2.align-items-end.w-100 {
  display: flex;
  flex-wrap: nowrap;
  align-items: center !important;
  gap: 0.45rem;
  margin: 0 !important;
}

.m01-page .card-body > .row.g-2.align-items-end.w-100 > [class*='col-'] {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  flex: 1 1 auto;
  min-width: 0;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.m01-page .card-body > .row.g-2.align-items-end.w-100 > [class*='col-'] > .form-label {
  margin-bottom: 0;
  white-space: nowrap;
  flex: 0 0 auto;
}

.m01-page .card-body > .row.g-2.align-items-end.w-100 > [class*='col-'] > .m01-inline-toolbar {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
}

.m01-page .m01-inline-toolbar .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding-top: 0;
  padding-bottom: 0;
}

.m01-page .m01-inline-toolbar .form-control,
.m01-page .m01-inline-toolbar .form-select {
  border-radius: 0.5rem;
}

.m01-page .m01-card .form-control:not(textarea),
.m01-page .m01-card .form-select {
  min-height: var(--nd335-control-height);
}

.m01-page .m01-table-card .m01-table-tools {
  width: 100%;
}

.m01-page .m01-table-card .card-header {
  background: color-mix(in sRGB, var(--nd335-surface-card) 88%, rgba(var(--bs-primary-rgb), 0.08));
  border-bottom: 1px solid var(--nd335-border-color);
}

.m01-page .m01-table-card .table thead th {
  font-size: 0.77rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--nd335-title-color);
}

.m01-page .table > :not(caption) > * > * {
  padding-top: var(--nd335-table-cell-py);
  padding-bottom: var(--nd335-table-cell-py);
  vertical-align: middle;
}

.m01-page .btn.btn-icon {
  width: 1.6rem;
  height: 1.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.45rem;
  padding: 0;
  font-size: 0.8rem;
}

.m01-page .m01-action-group {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.m01-page .card-footer .btn-group .btn {
  min-width: 3rem;
}

.m01-page .m01-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.m01-page .m01-footer .m01-pagination {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(75, 70, 92, 0.16);
  border-radius: 0.5rem;
  overflow: hidden;
}

.m01-page .m01-footer .m01-pagination .btn {
  border: 0;
  border-radius: 0;
  min-width: 3rem;
}

.m01-page .m01-footer .m01-pagination .btn + .btn {
  border-left: 1px solid rgba(75, 70, 92, 0.16);
}

.m01-page .m01-footer .m01-pagination .btn-primary {
  background: linear-gradient(
    72deg,
    color-mix(in sRGB, var(--bs-primary) 86%, #000) 0%,
    var(--bs-primary) 100%
  );
}

.m01-page .m01-alert {
  margin-bottom: 0.5rem;
  position: relative;
  padding-right: 2.5rem;
}

.m01-page .m01-alert .btn-close {
  position: absolute;
  top: 50%;
  right: 0.75rem;
  transform: translateY(-50%);
  width: 0.9rem;
  height: 0.9rem;
  padding: 0;
  margin: 0;
  background-size: 0.72rem;
  border: 0;
  opacity: 0.58;
}

.m01-page .m01-alert .btn-close:hover,
.m01-page .m01-alert .btn-close:focus {
  opacity: 0.85;
}

.m01-page .m01-alert .btn-close:focus {
  box-shadow: none;
}

.m01-page form.was-validated .form-control:invalid,
.m01-page form.was-validated .form-select:invalid {
  border-color: #ff4c51;
  box-shadow: 0 0 0 0.1rem rgba(255, 76, 81, 0.15);
}

.m01-page form.was-validated .form-control:valid,
.m01-page form.was-validated .form-select:valid {
  border-color: #28c76f;
  box-shadow: 0 0 0 0.1rem rgba(40, 199, 111, 0.12);
}

.m01-page .invalid-feedback {
  font-size: 0.8rem;
}

.m01-page .m01-assignment-side {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  border: 1px solid var(--nd335-border-color);
  border-radius: 0.65rem;
  padding: 0.8rem 0.9rem;
  background: color-mix(in sRGB, var(--nd335-surface-card) 90%, rgba(var(--bs-primary-rgb), 0.05));
  min-height: 100%;
}

.m01-page .m01-assignment-meta-item {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.m01-page .m01-assignment-status-badge {
  padding: 0.45rem 0.8rem;
  font-size: 0.88rem;
  font-weight: 800;
  align-self: flex-start;
}

.m01-page .m01-worklog-status-badge {
  min-width: 6.1rem;
  text-align: center;
}

.m01-page .nd335-work-details {
  min-width: 20rem;
}

.m01-page details.nd335-collapsible {
  border: 1px solid var(--nd335-border-color);
  border-radius: var(--nd335-radius-lg);
  box-shadow: var(--nd335-card-shadow-soft);
  background: var(--nd335-surface-card);
  overflow: hidden;
}

.m01-page .nd335-collapsible-summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.42rem;
  padding: 0.56rem var(--nd335-card-padding-x);
  background: color-mix(in sRGB, var(--nd335-surface-card) 91%, rgba(var(--bs-primary-rgb), 0.06));
  border-bottom: 1px solid transparent;
}

.m01-page details[open].nd335-collapsible > .nd335-collapsible-summary {
  border-bottom-color: var(--nd335-border-color);
}

.m01-page .nd335-collapsible-summary::-webkit-details-marker {
  display: none;
}

.m01-page .nd335-collapsible-summary::after {
  content: '+';
  font-weight: 700;
  font-size: 1.05rem;
  color: var(--nd335-muted-color);
  line-height: 1;
}

.m01-page details[open].nd335-collapsible > .nd335-collapsible-summary::after {
  content: '-';
}

.m01-page .nd335-collapsible-summary h5,
.m01-page .nd335-collapsible-summary h6 {
  margin: 0;
  color: var(--nd335-title-color);
}

.m01-page .nd335-work-details summary {
  color: var(--bs-primary);
  cursor: pointer;
  font-weight: 600;
  list-style: none;
}

.m01-page .nd335-work-details summary::-webkit-details-marker {
  display: none;
}

.m01-page .nd335-work-details[open] summary {
  margin-bottom: 0.5rem;
}

.m01-page .nd335-work-details .table {
  font-size: 0.82rem;
}

.nd335-product-hero {
  background: var(--nd335-hero-bg);
  overflow: hidden;
}

.nd335-product-hero .card-body {
  position: relative;
}

.nd335-product-hero::after {
  content: '';
  position: absolute;
  inset: auto -3.5rem -4.4rem auto;
  width: 15rem;
  height: 15rem;
  border-radius: 50%;
  background: rgba(var(--bs-primary-rgb), 0.12);
  filter: blur(2px);
}

.nd335-product-hero-media {
  position: relative;
  z-index: 1;
}

.nd335-product-hero-media img {
  max-height: 10.5rem;
  object-fit: contain;
}

.nd335-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.32rem 0.58rem;
  border-radius: 999px;
  font-size: 0.74rem;
  border: 1px solid var(--nd335-border-color);
  color: var(--nd335-muted-color);
  background: color-mix(in sRGB, var(--nd335-surface-card) 90%, rgba(var(--bs-primary-rgb), 0.08));
}

.nd335-kpi-card {
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.nd335-kpi-card:hover {
  transform: translateY(-2px);
}

.nd335-kpi-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.68rem;
}

.nd335-kpi-icon {
  width: 2rem;
  height: 2rem;
  border-radius: 0.58rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem;
  color: #fff;
}

.nd335-kpi-icon-primary { background: linear-gradient(135deg, #2ea44f, #4eb96c); }
.nd335-kpi-icon-info { background: linear-gradient(135deg, #03c3ec, #36d5f2); }
.nd335-kpi-icon-warning { background: linear-gradient(135deg, #ff9f43, #ffbf78); }
.nd335-kpi-icon-success { background: linear-gradient(135deg, #28c76f, #48d48a); }
.nd335-kpi-icon-danger { background: linear-gradient(135deg, #ea5455, #f4797b); }
.nd335-kpi-icon-secondary { background: linear-gradient(135deg, #8592a3, #a8b2bf); }

.nd335-kpi-value {
  font-size: 1.24rem;
  font-weight: 800;
  color: var(--nd335-title-color);
  line-height: 1.1;
}

.nd335-kpi-label {
  color: var(--nd335-muted-color);
  font-size: 0.8rem;
}

.nd335-section-title {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  color: var(--nd335-title-color);
}

.nd335-empty-inline {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.45rem;
}

.nd335-empty-inline img {
  width: 4rem;
  height: 4rem;
  object-fit: contain;
  opacity: 0.9;
}

.nd335-table-compact .table > :not(caption) > * > * {
  padding-top: 0.52rem;
  padding-bottom: 0.52rem;
}

@media (max-width: 991.98px) {
  .layout-navbar {
    border-radius: 0;
  }

  .m01-page .nd335-page-header {
    padding: 0.05rem 0 0.2rem;
  }

  .m01-page .nd335-page-header .m01-action-primary {
    width: 100%;
  }

  .nd335-user-context {
    max-width: 13rem;
  }

  .nd335-navbar-user-row {
    gap: 0.42rem;
  }

  .nd335-kpi-value {
    font-size: 1.2rem;
  }

  .nd335-product-hero-media img {
    max-height: 8rem;
  }
}

/* Signature login page */
.nd335-auth-signature {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.15rem;
  background:
    radial-gradient(circle at 12% 12%, rgba(var(--bs-primary-rgb), 0.24), transparent 36%),
    radial-gradient(circle at 88% 88%, rgba(3, 195, 236, 0.2), transparent 34%),
    linear-gradient(135deg, #edf8f1 0%, #eef5fb 52%, #f6fbff 100%);
}

.nd335-auth-signature::before,
.nd335-auth-signature::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  filter: blur(2px);
}

.nd335-auth-signature::before {
  width: 15rem;
  height: 15rem;
  left: -4.4rem;
  top: 5.6rem;
  background: rgba(var(--bs-primary-rgb), 0.15);
}

.nd335-auth-signature::after {
  width: 11rem;
  height: 11rem;
  right: -3.4rem;
  bottom: 4.2rem;
  background: rgba(3, 195, 236, 0.14);
}

.nd335-auth-surface {
  position: relative;
  z-index: 1;
  width: min(1120px, 100%);
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  border: 1px solid rgba(46, 164, 79, 0.2);
  border-radius: 1.1rem;
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(6px);
  box-shadow:
    0 1.2rem 2.6rem rgba(26, 64, 45, 0.15),
    0 0.3rem 0.9rem rgba(75, 70, 92, 0.08);
  overflow: hidden;
}

.nd335-auth-side {
  position: relative;
  padding: 1.7rem 1.65rem 1.55rem;
  background: linear-gradient(162deg, rgba(16, 185, 129, 0.2) 0%, rgba(52, 211, 153, 0.12) 34%, rgba(125, 211, 252, 0.16) 100%);
  border-right: 1px solid rgba(46, 164, 79, 0.2);
}

.nd335-auth-side::after {
  content: '';
  position: absolute;
  inset: auto -4.5rem -4.8rem auto;
  width: 12rem;
  height: 12rem;
  border-radius: 50%;
  background: radial-gradient(circle at center, rgba(var(--bs-primary-rgb), 0.22), rgba(var(--bs-primary-rgb), 0));
}

.nd335-auth-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.72rem;
  text-decoration: none;
  margin-bottom: 1.15rem;
}

.nd335-auth-brand-logo {
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 0.8rem;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(46, 164, 79, 0.2);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0.25rem 0.7rem rgba(46, 164, 79, 0.18);
}

.nd335-auth-brand-logo .nd335-brand-mark svg {
  width: 1.9rem;
  height: 1.9rem;
}

.nd335-auth-brand-copy {
  display: inline-flex;
  flex-direction: column;
}

.nd335-auth-brand-name {
  font-size: 1.08rem;
  line-height: 1.1;
  font-weight: 800;
  color: #1f2937;
}

.nd335-auth-brand-caption {
  margin-top: 0.12rem;
  font-size: 0.8rem;
  color: #4b5563;
  font-weight: 600;
}

.nd335-auth-side-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.74rem;
  font-weight: 700;
  color: #047857;
  border: 1px solid rgba(4, 120, 87, 0.24);
  border-radius: 999px;
  padding: 0.3rem 0.58rem;
  background: rgba(236, 253, 245, 0.9);
}

.nd335-auth-side-title {
  margin: 0.8rem 0 0.55rem;
  font-size: clamp(1.32rem, 1.1rem + 0.9vw, 1.72rem);
  line-height: 1.2;
  color: #111827;
  font-weight: 800;
  max-width: 34rem;
}

.nd335-auth-side-text {
  margin: 0;
  color: #334155;
  max-width: 34rem;
  font-size: 0.92rem;
}

.nd335-auth-principle-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
  margin-top: 0.95rem;
}

.nd335-auth-principle {
  padding: 0.58rem 0.62rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(46, 164, 79, 0.2);
  background: rgba(255, 255, 255, 0.8);
  box-shadow: 0 0.22rem 0.5rem rgba(46, 164, 79, 0.08);
}

.nd335-auth-principle i {
  display: inline-flex;
  font-size: 1rem;
  color: #059669;
  margin-bottom: 0.2rem;
}

.nd335-auth-principle h3 {
  margin: 0;
  font-size: 0.82rem;
  color: #1f2937;
  font-weight: 700;
}

.nd335-auth-principle p {
  margin: 0.14rem 0 0;
  font-size: 0.76rem;
  line-height: 1.34;
  color: #4b5563;
}

.nd335-auth-score {
  margin-top: 0.92rem;
  display: grid;
  gap: 0.44rem;
}

.nd335-auth-score-row {
  display: grid;
  align-items: center;
  gap: 0.5rem;
  grid-template-columns: 5.15rem minmax(0, 1fr) 2rem;
  font-size: 0.8rem;
  color: #374151;
}

.nd335-auth-score-row strong {
  font-size: 0.86rem;
  color: #0f766e;
  text-align: right;
}

.nd335-auth-score-bar {
  position: relative;
  height: 0.44rem;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(148, 163, 184, 0.35);
}

.nd335-auth-score-bar > span {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #10b981 0%, #34d399 45%, #22d3ee 100%);
}

.nd335-auth-form-panel {
  padding: 1.65rem 1.65rem 1.5rem;
  background: rgba(255, 255, 255, 0.95);
}

.nd335-auth-form-brand {
  display: flex;
  justify-content: center;
  margin-bottom: 0.5rem;
}

.nd335-auth-form-brand-logo {
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 0.88rem;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(46, 164, 79, 0.24);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0.28rem 0.82rem rgba(46, 164, 79, 0.2);
}

.nd335-auth-form-brand-logo .nd335-brand-mark svg {
  width: 2.35rem;
  height: 2.35rem;
}

.nd335-auth-form-title {
  margin: 0;
  font-size: 1.52rem;
  font-weight: 800;
  color: #1f2937;
  text-align: center;
}

.nd335-auth-form-subtitle {
  margin: 0.46rem 0 1.1rem;
  font-size: 0.9rem;
  color: #475569;
  line-height: 1.45;
  text-align: center;
}

.nd335-auth-form .form-control,
.nd335-auth-form .input-group-text {
  min-height: 2.78rem;
  border-color: rgba(100, 116, 139, 0.3);
}

.nd335-auth-form .form-control {
  border-radius: 0.72rem;
  background: #fff;
}

.nd335-auth-form .form-control:focus {
  border-color: rgba(var(--bs-primary-rgb), 0.64);
  box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.13);
}

.nd335-auth-form .input-group-merge .form-control {
  border-right: 0;
  border-radius: 0.72rem 0 0 0.72rem;
}

.nd335-auth-form .input-group-merge .input-group-text {
  border-left: 0;
  border-radius: 0 0.72rem 0.72rem 0;
  background: #fff;
  color: #64748b;
}

.nd335-auth-form .form-floating-outline .form-control,
.nd335-auth-form .form-floating-outline .form-select {
  padding-top: 1.05rem;
  padding-bottom: 0.42rem;
}

.nd335-auth-submit {
  min-height: 2.8rem;
  border-radius: 0.78rem;
  border: 0;
  font-weight: 700;
  font-size: 1rem;
  background: linear-gradient(90deg, #16a34a 0%, #22c55e 46%, #16a34a 100%);
  box-shadow: 0 0.46rem 1rem rgba(34, 197, 94, 0.32);
}

.nd335-auth-submit:hover,
.nd335-auth-submit:focus {
  background: linear-gradient(90deg, #15803d 0%, #16a34a 46%, #15803d 100%);
  transform: translateY(-1px);
}

.nd335-auth-support {
  margin: 0.95rem 0 0;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.82rem;
  color: #475569;
}

.nd335-auth-support i {
  color: #0f766e;
}

@media (max-width: 1199.98px) {
  .nd335-auth-principle-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .nd335-auth-signature {
    padding: 0.8rem;
  }

  .nd335-auth-surface {
    grid-template-columns: 1fr;
  }

  .nd335-auth-side {
    border-right: 0;
    border-bottom: 1px solid rgba(46, 164, 79, 0.2);
    padding: 1.2rem 1.15rem;
  }

  .nd335-auth-form-panel {
    padding: 1.2rem 1.15rem 1.1rem;
  }

  .nd335-auth-side-title {
    max-width: none;
  }
}

@media (max-width: 575.98px) {
  .nd335-auth-principle-grid {
    grid-template-columns: 1fr;
  }

  .nd335-auth-score-row {
    grid-template-columns: 4.8rem minmax(0, 1fr) 1.9rem;
  }
}

.nd335-metric-label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  line-height: 1.25;
}

.nd335-info-hint {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1rem;
  height: 1rem;
  border-radius: 999px;
  color: #0f766e;
  background: rgba(16, 185, 129, 0.12);
  cursor: help;
  outline: none;
  flex: 0 0 auto;
}

.nd335-info-hint i {
  font-size: 0.72rem;
  line-height: 1;
}

.nd335-info-hint__bubble {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 0.5rem);
  transform: translateX(-50%) translateY(0.35rem);
  min-width: 10rem;
  max-width: 17rem;
  padding: 0.42rem 0.55rem;
  border-radius: 0.45rem;
  background: #1f2937;
  color: #fff;
  font-size: 0.73rem;
  line-height: 1.35;
  box-shadow: 0 0.6rem 1.2rem rgba(31, 41, 55, 0.25);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 1060;
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
}

.nd335-info-hint__bubble::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  border-width: 0.32rem;
  border-style: solid;
  border-color: #1f2937 transparent transparent transparent;
}

.nd335-info-hint:hover .nd335-info-hint__bubble,
.nd335-info-hint:focus .nd335-info-hint__bubble,
.nd335-info-hint:focus-visible .nd335-info-hint__bubble {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

.nd335-preview-metrics > [class*="col-"] {
  display: flex;
}

.nd335-preview-metric-card {
  width: 100%;
  min-height: 106px;
  display: flex;
  flex-direction: column;
}

.nd335-preview-metric-value {
  margin-top: auto;
  line-height: 1.15;
}