/* /App.razor.rz.scp.css */
/* Auth gate styles now live in MainLayout.razor.css as the loading curtain */
/* /Layout/MainLayout.razor.rz.scp.css */
/* ─────────────────────────────────────────────────────────
   Page Shell
   ───────────────────────────────────────────────────────── */

.page[b-yd8f1es1tu] {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background: var(--grc-bg);
}

main[b-yd8f1es1tu] {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
}

/* ─────────────────────────────────────────────────────────
   Sidebar
   ───────────────────────────────────────────────────────── */

.sidebar[b-yd8f1es1tu] {
  background: linear-gradient(170deg, var(--grc-navy) 0%, var(--grc-navy-dark, #091A36) 100%);
  position: relative;
  flex-shrink: 0;
}

/* Micro dot-grid texture — adds depth without noise */
.sidebar[b-yd8f1es1tu]::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(255,255,255,0.045) 1px, transparent 1px);
  background-size: 18px 18px;
  pointer-events: none;
  z-index: 0;
}

/* ─────────────────────────────────────────────────────────
   Top Bar
   ───────────────────────────────────────────────────────── */

.top-row[b-yd8f1es1tu] {
  background: var(--grc-white);
  border-bottom: 1px solid var(--grc-border);
  justify-content: flex-end;
  height: 58px;
  display: flex;
  align-items: center;
  padding: 0 1.75rem !important;
  position: sticky;
  top: 0;
  z-index: 20;
  box-shadow: 0 1px 4px rgba(13,36,71,0.04);
}

/* ─────────────────────────────────────────────────────────
   Alpha Environment Banner
   ───────────────────────────────────────────────────────── */

.alpha-banner[b-yd8f1es1tu] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.3rem 1rem;
  background: linear-gradient(90deg, #F59E0B, #D97706);
  color: #78350F;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.4;
  position: sticky;
  top: 58px;
  z-index: 19;
  text-align: center;
}

.alpha-banner-badge[b-yd8f1es1tu] {
  display: inline-block;
  background: rgba(120, 53, 15, 0.18);
  color: #78350F;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.1rem 0.5rem;
  border-radius: 9999px;
  line-height: 1.4;
}

/* ─────────────────────────────────────────────────────────
   Content Area
   ───────────────────────────────────────────────────────── */

article.content[b-yd8f1es1tu] {
  flex: 1;
  padding: 2rem 2.25rem !important;
}

/* ─────────────────────────────────────────────────────────
   Unauthenticated layout — full-bleed branded background
   ───────────────────────────────────────────────────────── */

main.main-unauth[b-yd8f1es1tu] {
  position: relative;
  background: linear-gradient(170deg, var(--grc-navy) 0%, var(--grc-navy-dark, #091A36) 100%);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: clip;
  padding: 2.5rem 1rem;
}

/* Same dot-grid texture as the sidebar */
main.main-unauth[b-yd8f1es1tu]::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(255,255,255,0.045) 1px, transparent 1px);
  background-size: 18px 18px;
  pointer-events: none;
  z-index: 0;
}

/* Elevate content above dot-grid and orbs */
.auth-brand-header[b-yd8f1es1tu],
main.main-unauth[b-yd8f1es1tu]  article.content {
  position: relative;
  z-index: 1;
}

/* Let article size to its content so the brand header + card center as one group */
main.main-unauth article.content[b-yd8f1es1tu] {
  flex: 0 0 auto;
  padding-top: 1rem !important;
}

/* ─────────────────────────────────────────────────────────
   Unauthenticated — centred branding header
   ───────────────────────────────────────────────────────── */

.auth-brand-header[b-yd8f1es1tu] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1.5rem 1rem 0;
  gap: 0.6rem;
  animation: grc-slide-up 0.5s var(--grc-ease) both;
}

.auth-brand-logo[b-yd8f1es1tu] {
  height: 52px;
  object-fit: contain;
  filter: drop-shadow(0 0 12px var(--grc-teal-glow));
}

.auth-brand-name[b-yd8f1es1tu] {
  font-family: 'Instrument Serif', serif;
  font-size: 1.75rem;
  font-weight: 400;
  color: #fff;
  letter-spacing: -0.01em;
}

/* ─────────────────────────────────────────────────────────
   Ambient Orbs — floating gradient blurs on login bg
   ───────────────────────────────────────────────────────── */

.auth-orb[b-yd8f1es1tu] {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
  filter: blur(80px);
  opacity: 0.35;
  will-change: transform;
}

.auth-orb-1[b-yd8f1es1tu] {
  width: 400px;
  height: 400px;
  top: 5%;
  left: 5%;
  background: var(--grc-teal);
  animation: grc-float-orb 20s ease-in-out infinite;
}

.auth-orb-2[b-yd8f1es1tu] {
  width: 350px;
  height: 350px;
  bottom: 5%;
  right: 5%;
  background: var(--grc-navy-400);
  animation: grc-float-orb 25s ease-in-out infinite reverse;
}

.auth-orb-3[b-yd8f1es1tu] {
  width: 250px;
  height: 250px;
  top: 35%;
  left: 55%;
  background: var(--grc-teal-600);
  animation: grc-float-orb 18s ease-in-out infinite 5s;
}

/* ─────────────────────────────────────────────────────────
   Loading Curtain — navy overlay that covers the entire
   viewport during initial load, then fades away to reveal
   the ready layout underneath.
   ───────────────────────────────────────────────────────── */

.load-curtain[b-yd8f1es1tu] {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(170deg, var(--grc-navy) 0%, var(--grc-navy-dark, #091A36) 100%);
}

/* Dot-grid texture matching login + sidebar */
.load-curtain[b-yd8f1es1tu]::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(255,255,255,0.045) 1px, transparent 1px);
  background-size: 18px 18px;
  pointer-events: none;
}

.load-curtain-spinner[b-yd8f1es1tu] {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 3px solid rgba(255, 255, 255, 0.08);
  border-top-color: var(--grc-teal);
  animation: curtain-spin-b-yd8f1es1tu 0.7s linear infinite;
  position: relative;
  z-index: 1;
}

/* Fade-out state — played when layout is ready */
.load-curtain--out[b-yd8f1es1tu] {
  animation: curtain-fade-out-b-yd8f1es1tu 0.45s var(--grc-ease) both;
}

@keyframes curtain-spin-b-yd8f1es1tu {
  to { transform: rotate(360deg); }
}

@keyframes curtain-fade-out-b-yd8f1es1tu {
  from { opacity: 1; }
  to   { opacity: 0; pointer-events: none; }
}

@media (prefers-reduced-motion: reduce) {
  .load-curtain-spinner[b-yd8f1es1tu] { animation: none; }
  .load-curtain--out[b-yd8f1es1tu] { animation-duration: 0.01s; }
}

/* ─────────────────────────────────────────────────────────
   User Menu (::deep because it's a child component)
   ───────────────────────────────────────────────────────── */

[b-yd8f1es1tu] .user-menu { position: relative; }

[b-yd8f1es1tu] .user-menu-toggle {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: none;
  border: 1px solid transparent;
  cursor: pointer;
  padding: 0.3rem 0.55rem 0.3rem 0.4rem;
  border-radius: var(--grc-r-sm);
  color: var(--grc-text);
  font-family: 'Outfit', sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  transition: background-color var(--grc-fast) ease,
              border-color var(--grc-fast) ease;
}

[b-yd8f1es1tu] .user-menu-toggle:hover {
  background-color: var(--grc-bg);
  border-color: var(--grc-border);
}

[b-yd8f1es1tu] .user-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--grc-navy) 0%, var(--grc-navy-600) 100%);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 700;
  flex-shrink: 0;
  letter-spacing: 0;
}

[b-yd8f1es1tu] .user-avatar-lg {
  width: 2.75rem;
  height: 2.75rem;
  font-size: 1rem;
  border: 2px solid var(--grc-teal);
}

[b-yd8f1es1tu] .user-display-name {
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--grc-text);
}

[b-yd8f1es1tu] .user-caret {
  font-size: 0.5rem;
  color: var(--grc-text-3);
  margin-left: 0.1rem;
}

[b-yd8f1es1tu] .user-menu-backdrop {
  position: fixed;
  inset: 0;
  z-index: 99;
}

[b-yd8f1es1tu] .user-menu-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  min-width: 248px;
  background: var(--grc-white);
  border: 1px solid var(--grc-border);
  border-radius: var(--grc-r);
  box-shadow: var(--grc-shadow-lg);
  z-index: 100;
  padding: 0.375rem 0;
  animation: grc-slide-up 0.2s var(--grc-ease) both;
}

[b-yd8f1es1tu] .user-menu-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.875rem 1rem;
}

[b-yd8f1es1tu] .user-menu-item {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  padding: 0.5rem 1rem;
  background: none;
  border: none;
  border-left: 3px solid transparent;
  text-align: left;
  text-decoration: none;
  color: var(--grc-text-2);
  font-family: 'Outfit', sans-serif;
  font-size: 0.875rem;
  font-weight: 400;
  cursor: pointer;
  transition: background-color var(--grc-fast) ease,
              color var(--grc-fast) ease,
              border-color var(--grc-fast) ease;
}

[b-yd8f1es1tu] .user-menu-item:hover {
  background-color: var(--grc-bg);
  color: var(--grc-navy);
  border-left-color: var(--grc-teal);
}

[b-yd8f1es1tu] .user-menu-item-danger { color: #DC2626; }
[b-yd8f1es1tu] .user-menu-item-danger:hover {
  background-color: #FEF2F2;
  color: #B91C1C;
  border-left-color: #EF4444;
}

/* ─────────────────────────────────────────────────────────
   Responsive
   ───────────────────────────────────────────────────────── */

@media (max-width: 640.98px) {
  .top-row[b-yd8f1es1tu] { display: none; }
  article.content[b-yd8f1es1tu] { padding: 1.25rem 1rem !important; }

  .mobile-user-menu-slot[b-yd8f1es1tu] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 0.875rem 0.5rem;
    position: relative;
    z-index: 1;
  }

  [b-yd8f1es1tu] .mobile-user-menu-slot .user-display-name { display: none; }
  [b-yd8f1es1tu] .mobile-user-menu-slot .user-caret { display: none; }
}

@media (min-width: 641px) {
  .page[b-yd8f1es1tu] { flex-direction: row; }

  .sidebar[b-yd8f1es1tu] {
    width: 264px;
    height: 100vh;
    position: sticky;
    top: 0;
    transition: width 0.22s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
  }

  .sidebar.sidebar-collapsed[b-yd8f1es1tu] {
    width: 64px;
  }

  main[b-yd8f1es1tu] { flex: 1; overflow: auto; }

  article.content[b-yd8f1es1tu] { min-height: calc(100vh - 58px); }
}

/* Collapsed sidebar — hide text, center icons */
[b-yd8f1es1tu] .sidebar-collapsed .nav-label {
  opacity: 0;
  width: 0;
  overflow: hidden;
  pointer-events: none;
}

[b-yd8f1es1tu] .sidebar-collapsed .nav-brand-text {
  opacity: 0;
  width: 0;
  overflow: hidden;
  pointer-events: none;
}

[b-yd8f1es1tu] .sidebar-collapsed .nav-link {
  justify-content: center;
  padding-left: 0;
  padding-right: 0;
}

[b-yd8f1es1tu] .sidebar-collapsed .bi {
  margin-right: 0;
  transform: scale(1.1);
  transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1),
              margin 0.22s cubic-bezier(0.4, 0, 0.2, 1),
              opacity var(--grc-fast) ease;
}

[b-yd8f1es1tu] .sidebar-collapsed .nav-version {
  text-align: center;
  padding-left: 0;
  padding-right: 0;
}

[b-yd8f1es1tu] .sidebar-collapsed .nav-version-text {
  font-size: 0.55rem;
}

/* ─────────────────────────────────────────────────────────
   Mobile User Menu Slot
   ───────────────────────────────────────────────────────── */

.mobile-user-menu-slot[b-yd8f1es1tu] { display: none; }

/* Mobile: restore nav labels even when sidebar is collapsed */
@media (max-width: 640.98px) {
  [b-yd8f1es1tu] .sidebar-collapsed .nav-label {
    opacity: 1;
    width: auto;
    overflow: visible;
    pointer-events: auto;
  }

  [b-yd8f1es1tu] .sidebar-collapsed .nav-brand-text {
    opacity: 1;
    width: auto;
    overflow: visible;
    pointer-events: auto;
  }

  [b-yd8f1es1tu] .sidebar-collapsed .nav-link {
    justify-content: flex-start;
    padding-left: 0.875rem;
    padding-right: 0.875rem;
  }

  [b-yd8f1es1tu] .sidebar-collapsed .bi {
    margin-right: 0.7rem;
  }
}
/* /Layout/NavMenu.razor.rz.scp.css */
/* ─────────────────────────────────────────────────────────
   Nav Header (brand + collapse btn + mobile hamburger)
   ───────────────────────────────────────────────────────── */

.nav-header[b-0g2ckhs6o3] {
  height: 58px;
  min-height: 58px;
  display: flex;
  align-items: center;
  padding: 0 0.875rem;
  border-bottom: none;
  position: relative;
  z-index: 1;
  gap: 0.25rem;
}

/* Gradient separator replacing solid border */
.nav-header[b-0g2ckhs6o3]::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0.875rem;
  right: 0.875rem;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.12) 30%, rgba(255,255,255,0.12) 70%, transparent);
}

.nav-brand[b-0g2ckhs6o3] {
  font-family: 'Outfit', sans-serif;
  font-size: 0.95rem;
  font-weight: 700;
  color: #fff !important;
  letter-spacing: -0.01em;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 0.65rem;
  line-height: 1;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

/* Teal pulse dot — shown when no logo */
.nav-brand:not(:has(.nav-logo))[b-0g2ckhs6o3]::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  min-width: 8px;
  background: var(--grc-teal);
  border-radius: 50%;
  box-shadow: 0 0 0 3px var(--grc-teal-glow), 0 0 8px var(--grc-teal-glow);
  flex-shrink: 0;
}

.nav-logo[b-0g2ckhs6o3] {
  height: 26px;
  max-width: 80px;
  object-fit: contain;
  flex-shrink: 0;
  filter: drop-shadow(0 0 6px var(--grc-teal-glow));
}

.nav-brand-text[b-0g2ckhs6o3] {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: opacity 0.18s ease, width 0.22s cubic-bezier(0.4,0,0.2,1);
}

/* ─────────────────────────────────────────────────────────
   Collapse Button (desktop chevron)
   ───────────────────────────────────────────────────────── */

