/* Public portal and knowledge-base redesign. */
:root {
  --public-ui-accent: #2563eb;
  --public-ui-accent-rgb: 37, 99, 235;
  --public-ui-accent-strong: #1d4ed8;
  --public-ui-accent-soft: #eff6ff;
  --public-ui-canvas: #f5f7fb;
  --public-ui-surface: #ffffff;
  --public-ui-surface-muted: #f8fafc;
  --public-ui-text: #18212f;
  --public-ui-muted: #667085;
  --public-ui-border: #dfe5ee;
  --public-ui-border-strong: #c9d2df;
  --public-ui-radius: 1rem;
  --public-ui-radius-lg: 1.4rem;
  --public-ui-shadow-sm: 0 6px 20px rgba(16, 24, 40, .06);
  --public-ui-shadow: 0 18px 48px rgba(16, 24, 40, .11);
  --public-header-height: 4.5rem;
}

[data-bs-theme="dark"] {
  --public-ui-accent: #7b9cff;
  --public-ui-accent-rgb: 123, 156, 255;
  --public-ui-accent-strong: #9db4ff;
  --public-ui-accent-soft: rgba(123, 156, 255, .14);
  --public-ui-canvas: #0b111c;
  --public-ui-surface: #151e2d;
  --public-ui-surface-muted: #111a28;
  --public-ui-text: #f2f4f7;
  --public-ui-muted: #98a2b3;
  --public-ui-border: #2b394d;
  --public-ui-border-strong: #3b4b61;
  --public-ui-shadow-sm: 0 8px 24px rgba(0, 0, 0, .2);
  --public-ui-shadow: 0 22px 58px rgba(0, 0, 0, .34);
}

body.public-ui-next,
body.kb-ui-next {
  min-width: 320px;
  background:
    radial-gradient(circle at 90% 0, rgba(var(--public-ui-accent-rgb), .08), transparent 28rem),
    var(--public-ui-canvas);
  color: var(--public-ui-text);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
  letter-spacing: -.006em;
  text-rendering: optimizeLegibility;
}

body.public-ui-next :where(a, button, input, select, textarea, [tabindex]):focus-visible,
body.kb-ui-next :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid rgba(var(--public-ui-accent-rgb), .24) !important;
  outline-offset: 2px;
  box-shadow: none !important;
}

.public-navbar,
.kb-navbar {
  min-height: var(--public-header-height);
  border-bottom-color: var(--public-ui-border) !important;
  background: rgba(255, 255, 255, .9) !important;
  box-shadow: 0 1px 0 rgba(16, 24, 40, .035);
  backdrop-filter: saturate(160%) blur(18px);
  -webkit-backdrop-filter: saturate(160%) blur(18px);
}

[data-bs-theme="dark"] .public-navbar,
[data-bs-theme="dark"] .kb-navbar {
  background: rgba(15, 23, 36, .9) !important;
}

.public-brand-mark,
.kb-brand-mark {
  border: 1px solid rgba(var(--public-ui-accent-rgb), .2);
  background: linear-gradient(145deg, var(--public-ui-accent), var(--public-ui-accent-strong)) !important;
  box-shadow: 0 9px 22px rgba(var(--public-ui-accent-rgb), .22) !important;
}

.public-brand,
.public-brand:hover,
.public-brand:focus,
.kb-brand,
.kb-brand:hover,
.kb-brand:focus { color: var(--public-ui-text); }

.public-navbar .nav-link {
  min-height: 2.6rem;
  color: var(--public-ui-muted);
}

.public-navbar .nav-link:hover,
.public-navbar .nav-link:focus,
.public-navbar .nav-link.active {
  background: var(--public-ui-accent-soft);
  color: var(--public-ui-accent-strong);
}

.public-topbar-action {
  border-color: var(--public-ui-border);
  background: var(--public-ui-surface);
  color: var(--public-ui-muted);
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}

.public-topbar-action:hover,
.public-topbar-action:focus {
  border-color: rgba(var(--public-ui-accent-rgb), .32);
  background: var(--public-ui-accent-soft);
  color: var(--public-ui-accent-strong);
}

#public-main {
  background: transparent !important;
}

.public-hero {
  border-bottom: 1px solid var(--public-ui-border);
  background:
    radial-gradient(circle at 84% 14%, rgba(var(--public-ui-accent-rgb), .16), transparent 24rem),
    linear-gradient(180deg, var(--public-ui-accent-soft), var(--public-ui-surface) 82%) !important;
}

.public-hero::before {
  opacity: .65;
}

.public-display {
  color: var(--public-ui-text);
  font-weight: 790;
  letter-spacing: -.055em;
  text-wrap: balance;
}

.public-eyebrow {
  color: var(--public-ui-accent-strong);
  font-size: .75rem;
  letter-spacing: .08em;
}