.nav-collapse-btn[b-0g2ckhs6o3] {
  display: none; /* shown only on desktop via media query */
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 6px;
  cursor: pointer;
  padding: 0;
  transition: background var(--grc-fast) ease;
}

.nav-collapse-btn:hover[b-0g2ckhs6o3] {
  background: rgba(255,255,255,0.14);
}

/* Chevron arrow via CSS border trick */
.nav-collapse-icon[b-0g2ckhs6o3] {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-left: 2px solid rgba(255,255,255,0.7);
  border-bottom: 2px solid rgba(255,255,255,0.7);
  transform: rotate(45deg) translateX(1px);
  transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

/* When collapsed, flip chevron to point right */
.nav-collapse-icon.is-collapsed[b-0g2ckhs6o3] {
  transform: rotate(-135deg) translateX(-1px);
}

/* ─────────────────────────────────────────────────────────
   Mobile Hamburger
   ───────────────────────────────────────────────────────── */

.nav-mobile-toggle[b-0g2ckhs6o3] {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  width: 36px;
  height: 36px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 6px;
  cursor: pointer;
  padding: 0 9px;
  flex-shrink: 0;
  transition: background var(--grc-fast) ease;
}

.nav-mobile-toggle:hover[b-0g2ckhs6o3] { background: rgba(255,255,255,0.15); }

.nav-mobile-toggle span[b-0g2ckhs6o3] {
  display: block;
  height: 2px;
  width: 100%;
  background: rgba(255,255,255,0.8);
  border-radius: 2px;
}

/* ─────────────────────────────────────────────────────────
   Nav Body
   ───────────────────────────────────────────────────────── */

.nav-body[b-0g2ckhs6o3] {
  padding: 0.875rem 0.75rem;
  overflow-y: auto;
  overflow-x: hidden;
  position: relative;
  z-index: 1;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,0.1) transparent;
  mask-image: linear-gradient(to bottom, transparent, black 20px, black calc(100% - 20px), transparent);
  -webkit-mask-image: linear-gradient(to bottom, transparent, black 20px, black calc(100% - 20px), transparent);
}

.nav-body[b-0g2ckhs6o3]::-webkit-scrollbar { width: 4px; }
.nav-body[b-0g2ckhs6o3]::-webkit-scrollbar-track { background: transparent; }
.nav-body[b-0g2ckhs6o3]::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 2px; }

/* ─────────────────────────────────────────────────────────
   Nav Links
   ───────────────────────────────────────────────────────── */

.nav[b-0g2ckhs6o3]  .nav-link {
  color: rgba(255,255,255,0.6);
  border-radius: 8px;
  height: 2.65rem;
  display: flex;
  align-items: center;
  padding: 0 0.875rem;
  font-family: 'Outfit', sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  text-decoration: none;
  border-left: 3px solid transparent;
  margin-bottom: 0.1rem;
  white-space: nowrap;
  overflow: hidden;
  position: relative;
  transition: background-color var(--grc-fast) ease,
              color var(--grc-fast) ease,
              border-color var(--grc-fast) ease,
              box-shadow var(--grc-mid) var(--grc-ease);
}

/* Animated left bar via pseudo-element */
.nav[b-0g2ckhs6o3]  .nav-link::before {
  content: '';
  position: absolute;
  left: 0;
  top: 20%;
  height: 60%;
  width: 3px;
  border-radius: 2px;
  background: rgba(255,255,255,0.3);
  transform: scaleY(0);
  transform-origin: center;
  transition: transform var(--grc-mid) var(--grc-ease),
              background var(--grc-fast) ease,
              box-shadow var(--grc-fast) ease;
}

.nav[b-0g2ckhs6o3]  .nav-link:hover {
  color: rgba(255,255,255,0.92);
  background: rgba(255,255,255,0.07);
  border-left-color: transparent;
}

.nav[b-0g2ckhs6o3]  .nav-link:hover::before {
  transform: scaleY(1);
}

.nav[b-0g2ckhs6o3]  .nav-link.active {
  color: #fff;
  background: linear-gradient(90deg, var(--grc-teal-50) 0%, transparent 70%);
  border-left-color: transparent;
  font-weight: 600;
  box-shadow: -4px 0 16px var(--grc-teal-glow),
              inset 4px 0 12px var(--grc-teal-50);
}

.nav[b-0g2ckhs6o3]  .nav-link.active::before {
  transform: scaleY(1);
  background: var(--grc-teal);
  box-shadow: 0 0 8px var(--grc-teal-glow);
}

/* ── Skeleton nav items ── */

.nav-skel-item[b-0g2ckhs6o3] {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.55rem 0.875rem;
  animation: grc-fade-in 0.3s var(--grc-ease) both;
}

.nav-skel-icon[b-0g2ckhs6o3] {
  width: 18px;
  height: 18px;
  border-radius: 4px;
  flex-shrink: 0;
}

.nav-skel-label[b-0g2ckhs6o3] {
  height: 12px;
  border-radius: 3px;
}

.nav-divider[b-0g2ckhs6o3] {
  flex: 1;
  min-height: 1rem;
  display: flex;
  align-items: flex-end;
  padding-bottom: 0.5rem;
}

.nav-divider[b-0g2ckhs6o3]::after {
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.08) 30%, rgba(255,255,255,0.08) 70%, transparent);
}

.nav.flex-column[b-0g2ckhs6o3] {
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* ─────────────────────────────────────────────────────────
   Nav Labels
   ───────────────────────────────────────────────────────── */

.nav-label[b-0g2ckhs6o3] {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: opacity 0.18s ease;
}

/* ─────────────────────────────────────────────────────────
   Nav Icons
   ───────────────────────────────────────────────────────── */

.bi[b-0g2ckhs6o3] {
  display: inline-block;
  position: relative;
  width: 1.05rem;
  height: 1.05rem;
  min-width: 1.05rem;
  margin-right: 0.7rem;
  top: -1px;
  background-size: cover;
  opacity: 0.6;
  flex-shrink: 0;
  transition: opacity var(--grc-fast) ease,
              margin var(--grc-fast) ease,
              transform var(--grc-mid) var(--grc-ease);
}

.nav[b-0g2ckhs6o3]  .nav-link:hover .bi,
.nav[b-0g2ckhs6o3]  .nav-link.active .bi {
  opacity: 1;
  transform: scale(1.08);
}

.bi-house-door-fill-nav-menu[b-0g2ckhs6o3] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-building-nav-menu[b-0g2ckhs6o3] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M4 2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1ZM4 5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM7.5 5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM4.5 8a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Z'/%3E%3Cpath d='M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V1Zm11 0H3v14h3v-2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5V15h3V1Z'/%3E%3C/svg%3E");
}

.bi-person-fill-nav-menu[b-0g2ckhs6o3] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E");
}

.bi-person-badge-fill-nav-menu[b-0g2ckhs6o3] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E");
}

.bi-people-fill-nav-menu[b-0g2ckhs6o3] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1H7Zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3Cpath fill-rule='evenodd' d='M5.216 14A2.238 2.238 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.325 6.325 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1h4.216Z'/%3E%3Cpath d='M4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5Z'/%3E%3C/svg%3E");
}

.bi-geo-fill-nav-menu[b-0g2ckhs6o3] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4 4a4 4 0 1 1 4.5 3.969V13.5a.5.5 0 0 1-1 0V7.97A4 4 0 0 1 4 3.999zm2.493 8.574a.5.5 0 0 1-.411.575c-.712.118-1.28.295-1.655.493a1.319 1.319 0 0 0-.37.265.301.301 0 0 0-.057.09V14l.002.008a.147.147 0 0 0 .016.033.617.617 0 0 0 .145.15c.165.13.435.27.813.395.751.25 1.82.414 3.024.414s2.273-.163 3.024-.414c.378-.126.648-.265.813-.395a.619.619 0 0 0 .146-.15.148.148 0 0 0 .015-.033L12 14v-.004a.301.301 0 0 0-.057-.09 1.318 1.318 0 0 0-.37-.264c-.376-.198-.943-.375-1.655-.493a.5.5 0 1 1 .164-.986c.77.127 1.452.328 1.957.594C12.5 13 13 13.4 13 14c0 .426-.26.752-.544.977-.29.228-.68.413-1.116.558-.878.293-2.059.465-3.34.465-1.281 0-2.462-.172-3.34-.465-.436-.145-.826-.33-1.116-.558C3.26 14.752 3 14.426 3 14c0-.599.5-1 .961-1.243.505-.266 1.187-.467 1.957-.594a.5.5 0 0 1 .575.411z'/%3E%3C/svg%3E");
}

.bi-calendar-check-fill-nav-menu[b-0g2ckhs6o3] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M4 .5a.5.5 0 0 0-1 0V1H2a2 2 0 0 0-2 2v1h16V3a2 2 0 0 0-2-2h-1V.5a.5.5 0 0 0-1 0V1H4V.5zM16 14V5H0v9a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2zm-5.146-5.146-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 0 1 .708-.708L7.5 10.793l2.646-2.647a.5.5 0 0 1 .708.708z'/%3E%3C/svg%3E");
}

.bi-bar-chart-fill-nav-menu[b-0g2ckhs6o3] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M4 11H2v3h2zm5-4H7v7h2zm5-5h-2v12h2zm-2-1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1zM6 7a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1zm-5 4a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1z'/%3E%3C/svg%3E");
}

.bi-question-circle-fill-nav-menu[b-0g2ckhs6o3] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.496 6.033h.825c.138 0 .248-.113.266-.25.09-.656.54-1.134 1.342-1.134.686 0 1.314.343 1.314 1.168 0 .635-.374.927-.965 1.371-.673.489-1.206 1.06-1.168 1.987l.003.217a.25.25 0 0 0 .25.246h.811a.25.25 0 0 0 .25-.25v-.105c0-.718.273-.927 1.01-1.486.609-.463 1.244-.977 1.244-2.056 0-1.511-1.276-2.241-2.673-2.241-1.267 0-2.655.59-2.75 2.286a.237.237 0 0 0 .241.247zm2.325 6.443c.61 0 1.029-.394 1.029-.927 0-.552-.42-.94-1.029-.94-.584 0-1.009.388-1.009.94 0 .533.425.927 1.01.927z'/%3E%3C/svg%3E");
}

.bi-gear-fill-nav-menu[b-0g2ckhs6o3] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M9.405 1.05c-.413-1.4-2.397-1.4-2.81 0l-.1.34a1.464 1.464 0 0 1-2.105.872l-.31-.17c-1.283-.698-2.686.705-1.987 1.987l.169.311c.446.82.023 1.841-.872 2.105l-.34.1c-1.4.413-1.4 2.397 0 2.81l.34.1a1.464 1.464 0 0 1 .872 2.105l-.17.31c-.698 1.283.705 2.686 1.987 1.987l.311-.169a1.464 1.464 0 0 1 2.105.872l.1.34c.413 1.4 2.397 1.4 2.81 0l.1-.34a1.464 1.464 0 0 1 2.105-.872l.31.17c1.283.698 2.686-.705 1.987-1.987l-.169-.311a1.464 1.464 0 0 1 .872-2.105l.34-.1c1.4-.413 1.4-2.397 0-2.81l-.34-.1a1.464 1.464 0 0 1-.872-2.105l.17-.31c.698-1.283-.705-2.686-1.987-1.987l-.311.169a1.464 1.464 0 0 1-2.105-.872l-.1-.34zM8 10.93a2.929 2.929 0 1 1 0-5.86 2.929 2.929 0 0 1 0 5.858z'/%3E%3C/svg%3E");
}

/* ─────────────────────────────────────────────────────────
   Edit Mode Bar
   ───────────────────────────────────────────────────────── */

.nav-edit-bar[b-0g2ckhs6o3] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 0.875rem;
  background: rgba(0, 197, 168, 0.1);
  border-bottom: 2px solid var(--grc-teal);
  gap: 0.5rem;
}

.nav-edit-label[b-0g2ckhs6o3] {
  font-family: 'Outfit', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--grc-teal);
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.nav-edit-actions[b-0g2ckhs6o3] {
  display: flex;
  gap: 0.375rem;
}

.nav-edit-done[b-0g2ckhs6o3],
.nav-edit-cancel[b-0g2ckhs6o3] {
  font-family: 'Outfit', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.25rem 0.625rem;
  border-radius: 5px;
  border: none;
  cursor: pointer;
  transition: background var(--grc-fast) ease, opacity var(--grc-fast) ease;
}

.nav-edit-done[b-0g2ckhs6o3] {
  background: var(--grc-teal);
  color: #fff;
}
.nav-edit-done:hover[b-0g2ckhs6o3] { background: var(--grc-teal-600); }
.nav-edit-done:disabled[b-0g2ckhs6o3] { opacity: 0.6; cursor: not-allowed; }

.nav-edit-cancel[b-0g2ckhs6o3] {
  background: rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.7);
}
.nav-edit-cancel:hover[b-0g2ckhs6o3] { background: rgba(255,255,255,0.18); color: #fff; }

/* ─────────────────────────────────────────────────────────
   Editable Nav Item Row
   ───────────────────────────────────────────────────────── */

.nav-item-edit[b-0g2ckhs6o3] {
  display: flex;
  align-items: center;
  height: 2.65rem;
  padding: 0 0.5rem;
  margin-bottom: 0.1rem;
  border-radius: 8px;
  border-left: 2.5px solid transparent;
  position: relative;
  transition: opacity var(--grc-fast) ease,
              background var(--grc-fast) ease,
              border-color var(--grc-fast) ease;
  cursor: grab;
}

.nav-item-edit:hover[b-0g2ckhs6o3] {
  background: rgba(255,255,255,0.05);
}

.nav-item-edit.is-hidden[b-0g2ckhs6o3] {
  opacity: 0.35;
  border-left-color: rgba(255,255,255,0.15);
  border-left-style: dashed;
}

.nav-item-edit.is-dragging[b-0g2ckhs6o3] {
  opacity: 0.5;
  background: rgba(0, 197, 168, 0.08);
}

.nav-drop-indicator[b-0g2ckhs6o3] {
  position: absolute;
  top: -2px;
  left: 0.5rem;
  right: 0.5rem;
  height: 2px;
  background: var(--grc-teal);
  border-radius: 1px;
  box-shadow: 0 0 6px rgba(0, 197, 168, 0.4);
  z-index: 2;
}

.nav-drag-handle[b-0g2ckhs6o3] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  min-width: 1.25rem;
  color: rgba(255,255,255,0.25);
  font-size: 1rem;
  cursor: grab;
  transition: color var(--grc-fast) ease;
}

.nav-item-edit:hover .nav-drag-handle[b-0g2ckhs6o3] {
  color: rgba(255,255,255,0.5);
}

.nav-item-edit-content[b-0g2ckhs6o3] {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0;
  gap: 0;
  overflow: hidden;
}

.nav-item-edit-content .bi[b-0g2ckhs6o3] {
  display: inline-block;
  position: relative;
  width: 1.05rem;
  height: 1.05rem;
  min-width: 1.05rem;
  margin-right: 0.7rem;
  top: -1px;
  background-size: cover;
  opacity: 0.6;
  flex-shrink: 0;
}

.nav-item-edit-content .nav-label[b-0g2ckhs6o3] {
  font-family: 'Outfit', sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  color: rgba(255,255,255,0.6);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nav-visibility-toggle[b-0g2ckhs6o3] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  min-width: 1.75rem;
  height: 1.75rem;
  background: none;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  color: rgba(255,255,255,0.3);
  font-size: 0.85rem;
  transition: color var(--grc-fast) ease, background var(--grc-fast) ease;
  flex-shrink: 0;
}

.nav-visibility-toggle:hover[b-0g2ckhs6o3] {
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.6);
}

.nav-visibility-toggle.is-visible[b-0g2ckhs6o3] {
  color: var(--grc-teal);
}

.nav-visibility-toggle.is-visible:hover[b-0g2ckhs6o3] {
  color: var(--grc-teal-600);
  background: rgba(0, 197, 168, 0.1);
}

/* Mobile reorder buttons — hidden on desktop */
.nav-mobile-reorder[b-0g2ckhs6o3] {
  display: none;
  flex-direction: column;
  gap: 1px;
  margin-left: 0.25rem;
}

.nav-reorder-btn[b-0g2ckhs6o3] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  background: none;
  border: none;
  border-radius: 3px;
  cursor: pointer;
  color: rgba(255,255,255,0.4);
  font-size: 0.7rem;
  padding: 0;
  transition: color var(--grc-fast) ease, background var(--grc-fast) ease;
}

.nav-reorder-btn:hover:not(:disabled)[b-0g2ckhs6o3] {
  background: rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.8);
}

.nav-reorder-btn:disabled[b-0g2ckhs6o3] {
  opacity: 0.2;
  cursor: not-allowed;
}

/* ─────────────────────────────────────────────────────────
   Customize Button
   ───────────────────────────────────────────────────────── */

.nav-customize-btn[b-0g2ckhs6o3] {
  display: flex;
  align-items: center;
  height: 2.25rem;
  padding: 0 0.875rem;
  margin-top: 0.25rem;
  background: none;
  border: none;
  border-radius: 8px;
  border-left: 2.5px solid transparent;
  cursor: pointer;
  color: rgba(255,255,255,0.3);
  font-family: 'Outfit', sans-serif;
  font-size: 0.8rem;
  font-weight: 500;
  transition: color var(--grc-fast) ease, background var(--grc-fast) ease;
  white-space: nowrap;
  overflow: hidden;
}

.nav-customize-btn:hover[b-0g2ckhs6o3] {
  color: rgba(255,255,255,0.6);
  background: rgba(255,255,255,0.05);
}

.nav-customize-btn i[b-0g2ckhs6o3] {
  font-size: 0.9rem;
  margin-right: 0.7rem;
  flex-shrink: 0;
}

/* ─────────────────────────────────────────────────────────
   Reset Button
   ───────────────────────────────────────────────────────── */

.nav-reset-btn[b-0g2ckhs6o3] {
  display: block;
  background: none;
  border: none;
  cursor: pointer;
  color: rgba(255,255,255,0.3);
  font-family: 'Outfit', sans-serif;
  font-size: 0.72rem;
  font-weight: 500;
  padding: 0.5rem 0.875rem;
  transition: color var(--grc-fast) ease;
}

.nav-reset-btn:hover[b-0g2ckhs6o3] {
  color: rgba(255,255,255,0.55);
}

/* ─────────────────────────────────────────────────────────
   Version Badge
   ───────────────────────────────────────────────────────── */

.nav-version[b-0g2ckhs6o3] {
  padding: 0.5rem 0.875rem 0.75rem;
  text-align: right;
}

.nav-version-text[b-0g2ckhs6o3] {
  font-family: 'Outfit', sans-serif;
  font-size: 0.65rem;
  font-weight: 500;
  color: rgba(255,255,255,0.18);
  letter-spacing: 0.04em;
  transition: color var(--grc-fast) ease;
}

.nav-version:hover .nav-version-text[b-0g2ckhs6o3] {
  color: rgba(255,255,255,0.35);
}

.alpha-badge[b-0g2ckhs6o3] {
  display: inline-block;
  background: #F59E0B;
  color: #78350F;
  font-family: 'Outfit', sans-serif;
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: 0.1rem 0.4rem;
  border-radius: 9999px;
  margin-right: 0.35rem;
  vertical-align: middle;
  line-height: 1.4;
}

/* Custom object icons use Bootstrap Icons font (not SVG background) */
.nav-custom-obj-icon[b-0g2ckhs6o3] {
  background-image: none !important;
  font-size: 1rem;
  line-height: 1.05rem;
  color: white;
  text-align: center;
}

/* ─────────────────────────────────────────────────────────
   Mobile
   ───────────────────────────────────────────────────────── */

@media (max-width: 640.98px) {
  .nav-collapse-btn[b-0g2ckhs6o3] { display: none !important; }

  .nav-body[b-0g2ckhs6o3] {
    max-height: 0;
    overflow: hidden;
    padding: 0 0.75rem;
    transition: max-height 0.32s var(--grc-ease), padding 0.32s ease;
  }

  .nav-body.mobile-open[b-0g2ckhs6o3] {
    max-height: 100vh;
    padding: 0.875rem 0.75rem;
  }

  /* Mobile: show up/down buttons, hide drag handle */
  .nav-drag-handle[b-0g2ckhs6o3] { display: none; }
  .nav-mobile-reorder[b-0g2ckhs6o3] { display: flex; }
}

/* ─────────────────────────────────────────────────────────
   Desktop
   ───────────────────────────────────────────────────────── */

@media (min-width: 641px) {
  .nav-mobile-toggle[b-0g2ckhs6o3] { display: none; }

  .nav-collapse-btn[b-0g2ckhs6o3] { display: flex; }

  .nav-body[b-0g2ckhs6o3] {
    height: calc(100vh - 58px);
    overflow-y: auto;
  }
}
/* /Pages/Admin/AdminSettings.razor.rz.scp.css */
.admin-header p[b-t6kojzh4v2] { font-size: 0.95rem; margin-top: 0.25rem; }

/* ── Settings card (no hover lift) ────────────────────── */

[b-t6kojzh4v2] .settings-card { transition: none !important; }
[b-t6kojzh4v2] .settings-card:hover { transform: none !important; box-shadow: var(--grc-shadow-sm) !important; }

/* Card containing the icon picker must sit above sibling cards so the dropdown panel clears them */
[b-t6kojzh4v2] .settings-card-picker { z-index: 10; }

/* ── Branding grid ─────────────────────────────────────── */

[b-t6kojzh4v2] .settings-grid { display: grid; gap: 2rem; }

@media (min-width: 900px) {
    [b-t6kojzh4v2] .settings-grid { grid-template-columns: 1fr 1fr; }
}

[b-t6kojzh4v2] .settings-section-title {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--grc-text-2);
    margin-bottom: 0.2rem;
}

[b-t6kojzh4v2] .settings-section-desc { font-size: 0.82rem; color: var(--grc-text-3); margin-bottom: 0.75rem; }

/* Logo */
[b-t6kojzh4v2] .logo-preview-wrap {
    display: flex;
    align-items: center;
    padding: 0.75rem;
    background: var(--grc-bg);
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r-sm);
    max-width: 320px;
    margin-bottom: 0.5rem;
}
[b-t6kojzh4v2] .logo-preview-img { max-height: 40px; max-width: 180px; object-fit: contain; }
[b-t6kojzh4v2] .logo-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 56px;
    max-width: 320px;
    background: var(--grc-bg);
    border: 1px dashed var(--grc-border-2);
    border-radius: var(--grc-r-sm);
    color: var(--grc-text-3);
    font-size: 0.825rem;
    margin-bottom: 0.5rem;
}

/* Colors */
[b-t6kojzh4v2] .color-fields { display: flex; flex-direction: column; gap: 1.1rem; }
[b-t6kojzh4v2] .color-field { display: flex; flex-direction: column; gap: 0.25rem; }
[b-t6kojzh4v2] .color-input-row { display: flex; align-items: center; gap: 0.5rem; }
[b-t6kojzh4v2] .color-swatch {
    width: 42px;
    height: 38px;
    border: 1px solid var(--grc-border-2);
    border-radius: var(--grc-r-sm);
    padding: 2px;
    cursor: pointer;
    background: none;
    flex-shrink: 0;
}
[b-t6kojzh4v2] .color-hex { width: 108px; font-family: 'Courier New', monospace; font-size: 0.875rem; letter-spacing: 0.04em; }
[b-t6kojzh4v2] .color-hint { font-size: 0.78rem; color: var(--grc-text-3); }

/* Save row */
[b-t6kojzh4v2] .settings-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding-top: 1.75rem;
    margin-top: 1.75rem;
    border-top: 1px solid var(--grc-border);
}

[b-t6kojzh4v2] .alert-success {
    background: var(--grc-teal-50);
    border: 1px solid var(--grc-teal);
    color: var(--grc-teal-600);
    border-radius: var(--grc-r-sm);
    font-size: 0.875rem;
    padding: 0.6rem 1rem;
}

/* ── Add user form ─────────────────────────────────────── */

[b-t6kojzh4v2] .add-user-form {
    background: var(--grc-bg);
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r);
    padding: 1.25rem;
}

/* ── Role filter pills ─────────────────────────────────── */

[b-t6kojzh4v2] .role-filter { display: flex; gap: 0.4rem; flex-wrap: wrap; }

[b-t6kojzh4v2] .role-pill {
    padding: 0.3rem 0.875rem;
    background: var(--grc-white);
    border: 1px solid var(--grc-border-2);
    border-radius: 20px;
    font-family: 'Outfit', sans-serif;
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--grc-text-2);
    cursor: pointer;
    transition: background-color var(--grc-fast) ease,
                border-color var(--grc-fast) ease,
                color var(--grc-fast) ease;
}

[b-t6kojzh4v2] .role-pill:hover { border-color: var(--grc-navy); color: var(--grc-navy); }

[b-t6kojzh4v2] .role-pill.active {
    background: var(--grc-navy);
    border-color: var(--grc-navy);
    color: #fff;
}

/* ── User table ────────────────────────────────────────── */

[b-t6kojzh4v2] .user-table { margin-bottom: 0; }

[b-t6kojzh4v2] .user-cell { display: flex; align-items: center; gap: 0.75rem; }

[b-t6kojzh4v2] .user-cell-avatar {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--grc-navy) 0%, var(--grc-navy-600) 100%);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.78rem;
    font-weight: 700;
    flex-shrink: 0;
}

[b-t6kojzh4v2] .user-cell-name { font-weight: 500; font-size: 0.9rem; }
[b-t6kojzh4v2] .user-cell-title { font-size: 0.78rem; color: var(--grc-text-3); }

[b-t6kojzh4v2] .role-select {
    width: auto;
    min-width: 100px;
    font-size: 0.8rem;
    padding: 0.25rem 0.5rem;
    cursor: pointer;
}

/* ── Delete confirmation ───────────────────────────────── */

[b-t6kojzh4v2] .delete-confirm-overlay {
    position: fixed;
    inset: 0;
    background: rgba(13,36,71,0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 200;
    backdrop-filter: blur(2px);
}

[b-t6kojzh4v2] .delete-confirm-box {
    background: var(--grc-white);
    border-radius: var(--grc-r);
    box-shadow: var(--grc-shadow-lift);
    padding: 1.75rem 2rem;
    max-width: 360px;
    width: 100%;
    animation: grc-slide-up 0.2s var(--grc-ease) both;
}

/* ── Relationship Labels ───────────────────────────── */

[b-t6kojzh4v2] .label-group {
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r);
    overflow: hidden;
    background: var(--grc-white);
    box-shadow: var(--grc-shadow-xs);
}

[b-t6kojzh4v2] .label-group-header {
    font-family: 'Outfit', sans-serif;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--grc-text-3);
    padding: 0.55rem 1rem;
    background: var(--grc-bg);
    border-bottom: 1px solid var(--grc-border);
    margin-bottom: 0;
}

[b-t6kojzh4v2] .label-group .user-table { margin-bottom: 0; }

[b-t6kojzh4v2] .label-group .user-table thead th {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--grc-text-3);
    border-bottom-width: 1px;
    border-color: var(--grc-border);
    padding: 0.5rem 0.75rem;
    background: var(--grc-white);
}

[b-t6kojzh4v2] .label-group .user-table tbody td {
    padding: 0.6rem 0.75rem;
    vertical-align: middle;
    font-size: 0.87rem;
    border-color: var(--grc-border);
}

[b-t6kojzh4v2] .label-group .user-table tbody tr:last-child td {
    border-bottom: none;
}

/* Relationship label badges */
[b-t6kojzh4v2] .rl-badge-promoted {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 600;
    background: var(--grc-teal-50);
    color: var(--grc-teal-600);
    border: 1px solid var(--grc-teal);
}

[b-t6kojzh4v2] .rl-badge-change {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 600;
    background: var(--grc-bg);
    color: var(--grc-text-2);
    border: 1px solid var(--grc-border-2);
}

/* ── Audit log ─────────────────────────────────────── */

[b-t6kojzh4v2] .audit-filters { }

[b-t6kojzh4v2] .audit-count-bar { border-bottom: 1px solid var(--grc-border); padding-bottom: 0.5rem; }

[b-t6kojzh4v2] .audit-table td { vertical-align: middle; }