.public-section-heading,
.public-content,
.public-page-card { color: var(--public-ui-text); }

.public-card,
.public-page-card,
.public-helpdesk-card,
.ticket-lookup-card,
.kb-card,
body.kb-ui-next .card {
  border: 1px solid var(--public-ui-border) !important;
  border-radius: var(--public-ui-radius) !important;
  background: var(--public-ui-surface) !important;
  color: var(--public-ui-text);
  box-shadow: var(--public-ui-shadow-sm) !important;
}

.public-page-card,
.public-helpdesk-card,
.ticket-lookup-card { border-radius: var(--public-ui-radius-lg) !important; }

.public-card:hover,
.public-quick-action:hover,
.ticket-result-card:hover,
.kb-card:hover {
  border-color: rgba(var(--public-ui-accent-rgb), .38) !important;
  box-shadow: var(--public-ui-shadow) !important;
  transform: translateY(-2px);
}

.public-icon,
.ticket-result-icon,
.ticket-session-icon,
.ticket-code-recipient-icon {
  background: var(--public-ui-accent-soft) !important;
  color: var(--public-ui-accent-strong) !important;
}

.public-quick-action,
.ticket-result-card,
.ticket-code-panel,
.ticket-session-banner,
.ticket-empty-state {
  border-color: var(--public-ui-border) !important;
  background: var(--public-ui-surface-muted) !important;
  color: var(--public-ui-text) !important;
}

.ticket-lookup-header,
.public-helpdesk-card .card-header {
  border-bottom-color: var(--public-ui-border) !important;
  background: var(--public-ui-surface-muted) !important;
}

.ticket-lookup-tabs .nav-link {
  color: var(--public-ui-muted);
}

.ticket-lookup-tabs .nav-link.active {
  background: var(--public-ui-surface) !important;
  color: var(--public-ui-accent-strong) !important;
}

.public-ui-next .btn,
.kb-ui-next .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .42rem;
  min-height: 2.75rem;
  padding-inline: .9rem;
  border-radius: .68rem;
  font-size: .88rem;
  font-weight: 680;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
  transition: transform 160ms cubic-bezier(.2, 0, 0, 1), box-shadow 160ms cubic-bezier(.2, 0, 0, 1), background-color 160ms cubic-bezier(.2, 0, 0, 1), border-color 160ms cubic-bezier(.2, 0, 0, 1);
}

.public-ui-next .btn-sm,
.kb-ui-next .btn-sm { min-height: 2.25rem; padding-inline: .7rem; font-size: .8rem; }
.public-ui-next .btn:hover,
.kb-ui-next .btn:hover { transform: translateY(-1px); }
.public-ui-next .btn-primary,
.kb-ui-next .btn-primary {
  --bs-btn-bg: var(--public-ui-accent);
  --bs-btn-border-color: var(--public-ui-accent);
  --bs-btn-hover-bg: var(--public-ui-accent-strong);
  --bs-btn-hover-border-color: var(--public-ui-accent-strong);
}
.public-ui-next .btn-outline-primary,
.kb-ui-next .btn-outline-primary {
  --bs-btn-color: var(--public-ui-accent-strong);
  --bs-btn-border-color: rgba(var(--public-ui-accent-rgb), .38);
  --bs-btn-hover-bg: var(--public-ui-accent);
  --bs-btn-hover-border-color: var(--public-ui-accent);
}
.public-ui-next .btn-outline-secondary,
.kb-ui-next .btn-outline-secondary {
  border-color: var(--public-ui-border-strong);
  background: var(--public-ui-surface);
  color: var(--public-ui-text);
}

.public-ui-next .form-control,
.public-ui-next .form-select,
.public-ui-next .input-group-text,
.kb-ui-next .form-control,
.kb-ui-next .form-select {
  min-height: 2.75rem;
  border-color: var(--public-ui-border-strong);
  border-radius: .68rem;
  background: var(--public-ui-surface);
  color: var(--public-ui-text);
  font-size: .9rem;
}

.public-ui-next .form-control:focus,
.public-ui-next .form-select:focus,
.kb-ui-next .form-control:focus,
.kb-ui-next .form-select:focus {
  border-color: var(--public-ui-accent);
  box-shadow: 0 0 0 .22rem rgba(var(--public-ui-accent-rgb), .14) !important;
}

.public-ui-next .form-label,
.kb-ui-next .form-label {
  color: var(--public-ui-text);
  font-size: .84rem;
  font-weight: 670;
}

.public-ui-next .text-muted,
.public-ui-next .text-body-secondary,
.public-ui-next .text-secondary,
.kb-ui-next .text-muted,
.kb-ui-next .text-body-secondary,
.kb-ui-next .text-secondary { color: var(--public-ui-muted) !important; }