/* Action badges */
[b-t6kojzh4v2] .audit-action-badge {
    display: inline-block;
    padding: 0.2rem 0.55rem;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

[b-t6kojzh4v2] .audit-badge-auth    { background: var(--grc-teal-50); color: var(--grc-teal-600); border: 1px solid var(--grc-teal); }
[b-t6kojzh4v2] .audit-badge-create  { background: #ecfdf5; color: #065f46; border: 1px solid #6ee7b7; }
[b-t6kojzh4v2] .audit-badge-update  { background: #eff6ff; color: #1e40af; border: 1px solid #93c5fd; }
[b-t6kojzh4v2] .audit-badge-delete  { background: #fef2f2; color: #991b1b; border: 1px solid #fca5a5; }
[b-t6kojzh4v2] .audit-badge-complete { background: #f0fdf4; color: #166534; border: 1px solid #86efac; }
[b-t6kojzh4v2] .audit-badge-neutral { background: var(--grc-bg); color: var(--grc-text-2); border: 1px solid var(--grc-border-2); }

/* ── Built-in fields: search toolbar & sortable headers ── */

[b-t6kojzh4v2] .field-search-wrap {
    position: relative;
    flex: 1;
    max-width: 280px;
}

[b-t6kojzh4v2] .field-search-icon {
    position: absolute;
    left: 0.6rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1rem;
    color: var(--grc-text-3);
    pointer-events: none;
    line-height: 1;
}

[b-t6kojzh4v2] .field-search-input {
    width: 100%;
    padding: 0.3rem 0.75rem 0.3rem 2rem;
    font-size: 0.82rem;
    font-family: inherit;
    color: var(--grc-text-1, #111);
    background: var(--grc-white, #fff);
    border: 1px solid var(--grc-border-2, #d1d5db);
    border-radius: var(--grc-r-sm);
    outline: none;
    transition: border-color var(--grc-fast) ease, box-shadow var(--grc-fast) ease;
    /* remove native x in webkit */
    -webkit-appearance: none;
}

[b-t6kojzh4v2] .field-search-input:focus {
    border-color: var(--grc-navy);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--grc-navy) 12%, transparent);
}

[b-t6kojzh4v2] .field-search-input::placeholder { color: var(--grc-text-3); }

[b-t6kojzh4v2] .sortable-th {
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
    transition: color var(--grc-fast) ease;
}

[b-t6kojzh4v2] .sortable-th:hover { color: var(--grc-navy); }

[b-t6kojzh4v2] .sortable-th.sort-active { color: var(--grc-navy); }

[b-t6kojzh4v2] .sort-icon {
    display: inline-block;
    font-size: 0.68rem;
    margin-left: 0.25rem;
    opacity: 0.35;
    vertical-align: middle;
    transition: opacity var(--grc-fast) ease;
}

[b-t6kojzh4v2] .sort-icon.active { opacity: 1; }

[b-t6kojzh4v2] .sortable-th:hover .sort-icon { opacity: 0.7; }

/* Inline audit trail (used in entity detail pages) */
[b-t6kojzh4v2] .audit-trail { display: flex; flex-direction: column; gap: 0.6rem; }

[b-t6kojzh4v2] .audit-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.6rem 0.75rem;
    background: var(--grc-bg);
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r-sm);
    font-size: 0.83rem;
}

[b-t6kojzh4v2] .audit-time { color: var(--grc-text-2); }
[b-t6kojzh4v2] .audit-actor { font-weight: 500; }
[b-t6kojzh4v2] .audit-notes-inline { color: var(--grc-text-3); font-style: italic; }

/* ── Feature Module cards ──────────────────────────── */

[b-t6kojzh4v2] .fm-module-card {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 1.15rem;
    background: var(--grc-bg);
    border: 1px solid var(--grc-border);
    border-left: 3px solid var(--grc-border-2);
    border-radius: 0 var(--grc-r-sm) var(--grc-r-sm) 0;
    transition: border-color var(--grc-mid) ease,
                background-color var(--grc-mid) ease,
                box-shadow var(--grc-mid) ease;
}

[b-t6kojzh4v2] .fm-module-card.fm-enabled {
    border-left-color: var(--grc-teal);
    background: var(--grc-white);
    box-shadow: var(--grc-shadow-xs);
}

[b-t6kojzh4v2] .fm-module-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: var(--grc-r-sm);
    background: var(--grc-surface-2);
    color: var(--grc-text-3);
    flex-shrink: 0;
    transition: background-color var(--grc-mid) ease, color var(--grc-mid) ease;
}

[b-t6kojzh4v2] .fm-enabled .fm-module-icon {
    background: var(--grc-teal-50);
    color: var(--grc-teal-600);
}

[b-t6kojzh4v2] .fm-module-body {
    flex: 1;
    min-width: 0;
}

[b-t6kojzh4v2] .fm-module-title {
    font-family: 'Outfit', sans-serif;
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--grc-navy);
    margin-bottom: 0.2rem;
    line-height: 1.3;
}

[b-t6kojzh4v2] .fm-module-desc {
    font-size: 0.82rem;
    color: var(--grc-text-2);
    line-height: 1.5;
    margin-bottom: 0.5rem;
}

[b-t6kojzh4v2] .fm-status-badge {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 20px;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

[b-t6kojzh4v2] .fm-status-active {
    background: var(--grc-teal-50);
    color: var(--grc-teal-600);
    border: 1px solid var(--grc-teal);
}

[b-t6kojzh4v2] .fm-status-inactive {
    background: var(--grc-bg);
    color: var(--grc-text-3);
    border: 1px solid var(--grc-border-2);
}

[b-t6kojzh4v2] .fm-module-toggle {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
    padding-top: 0.15rem;
}

/* =====================================================
   Custom Objects -- Sub-tabs
   ===================================================== */

[b-t6kojzh4v2] .co-subtab-bar {
    display: flex;
    gap: 0.15rem;
    background: var(--grc-surface-2);
    border-radius: var(--grc-r);
    padding: 3px;
    margin-bottom: 1.5rem;
    width: fit-content;
}

[b-t6kojzh4v2] .co-subtab {
    padding: 0.4rem 1.1rem;
    background: none;
    border: none;
    border-radius: calc(var(--grc-r) - 2px);
    font-family: 'Outfit', sans-serif;
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--grc-text-2);
    cursor: pointer;
    transition: background-color var(--grc-fast) ease,
                color var(--grc-fast) ease,
                box-shadow var(--grc-fast) ease;
    white-space: nowrap;
}

[b-t6kojzh4v2] .co-subtab:hover { color: var(--grc-navy); }

[b-t6kojzh4v2] .co-subtab.active {
    background: var(--grc-white);
    color: var(--grc-navy);
    font-weight: 600;
    box-shadow: var(--grc-shadow-xs);
}

/* =====================================================
   Settings -- Sub-tabs (reusable pill-bar)
   ===================================================== */

.settings-subtab-bar[b-t6kojzh4v2] {
    display: flex;
    gap: 0.15rem;
    background: var(--grc-surface-2);
    border-radius: var(--grc-r);
    padding: 3px;
    margin-bottom: 1.5rem;
    width: fit-content;
}

.settings-subtab[b-t6kojzh4v2] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 1.1rem;
    background: none;
    border: none;
    border-radius: calc(var(--grc-r) - 2px);
    font-family: 'Outfit', sans-serif;
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--grc-text-2);
    cursor: pointer;
    transition: background-color var(--grc-fast) ease,
                color var(--grc-fast) ease,
                box-shadow var(--grc-fast) ease;
    white-space: nowrap;
    text-decoration: none;
}

.settings-subtab:hover[b-t6kojzh4v2] { color: var(--grc-navy); }

.settings-subtab.active[b-t6kojzh4v2] {
    background: var(--grc-white);
    color: var(--grc-navy);
    font-weight: 600;
    box-shadow: var(--grc-shadow-xs);
}

.settings-subtab i[b-t6kojzh4v2] {
    font-size: 0.85rem;
}

/* External link icon for nav-away sub-tabs */
.settings-subtab-ext[b-t6kojzh4v2] {
    font-size: 0.6rem;
    opacity: 0.4;
    margin-left: 0.1rem;
    transition: opacity var(--grc-fast) ease;
}
.settings-subtab-link:hover .settings-subtab-ext[b-t6kojzh4v2] {
    opacity: 0.7;
}

/* =====================================================
   Master-Detail layout
   ===================================================== */

[b-t6kojzh4v2] .co-master-detail {
    display: grid;
    grid-template-columns: minmax(280px, 2fr) 3fr;
    gap: 1.25rem;
    align-items: start;
    min-height: 420px;
}

@media (max-width: 900px) {
    [b-t6kojzh4v2] .co-master-detail { grid-template-columns: 1fr; }
}

/* Left panel -- object type list */
[b-t6kojzh4v2] .co-master {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r);
    background: var(--grc-white);
    overflow: visible;
    box-shadow: var(--grc-shadow-xs);
}

[b-t6kojzh4v2] .co-master-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--grc-border);
    background: var(--grc-bg);
    border-radius: var(--grc-r) var(--grc-r) 0 0;
}

[b-t6kojzh4v2] .co-master-search {
    flex: 1;
    padding: 0.3rem 0.6rem;
    font-size: 0.82rem;
    font-family: inherit;
    border: 1px solid var(--grc-border-2);
    border-radius: var(--grc-r-sm);
    background: var(--grc-white);
    outline: none;
    transition: border-color var(--grc-fast) ease, box-shadow var(--grc-fast) ease;
}

[b-t6kojzh4v2] .co-master-search:focus {
    border-color: var(--grc-navy);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--grc-navy) 12%, transparent);
}

[b-t6kojzh4v2] .co-master-search::placeholder { color: var(--grc-text-3); }

[b-t6kojzh4v2] .co-master-list {
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    max-height: 520px;
    padding: 6px;
}

[b-t6kojzh4v2] .co-master-item {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.7rem 1rem;
    border: none;
    border-bottom: 1px solid var(--grc-border);
    background: var(--grc-white);
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    transition: background-color var(--grc-fast) ease;
    position: relative;
    width: 100%;
}

[b-t6kojzh4v2] .co-master-item:last-child { border-bottom: none; }

[b-t6kojzh4v2] .co-master-item:hover { background: var(--grc-bg); }

[b-t6kojzh4v2] .co-master-item.selected {
    background: var(--grc-teal-50);
    border-left: 3px solid var(--grc-teal);
    padding-left: calc(1rem - 3px);
}

[b-t6kojzh4v2] .co-master-item.selected:hover { background: var(--grc-teal-50); }

[b-t6kojzh4v2] .co-master-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--grc-r-sm);
    background: var(--grc-surface-2);
    color: var(--grc-navy-400);
    font-size: 0.9rem;
    flex-shrink: 0;
    transition: background-color var(--grc-fast) ease, color var(--grc-fast) ease;
}

[b-t6kojzh4v2] .co-master-item.selected .co-master-icon {
    background: var(--grc-teal-glow);
    color: var(--grc-teal-600);
}

[b-t6kojzh4v2] .co-master-info { flex: 1; min-width: 0; }

[b-t6kojzh4v2] .co-master-name {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--grc-navy);
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-t6kojzh4v2] .co-master-meta {
    font-size: 0.72rem;
    color: var(--grc-text-3);
    margin-top: 1px;
}

[b-t6kojzh4v2] .co-master-add {
    padding: 0.65rem 1rem;
    border-top: 1px solid var(--grc-border);
    background: var(--grc-bg);
    border-radius: 0 0 var(--grc-r) var(--grc-r);
}

/* Right panel -- detail/fields */
[b-t6kojzh4v2] .co-detail {
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r);
    background: var(--grc-white);
    box-shadow: var(--grc-shadow-xs);
    overflow: hidden;
}

[b-t6kojzh4v2] .co-detail-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.75rem 1.15rem;
    background: var(--grc-bg);
    border-bottom: 1px solid var(--grc-border);
}

[b-t6kojzh4v2] .co-detail-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: 'Outfit', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--grc-navy);
}

[b-t6kojzh4v2] .co-detail-title i {
    color: var(--grc-teal-600);
    font-size: 1.1rem;
}

[b-t6kojzh4v2] .co-detail-body { padding: 1.15rem; }

[b-t6kojzh4v2] .co-detail-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 360px;
    color: var(--grc-text-3);
    text-align: center;
    padding: 2rem;
}

[b-t6kojzh4v2] .co-detail-empty-icon {
    font-size: 2.5rem;
    margin-bottom: 0.75rem;
    opacity: 0.35;
}

[b-t6kojzh4v2] .co-detail-empty-text {
    font-size: 0.88rem;
    max-width: 240px;
    line-height: 1.5;
}

/* =====================================================
   SortableList -- context overrides (core styles in SortableList.razor.css)
   ===================================================== */

/* Field row inside sortable list */
[b-t6kojzh4v2] .sl-field-label {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--grc-navy);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: -0.01em;
}

[b-t6kojzh4v2] .sl-field-key {
    font-family: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace;
    font-size: 0.7rem;
    color: var(--grc-text-3);
    background: var(--grc-bg);
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
    border: 1px solid var(--grc-border);
}

[b-t6kojzh4v2] .sl-field-type {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.72rem;
    font-weight: 600;
    white-space: nowrap;
    padding: 0.15rem 0.5rem;
    border-radius: 10px;
    letter-spacing: 0.02em;
    /* Default coloring — overridden per type */
    background: var(--grc-surface-2);
    color: var(--grc-text-2);
}

/* Type-specific badge colors */
[b-t6kojzh4v2] .sl-field-type[data-type="Text"]        { background: #f0f4f8; color: #475569; }
[b-t6kojzh4v2] .sl-field-type[data-type="Note"]        { background: #f0f4f8; color: #475569; }
[b-t6kojzh4v2] .sl-field-type[data-type="Number"]      { background: #eff6ff; color: #1d4ed8; }
[b-t6kojzh4v2] .sl-field-type[data-type="Date"]        { background: #fdf4ff; color: #7e22ce; }
[b-t6kojzh4v2] .sl-field-type[data-type="Boolean"]     { background: #fffbeb; color: #b45309; }
[b-t6kojzh4v2] .sl-field-type[data-type="Dropdown"]    { background: var(--grc-teal-50); color: var(--grc-teal-600); }
[b-t6kojzh4v2] .sl-field-type[data-type="MultiSelect"] { background: var(--grc-teal-50); color: var(--grc-teal-600); }
[b-t6kojzh4v2] .sl-field-type[data-type="Url"]         { background: #eef2ff; color: #4338ca; }
[b-t6kojzh4v2] .sl-field-type[data-type="Email"]       { background: #fef2f2; color: #b91c1c; }
[b-t6kojzh4v2] .sl-field-type[data-type="Phone"]       { background: #ecfdf5; color: #047857; }

/* Field type icons (inserted via CSS) */
[b-t6kojzh4v2] .sl-field-type-icon {
    font-size: 0.72rem;
    flex-shrink: 0;
}

[b-t6kojzh4v2] .sl-field-badge {
    display: inline-block;
    padding: 0.1rem 0.4rem;
    border-radius: 20px;
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

[b-t6kojzh4v2] .sl-field-badge.required {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

/* Required dot indicator (alternative to badge) */
[b-t6kojzh4v2] .sl-field-required-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #ef4444;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px #fecaca;
}

/* Hover left accent on field rows */
[b-t6kojzh4v2] .sl-item:hover {
    border-left: 2px solid var(--grc-navy-400);
    padding-left: calc(0.75rem - 2px);
}

[b-t6kojzh4v2] .sl-compact .sl-item:hover {
    padding-left: calc(0.6rem - 2px);
}

/* Action buttons inside sortable list */
[b-t6kojzh4v2] .sl-action-btn {
    padding: 0.15rem 0.5rem;
    font-size: 0.72rem;
    line-height: 1.3;
    border-radius: 4px;
}

/* co-master-item nesting fix -- selected state lifted to sl-item */
[b-t6kojzh4v2] .sl-content .co-master-item {
    padding: 0;
    border: none;
    background: transparent;
    width: 100%;
}

[b-t6kojzh4v2] .sl-content .co-master-item:hover {
    background: transparent;
}

[b-t6kojzh4v2] .sl-content .co-master-item.selected {
    background: transparent;
    border-left: none;
    padding-left: 0;
}

[b-t6kojzh4v2] .sl-item:has(.co-master-item.selected) {
    background: var(--grc-teal-50);
    border-left: 3px solid var(--grc-teal);
    padding-left: calc(0.75rem - 3px);
}

/* =====================================================
   Object type inline edit form (in detail panel)
   ===================================================== */

[b-t6kojzh4v2] .co-props-form {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 0.75rem;
    padding: 0.75rem 0;
    margin-bottom: 0.75rem;
    border-bottom: 1px solid var(--grc-border);
    align-items: end;
}

@media (max-width: 700px) {
    [b-t6kojzh4v2] .co-props-form { grid-template-columns: 1fr; }
}

[b-t6kojzh4v2] .co-props-field label {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--grc-text-3);
    margin-bottom: 0.2rem;
    display: block;
}

/* =====================================================
   Built-in Entities -- master panel overrides
   ===================================================== */

[b-t6kojzh4v2] .bei-master-list {
    max-height: 560px;
}

[b-t6kojzh4v2] .bei-section-header {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--grc-text-3);
    padding: 0.75rem 1rem 0.35rem;
    background: var(--grc-white);
    position: sticky;
    top: 0;
    z-index: 1;
    border-bottom: 1px solid var(--grc-border);
}

[b-t6kojzh4v2] .bei-section-header i {
    font-size: 0.8rem;
    color: var(--grc-navy-400);
}

[b-t6kojzh4v2] .bei-section-group {
    margin-left: 0.75rem;
    border-left: 2px solid var(--grc-border);
    margin-bottom: 0.5rem;
    position: relative;
}

/* Tree-rail connector dots at each item */
[b-t6kojzh4v2] .bei-section-group .bei-item::before {
    content: '';
    position: absolute;
    left: -0.75rem;
    top: 50%;
    width: 8px;
    height: 2px;
    background: var(--grc-border);
    transform: translateX(-2px);
}

[b-t6kojzh4v2] .bei-section-group .bei-item {
    position: relative;
}

[b-t6kojzh4v2] .bei-item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.55rem 0.85rem;
    border: none;
    border-bottom: 1px solid var(--grc-border);
    background: var(--grc-white);
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    transition: background-color var(--grc-fast) ease;
    width: 100%;
}

[b-t6kojzh4v2] .bei-item:last-child { border-bottom: none; }

[b-t6kojzh4v2] .bei-item:hover { background: var(--grc-bg); }

[b-t6kojzh4v2] .bei-item.selected {
    background: var(--grc-teal-50);
    border-left: 3px solid var(--grc-teal);
    padding-left: calc(0.85rem - 3px);
}

[b-t6kojzh4v2] .bei-item.selected:hover { background: var(--grc-teal-50); }

[b-t6kojzh4v2] .bei-item-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: var(--grc-r-sm);
    font-size: 0.8rem;
    flex-shrink: 0;
    color: var(--grc-white);
    transition: background-color var(--grc-fast) ease;
}

[b-t6kojzh4v2] .bei-icon-account { background: var(--grc-navy-400); }
[b-t6kojzh4v2] .bei-icon-contact { background: var(--grc-teal-600); }
[b-t6kojzh4v2] .bei-icon-workgroup { background: var(--grc-navy-700); }
[b-t6kojzh4v2] .bei-icon-visit { background: var(--grc-text-2); }

[b-t6kojzh4v2] .bei-item-info { flex: 1; min-width: 0; }

[b-t6kojzh4v2] .bei-item-name {
    font-size: 0.84rem;
    font-weight: 600;
    color: var(--grc-navy);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

[b-t6kojzh4v2] .bei-all-name { font-weight: 500; }

[b-t6kojzh4v2] .bei-item-badge {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--grc-text-3);
    background: var(--grc-surface-2);
    padding: 0.12rem 0.5rem;
    border-radius: 10px;
    white-space: nowrap;
    flex-shrink: 0;
    transition: opacity var(--grc-fast) ease;
}

/* Dim badge when zero fields */
[b-t6kojzh4v2] .bei-item-badge.bei-badge-empty {
    opacity: 0.45;
    font-weight: 400;
}

/* Category-colored badges for items with fields */
[b-t6kojzh4v2] .bei-icon-account ~ .bei-item-info ~ .bei-item-badge:not(.bei-badge-empty) {
    background: rgba(58, 90, 150, 0.1);
    color: var(--grc-navy-400);
}

[b-t6kojzh4v2] .bei-icon-contact ~ .bei-item-info ~ .bei-item-badge:not(.bei-badge-empty) {
    background: var(--grc-teal-50);
    color: var(--grc-teal-600);
}

[b-t6kojzh4v2] .bei-add-type {
    padding: 0.4rem 0.85rem;
    border-top: 1px solid var(--grc-border);
    background: var(--grc-bg);
}

[b-t6kojzh4v2] .bei-add-type-btn {
    font-size: 0.78rem;
    color: var(--grc-text-3);
    padding: 0;
    text-decoration: none;
}

[b-t6kojzh4v2] .bei-add-type-btn:hover {
    color: var(--grc-navy);
}

[b-t6kojzh4v2] .bei-detail-subtitle {
    font-size: 0.76rem;
    color: var(--grc-text-3);
    font-style: italic;
    margin-top: 1px;
}

/* ── Detail header enhancements ── */

[b-t6kojzh4v2] .bei-detail-header-left {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

[b-t6kojzh4v2] .bei-breadcrumb {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.72rem;
    color: var(--grc-text-3);
}

[b-t6kojzh4v2] .bei-breadcrumb-sep {
    font-size: 0.55rem;
    opacity: 0.6;
}

[b-t6kojzh4v2] .bei-breadcrumb-current {
    color: var(--grc-navy);
    font-weight: 600;
}

[b-t6kojzh4v2] .bei-detail-title-row {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

[b-t6kojzh4v2] .bei-detail-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--grc-r);
    font-size: 1rem;
    flex-shrink: 0;
    color: var(--grc-white);
}

[b-t6kojzh4v2] .bei-detail-actions {
    display: flex;
    gap: 0.35rem;
    align-items: center;
}

/* Overflow menu */
[b-t6kojzh4v2] .bei-overflow-menu {
    position: relative;
}

[b-t6kojzh4v2] .bei-overflow-btn {
    padding: 0.25rem 0.45rem;
    line-height: 1;
}

[b-t6kojzh4v2] .bei-overflow-dropdown {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    min-width: 160px;
    background: var(--grc-white);
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r-sm);
    box-shadow: var(--grc-shadow);
    z-index: 100;
    padding: 0.25rem 0;
    animation: bei-dropdown-in-b-t6kojzh4v2 0.12s var(--grc-ease) both;
}

@keyframes bei-dropdown-in-b-t6kojzh4v2 {
    0%   { opacity: 0; transform: translateY(-4px) scale(0.97); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

[b-t6kojzh4v2] .bei-overflow-item {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0.5rem 0.85rem;
    border: none;
    background: transparent;
    font-size: 0.82rem;
    color: var(--grc-text);
    cursor: pointer;
    text-align: left;
    transition: background-color var(--grc-fast) ease;
}

[b-t6kojzh4v2] .bei-overflow-item:hover {
    background: var(--grc-bg);
}

[b-t6kojzh4v2] .bei-overflow-danger {
    color: #b91c1c;
}

[b-t6kojzh4v2] .bei-overflow-danger:hover {
    background: #fef2f2;
}

[b-t6kojzh4v2] .bei-overflow-backdrop {
    position: fixed;
    inset: 0;
    z-index: 99;
}

/* ── Empty fields state ── */

[b-t6kojzh4v2] .bei-empty-fields {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1rem;
    text-align: center;
    gap: 0.65rem;
}

[b-t6kojzh4v2] .bei-empty-fields-icon {
    font-size: 2rem;
    color: var(--grc-border-2);
    line-height: 1;
}

[b-t6kojzh4v2] .bei-empty-fields-text {
    font-size: 0.85rem;
    color: var(--grc-text-3);
}

/* bei-item nesting fix for SortableList */
[b-t6kojzh4v2] .sl-content .bei-item {
    padding: 0;
    border: none;
    background: transparent;
    width: 100%;
}

[b-t6kojzh4v2] .sl-content .bei-item:hover {
    background: transparent;
}

[b-t6kojzh4v2] .sl-content .bei-item.selected {
    background: transparent;
    border-left: none;
    padding-left: 0;
}

[b-t6kojzh4v2] .sl-item:has(.bei-item.selected) {
    background: var(--grc-teal-50);
    border-left: 3px solid var(--grc-teal);
    padding-left: calc(0.75rem - 3px);
}

/* =====================================================
   Email Settings
   ===================================================== */

[b-t6kojzh4v2] .em-status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

[b-t6kojzh4v2] .em-dot-connected {
    background: var(--grc-teal);
    box-shadow: 0 0 0 3px var(--grc-teal-50);
}

[b-t6kojzh4v2] .em-dot-disconnected {
    background: var(--grc-border-2);
    box-shadow: 0 0 0 3px var(--grc-bg);
}

[b-t6kojzh4v2] .em-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

[b-t6kojzh4v2] .em-form-grid .form-label {
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--grc-text-2);
    margin-bottom: 0.2rem;
}

[b-t6kojzh4v2] .em-span-full { grid-column: 1 / -1; }

[b-t6kojzh4v2] .em-field-hint {
    display: block;
    font-size: 0.72rem;
    color: var(--grc-text-3);
    margin-top: 0.2rem;
}

[b-t6kojzh4v2] .em-test-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

[b-t6kojzh4v2] .em-test-row input {
    flex: 1;
    max-width: 280px;
}

@media (max-width: 640px) {
    [b-t6kojzh4v2] .em-form-grid { grid-template-columns: 1fr; }
    [b-t6kojzh4v2] .em-span-full { grid-column: auto; }
    [b-t6kojzh4v2] .em-test-row { flex-direction: column; align-items: stretch; }
    [b-t6kojzh4v2] .em-test-row input { max-width: none; }
}

/* Hero image preview */
[b-t6kojzh4v2] .em-hero-preview-wrap {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    background: var(--grc-bg);
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r-sm);
    max-width: 420px;
    margin-bottom: 0.5rem;
}

[b-t6kojzh4v2] .em-hero-preview-img {
    max-height: 60px;
    max-width: 280px;
    object-fit: contain;
    border-radius: var(--grc-r-sm);
}

/* =====================================================
   Notification Toggle Groups
   ===================================================== */

[b-t6kojzh4v2] .em-notif-groups {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1rem;
}

[b-t6kojzh4v2] .em-notif-group {
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r);
    overflow: hidden;
    background: var(--grc-white);
}

[b-t6kojzh4v2] .em-notif-group-header {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 0.9rem;
    background: var(--grc-bg);
    border-bottom: 1px solid var(--grc-border);
    font-family: 'Outfit', sans-serif;
    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--grc-text-3);
}

[b-t6kojzh4v2] .em-notif-group-header i {
    font-size: 0.85rem;
    color: var(--grc-navy-400);
}

[b-t6kojzh4v2] .em-notif-group-body {
    display: flex;
    flex-direction: column;
}

[b-t6kojzh4v2] .em-notif-toggle {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.55rem 0.9rem;
    cursor: pointer;
    transition: background-color var(--grc-fast) ease;
    font-size: 0.85rem;
    color: var(--grc-text);
    border-bottom: 1px solid var(--grc-border);
    margin: 0;
}

[b-t6kojzh4v2] .em-notif-toggle:last-child { border-bottom: none; }

[b-t6kojzh4v2] .em-notif-toggle:hover { background: var(--grc-bg); }

/* ── Notification Preview Rows ───────────────────────── */

[b-t6kojzh4v2] .em-preview-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.6rem 0.9rem;
    border-bottom: 1px solid var(--grc-border);
}

[b-t6kojzh4v2] .em-preview-row:last-child { border-bottom: none; }

[b-t6kojzh4v2] .em-preview-info {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

[b-t6kojzh4v2] .em-preview-label {
    font-size: 0.84rem;
    font-weight: 600;
    color: var(--grc-text);
}

[b-t6kojzh4v2] .em-preview-desc {
    font-size: 0.74rem;
    color: var(--grc-text-3);
    line-height: 1.3;
}

[b-t6kojzh4v2] .em-preview-btn {
    flex-shrink: 0;
    min-width: 52px;
}

/* ── Security Policy ─────────────────────────────────── */

[b-t6kojzh4v2] .sec-toggle-group {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r-sm);
    overflow: hidden;
}

[b-t6kojzh4v2] .sec-toggle-group .em-notif-toggle { margin: 0; }

[b-t6kojzh4v2] .sec-admin-unlock-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.65rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fcd34d;
}

/* ── Email Provider Cards ────────────────────────────── */

[b-t6kojzh4v2] .em-provider-label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--grc-text-3);
    margin-bottom: 0.6rem;
}

[b-t6kojzh4v2] .em-provider-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0.6rem;
    margin-bottom: 1.5rem;
}

[b-t6kojzh4v2] .em-provider-grid-sm {
    grid-template-columns: repeat(4, 1fr);
    margin-bottom: 1rem;
}

[b-t6kojzh4v2] .em-provider-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    padding: 1rem 0.5rem 0.75rem;
    background: var(--grc-white);
    border: 1.5px solid var(--grc-border);
    border-radius: var(--grc-r);
    cursor: pointer;
    transition: border-color var(--grc-fast) ease,
                background-color var(--grc-fast) ease,
                box-shadow var(--grc-fast) ease;
    text-align: center;
}

[b-t6kojzh4v2] .em-provider-card:hover {
    border-color: var(--grc-border-2);
    background: var(--grc-bg);
}

[b-t6kojzh4v2] .em-provider-card.em-provider-active {
    border-color: var(--grc-teal);
    background: var(--grc-teal-50);
    box-shadow: 0 0 0 2px var(--grc-teal-glow);
}