.public-ui-next .text-primary,
.kb-ui-next .text-primary { color: var(--public-ui-accent-strong) !important; }
.public-ui-next .bg-primary-subtle,
.kb-ui-next .bg-primary-subtle { background: var(--public-ui-accent-soft) !important; }

.public-ui-next .dropdown-menu,
.public-ui-next .modal-content,
.kb-ui-next .dropdown-menu,
.kb-ui-next .modal-content {
  border-color: var(--public-ui-border);
  border-radius: .95rem;
  background: var(--public-ui-surface);
  color: var(--public-ui-text);
  box-shadow: var(--public-ui-shadow);
}

.public-ui-next .alert,
.kb-ui-next .alert {
  border-radius: .82rem;
  box-shadow: none;
}

.public-content {
  color: var(--public-ui-text);
  font-size: 1rem;
  line-height: 1.78;
}

.public-content :where(h2, h3, h4),
.kb-body :where(h2, h3, h4) {
  color: var(--public-ui-text);
  font-weight: 740;
  letter-spacing: -.025em;
}

.public-content a,
.kb-body a { color: var(--public-ui-accent-strong); }
.public-content blockquote,
.kb-body blockquote {
  padding: 1rem 1.1rem;
  border-left: .25rem solid var(--public-ui-accent);
  border-radius: 0 .75rem .75rem 0;
  background: var(--public-ui-surface-muted);
}

.public-content table,
.kb-body table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--public-ui-border);
  border-radius: .85rem;
  background: var(--public-ui-surface);
}
.public-content :where(th, td),
.kb-body :where(th, td) { padding: .72rem .8rem; border-bottom: 1px solid var(--public-ui-border); }
.public-content th,
.kb-body th { background: var(--public-ui-surface-muted); color: var(--public-ui-muted); font-size: .76rem; text-transform: uppercase; }

.public-footer,
.kb-footer {
  border-top: 1px solid var(--public-ui-border);
  background: var(--public-ui-surface) !important;
  color: var(--public-ui-muted);
}

.public-footer-link { color: var(--public-ui-muted) !important; }
.public-footer-link:hover,
.public-footer-link:focus { color: var(--public-ui-accent-strong) !important; }

.kb-shell { max-width: 1180px !important; }
.kb-navbar-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .75rem;
}
.kb-brand {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: .6rem;
}
.kb-brand-mark {
  width: 2.35rem;
  height: 2.35rem;
  flex: 0 0 2.35rem;
}
.kb-brand-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.kb-navbar-actions {
  display: flex;
  align-items: center;
  gap: .45rem;
  min-width: 0;
}
.kb-main { min-height: calc(100dvh - var(--public-header-height)); }
.kb-search-surface {
  border: 1px solid var(--public-ui-border);
  border-radius: var(--public-ui-radius-lg);
  background: var(--public-ui-surface);
  box-shadow: var(--public-ui-shadow-sm);
}

@media (max-width: 991.98px) {
  :root { --public-header-height: 4rem; }
  .public-navbar .navbar-collapse {
    border-color: var(--public-ui-border) !important;
    background: var(--public-ui-surface) !important;
    box-shadow: var(--public-ui-shadow) !important;
  }
}

@media (max-width: 767.98px) {
  .public-display { font-size: clamp(2.25rem, 12vw, 3.35rem); }
  .public-page-shell { padding-block: 1.5rem; }
  .public-page-card .card-body { padding: 1rem !important; }
  .kb-navbar-inner { padding-block: .7rem !important; gap: .5rem; }
  .kb-brand-mark { width: 2.1rem; height: 2.1rem; flex-basis: 2.1rem; }
  .kb-navbar-actions .btn {
    width: 2.45rem;
    min-width: 2.45rem;
    padding-inline: 0;
  }
  .kb-action-label { display: none; }
}

@media (pointer: coarse) {
  .public-ui-next :where(.btn, .form-control, .form-select, .nav-link, .dropdown-item),
  .kb-ui-next :where(.btn, .form-control, .form-select, .nav-link, .dropdown-item) { min-height: 2.75rem; }
}

@media (prefers-reduced-motion: reduce) {
  .public-ui-next *,
  .public-ui-next *::before,
  .public-ui-next *::after,
  .kb-ui-next *,
  .kb-ui-next *::before,
  .kb-ui-next *::after {
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
    animation-duration: .001ms !important;
  }
}

@media print {
  .public-navbar,
  .public-footer,
  .kb-navbar,
  .kb-footer,
  .btn,
  .dropdown { display: none !important; }
  body.public-ui-next,
  body.kb-ui-next,
  .card { background: #fff !important; color: #000 !important; box-shadow: none !important; }
}

.d-inline-grid { display: inline-grid !important; }
.place-items-center { place-items: center !important; }
.form-label.is-required::after {
  margin-left: .25rem;
  color: #d92d20;
  content: '*';
  font-weight: 760;
}