[b-t6kojzh4v2] .em-provider-card-sm {
    padding: 0.65rem 0.4rem 0.55rem;
}

[b-t6kojzh4v2] .em-provider-card-sm .em-provider-icon {
    font-size: 1.1rem;
}

[b-t6kojzh4v2] .em-provider-icon {
    font-size: 1.4rem;
    color: var(--grc-navy-400);
    transition: color var(--grc-fast) ease;
}

[b-t6kojzh4v2] .em-provider-active .em-provider-icon {
    color: var(--grc-teal-600);
}

[b-t6kojzh4v2] .em-provider-name {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--grc-text);
    line-height: 1.2;
}

[b-t6kojzh4v2] .em-provider-tag {
    font-size: 0.68rem;
    color: var(--grc-text-3);
    line-height: 1.1;
}

[b-t6kojzh4v2] .em-provider-config {
    padding: 0.25rem 0 0 0;
}

/* Fallback section */

[b-t6kojzh4v2] .em-fallback-section {
    margin-top: 1.5rem;
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r);
    overflow: hidden;
}

[b-t6kojzh4v2] .em-fallback-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1rem;
    cursor: pointer;
    background: var(--grc-bg);
    transition: background-color var(--grc-fast) ease;
}

[b-t6kojzh4v2] .em-fallback-toggle:hover {
    background: var(--grc-surface-2);
}

[b-t6kojzh4v2] .em-fallback-icon {
    font-size: 1.1rem;
    color: var(--grc-navy-400);
}

[b-t6kojzh4v2] .em-fallback-title {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--grc-text);
}

[b-t6kojzh4v2] .em-fallback-desc {
    font-size: 0.72rem;
    color: var(--grc-text-3);
    line-height: 1.3;
}

[b-t6kojzh4v2] .em-fallback-chevron {
    font-size: 0.85rem;
    color: var(--grc-text-3);
    transition: transform var(--grc-fast) ease;
}

[b-t6kojzh4v2] .em-fallback-body {
    padding: 1rem;
    border-top: 1px solid var(--grc-border);
}

[b-t6kojzh4v2] .em-fallback-enable {
    margin-bottom: 0.75rem;
}

/* Responsive */

@media (max-width: 900px) {
    [b-t6kojzh4v2] .em-provider-grid { grid-template-columns: repeat(3, 1fr); }
    [b-t6kojzh4v2] .em-provider-grid-sm { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
    [b-t6kojzh4v2] .em-provider-grid { grid-template-columns: repeat(2, 1fr); }
    [b-t6kojzh4v2] .em-provider-grid-sm { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 400px) {
    [b-t6kojzh4v2] .em-provider-grid { grid-template-columns: 1fr; }
    [b-t6kojzh4v2] .em-provider-grid-sm { grid-template-columns: 1fr; }
}

/* ── Mobile: scrollable sub-tab bars ──────────────────── */

@media (max-width: 640.98px) {
    .settings-subtab-bar[b-t6kojzh4v2],
    [b-t6kojzh4v2] .co-subtab-bar {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        width: 100%;
        flex-wrap: nowrap;
    }
    .settings-subtab-bar[b-t6kojzh4v2]::-webkit-scrollbar,
    [b-t6kojzh4v2] .co-subtab-bar::-webkit-scrollbar { display: none; }
    .settings-subtab[b-t6kojzh4v2],
    [b-t6kojzh4v2] .co-subtab { flex-shrink: 0; }
}
/* /Pages/CustomObjects/CustomObjectDetail.razor.rz.scp.css */
/* ── Header ─────────────────────────────────────────── */

.co-header[b-dqlyibjjw1] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
    background: var(--grc-white);
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r);
    box-shadow: var(--grc-shadow-xs);
}

.co-header-left[b-dqlyibjjw1] {
    min-width: 0;
    flex: 1;
}

.co-header[b-dqlyibjjw1]  h1 {
    margin: 0.15rem 0 0.5rem;
    font-size: 1.6rem;
}


.co-meta[b-dqlyibjjw1] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1.25rem;
}

.co-meta-item[b-dqlyibjjw1] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.85rem;
    color: var(--grc-text-2);
}

.co-meta-muted[b-dqlyibjjw1] {
    color: var(--grc-text-3);
}

.co-meta-item[b-dqlyibjjw1]  i {
    font-size: 0.9rem;
    opacity: 0.6;
}

.co-actions[b-dqlyibjjw1] {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
    padding-top: 0.15rem;
}

/* ── Empty state ───────────────────────────────────── */

.co-empty-state[b-dqlyibjjw1] {
    padding: 2rem;
    text-align: center;
    color: var(--grc-text-3);
    background: var(--grc-white);
    border: 1px dashed var(--grc-border-2);
    border-radius: var(--grc-r);
}

/* ── Panels: side-by-side, grow vertically, aligned at top ── */

.co-panels[b-dqlyibjjw1] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    align-items: start;
}

.co-panel-section[b-dqlyibjjw1] {
    min-width: 0;
}

/* Give the RelatedObjectsPanel containers more visual weight */
.co-panel-section[b-dqlyibjjw1]  .rop-container {
    background: var(--grc-white);
    border-color: var(--grc-border-2);
    box-shadow: var(--grc-shadow-sm);
    border-radius: var(--grc-r);
}

.co-panel-section[b-dqlyibjjw1]  .rop-header {
    background: var(--grc-navy);
    border-bottom-color: var(--grc-navy-dark);
    border-radius: var(--grc-r) var(--grc-r) 0 0;
}

.co-panel-section[b-dqlyibjjw1]  .rop-title {
    color: var(--grc-white);
    font-size: 0.8rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.co-panel-section[b-dqlyibjjw1]  .rop-header .btn-primary {
    background: var(--grc-teal);
    border-color: var(--grc-teal);
    color: var(--grc-navy);
    font-weight: 600;
    font-size: 0.78rem;
}

.co-panel-section[b-dqlyibjjw1]  .rop-header .btn-primary:hover {
    background: var(--grc-teal-600);
    border-color: var(--grc-teal-600);
}

.co-panel-section[b-dqlyibjjw1]  .rop-item {
    border-bottom-color: var(--grc-border);
    padding: 10px 14px;
}

.co-panel-section[b-dqlyibjjw1]  .rop-item:hover {
    background: var(--grc-teal-50);
}

.co-panel-section[b-dqlyibjjw1]  .rop-item-name {
    color: var(--grc-navy);
    font-weight: 600;
}

.co-panel-section[b-dqlyibjjw1]  .rop-empty {
    padding: 20px 14px;
    text-align: center;
    color: var(--grc-text-3);
}

/* ── Responsive ─────────────────────────────────────── */

@media (max-width: 767.98px) {
    .co-panels[b-dqlyibjjw1] {
        grid-template-columns: 1fr;
    }

    .co-header[b-dqlyibjjw1] {
        flex-direction: column;
        gap: 0.75rem;
    }

    .co-actions[b-dqlyibjjw1] {
        align-self: flex-end;
    }
}
/* /Pages/ForgotPassword.razor.rz.scp.css */
.fp-desc[b-h86jq0648w] {
    font-size: 0.88rem;
    color: var(--grc-text-2);
    line-height: 1.55;
    margin-bottom: 1.25rem;
}

.fp-sent[b-h86jq0648w] {
    text-align: center;
    padding: 1rem 0 0.5rem;
}

.fp-sent-icon[b-h86jq0648w] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--grc-teal-50);
    color: var(--grc-teal-600);
    margin-bottom: 1rem;
}

.fp-sent-text[b-h86jq0648w] {
    font-size: 0.92rem;
    color: var(--grc-text);
    line-height: 1.5;
    margin-bottom: 0.25rem;
}

.fp-sent-hint[b-h86jq0648w] {
    font-size: 0.8rem;
    color: var(--grc-text-3);
}

.fp-back[b-h86jq0648w] {
    text-align: center;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid var(--grc-border);
}

.fp-back-link[b-h86jq0648w] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.84rem;
    color: var(--grc-text-2);
    text-decoration: none;
    transition: color var(--grc-fast) ease;
}

.fp-back-link:hover[b-h86jq0648w] {
    color: var(--grc-navy);
}
/* /Pages/Login.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════
   Login · Glassmorphism + Orchestrated Entrance
   ═══════════════════════════════════════════════════════════ */

.login-stage[b-tp3cdjp7er] {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 420px;
  width: 100%;
  margin: 0 auto;
  animation: grc-fade-in 0.5s var(--grc-ease) both;
}

/* ── Glass Card ── */

.login-card[b-tp3cdjp7er] {
  width: 100%;
  position: relative;
  background: var(--grc-glass-bg);
  backdrop-filter: blur(var(--grc-glass-blur));
  -webkit-backdrop-filter: blur(var(--grc-glass-blur));
  border: 1px solid transparent;
  border-radius: var(--grc-r-xl);
  box-shadow: 0 0 40px rgba(var(--grc-teal-rgb), 0.06),
              0 8px 32px rgba(0, 0, 0, 0.2);
  padding: 2.25rem 2rem 2rem;
  animation: grc-scale-up 0.6s var(--grc-ease) both 0.2s;
}

/* Animated gradient border sweep — single ambient loop */
.login-card[b-tp3cdjp7er]::after {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: var(--grc-r-xl);
  padding: 1px;
  background: linear-gradient(
    90deg,
    rgba(var(--grc-teal-rgb), 0.0) 0%,
    rgba(var(--grc-teal-rgb), 0.3) 25%,
    rgba(255, 255, 255, 0.15) 50%,
    rgba(var(--grc-teal-rgb), 0.3) 75%,
    rgba(var(--grc-teal-rgb), 0.0) 100%
  );
  background-size: 200% 100%;
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  mask-composite: exclude;
  animation: grc-border-sweep 4s linear infinite 1s;
  pointer-events: none;
  z-index: 1;
}

.login-title[b-tp3cdjp7er] {
  font-family: 'Instrument Serif', serif;
  color: #fff;
  font-size: 1.5rem;
  font-weight: 400;
  text-align: center;
  margin-bottom: 1.75rem;
  letter-spacing: -0.01em;
  animation: grc-fade-in 0.4s var(--grc-ease) both 0.35s;
}

/* ── Form Controls (dark bg overrides) ── */

.login-card-body[b-tp3cdjp7er]  .form-label {
  color: rgba(255, 255, 255, 0.55);
}

.login-card-body[b-tp3cdjp7er]  .form-control {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #fff;
  border-radius: 8px;
  transition: border-color var(--grc-fast) ease,
              box-shadow var(--grc-mid) var(--grc-ease),
              background var(--grc-fast) ease;
}

.login-card-body[b-tp3cdjp7er]  .form-control::placeholder {
  color: rgba(255, 255, 255, 0.3);
}

.login-card-body[b-tp3cdjp7er]  .form-control:focus {
  background: rgba(255, 255, 255, 0.09);
  border-color: var(--grc-teal);
  box-shadow: 0 0 0 3px var(--grc-teal-glow), 0 0 20px rgba(var(--grc-teal-rgb), 0.08);
  color: #fff;
}

/* ── Staggered Field Entrance ── */

.login-field:nth-child(1)[b-tp3cdjp7er] { animation: grc-slide-up 0.4s var(--grc-ease) both 0.40s; }
.login-field:nth-child(2)[b-tp3cdjp7er] { animation: grc-slide-up 0.4s var(--grc-ease) both 0.50s; }
.login-field:nth-child(3)[b-tp3cdjp7er] { animation: grc-slide-up 0.4s var(--grc-ease) both 0.60s; }
.login-field:nth-child(4)[b-tp3cdjp7er] { animation: grc-slide-up 0.4s var(--grc-ease) both 0.70s; }

/* ── Primary Button (gradient + hover glow) ── */

.login-btn-primary[b-tp3cdjp7er] {
  background: linear-gradient(135deg, var(--grc-navy-600), var(--grc-teal-600)) !important;
  border: none !important;
  color: #fff !important;
  font-weight: 600;
  border-radius: 8px;
  transition: transform var(--grc-fast) var(--grc-ease),
              box-shadow var(--grc-mid) var(--grc-ease),
              opacity var(--grc-fast) ease;
}

.login-btn-primary:hover:not(:disabled)[b-tp3cdjp7er] {
  transform: scale(1.01);
  box-shadow: 0 0 32px rgba(var(--grc-teal-rgb), 0.3),
              0 0 8px rgba(var(--grc-teal-rgb), 0.2);
}

.login-btn-primary:active:not(:disabled)[b-tp3cdjp7er] {
  transform: scale(0.99);
}

.login-btn-primary:disabled[b-tp3cdjp7er] {
  opacity: 0.6;
}

/* ── SSO Button (dark bg variant) ── */

.login-btn-sso[b-tp3cdjp7er] {
  border-color: rgba(255, 255, 255, 0.25) !important;
  color: #fff !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border-radius: 8px;
  transition: background var(--grc-fast) ease,
              border-color var(--grc-fast) ease;
}

.login-btn-sso:hover[b-tp3cdjp7er] {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.4) !important;
  color: #fff !important;
}

/* ── Error Alert (dark bg) ── */

.login-alert[b-tp3cdjp7er] {
  background: rgba(220, 38, 38, 0.12) !important;
  border-color: rgba(220, 38, 38, 0.3) !important;
  color: #FCA5A5 !important;
  border-radius: 8px;
  animation: grc-slide-up 0.3s var(--grc-ease) both;
}

/* ── Forgot Password ── */

.login-forgot[b-tp3cdjp7er] {
  font-size: 0.82rem;
  color: rgba(255, 255, 255, 0.45);
  text-decoration: none;
  transition: color var(--grc-fast) ease;
}

.login-forgot:hover[b-tp3cdjp7er] {
  color: var(--grc-teal);
}

/* ── MFA Section ── */

.login-mfa-section[b-tp3cdjp7er] {
  animation: grc-scale-up 0.4s var(--grc-ease) both;
}

.login-mfa-section[b-tp3cdjp7er]  .text-muted {
  color: rgba(255, 255, 255, 0.5) !important;
}

.login-mfa-code[b-tp3cdjp7er] {
  letter-spacing: 0.3em;
  font-size: 1.25rem;
  text-align: center;
}

/* ── Link Buttons (dark bg) ── */

.login-link[b-tp3cdjp7er] {
  color: var(--grc-teal) !important;
  text-decoration: none !important;
  transition: opacity var(--grc-fast) ease;
}

.login-link:hover[b-tp3cdjp7er] {
  opacity: 0.8;
}

/* ── Validation Messages ── */

.login-card-body[b-tp3cdjp7er]  .validation-message {
  color: #FCA5A5;
}

/* ── Responsive ── */

@media (max-width: 640.98px) {
  .login-card[b-tp3cdjp7er] {
    padding: 1.5rem 1.25rem;
    margin: 0 0.75rem;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .login-card[b-tp3cdjp7er]::after {
    animation: none;
  }
}
/* /Pages/Profile.razor.rz.scp.css */
/* ── Profile avatar ─────────────────────────────────── */

.profile-avatar-row[b-n4jy4ay2e3] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1rem 1.25rem;
    background: linear-gradient(135deg, var(--grc-navy) 0%, var(--grc-navy-600, #1a3d6e) 100%);
    border-radius: var(--grc-r-sm);
    margin-bottom: 0.5rem;
    color: #fff;
}

.profile-avatar-lg[b-n4jy4ay2e3] {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 50%;
    background: rgba(255,255,255,0.2);
    border: 2px solid rgba(255,255,255,0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    font-weight: 700;
    flex-shrink: 0;
    color: #fff;
}

.profile-full-name[b-n4jy4ay2e3]  { font-size: 1.05rem; font-weight: 600; }
.profile-email[b-n4jy4ay2e3]      { font-size: 0.82rem; opacity: 0.8; }
.profile-title-display[b-n4jy4ay2e3] { font-size: 0.82rem; opacity: 0.7; font-style: italic; margin-top: 0.1rem; }

/* ── Email field (disabled) ─────────────────────────── */

.profile-email-input[b-n4jy4ay2e3] {
    background: var(--grc-bg) !important;
    color: var(--grc-text-2) !important;
    cursor: not-allowed;
}

/* ── Notifications placeholder ──────────────────────── */

.notifications-placeholder[b-n4jy4ay2e3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 2rem;
    text-align: center;
    gap: 0.75rem;
}

.notif-icon[b-n4jy4ay2e3] {
    font-size: 2.5rem;
    opacity: 0.35;
    margin-bottom: 0.5rem;
}

/* ── Notification preference groups ──────────────── */

.em-notif-groups[b-n4jy4ay2e3] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1rem;
}

.em-notif-group[b-n4jy4ay2e3] {
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r);
    overflow: hidden;
    background: var(--grc-white);
}

.em-notif-group-header[b-n4jy4ay2e3] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 0.9rem;
    background: var(--grc-bg);
    border-bottom: 1px solid var(--grc-border);
    font-family: 'Outfit', sans-serif;
    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--grc-text-3);
}

.em-notif-group-header i[b-n4jy4ay2e3] {
    font-size: 0.85rem;
    color: var(--grc-navy-400);
}

.em-notif-group-body[b-n4jy4ay2e3] {
    display: flex;
    flex-direction: column;
}

.em-notif-toggle[b-n4jy4ay2e3] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.55rem 0.9rem;
    cursor: pointer;
    transition: background-color var(--grc-fast) ease;
    font-size: 0.85rem;
    color: var(--grc-text);
    border-bottom: 1px solid var(--grc-border);
    margin: 0;
}

.em-notif-toggle:last-child[b-n4jy4ay2e3] { border-bottom: none; }

.em-notif-toggle:hover[b-n4jy4ay2e3] { background: var(--grc-bg); }

/* ── Notification label with hint ──────────────────── */

.notif-label[b-n4jy4ay2e3] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.notif-hint[b-n4jy4ay2e3] {
    font-size: 0.74rem;
    color: var(--grc-text-3);
    line-height: 1.3;
    opacity: 0.8;
}

/* ── Notification section description ──────────────── */

.notif-desc[b-n4jy4ay2e3] {
    font-size: 0.82rem;
    color: var(--grc-text-3);
    margin-bottom: 1.25rem;
    line-height: 1.5;
}

/* ── Save button row ───────────────────────────────── */

.notif-actions[b-n4jy4ay2e3] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding-top: 1.75rem;
    margin-top: 1.75rem;
    border-top: 1px solid var(--grc-border);
}
/* /Pages/ResetPassword.razor.rz.scp.css */
.rp-success[b-kyl1cct0hg] {
    text-align: center;
    padding: 1rem 0 0.5rem;
}

.rp-success-icon[b-kyl1cct0hg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--grc-teal-50);
    color: var(--grc-teal-600);
    margin-bottom: 1rem;
}

.rp-success-text[b-kyl1cct0hg] {
    font-size: 0.92rem;
    color: var(--grc-text);
    line-height: 1.5;
    margin-bottom: 0.25rem;
}
/* /Shared/Breadcrumb.razor.rz.scp.css */
.app-breadcrumb[b-ddno3xsz5d] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    color: var(--grc-text-3);
    letter-spacing: 0.01em;
}

.app-breadcrumb a[b-ddno3xsz5d] {
    color: var(--grc-navy-400);
    text-decoration: none;
    transition: color var(--grc-fast) var(--grc-ease);
}

.app-breadcrumb a:hover[b-ddno3xsz5d] {
    color: var(--grc-teal-600);
}

.app-breadcrumb-sep[b-ddno3xsz5d] {
    opacity: 0.4;
}
/* /Shared/CustomObjectAddInlineForm.razor.rz.scp.css */
.rop-add-panel[b-kfcuiteszz] {
    padding: 12px 16px;
}

.rop-add-tabs[b-kfcuiteszz] {
    display: flex;
    gap: 4px;
    margin-bottom: 10px;
}

.rop-add-tab[b-kfcuiteszz] {
    background: none;
    border: 1px solid var(--grc-border);
    border-radius: 6px;
    padding: 3px 10px;
    font-size: 0.8rem;
    color: var(--grc-text-3);
    cursor: pointer;
    transition: all var(--grc-fast) ease;
}

.rop-add-tab.active[b-kfcuiteszz] {
    background: var(--grc-navy);
    color: white;
    border-color: var(--grc-navy);
}

.rop-add-tab:hover:not(.active)[b-kfcuiteszz] {
    background: var(--grc-bg);
}

.rop-search-row[b-kfcuiteszz] {
    position: relative;
    margin-bottom: 8px;
}

.rop-searching-indicator[b-kfcuiteszz] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.75rem;
    color: var(--grc-text-3);
}

.rop-results[b-kfcuiteszz] {
    max-height: 180px;
    overflow-y: auto;
    border: 1px solid var(--grc-border);
    border-radius: 6px;
    background: white;
    margin-bottom: 8px;
}

.rop-result-item[b-kfcuiteszz] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    cursor: pointer;
    border-bottom: 1px solid var(--grc-border);
    transition: background var(--grc-fast) ease;
}

.rop-result-item:last-child[b-kfcuiteszz] {
    border-bottom: none;
}

.rop-result-item:hover[b-kfcuiteszz] {
    background: var(--grc-bg);
}

.rop-result-item.selected[b-kfcuiteszz] {
    background: color-mix(in srgb, var(--grc-teal) 10%, white);
}

.rop-result-name[b-kfcuiteszz] {
    font-size: 0.875rem;
    font-weight: 500;
}

.rop-result-subtitle[b-kfcuiteszz] {
    font-size: 0.75rem;
    color: var(--grc-text-3);
}

.rop-label-section[b-kfcuiteszz] {
    margin: 10px 0 8px;
}

.rop-label-section-title[b-kfcuiteszz] {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--grc-text-2);
    display: block;
    margin-bottom: 6px;
}

.rop-label-options[b-kfcuiteszz] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.rop-label-check[b-kfcuiteszz] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.8rem;
    cursor: pointer;
    padding: 2px 6px;
    border-radius: 4px;
    border: 1px solid var(--grc-border);
    background: white;
    margin: 2px;
}

.rop-label-check:hover[b-kfcuiteszz] {
    background: var(--grc-bg);
}

.rop-add-actions[b-kfcuiteszz] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}
/* /Shared/DynamicFieldInput.razor.rz.scp.css */
.dyn-multi-picker[b-j0ey4swv1d] {
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 6px;
    padding: 8px;
    background: var(--bs-body-bg, #fff);
}

.dyn-multi-chips[b-j0ey4swv1d] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 6px;
}

.dyn-multi-chip[b-j0ey4swv1d] {
    display: inline-flex;
    align-items: center;
    padding: 4px 4px 4px 8px;
    font-weight: 500;
}

.dyn-multi-chip .btn-close[b-j0ey4swv1d] {
    width: 0.6em;
    height: 0.6em;
    padding: 0;
    opacity: 0.85;
}

.dyn-multi-results[b-j0ey4swv1d] {
    max-height: 220px;
    overflow-y: auto;
    margin-top: 6px;
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 4px;
    background: var(--bs-body-bg, #fff);
}

.dyn-multi-result[b-j0ey4swv1d] {
    display: block;
    width: 100%;
    text-align: left;
    padding: 6px 10px;
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--bs-border-color-translucent, #f0f0f0);
    cursor: pointer;
    font-size: 0.9rem;
}

.dyn-multi-result:last-child[b-j0ey4swv1d] {
    border-bottom: 0;
}

.dyn-multi-result:hover[b-j0ey4swv1d],
.dyn-multi-result:focus-visible[b-j0ey4swv1d] {
    background: var(--bs-secondary-bg, #f5f5f5);
}

.dyn-multi-hint[b-j0ey4swv1d] {
    background: var(--bs-light, #fafafa);
    border-top: 1px solid var(--bs-border-color-translucent, #f0f0f0);
}
/* /Shared/EntitySearchSelect.razor.rz.scp.css */
.esp-container[b-wo0x2smq8v] {
    position: relative;
}

/* ── Search ───────────────────────────────── */
.esp-search-wrap[b-wo0x2smq8v] {
    position: relative;
}

.esp-search-icon[b-wo0x2smq8v] {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.82rem;
    opacity: 0.4;
    color: var(--grc-text-3);
    pointer-events: none;
}

.esp-search-input[b-wo0x2smq8v] {
    padding-left: 32px !important;
    font-size: 0.9rem;
    border-color: var(--grc-border-2);
    transition: border-color var(--grc-fast) ease, box-shadow var(--grc-fast) ease;
}

.esp-search-input:focus[b-wo0x2smq8v] {
    border-color: var(--grc-teal);
    box-shadow: 0 0 0 3px var(--grc-teal-glow);
}

.esp-spinner[b-wo0x2smq8v] {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    border: 2px solid var(--grc-border);
    border-top-color: var(--grc-teal);
    border-radius: 50%;
    animation: esp-spin-b-wo0x2smq8v 0.6s linear infinite;
}

@keyframes esp-spin-b-wo0x2smq8v {
    to { transform: translateY(-50%) rotate(360deg); }
}

/* ── Dropdown ─────────────────────────────── */
.esp-dropdown[b-wo0x2smq8v] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1050;
    margin-top: 4px;
    max-height: 240px;
    overflow-y: auto;
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r-sm);
    background: var(--grc-white);
    box-shadow: var(--grc-shadow);
    animation: esp-drop-in-b-wo0x2smq8v var(--grc-fast) var(--grc-ease) both;
}

@keyframes esp-drop-in-b-wo0x2smq8v {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ── Result Items ─────────────────────────── */
.esp-result-item[b-wo0x2smq8v] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    cursor: pointer;
    border-bottom: 1px solid var(--grc-border);
    transition: background var(--grc-fast) ease;
}

.esp-result-item:last-child[b-wo0x2smq8v] {
    border-bottom: none;
}

.esp-result-item:hover[b-wo0x2smq8v] {
    background: var(--grc-teal-50);
}

.esp-result-item.highlighted[b-wo0x2smq8v] {
    background: var(--grc-teal-50);
    border-left: 2px solid var(--grc-teal);
    padding-left: 10px;
}

.esp-result-avatar[b-wo0x2smq8v] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--grc-navy);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.72rem;
    font-weight: 600;
    flex-shrink: 0;
    text-transform: uppercase;
}

.esp-result-avatar.esp-avatar-square[b-wo0x2smq8v] {
    border-radius: var(--grc-r-sm);
    background: var(--grc-navy-600);
}

.esp-result-info[b-wo0x2smq8v] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.esp-result-name[b-wo0x2smq8v] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--grc-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.esp-result-subtitle[b-wo0x2smq8v] {
    font-size: 0.75rem;
    color: var(--grc-text-3);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Selected State ───────────────────────── */
.esp-selected[b-wo0x2smq8v] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: var(--grc-teal-50);
    border: 1px solid color-mix(in srgb, var(--grc-teal) 30%, transparent);
    border-radius: var(--grc-r-sm);
    animation: esp-fade-in-b-wo0x2smq8v var(--grc-fast) ease both;
}

.esp-selected.esp-disabled[b-wo0x2smq8v] {
    opacity: 0.65;
    pointer-events: none;
}

@keyframes esp-fade-in-b-wo0x2smq8v {
    from { opacity: 0; }
    to { opacity: 1; }
}

.esp-selected-avatar[b-wo0x2smq8v] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--grc-teal);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 600;
    flex-shrink: 0;
    text-transform: uppercase;
}

.esp-selected-avatar.esp-avatar-square[b-wo0x2smq8v] {
    border-radius: var(--grc-r-sm);
}

.esp-selected-info[b-wo0x2smq8v] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.esp-selected-name[b-wo0x2smq8v] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--grc-text);
}

.esp-selected-detail[b-wo0x2smq8v] {
    font-size: 0.75rem;
    color: var(--grc-text-3);
}

.esp-clear-btn[b-wo0x2smq8v] {
    background: none;
    border: none;
    color: var(--grc-text-3);
    cursor: pointer;
    font-size: 0.85rem;
    padding: 4px;
    border-radius: 4px;
    line-height: 1;
    transition: color var(--grc-fast) ease, background var(--grc-fast) ease;
}

.esp-clear-btn:hover[b-wo0x2smq8v] {
    color: var(--grc-text);
    background: rgba(0, 0, 0, 0.06);
}

/* ── No Results ───────────────────────────── */
.esp-no-results[b-wo0x2smq8v] {
    font-size: 0.8rem;
    color: var(--grc-text-3);
    padding: 12px;
    margin: 0;
}
/* /Shared/FieldDefinitionForm.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   FieldDefinitionForm — add/edit field card
   ═══════════════════════════════════════════════════════ */

.fdf-card[b-iwsiqzcwak] {
    background: var(--grc-white);
    border: 1px solid var(--grc-border);
    border-left: 3px solid var(--grc-teal);
    border-radius: var(--grc-r);
    padding: 1.15rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.fdf-row[b-iwsiqzcwak] {
    display: flex;
    gap: 0.85rem;
    align-items: flex-start;
    flex-wrap: wrap;
}

.fdf-row-secondary[b-iwsiqzcwak] {
    padding-top: 0.5rem;
    border-top: 1px solid var(--grc-border);
}

.fdf-field[b-iwsiqzcwak] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.fdf-field-label[b-iwsiqzcwak] { flex: 2; min-width: 160px; }
.fdf-field-type[b-iwsiqzcwak] { flex: 1; min-width: 120px; }
.fdf-field-applicable[b-iwsiqzcwak] { flex: 1; min-width: 120px; }
.fdf-field-key[b-iwsiqzcwak] { flex: 1; min-width: 140px; }
.fdf-field-options[b-iwsiqzcwak] { flex: 2; min-width: 200px; }

.fdf-field-required[b-iwsiqzcwak] {
    flex: 0 0 auto;
    min-width: 100px;
}

.fdf-label[b-iwsiqzcwak] {
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--grc-text-2);
    margin: 0;
}

.fdf-required-mark[b-iwsiqzcwak] {
    color: #c0392b;
}

/* Key preview */
.fdf-key-preview[b-iwsiqzcwak] {
    display: flex;
    align-items: center;
    padding: 0.3rem 0.55rem;
    min-height: 1.875rem;
    background: var(--grc-bg);
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r-sm);
    font-family: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace;
    font-size: 0.78rem;
    color: var(--grc-text-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fdf-hint[b-iwsiqzcwak] {
    font-size: 0.7rem;
    color: var(--grc-text-3);
    font-style: italic;
}

/* Toggle switch */
.fdf-toggle[b-iwsiqzcwak] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    cursor: pointer;
    padding-top: 0.3rem;
    user-select: none;
}

.fdf-toggle input[b-iwsiqzcwak] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.fdf-toggle-track[b-iwsiqzcwak] {
    position: relative;
    width: 2rem;
    height: 1.1rem;
    background: var(--grc-border-2);
    border-radius: 0.55rem;
    transition: background-color var(--grc-fast) ease;
    flex-shrink: 0;
}

.fdf-toggle input:checked + .fdf-toggle-track[b-iwsiqzcwak] {
    background: var(--grc-teal);
}

.fdf-toggle-thumb[b-iwsiqzcwak] {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 0.85rem;
    height: 0.85rem;
    background: var(--grc-white);
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
    transition: transform var(--grc-fast) var(--grc-ease);
}

.fdf-toggle input:checked + .fdf-toggle-track .fdf-toggle-thumb[b-iwsiqzcwak] {
    transform: translateX(0.9rem);
}

.fdf-toggle-label[b-iwsiqzcwak] {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--grc-text-2);
}

/* Actions row */
.fdf-actions[b-iwsiqzcwak] {
    display: flex;
    gap: 0.4rem;
    padding-top: 0.35rem;
}
/* /Shared/IconPicker.razor.rz.scp.css */
/* ── Wrapper ── */
.icon-picker[b-fck2jvz3aj] {
    position: relative;
    display: inline-block;
    width: 100%;
    z-index: 1;
}

.icon-picker.is-open[b-fck2jvz3aj] {
    z-index: 500;
}

/* ── Trigger — form-control look ── */
.icon-picker-toggle[b-fck2jvz3aj] {
    -webkit-appearance: none;
    appearance: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0.5rem 0.875rem;
    font-family: 'Outfit', sans-serif;
    font-size: 0.9rem;
    font-weight: 400;
    color: var(--grc-text);
    background: var(--grc-white);
    border: 1px solid var(--grc-border-2);
    border-radius: var(--grc-r-sm);
    cursor: pointer;
    transition: border-color var(--grc-fast) ease,
                box-shadow var(--grc-fast) ease;
    text-align: left;
}

.icon-picker-toggle:hover[b-fck2jvz3aj] {
    border-color: var(--grc-navy-400);
}

.icon-picker-toggle:focus[b-fck2jvz3aj] {
    outline: none;
    border-color: var(--grc-teal);
    box-shadow: 0 0 0 3px var(--grc-teal-glow);
}

.icon-picker.is-open .icon-picker-toggle[b-fck2jvz3aj] {
    border-color: var(--grc-teal);
    box-shadow: 0 0 0 3px var(--grc-teal-glow);
}

.icon-picker-value[b-fck2jvz3aj] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    min-width: 0;
}

.icon-picker-preview[b-fck2jvz3aj] {
    font-size: 1rem;
    color: var(--grc-navy-600);
    flex-shrink: 0;
}

.icon-picker-placeholder[b-fck2jvz3aj] {
    color: var(--grc-text-3);
}

.icon-picker-chevron[b-fck2jvz3aj] {
    font-size: 0.75rem;
    color: var(--grc-text-3);
    flex-shrink: 0;
    margin-left: 0.5rem;
    transition: transform var(--grc-fast) var(--grc-ease);
}

.icon-picker.is-open .icon-picker-chevron[b-fck2jvz3aj] {
    transform: rotate(180deg);
}

/* ── Dropdown panel ── */
.icon-picker-panel[b-fck2jvz3aj] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    z-index: 1050;
    width: 340px;
    background: var(--grc-white);
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r);
    padding: 0.875rem;
    box-shadow: var(--grc-shadow-lg);
    animation: iconPickerIn-b-fck2jvz3aj var(--grc-fast) var(--grc-ease);
}

@keyframes iconPickerIn-b-fck2jvz3aj {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Search input ── */
.icon-picker-search[b-fck2jvz3aj] {
    margin-bottom: 0.625rem !important;
}

/* ── Icon grid ── */
.icon-picker-grid[b-fck2jvz3aj] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 3px;
    max-height: 256px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--grc-border-2) transparent;
}

/* ── Individual icon cell — full appearance reset ── */
.icon-picker-item[b-fck2jvz3aj] {
    -webkit-appearance: none;
    appearance: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 3px;
    padding: 7px 3px 5px;
    border: none;
    border-radius: var(--grc-r-sm);
    background: transparent;
    color: var(--grc-text-2);
    font-family: 'Outfit', sans-serif;
    font-size: 0.6rem;
    cursor: pointer;
    transition: background var(--grc-fast) ease,
                color var(--grc-fast) ease;
    overflow: hidden;
    outline: none;
}

.icon-picker-item i[b-fck2jvz3aj] {
    font-size: 1.1rem;
    line-height: 1;
    flex-shrink: 0;
}

.icon-picker-item span[b-fck2jvz3aj] {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    line-height: 1.2;
}

.icon-picker-item:hover[b-fck2jvz3aj] {
    background: var(--grc-surface-2);
    color: var(--grc-navy);
}

.icon-picker-item:focus-visible[b-fck2jvz3aj] {
    outline: none;
    box-shadow: 0 0 0 2px var(--grc-teal);
}

.icon-picker-item.is-selected[b-fck2jvz3aj] {
    background: var(--grc-teal-50);
    color: var(--grc-teal-600);
}

.icon-picker-item.is-selected i[b-fck2jvz3aj] {
    color: var(--grc-teal-600);
}

/* ── Empty state ── */
.icon-picker-empty[b-fck2jvz3aj] {
    grid-column: 1 / -1;
    color: var(--grc-text-3);
    font-size: 0.8rem;
    padding: 0.5rem;
    margin: 0;
}
/* /Shared/SendEmailForm.razor.rz.scp.css */
.em-compose-btn[b-mteqi9imn2] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    font-weight: 500;
}

.em-compose-card[b-mteqi9imn2] {
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r);
    background: var(--grc-white);
    box-shadow: var(--grc-shadow-xs);
    overflow: hidden;
    margin-bottom: 1rem;
}

.em-compose-header[b-mteqi9imn2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.6rem 0.9rem;
    background: var(--grc-bg);
    border-bottom: 1px solid var(--grc-border);
}

.em-compose-title[b-mteqi9imn2] {
    font-family: 'Outfit', sans-serif;
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--grc-navy);
}

.em-compose-close[b-mteqi9imn2] {
    font-size: 0.75rem;
    padding: 0.15rem 0.5rem;
}

.em-compose-body[b-mteqi9imn2] {
    padding: 0.9rem;
}

.em-compose-label[b-mteqi9imn2] {
    display: block;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--grc-text-3);
    margin-bottom: 0.2rem;
}

.em-compose-actions[b-mteqi9imn2] {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.5rem;
}
/* /Shared/SortableList.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   SortableList — drag-and-drop reorder
   ═══════════════════════════════════════════════════════ */

.sl-list[b-gk2slim8j7] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sl-item[b-gk2slim8j7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.75rem;
    background: var(--grc-white);
    border: 1px solid var(--grc-border);
    border-radius: var(--grc-r-sm);
    transition: background-color var(--grc-fast) ease,
                border-color var(--grc-fast) ease,
                box-shadow var(--grc-fast) ease,
                opacity var(--grc-fast) ease,
                transform var(--grc-fast) var(--grc-ease);
    position: relative;
}

.sl-item:hover[b-gk2slim8j7] {
    border-color: var(--grc-border-2);
    background: var(--grc-bg);
}

/* Drag handle */
.sl-handle[b-gk2slim8j7] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    cursor: grab;
    color: var(--grc-text-3);
    border-radius: 4px;
    flex-shrink: 0;
    background: var(--grc-bg);
    border: 1px solid transparent;
    transition: color var(--grc-fast) ease,
                background-color var(--grc-fast) ease,
                border-color var(--grc-fast) ease;
}

.sl-handle:hover[b-gk2slim8j7] {
    color: var(--grc-navy);
    background: var(--grc-surface-2);
    border-color: var(--grc-border);
}

.sl-handle:active[b-gk2slim8j7] { cursor: grabbing; }

.sl-handle svg[b-gk2slim8j7] {
    width: 14px;
    height: 14px;
}

/* Item content */
.sl-content[b-gk2slim8j7] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Action buttons area */
.sl-actions[b-gk2slim8j7] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
    opacity: 0.35;
    transition: opacity var(--grc-fast) ease;
}

.sl-item:hover .sl-actions[b-gk2slim8j7] { opacity: 1; }

/* Up/down arrow buttons */
.sl-arrow[b-gk2slim8j7] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    border: 1px solid var(--grc-border-2);
    border-radius: 3px;
    background: var(--grc-white);
    color: var(--grc-text-3);
    cursor: pointer;
    font-size: 0.75rem;
    transition: color var(--grc-fast) ease,
                border-color var(--grc-fast) ease,
                background-color var(--grc-fast) ease;
}

.sl-arrow:hover[b-gk2slim8j7] {
    color: var(--grc-navy);
    border-color: var(--grc-navy);
    background: var(--grc-surface-2);
}

.sl-arrow:disabled[b-gk2slim8j7] {
    opacity: 0.3;
    cursor: default;
    pointer-events: none;
}

/* ── Drag states ── */

.sl-item.sl-dragging[b-gk2slim8j7] {
    opacity: 0.55;
    border-style: dashed;
    border-color: var(--grc-navy-400);
    background: var(--grc-surface-2);
    box-shadow: var(--grc-shadow);
}

.sl-item.sl-dragging .sl-handle[b-gk2slim8j7] { cursor: grabbing; }

.sl-item.sl-drop-above[b-gk2slim8j7]::before,
.sl-item.sl-drop-below[b-gk2slim8j7]::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--grc-teal);
    border-radius: 2px;
    z-index: 2;
    box-shadow: 0 0 8px rgba(0, 197, 168, 0.45);
}

.sl-item.sl-drop-above[b-gk2slim8j7]::before { top: -5px; }
.sl-item.sl-drop-below[b-gk2slim8j7]::after  { bottom: -5px; }

.sl-item.sl-drop-target[b-gk2slim8j7] {
    background: var(--grc-teal-50);
    border-color: var(--grc-teal);
}

/* Settle animation after drop */
@keyframes sl-settle-b-gk2slim8j7 {
    0%   { transform: scale(1.03); box-shadow: var(--grc-shadow-sm); }
    100% { transform: scale(1);    box-shadow: none; }
}

.sl-item.sl-just-dropped[b-gk2slim8j7] {
    animation: sl-settle-b-gk2slim8j7 0.25s var(--grc-ease) both;
    border-color: var(--grc-teal);
    background: var(--grc-teal-50);
}

/* ── Compact variant (for table-like field lists) ── */

.sl-compact .sl-item[b-gk2slim8j7] {
    padding: 0.4rem 0.6rem;
    border-radius: 3px;
    gap: 0.4rem;
}

.sl-compact .sl-handle[b-gk2slim8j7] {
    width: 1.35rem;
    height: 1.35rem;
}

.sl-compact .sl-handle svg[b-gk2slim8j7] {
    width: 12px;
    height: 12px;
}

.sl-compact .sl-arrow[b-gk2slim8j7] {
    width: 1.35rem;
    height: 1.35rem;
    font-size: 0.68rem;
}
/* /Shared/TagInput.razor.rz.scp.css */
.tag-input-wrap[b-tcuoa11pis] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.5rem;
    min-height: 2.15rem;
    background: var(--grc-white);
    border: 1px solid var(--grc-border-2);
    border-radius: var(--grc-r-sm);
    cursor: text;
    transition: border-color var(--grc-fast) ease, box-shadow var(--grc-fast) ease;
}

.tag-input-wrap:focus-within[b-tcuoa11pis] {
    border-color: var(--grc-teal);
    box-shadow: 0 0 0 3px var(--grc-teal-glow);
}

.tag-chip[b-tcuoa11pis] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    padding: 0.15rem 0.25rem 0.15rem 0.5rem;
    background: var(--grc-surface-2);
    border: 1px solid var(--grc-border);
    border-radius: 4px;
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--grc-text);
    line-height: 1.3;
    animation: tag-pop-b-tcuoa11pis 0.15s var(--grc-ease) both;
}

@keyframes tag-pop-b-tcuoa11pis {
    0%   { transform: scale(0.85); opacity: 0; }
    100% { transform: scale(1);    opacity: 1; }
}

.tag-chip-text[b-tcuoa11pis] {
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tag-chip-remove[b-tcuoa11pis] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.15rem;
    height: 1.15rem;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--grc-text-3);
    border-radius: 3px;
    cursor: pointer;
    font-size: 0.85rem;
    transition: color var(--grc-fast) ease, background-color var(--grc-fast) ease;
}

.tag-chip-remove:hover[b-tcuoa11pis] {
    color: #c0392b;
    background: rgba(192, 57, 43, 0.1);
}

.tag-input-field[b-tcuoa11pis] {
    flex: 1;
    min-width: 80px;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.8rem;
    color: var(--grc-text);
    padding: 0.1rem 0;
}

.tag-input-field[b-tcuoa11pis]::placeholder {
    color: var(--grc-text-3);
}
