/*
 * Vristo portal preview
 *
 * This layer deliberately stays behind data-portal-ui="vristo". It translates
 * the purchased Vristo visual language onto the existing Tailwind 4/daisyUI 5
 * markup without importing Vristo's Tailwind 3 component bundle (whose .btn,
 * .badge and .dropdown selectors would collide with daisyUI).
 */

html[data-portal-ui="vristo"] {
  /* Keep daisyUI semantic utilities in the same light palette as Vristo.
   * The portal's persisted light theme is named `prism`, but its original
   * base tokens are dark. Without this bridge text-base-content/* becomes
   * almost white on Vristo's white panels. */
  --color-base-100: #fff;
  --color-base-200: #f1f2f3;
  --color-base-300: #e0e6ed;
  --color-base-content: #0e1726;
  --color-neutral: #3b3f5c;
  --color-neutral-content: #fff;
  --vristo-primary: #4361ee;
  --vristo-primary-strong: #2f46c7;
  --vristo-primary-soft: #eef1ff;
  --vristo-secondary: #805dca;
  --vristo-success: #00ab55;
  --vristo-warning: #e2a03f;
  --vristo-danger: #e7515a;
  --vristo-info: #2196f3;
  --vristo-ink: #0e1726;
  --vristo-muted: #888ea8;
  --vristo-line: #e0e6ed;
  --vristo-canvas: #fafafa;
  --vristo-panel: #fff;
  --vristo-header-scrim: rgb(250 250 250 / 0.9);
  --vristo-sidebar: 260px;
  --vristo-shell-max: 1400px;
  --vristo-panel-shadow: 0 1px 3px rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  color-scheme: light;
  font-family: Nunito, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html[data-portal-ui="vristo"] body {
  background: var(--vristo-canvas);
  color: var(--vristo-ink);
  font-size: 0.875rem;
  line-height: 1.25rem;
  letter-spacing: normal;
}

html[data-portal-ui="vristo"] #portal-app-shell {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}

html[data-portal-ui="vristo"] .portal-sidebar-expand {
  display: none;
}

html[data-portal-ui="vristo"] .drawer-content {
  background: var(--vristo-canvas);
}

html[data-portal-ui="vristo"] .portal-global-header {
  position: sticky;
  top: 0;
  /* Keep navbar dropdowns above page-level action bars and sticky widgets. */
  z-index: 100;
  display: block;
  width: 100%;
  gap: 0;
  padding: 1rem 1.5rem 0;
  border: 0;
  background: var(--vristo-header-scrim);
  color: var(--vristo-ink);
}

html[data-portal-ui="vristo"] .portal-global-header-frame {
  box-shadow: 0 1px 2px rgb(0 0 0 / 0.05);
}

html[data-portal-ui="vristo"] .portal-global-header-surface {
  display: flex;
  min-height: 0;
  border-radius: 0.375rem;
  background: var(--vristo-panel);
  padding: 0.625rem 1.25rem;
  color: var(--vristo-ink);
}

html[data-portal-ui="vristo"] .portal-global-header .portal-header-utility,
html[data-portal-ui="vristo"] .portal-global-header .portal-header-dropdown > summary {
  color: var(--vristo-ink);
}

html[data-portal-ui="vristo"] .portal-global-header .portal-header-utility,
html[data-portal-ui="vristo"] .portal-global-header .portal-header-dropdown > summary {
  border-radius: 999px;
  background: rgb(241 242 243 / 0.4);
}

html[data-portal-ui="vristo"] .portal-global-header .portal-header-utility:hover,
html[data-portal-ui="vristo"] .portal-global-header .portal-header-utility:focus-visible,
html[data-portal-ui="vristo"] .portal-global-header .portal-header-dropdown > summary:hover,
html[data-portal-ui="vristo"] .portal-global-header .portal-header-dropdown > summary:focus-visible {
  background: rgb(241 242 243 / 0.9);
}

html[data-portal-ui="vristo"] .portal-company-search-slot {
  flex: 0 1 420px;
  max-width: 420px;
}

html[data-portal-ui="vristo"] .portal-global-company-search {
  width: 100%;
  max-width: 420px;
}

html[data-portal-ui="vristo"] .portal-global-header .btn {
  border-radius: 8px;
}

/* The guest account action has the same visual weight as the page actions
 * below the header. Keep the compact daisyUI markup for the classic skin. */
html[data-portal-ui="vristo"] .portal-global-header .portal-header-login {
  height: 40px;
  min-height: 40px;
  padding-inline: 1rem;
  font-size: .8125rem;
  font-weight: 600;
}

@media (max-width: 639px) {
  html[data-portal-ui="vristo"] .portal-global-header .portal-header-login {
    height: 36px;
    min-height: 36px;
    padding-inline: .75rem;
    font-size: .75rem;
  }
}

/* Vristo keeps the header utilities circular. This has to follow the generic
 * button bridge above so daisyUI's button radius cannot flatten the circles. */
html[data-portal-ui="vristo"] .portal-global-header .btn.portal-header-utility,
html[data-portal-ui="vristo"] .portal-global-header .portal-header-dropdown > summary.btn {
  border-radius: 999px;
}

html[data-portal-ui="vristo"] .portal-global-header .btn.portal-header-utility:hover,
html[data-portal-ui="vristo"] .portal-global-header .btn.portal-header-utility:focus-visible,
html[data-portal-ui="vristo"] .portal-global-header .portal-header-dropdown > summary.btn:hover,
html[data-portal-ui="vristo"] .portal-global-header .portal-header-dropdown > summary.btn:focus-visible {
  background: rgb(241 242 243 / 0.9);
}

html[data-portal-ui="vristo"] .portal-global-header .btn-ghost:hover,
html[data-portal-ui="vristo"] .portal-global-header .btn-ghost:focus-visible {
  border-color: transparent;
  background: var(--vristo-primary-soft);
  color: var(--vristo-primary);
}

html[data-portal-ui="vristo"] .portal-header-dropdown > .dropdown-content {
  border: 1px solid var(--vristo-line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 45px rgb(0 0 0 / 0.17);
}

/* Search: navbar input and quick-search modal – see the section at the end of this file. */

html[data-portal-ui="vristo"] .portal-header-user > .dropdown-content {
  position: absolute;
  top: calc(100% + 0.55rem);
  right: 0;
  z-index: 140;
  width: min(280px, calc(100vw - 1rem));
  max-width: calc(100vw - 1rem);
  height: auto;
  max-height: calc(100dvh - 5.5rem);
  margin: 0;
  overflow-y: auto;
  border: 1px solid var(--vristo-line);
  border-radius: 6px;
  padding: 0.45rem;
  box-shadow: 0 12px 28px rgb(0 0 0 / 0.16);
}

html[data-portal-ui="vristo"] .portal-vristo-profile-intro {
  position: relative;
  display: grid !important;
  min-height: 0;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 0.75rem;
  border-bottom: 1px solid var(--vristo-line);
  margin-bottom: 0.4rem;
  padding: 0.7rem 0.6rem 0.85rem;
  text-align: left;
}

html[data-portal-ui="vristo"] .portal-vristo-profile-intro::before,
html[data-portal-ui="vristo"] .portal-vristo-profile-intro::after {
  content: none;
}

html[data-portal-ui="vristo"] .portal-vristo-profile-close {
  display: none;
}

html[data-portal-ui="vristo"] .portal-vristo-profile-avatar {
  grid-column: 1;
  grid-row: 1 / 3;
  display: grid;
  width: 2.5rem;
  height: 2.5rem;
  place-items: center;
  border: 0;
  border-radius: 6px;
  background: linear-gradient(145deg, var(--vristo-primary), var(--vristo-secondary));
  color: #fff;
  font-size: 1rem;
  box-shadow: 0 5px 12px rgb(67 97 238 / 0.2);
}

html[data-portal-ui="vristo"] .portal-vristo-profile-intro strong {
  grid-column: 2;
  grid-row: 1;
  max-width: 100%;
  overflow: hidden;
  color: var(--vristo-ink);
  font-size: 0.82rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-portal-ui="vristo"] .portal-vristo-profile-intro small {
  grid-column: 2;
  grid-row: 2;
  margin-top: 0.1rem;
  color: var(--vristo-muted);
  font-size: 0.68rem;
  line-height: 1.25;
}

html[data-portal-ui="vristo"] .portal-header-user > .dropdown-content > li:not(.portal-vristo-profile-intro) > :where(a, span) {
  min-height: 38px;
  border-radius: 6px;
}

html[data-portal-ui="vristo"] .portal-header-user > summary {
  height: 2.25rem;
  min-height: 2.25rem;
  width: 2.5rem;
  min-width: 2.5rem;
  padding-inline: 0.25rem;
}

html[data-portal-ui="vristo"] .portal-header-user > summary .portal-header-user-email,
html[data-portal-ui="vristo"] .portal-header-user > summary > i,
html[data-portal-ui="vristo"] .portal-header-user > .dropdown-content > .menu-title {
  display: none !important;
}

html[data-portal-ui="vristo"] .drawer-side > .drawer-overlay {
  background: rgb(14 23 38 / 0.55);
  backdrop-filter: blur(2px);
}

html[data-portal-ui="vristo"] #portal-sidebar {
  width: var(--vristo-sidebar);
  border: 0;
  background: var(--vristo-panel);
  box-shadow: none;
}

html[data-portal-ui="vristo"] #portal-sidebar-brand {
  height: 56px;
  min-height: 56px;
  border: 0;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
}

html[data-portal-ui="vristo"] #portal-sidebar-brand > div:first-child {
  flex: 1 1 auto;
  align-items: center;
  gap: 0.5rem;
}

html[data-portal-ui="vristo"] #portal-sidebar-brand a {
  flex: 1 1 auto;
  color: var(--vristo-ink);
}

html[data-portal-ui="vristo"] #portal-sidebar-brand a > span:first-child {
  margin-right: 0.375rem;
  font-size: 1.75rem;
  color: var(--vristo-primary);
}

html[data-portal-ui="vristo"] #portal-sidebar-brand a > span:nth-child(2) {
  flex: 1 1 auto;
  overflow: visible;
}

html[data-portal-ui="vristo"] #portal-sidebar-brand a > span:nth-child(2) > span:first-child {
  overflow: visible;
  font-size: 1.25rem;
  font-weight: 600;
  text-overflow: clip;
}

html[data-portal-ui="vristo"] #portal-sidebar-brand a > span:nth-child(2) > span:last-child {
  color: var(--vristo-subtle);
}

html[data-portal-ui="vristo"] #portal-sidebar-brand .badge-primary {
  border: 0;
  background: var(--vristo-primary-soft);
  color: var(--vristo-primary);
  font-size: 0.625rem;
}

html[data-portal-ui="vristo"] #portal-sidebar-collapse {
  width: 2rem;
  min-width: 2rem;
  height: 2rem;
  min-height: 2rem;
  border-radius: 999px;
  color: var(--vristo-subtle);
}

html[data-portal-ui="vristo"] #portal-sidebar-collapse:hover,
html[data-portal-ui="vristo"] #portal-sidebar-collapse:focus-visible {
  background: rgb(107 114 128 / 0.1);
  color: var(--vristo-ink);
}

html[data-portal-ui="vristo"] #portal-primary-navigation {
  --color-primary: var(--vristo-primary);
  padding: 0 1rem;
  scrollbar-width: thin;
  scrollbar-color: #c5cad5 transparent;
}

html[data-portal-ui="vristo"] #portal-primary-navigation > .menu {
  gap: 0;
}

html[data-portal-ui="vristo"] #portal-primary-navigation > .menu > .menu-title:first-child {
  display: none;
}

html[data-portal-ui="vristo"] #portal-primary-navigation .menu-title {
  min-height: 44px;
  margin: 2px -1rem 4px;
  padding: 0.75rem 1.75rem;
  background: rgb(224 230 237 / 0.3);
  color: var(--vristo-ink);
  font-size: 0.875rem;
  font-weight: 800;
  line-height: 1.25rem;
  letter-spacing: normal;
  text-transform: uppercase;
}

html[data-portal-ui="vristo"] #portal-primary-navigation .menu-title.mt-3 {
  margin-top: 2px;
}

/* Section titles are plain labels: daisyUI's menu item :active/:focus highlight must not paint them. */
html[data-portal-ui="vristo"] #portal-primary-navigation .menu-title > *,
html[data-portal-ui="vristo"] #portal-primary-navigation .menu-title > :is(:active, :focus, :focus-visible, :hover) {
  background: transparent !important;
  color: inherit !important;
  box-shadow: none;
  outline: 0;
  cursor: default;
}

html[data-portal-ui="vristo"] #portal-primary-navigation .menu li > a,
html[data-portal-ui="vristo"] #portal-primary-navigation .menu li > button,
html[data-portal-ui="vristo"] #portal-primary-navigation .menu li > details > summary {
  min-height: 40px;
  margin-bottom: 0.25rem;
  border-radius: 6px;
  padding: 0.625rem;
  color: var(--vristo-subtle);
  font-size: 0.875rem;
  font-weight: 600;
  transition: background 150ms ease, color 150ms ease, transform 150ms ease;
}

html[data-portal-ui="vristo"] #portal-primary-navigation .menu li > a:hover,
html[data-portal-ui="vristo"] #portal-primary-navigation .menu li > button:hover,
html[data-portal-ui="vristo"] #portal-primary-navigation .menu li > details > summary:hover {
  background: rgb(0 0 0 / 0.07);
  color: var(--vristo-ink);
}

html[data-portal-ui="vristo"] #portal-primary-navigation .menu .menu-active {
  background: rgb(0 0 0 / 0.08);
  color: var(--vristo-ink);
  box-shadow: none;
}

html[data-portal-ui="vristo"] #portal-primary-navigation .menu :where(a, button, summary) > i:first-child {
  width: 1.25rem;
  color: rgb(14 23 38 / 0.5);
  transition: color 150ms ease;
}

/* Vristo's group-hover icon colour also applies to keyboard navigation. */
html[data-portal-ui="vristo"] #portal-primary-navigation .menu :where(a, button, summary):is(:hover, :focus-visible, .menu-active) > i:first-child {
  color: var(--color-primary);
}

html[data-portal-ui="vristo"] #portal-primary-navigation details > ul {
  margin: 0;
  padding: 0;
  border: 0;
}

html[data-portal-ui="vristo"] #portal-primary-navigation details > ul :where(a, button) {
  min-height: 40px;
  margin: 0;
  padding: 0.625rem 2.25rem;
  border-radius: 0;
  color: #6b7280;
  font-size: 0.875rem;
  font-weight: 600;
}

html[data-portal-ui="vristo"] #portal-primary-navigation details > ul :where(a, button)::before {
  content: "";
  width: 0.5rem;
  height: 0.125rem;
  flex: 0 0 0.5rem;
  margin-right: 0.5rem;
  border-radius: 0.25rem;
  background: #d1d5db;
}

html[data-portal-ui="vristo"] #portal-primary-navigation details > ul :where(a, button) > i:first-child {
  display: none;
}

html[data-portal-ui="vristo"] #portal-primary-navigation details > ul :where(a, button):hover,
html[data-portal-ui="vristo"] #portal-primary-navigation details > ul :where(a, button).menu-active {
  background: #f3f4f6;
  color: var(--vristo-primary);
}

html[data-portal-ui="vristo"] #portal-primary-navigation details > ul :where(a, button):hover::before,
html[data-portal-ui="vristo"] #portal-primary-navigation details > ul :where(a, button).menu-active::before {
  background: var(--vristo-primary);
}

html[data-portal-ui="vristo"] #portal-sidebar-resizer {
  height: 8px;
  border-color: #edf0f4;
  background: #f8f9fb;
}

html[data-portal-ui="vristo"] #portal-api-access {
  border-color: #edf0f4;
  border-top-width: 0; /* the resizer above already draws the line; two borders read as one thick bar */
  background: #f8f9fb;
}

html[data-portal-ui="vristo"] #portal-api-access .bg-base-100,
html[data-portal-ui="vristo"] #portal-api-access .card {
  border-color: #e8ebf1;
  border-radius: 7px;
  background: #fff;
  box-shadow: none;
}

html[data-portal-ui="vristo"] #portal-api-access-title {
  color: var(--vristo-ink);
  letter-spacing: 0.08em;
}

html[data-portal-ui="vristo"] #portal-sidebar-footer {
  border: 0;
  background: var(--vristo-panel);
  padding: 0 1rem 0.75rem;
}

html[data-portal-ui="vristo"] #portal-sidebar-footer .btn {
  min-height: 40px;
  margin: 0;
  border-radius: 0.375rem;
  padding: 0.625rem;
  color: var(--vristo-subtle);
  font-size: 0.875rem;
  font-weight: 600;
}

html[data-portal-ui="vristo"] main {
  padding: 1.5rem;
}

html[data-portal-ui="vristo"] #portal-main-container {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}

html[data-portal-ui="vristo"] #portal-main-container :where(.card, .modal-box) {
  border-color: transparent;
  border-radius: 6px;
  background: var(--vristo-panel);
  box-shadow: var(--vristo-panel-shadow);
}

html[data-portal-ui="vristo"] #portal-main-container .card.card-border {
  border: 0;
}

html[data-portal-ui="vristo"] #portal-main-container :where(h1, h2, h3, .card-title, .stat-value) {
  color: var(--vristo-ink);
}

html[data-portal-ui="vristo"] #portal-main-container h1 {
  font-size: clamp(1.65rem, 2.1vw, 2.25rem);
  font-weight: 700;
  letter-spacing: -0.025em;
}

html[data-portal-ui="vristo"] #portal-main-container .card-title {
  font-weight: 700;
}

html[data-portal-ui="vristo"] #portal-main-container :where(.btn-primary, .tab-active) {
  border-color: var(--vristo-primary);
  background: var(--vristo-primary);
  color: #fff;
}

html[data-portal-ui="vristo"] #portal-main-container .btn-primary:hover {
  border-color: var(--vristo-primary-strong);
  background: var(--vristo-primary-strong);
}

html[data-portal-ui="vristo"] #portal-main-container :where(.btn, .input, .select, .textarea) {
  border-radius: 6px;
}

html[data-portal-ui="vristo"] #portal-main-container :where(.input, .select, .textarea) {
  border-color: #d9dee8;
  background: #fff;
}

html[data-portal-ui="vristo"] #portal-main-container :where(.input, .select, .textarea):focus,
html[data-portal-ui="vristo"] #portal-main-container :where(.input, .select, .textarea):focus-within {
  border-color: var(--vristo-primary);
  outline: 0;
  box-shadow: 0 0 0 3px rgb(67 97 238 / 0.12);
}

html[data-portal-ui="vristo"] #portal-main-container .tabs-box {
  border-radius: 6px;
  background: #f3f5f8;
  padding: 0.25rem;
}

html[data-portal-ui="vristo"] #portal-main-container .tab {
  border-radius: 5px;
  color: var(--vristo-muted);
}

html[data-portal-ui="vristo"] #portal-main-container .tab-active {
  box-shadow: 0 2px 8px rgb(67 97 238 / 0.2);
}

html[data-portal-ui="vristo"] #portal-main-container .badge {
  border-radius: 5px;
  font-weight: 600;
}

html[data-portal-ui="vristo"] #portal-main-container .badge-primary,
html[data-portal-ui="vristo"] #portal-main-container .badge-soft.badge-primary {
  border-color: transparent;
  background: var(--vristo-primary-soft);
  color: var(--vristo-primary);
}

html[data-portal-ui="vristo"] #portal-main-container .badge-success,
html[data-portal-ui="vristo"] #portal-main-container .badge-soft.badge-success {
  border-color: transparent;
  background: rgb(0 171 85 / 0.1);
  color: #078847;
}

html[data-portal-ui="vristo"] #portal-main-container .badge-error,
html[data-portal-ui="vristo"] #portal-main-container .badge-soft.badge-error {
  border-color: transparent;
  background: rgb(231 81 90 / 0.1);
  color: var(--vristo-danger);
}

html[data-portal-ui="vristo"] #portal-main-container .badge-info,
html[data-portal-ui="vristo"] #portal-main-container .badge-soft.badge-info {
  border-color: transparent;
  background: rgb(33 150 243 / 0.1);
  color: var(--vristo-info);
}

html[data-portal-ui="vristo"] #portal-main-container .stat {
  padding: 1.25rem;
}

html[data-portal-ui="vristo"] #portal-main-container .stat-title,
html[data-portal-ui="vristo"] #portal-main-container .stat-desc,
html[data-portal-ui="vristo"] #portal-main-container .text-base-content\/60,
html[data-portal-ui="vristo"] #portal-main-container .text-base-content\/55 {
  color: var(--vristo-muted);
}

html[data-portal-ui="vristo"] #portal-main-container .stat-value {
  font-size: clamp(1.7rem, 2vw, 2.25rem);
  font-weight: 800;
  letter-spacing: -0.035em;
}

html[data-portal-ui="vristo"] #portal-main-container .table :where(th) {
  border-color: #e8ebf1;
  background: #f7f8fa;
  color: #506690;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

html[data-portal-ui="vristo"] #portal-main-container .table :where(td) {
  border-color: #edf0f4;
}

html[data-portal-ui="vristo"] #portal-main-container .table tbody tr:hover > * {
  background: #f5f7ff;
}

html[data-portal-ui="vristo"][data-theme="graphite"] #portal-main-container .table tbody tr:hover > * {
  background: rgba(67, 97, 238, 0.08);
}

html[data-portal-ui="vristo"] .portal-demo-alert-band {
  border: 0;
  border-radius: 0;
  background: linear-gradient(90deg, #eef1ff, #f6f7ff);
  color: #506690;
  box-shadow: inset 3px 0 0 var(--vristo-primary);
}

html[data-portal-ui="vristo"] .portal-demo-alert-icon {
  background: rgb(67 97 238 / 0.12);
  color: var(--vristo-primary);
}

/* Footer: one quiet, centred line under the content. */
html[data-portal-ui="vristo"] footer.portal-global-footer {
  display: block;
  color: var(--vristo-muted);
  background: transparent;
  padding: 0.5rem 1.5rem 1.25rem;
  font-size: 0.75rem;
  line-height: 1.25rem;
  text-align: center;
  opacity: 0.85;
  box-shadow: none;
}

html[data-portal-ui="vristo"] ::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}

html[data-portal-ui="vristo"] ::-webkit-scrollbar-track {
  background: transparent;
}

html[data-portal-ui="vristo"] ::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #b7bdca;
}

html[data-portal-ui="vristo"] ::-webkit-scrollbar-thumb:hover {
  background: #8790a5;
}

html[data-portal-ui="vristo"][data-theme="graphite"] {
  --color-base-100: #0e1726;
  --color-base-200: #111c32;
  --color-base-300: #263047;
  --color-base-content: #e0e6ed;
  --color-neutral: #e0e6ed;
  --color-neutral-content: #0e1726;
  --vristo-ink: #e0e6ed;
  --vristo-muted: #a6adbb;
  --vristo-line: #263047;
  --vristo-canvas: #060818;
  --vristo-panel: #0e1726;
  --vristo-header-scrim: rgb(6 8 24 / 0.9);
  --vristo-primary-soft: rgb(67 97 238 / 0.16);
  color-scheme: dark;
}

html[data-portal-ui="vristo"][data-theme="graphite"] #portal-sidebar,
html[data-portal-ui="vristo"][data-theme="graphite"] #portal-sidebar-footer {
  background: #0e1726;
}

html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header {
  background: rgb(6 8 24 / 0.9);
}

html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header-surface {
  background: #0e1726;
}

html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header .portal-header-utility,
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header .portal-header-dropdown > summary {
  background: rgb(59 63 92 / 0.4);
  color: #d0d2d6;
}

html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header .portal-header-utility:hover,
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header .portal-header-utility:focus-visible,
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header .portal-header-dropdown > summary:hover,
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header .portal-header-dropdown > summary:focus-visible {
  background: rgb(59 63 92 / 0.6);
  color: var(--vristo-primary);
}

html[data-portal-ui="vristo"][data-theme="graphite"] #portal-api-access,
html[data-portal-ui="vristo"][data-theme="graphite"] #portal-sidebar-resizer {
  border-color: var(--vristo-line);
  background: #111c32;
}

html[data-portal-ui="vristo"][data-theme="graphite"] .portal-header-dropdown > .dropdown-content,
html[data-portal-ui="vristo"][data-theme="graphite"] #portal-api-access .bg-base-100,
html[data-portal-ui="vristo"][data-theme="graphite"] #portal-api-access .card,
html[data-portal-ui="vristo"][data-theme="graphite"] #portal-main-container :where(.input, .select, .textarea) {
  background: #0e1726;
  color: var(--vristo-ink);
}

html[data-portal-ui="vristo"][data-theme="graphite"] #portal-main-container .table :where(th),
html[data-portal-ui="vristo"][data-theme="graphite"] #portal-main-container .tabs-box {
  background: #111c32;
}

html[data-portal-ui="vristo"][data-theme="graphite"] #portal-primary-navigation .menu-title {
  background: rgb(59 63 92 / 0.08);
  color: var(--vristo-ink);
}

html[data-portal-ui="vristo"][data-theme="graphite"] #portal-primary-navigation .menu li > a:hover,
html[data-portal-ui="vristo"][data-theme="graphite"] #portal-primary-navigation .menu li > button:hover,
html[data-portal-ui="vristo"][data-theme="graphite"] #portal-primary-navigation .menu li > details > summary:hover,
html[data-portal-ui="vristo"][data-theme="graphite"] #portal-primary-navigation .menu .menu-active {
  background: #181f32;
  color: #888ea8;
}

html[data-portal-ui="vristo"][data-theme="graphite"] #portal-primary-navigation .menu :where(a, button, summary) > i:first-child {
  color: rgb(255 255 255 / 0.5);
}

html[data-portal-ui="vristo"][data-theme="graphite"] #portal-primary-navigation .menu :where(a, button, summary):is(:hover, :focus-visible, .menu-active) > i:first-child {
  color: var(--color-primary);
}

html[data-portal-ui="vristo"][data-theme="graphite"] #portal-primary-navigation details > ul :where(a, button) {
  color: #6b7280;
}

html[data-portal-ui="vristo"][data-theme="graphite"] #portal-primary-navigation details > ul :where(a, button)::before {
  background: #6b7280;
}

html[data-portal-ui="vristo"][data-theme="graphite"] #portal-primary-navigation details > ul :where(a, button):hover,
html[data-portal-ui="vristo"][data-theme="graphite"] #portal-primary-navigation details > ul :where(a, button).menu-active {
  background: #111827;
  color: var(--vristo-primary);
}

html[data-portal-ui="vristo"][data-theme="graphite"] footer.portal-global-footer {
  color: #888ea8;
  background: transparent;
  opacity: 0.75;
}

@media (min-width: 1024px) {
  /* Explicit tracks interpolate; daisyUI's auto track jumps directly to zero. */
  html[data-portal-ui="vristo"] #portal-app-shell {
    grid-template-columns: var(--vristo-sidebar) minmax(0, 1fr);
    transition: grid-template-columns 300ms ease-in-out;
  }

  html[data-portal-ui="vristo"] .drawer-side {
    transition: width 300ms ease-in-out;
  }

  html[data-portal-ui="vristo"] #portal-sidebar {
    transform: translateX(0);
    transition: transform 300ms ease-in-out;
  }

  html[data-portal-ui="vristo"][data-portal-sidebar="collapsed"] #portal-app-shell {
    grid-template-columns: 0px minmax(0, 1fr);
  }

  html[data-portal-ui="vristo"][data-portal-sidebar="collapsed"] .drawer-side {
    width: 0;
    overflow: hidden;
    pointer-events: none;
  }

  html[data-portal-ui="vristo"][data-portal-sidebar="collapsed"] #portal-sidebar {
    transform: translateX(-100%);
  }

  html[data-portal-ui="vristo"][data-portal-sidebar="collapsed"] .portal-sidebar-expand {
    display: inline-flex;
  }

  html[data-portal-ui="vristo"][data-portal-width="contained"] #portal-app-shell {
    max-width: var(--vristo-shell-max);
    margin-inline: auto;
    box-shadow: none;
  }

  html[data-portal-ui="vristo"][data-portal-width="full"] #portal-app-shell {
    max-width: none;
    margin-inline: 0;
    box-shadow: none;
  }

  html[data-portal-ui="vristo"] .drawer-content {
    min-width: 0;
  }

  html[data-portal-ui="vristo"] .drawer-side {
    width: var(--vristo-sidebar);
    overflow: visible;
    box-shadow: 5px 0 25px rgb(94 92 154 / 0.1);
  }

  html[data-portal-ui="vristo"] .portal-demo-alert-band {
    --portal-demo-pane-width: calc(var(--portal-viewport-width, 100vw) - var(--vristo-sidebar));
    --portal-demo-pane-offset: calc(50% - var(--portal-viewport-half, 50vw) + (var(--vristo-sidebar) / 2));
  }
}

@media (max-width: 639px) {
  html[data-portal-ui="vristo"] #portal-main-container :where(.card, .modal-box) {
    border-radius: 5px;
  }

}

@media (prefers-reduced-motion: reduce) {
  html[data-portal-ui="vristo"] *,
  html[data-portal-ui="vristo"] *::before,
  html[data-portal-ui="vristo"] *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Requested sidebar interaction stays brief in reduced-motion mode; page and chart
 * entrance animations still respect the existing reduced-motion rules. */
@media (min-width: 1024px) and (prefers-reduced-motion: reduce) {
  html[data-portal-ui="vristo"] #portal-app-shell,
  html[data-portal-ui="vristo"] .drawer-side,
  html[data-portal-ui="vristo"] #portal-sidebar {
    transition-duration: 180ms !important;
  }
}

/* ── Header dropdowns: notifications and user menu (25. 9. 2026) ──
   Like the search mega menu, both panels hang from the bottom edge of the navbar
   box (not from the icon), so only their lower part is seen sliding out from under
   it; each stays right-aligned with its own icon. Panel look: Vristo index.html
   notification and profile dropdowns. */
html[data-portal-ui="vristo"] .portal-global-header .portal-header-dropdown { position: static; }
html[data-portal-ui="vristo"] .portal-global-header .portal-header-dropdown > .dropdown-content,
html[data-portal-ui="vristo"] .portal-global-header .portal-header-user > .dropdown-content {
  position: absolute;
  top: 100%;
  right: 1.25rem;
  z-index: 140;
  margin: 0;
  max-height: calc(100dvh - 6rem);
  overflow-y: auto;
  border: 0;
  border-top: 1px solid var(--vristo-line);
  border-radius: 0 0 6px 6px;
  background: var(--vristo-panel);
  color: var(--vristo-ink);
  box-shadow: 0 14px 30px -12px rgb(14 23 38 / 0.28);
  backdrop-filter: none;
}
/* The bell sits one 36 px button and the 4 px gap left of the avatar. */
html[data-portal-ui="vristo"] .portal-global-header .portal-header-notifications > .dropdown-content { right: calc(1.25rem + 2.25rem + 0.25rem); }
html[data-portal-ui="vristo"] .portal-global-header .portal-header-dropdown[open] > .dropdown-content { animation: portal-vristo-mega-in 260ms cubic-bezier(0.4, 0, 0.2, 1); }
html[data-portal-ui="vristo"] .portal-global-header .portal-header-dropdown[open] > summary { background: rgb(241 242 243 / 0.9); color: var(--vristo-primary); }

/* Triggers: the bell and the avatar share the 36 px circle of the other header buttons. */
html[data-portal-ui="vristo"] .portal-global-header .portal-header-notifications > summary,
html[data-portal-ui="vristo"] .portal-global-header .portal-header-user > summary {
  width: 2.25rem;
  min-width: 2.25rem;
  height: 2.25rem;
  min-height: 2.25rem;
  padding: 0;
  justify-content: center;
}
html[data-portal-ui="vristo"] .portal-global-header .portal-header-user > summary .avatar > div {
  width: 2.25rem;
  height: 2.25rem;
  background: linear-gradient(145deg, var(--vristo-primary), var(--vristo-secondary));
  color: #fff;
}
html[data-portal-ui="vristo"] .portal-global-header .portal-header-notifications > summary { position: relative; overflow: visible; }
html[data-portal-ui="vristo"] .portal-global-header .portal-header-notifications .indicator { position: static; }
html[data-portal-ui="vristo"] .portal-global-header .portal-header-notifications .indicator-item {
  position: absolute;
  inset: -3px -4px auto auto;
  min-width: 1.05rem;
  height: 1.05rem;
  padding: 0 4px;
  border: 2px solid var(--vristo-panel);
  border-radius: 999px;
  background: var(--vristo-danger);
  color: #fff;
  font-size: 9px;
  line-height: 1;
  translate: none;
  transform: none;
}

/* Notifications panel */
html[data-portal-ui="vristo"] .portal-vristo-notifications { width: min(350px, calc(100vw - 1rem)); padding: 0; }
html[data-portal-ui="vristo"] .portal-vristo-dropdown-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--vristo-line); }
html[data-portal-ui="vristo"] .portal-vristo-dropdown-head h2 { margin: 0; color: var(--vristo-ink); font-size: 1.125rem; font-weight: 600; line-height: 1.5; }
html[data-portal-ui="vristo"] .portal-vristo-dropdown-badge { padding: 2px 8px; border-radius: 4px; background: rgb(67 97 238 / 0.8); color: #fff; font-size: 12px; font-weight: 600; white-space: nowrap; }
html[data-portal-ui="vristo"] .portal-vristo-notification-list { max-height: 21rem; margin: 0; padding: 4px 0; overflow-y: auto; list-style: none; }
html[data-portal-ui="vristo"] .portal-vristo-notification-list > li + li { border-top: 1px solid var(--vristo-line); }
html[data-portal-ui="vristo"] .portal-vristo-notification-list a { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px 16px; color: inherit; text-decoration: none; }
html[data-portal-ui="vristo"] .portal-vristo-notification-list a:hover,
html[data-portal-ui="vristo"] .portal-vristo-notification-list a:focus-visible { background: rgb(67 97 238 / 0.06); outline: 0; }
html[data-portal-ui="vristo"] .portal-vristo-notification-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--vristo-canvas); color: var(--vristo-muted); font-size: 15px; }
html[data-portal-ui="vristo"] .portal-vristo-notification-list .is-unread .portal-vristo-notification-icon { background: rgb(67 97 238 / 0.12); color: var(--vristo-primary); }
html[data-portal-ui="vristo"] .portal-vristo-notification-text { display: grid; min-width: 0; }
html[data-portal-ui="vristo"] .portal-vristo-notification-text strong { overflow: hidden; color: var(--vristo-ink); font-size: 14px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
html[data-portal-ui="vristo"] .portal-vristo-notification-list li:not(.is-unread) .portal-vristo-notification-text strong { font-weight: 500; }
html[data-portal-ui="vristo"] .portal-vristo-notification-text > span { overflow: hidden; color: var(--vristo-muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
html[data-portal-ui="vristo"] .portal-vristo-notification-list time { align-self: start; margin-top: 2px; padding: 1px 6px; border-radius: 4px; background: var(--vristo-canvas); color: var(--vristo-muted); font-size: 11px; font-weight: 600; white-space: nowrap; }
html[data-portal-ui="vristo"] .portal-vristo-notification-dot { position: absolute; top: 12px; left: 46px; width: 9px; height: 9px; border: 2px solid #fff; border-radius: 50%; background: var(--vristo-success); }
html[data-portal-ui="vristo"] .portal-vristo-dropdown-empty { display: grid; justify-items: center; gap: 4px; padding: 32px 16px 28px; text-align: center; }
html[data-portal-ui="vristo"] .portal-vristo-dropdown-empty > span { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 10px; border-radius: 50%; background: rgb(67 97 238 / 0.1); color: var(--vristo-primary); font-size: 18px; box-shadow: 0 0 0 4px rgb(67 97 238 / 0.18); }
html[data-portal-ui="vristo"] .portal-vristo-dropdown-empty strong { color: var(--vristo-ink); font-size: 14px; font-weight: 600; }
html[data-portal-ui="vristo"] .portal-vristo-dropdown-empty small { color: var(--vristo-muted); font-size: 12px; }
html[data-portal-ui="vristo"] .portal-vristo-dropdown-foot { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--vristo-line); }
html[data-portal-ui="vristo"] .portal-vristo-dropdown-foot a { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 8px; color: var(--vristo-primary); font-size: 13px; font-weight: 600; text-decoration: none; }
html[data-portal-ui="vristo"] .portal-vristo-dropdown-foot a + a { border-left: 1px solid var(--vristo-line); }
html[data-portal-ui="vristo"] .portal-vristo-dropdown-foot a:hover,
html[data-portal-ui="vristo"] .portal-vristo-dropdown-foot a:focus-visible { background: rgb(67 97 238 / 0.06); outline: 0; }
html[data-portal-ui="vristo"] .portal-vristo-dropdown-foot i { font-size: 11px; }

/* User menu: Vristo profile dropdown (avatar with account, bold muted items, red sign-out). */
html[data-portal-ui="vristo"] .portal-global-header .portal-header-user > .dropdown-content { width: min(260px, calc(100vw - 1rem)); padding: 0 0 6px; }
html[data-portal-ui="vristo"] .portal-header-user .portal-vristo-profile-intro { margin: 0 0 6px; padding: 16px; border-bottom: 1px solid var(--vristo-line); }
html[data-portal-ui="vristo"] .portal-header-user .portal-vristo-profile-avatar { width: 40px; height: 40px; border-radius: 6px; box-shadow: none; font-size: 16px; font-weight: 700; }
html[data-portal-ui="vristo"] .portal-header-user .portal-vristo-profile-intro strong { font-size: 14px; line-height: 1.35; }
html[data-portal-ui="vristo"] .portal-header-user .portal-vristo-profile-intro small { font-size: 12px; }
html[data-portal-ui="vristo"] .portal-header-user > .dropdown-content > li:not(.portal-vristo-profile-intro) > a {
  gap: 10px;
  min-height: 0;
  margin: 0;
  padding: 8px 16px;
  border-radius: 0;
  color: rgb(14 23 38 / 0.6);
  font-size: 14px;
  font-weight: 600;
}
html[data-portal-ui="vristo"] .portal-header-user > .dropdown-content > li:not(.portal-vristo-profile-intro) > a > i { width: 18px; font-size: 15px; }
html[data-portal-ui="vristo"] .portal-header-user > .dropdown-content > li:not(.portal-vristo-profile-intro) > a:hover,
html[data-portal-ui="vristo"] .portal-header-user > .dropdown-content > li:not(.portal-vristo-profile-intro) > a:focus-visible { background: transparent; color: var(--vristo-primary); outline: 0; }
/* Sign-out (scrollbar rails are appended to the list, so :last-child cannot be used). */
html[data-portal-ui="vristo"] .portal-header-user > .dropdown-content > li:has(> a[href$="/logout"]) { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--vristo-line); }
html[data-portal-ui="vristo"] .portal-header-user > .dropdown-content > li:not(.portal-vristo-profile-intro) > a[href$="/logout"],
html[data-portal-ui="vristo"] .portal-header-user > .dropdown-content > li:not(.portal-vristo-profile-intro) > a[href$="/logout"]:hover,
html[data-portal-ui="vristo"] .portal-header-user > .dropdown-content > li:not(.portal-vristo-profile-intro) > a[href$="/logout"]:focus-visible { color: var(--vristo-danger); }

/* Dark theme */
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header .portal-header-dropdown > .dropdown-content { border-top-color: #1b2e4b; background: #0e1726; color: #e0e6ed; box-shadow: 0 14px 30px -10px rgb(0 0 0 / 0.6); }
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-vristo-dropdown-head,
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-vristo-dropdown-foot,
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-vristo-dropdown-foot a + a,
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-vristo-notification-list > li + li,
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-header-user .portal-vristo-profile-intro,
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-header-user > .dropdown-content > li:has(> a[href$="/logout"]) { border-color: rgb(255 255 255 / 0.1); }
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-vristo-notification-icon,
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-vristo-notification-list time { background: rgb(255 255 255 / 0.06); color: #888ea8; }
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-vristo-notification-dot { border-color: #0e1726; }
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-header-user > .dropdown-content > li:not(.portal-vristo-profile-intro) > a { color: rgb(224 230 237 / 0.75); }
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header .portal-header-notifications .indicator-item { border-color: #0e1726; }

/* Phones: the panel spans the width under the header instead of hanging off the icon. */
@media (max-width: 639px) {
  html[data-portal-ui="vristo"] .portal-global-header .portal-header-dropdown > .dropdown-content,
  html[data-portal-ui="vristo"] .portal-global-header .portal-header-user > .dropdown-content,
  html[data-portal-ui="vristo"] .portal-global-header .portal-header-notifications > .dropdown-content { right: 0; left: 0; width: auto; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-portal-ui="vristo"] .portal-global-header .portal-header-dropdown[open] > .dropdown-content { animation: none; }
}
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-header-user > .dropdown-content > li:not(.portal-vristo-profile-intro) > a[href$="/logout"] { color: #e7515a; }
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-header-user > .dropdown-content > li:not(.portal-vristo-profile-intro) > a:hover { color: var(--vristo-primary); }

/* Checkboxes (25. 9. 2026): Vristo form-checkbox – light border, primary fill with a white check.
   Colored variants (checkbox-error and others) keep their own color. */
html[data-portal-ui="vristo"] #portal-main-container .checkbox { border-radius: 4px; }
html[data-portal-ui="vristo"] #portal-main-container .checkbox:not(:checked, :indeterminate) { border-color: color-mix(in srgb, var(--vristo-muted) 55%, transparent); }
html[data-portal-ui="vristo"] #portal-main-container .checkbox:is(:checked, :indeterminate):not(.checkbox-error, .checkbox-success, .checkbox-warning, .checkbox-info, .checkbox-secondary, .checkbox-accent, .checkbox-neutral) { --input-color: var(--color-primary); border-color: var(--color-primary); color: #fff; }
html[data-portal-ui="vristo"] #portal-main-container .checkbox-error:is(:checked, :indeterminate) { color: #fff; }

/* ── Search (24. 9. 2026, mega menu 25. 9. 2026) ───────────────────────────────
 * Navbar: vristo-html-main index.html header search (.form-input 38 px, 16 px
 * magnifier on the left that turns primary on focus, transparent on desktop).
 * Results: no modal. Typing (3+ characters) slides a mega menu out from under the
 * navbar box, full navbar width: a bar with the query and filter chips (Všetko,
 * Firmy, Osoby, one per country), then one column per country of companies and a
 * column of persons, then keyboard hints. Built by portal-company-search.js when the
 * form has data-search-layout="mega"; the classic UI keeps its small result list.
 * The field, the submit button and the list share one grid cell / the navbar box as
 * containing block, so the list can span the navbar without extra script. */

/* Navbar field */
html[data-portal-ui="vristo"] .portal-company-search-slot,
html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-search {position:static;}
html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-search-control {position:static;display:grid;min-height:0;border:0;background:transparent;box-shadow:none;}
html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-search-control > :is(.portal-global-company-search-input,.portal-global-company-search-submit) {grid-area:1 / 1;}
html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-search-input {display:flex;align-items:center;gap:8px;width:100%;height:38px;min-height:38px;padding:0 6px 0 36px;border:1px solid #e0e6ed;border-radius:6px;background:transparent;box-shadow:none;font-size:14px;transition:border-color 160ms ease;}
html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-search-input:focus-within {border-color:var(--vristo-primary);outline:0;}
html[data-portal-ui="vristo"] .portal-company-search-slot #portal-global-company-query {order:1;flex:1 1 auto;min-width:0;height:36px;min-height:36px;padding:0;border:0;background:transparent;color:var(--vristo-ink);font-size:14px;font-weight:600;outline:0;}
html[data-portal-ui="vristo"] .portal-company-search-slot #portal-global-company-query::placeholder {color:#888ea8;font-weight:600;letter-spacing:.06em;opacity:1;}
html[data-portal-ui="vristo"] .portal-vristo-search-kbd {order:3;flex:none;padding:2px 6px;border:1px solid #e0e6ed;border-radius:4px;color:#888ea8;font-family:inherit;font-size:10px;font-weight:700;line-height:1.4;white-space:nowrap;}
html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-search-submit {position:relative;z-index:2;justify-self:start;width:36px;min-width:36px;height:38px;min-height:38px;padding:0;border:0;border-radius:6px 0 0 6px;background:transparent;box-shadow:none;color:rgb(136 142 168 / .8);font-size:14px;}
html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-search-control:focus-within .portal-global-company-search-submit,
html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-search-submit:hover {background:transparent;color:var(--vristo-primary);}

/* Mobile trigger (index.html .search_btn) */
html[data-portal-ui="vristo"] .portal-global-header .btn.portal-vristo-search-trigger {display:none;width:36px;height:36px;min-height:36px;border:0;border-radius:999px;background:rgb(224 230 237 / .4);color:var(--vristo-ink);}
html[data-portal-ui="vristo"] .portal-global-header .btn.portal-vristo-search-trigger:hover,
html[data-portal-ui="vristo"] .portal-global-header .btn.portal-vristo-search-trigger:focus-visible {background:rgb(224 230 237 / .9);color:var(--vristo-primary);}

/* Mega menu: attached to the bottom edge of the navbar box, slides out from under it */
html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-results {position:absolute;top:100%;right:0;left:0;z-index:130;display:block;width:auto;max-width:none;max-height:min(70vh,560px);margin:0;padding:0;overflow-y:auto;border:0;border-top:1px solid var(--vristo-line);border-radius:0 0 6px 6px;background:var(--vristo-panel);color:var(--vristo-ink);box-shadow:0 14px 30px -12px rgb(14 23 38 / .28);animation:portal-vristo-mega-in 260ms cubic-bezier(.4,0,.2,1);}
html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-results.hidden {display:none;}
html[data-portal-ui="vristo"] .portal-global-header-surface:has(.portal-global-company-results:not(.hidden)) {border-bottom-right-radius:0;border-bottom-left-radius:0;}
html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-results :is(.ps__rail-x,.ps__rail-y) {display:none;}
html[data-portal-ui="vristo"] .portal-global-company-results > li {display:block;width:100%;padding:0;}
html[data-portal-ui="vristo"] .portal-global-company-results > li::before,
html[data-portal-ui="vristo"] .portal-global-company-results .portal-global-company-result-group-list::before {display:none;}
html[data-portal-ui="vristo"] .portal-global-company-result-bar {display:flex !important;flex-direction:row !important;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:12px 20px !important;border-bottom:1px solid var(--vristo-line);}
html[data-portal-ui="vristo"] :is(.portal-global-company-result-bar,.portal-global-company-result-foot) > span {width:auto !important;min-height:0 !important;padding:0 !important;border-radius:0 !important;background:none !important;cursor:default;}
html[data-portal-ui="vristo"] .portal-global-company-result-summary {display:block !important;flex:1 1 180px;min-width:0;overflow:hidden;color:var(--vristo-muted);font-size:13px;font-weight:600;text-overflow:ellipsis;white-space:nowrap;}
html[data-portal-ui="vristo"] .portal-global-company-result-filters {display:flex;flex-wrap:wrap;gap:6px;}
html[data-portal-ui="vristo"] .portal-global-company-result-filters > button {display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:1px solid var(--vristo-line);border-radius:999px;background:transparent;color:var(--vristo-ink);font-size:12px;font-weight:600;cursor:pointer;}
html[data-portal-ui="vristo"] .portal-global-company-result-filters > button > b {min-width:18px;padding:0 5px;border-radius:999px;background:var(--vristo-canvas);color:var(--vristo-muted);font-size:11px;text-align:center;}
html[data-portal-ui="vristo"] .portal-global-company-result-filters > button:hover:not(:disabled) {border-color:var(--vristo-primary);color:var(--vristo-primary);}
html[data-portal-ui="vristo"] .portal-global-company-result-filters > button[aria-pressed="true"] {border-color:var(--vristo-primary);background:var(--vristo-primary);color:#fff;}
html[data-portal-ui="vristo"] .portal-global-company-result-filters > button[aria-pressed="true"] > b {background:rgb(255 255 255 / .2);color:#fff;}
html[data-portal-ui="vristo"] .portal-global-company-result-filters > button:disabled {opacity:.45;cursor:default;}
html[data-portal-ui="vristo"] .portal-global-company-result-filters > button:focus-visible {outline:2px solid var(--vristo-primary);outline-offset:2px;}
html[data-portal-ui="vristo"] .portal-global-company-result-filters .portal-global-company-result-flag {margin:0;}
html[data-portal-ui="vristo"] .portal-global-company-result-columns > ul {display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:0;padding:0;list-style:none;}
html[data-portal-ui="vristo"] .portal-global-company-result-columns .portal-global-company-result-group {display:block;min-width:0;padding:14px 12px 16px;border:0;}
html[data-portal-ui="vristo"] .portal-global-company-result-columns .portal-global-company-result-group + .portal-global-company-result-group {border-left:1px solid var(--vristo-line);}
html[data-portal-ui="vristo"] .portal-global-company-result-group > .menu-title {display:flex;align-items:center;gap:8px;padding:0 8px 8px;color:var(--vristo-muted);font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;}
html[data-portal-ui="vristo"] .portal-global-company-result-group > .menu-title .portal-global-company-result-flag {margin:0;}
html[data-portal-ui="vristo"] .portal-global-company-result-group > .menu-title > b {margin-left:auto;padding:0 6px;border-radius:999px;background:var(--vristo-canvas);font-size:11px;letter-spacing:0;}
html[data-portal-ui="vristo"] .portal-global-company-result-group-list {display:flex;flex-direction:column;gap:2px;width:100%;margin:0;padding:0;white-space:normal;}
html[data-portal-ui="vristo"] .portal-global-company-result-group-list > li {display:block;width:100%;padding:0;}
html[data-portal-ui="vristo"] .portal-global-company-result-group-list > li > button {display:flex;align-items:center;gap:10px;width:100%;padding:8px;border:0;border-radius:6px;background:transparent;color:var(--vristo-ink);text-align:left;}
html[data-portal-ui="vristo"] .portal-global-company-result-group-list > li > button:hover,
html[data-portal-ui="vristo"] .portal-global-company-results li.is-active > button {background:rgb(67 97 238 / .08);color:var(--vristo-primary);}
html[data-portal-ui="vristo"] .portal-global-company-result-group-list > li > button:focus-visible {outline:2px solid var(--vristo-primary);outline-offset:-2px;}
html[data-portal-ui="vristo"] .portal-global-company-result-group-list > li > button > i {display:grid;flex:0 0 32px;place-items:center;width:32px;height:32px;border-radius:6px;background:var(--vristo-primary-soft);color:var(--vristo-primary);font-size:13px;}
html[data-portal-ui="vristo"] .portal-global-company-result-group[data-kind="person"] .portal-global-company-result-group-list > li > button > i {background:rgb(128 93 202 / .12);color:var(--vristo-secondary);}
html[data-portal-ui="vristo"] .portal-global-company-result-copy {display:grid;flex:1 1 auto;min-width:0;}
html[data-portal-ui="vristo"] .portal-global-company-result-copy > strong {overflow:hidden;color:inherit;font-size:14px;font-weight:600;text-overflow:ellipsis;white-space:nowrap;}
html[data-portal-ui="vristo"] .portal-global-company-result-copy > small {overflow:hidden;color:var(--vristo-muted);font-size:12px;font-weight:600;text-overflow:ellipsis;white-space:nowrap;}
html[data-portal-ui="vristo"] .portal-global-company-result-status {display:inline-flex;flex:none;align-items:center;gap:5px;min-width:0;max-width:9.5rem;margin-left:auto;padding:2px 8px 2px 7px;border-radius:999px;background:color-mix(in srgb, var(--status-tone) 12%, transparent);color:var(--status-tone);font-size:11px;font-weight:700;line-height:16px;--status-tone:var(--vristo-muted);}
html[data-portal-ui="vristo"] .portal-global-company-result-status[hidden] {display:none;}
html[data-portal-ui="vristo"] .portal-global-company-result-status > i {flex:none;width:6px;height:6px;border-radius:50%;background:currentColor;}
html[data-portal-ui="vristo"] .portal-global-company-result-status > span {min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
html[data-portal-ui="vristo"] .portal-global-company-result-status[data-tone="success"] {--status-tone:var(--vristo-success);}
html[data-portal-ui="vristo"] .portal-global-company-result-status[data-tone="warning"] {--status-tone:var(--vristo-warning);}
html[data-portal-ui="vristo"] .portal-global-company-result-status[data-tone="error"] {--status-tone:var(--vristo-danger);}
html[data-portal-ui="vristo"] .portal-global-company-result-none {padding:8px;color:var(--vristo-muted);font-size:12px;}
html[data-portal-ui="vristo"] .portal-global-company-result-flag {display:inline-block;width:18px;height:12px;margin:0 7px 0 0;border-radius:2px;object-fit:cover;vertical-align:-1px;box-shadow:0 0 0 1px rgb(14 23 38 / .1);}
html[data-portal-ui="vristo"] .portal-global-company-result-foot {display:flex !important;flex-direction:row !important;flex-wrap:wrap;gap:16px;padding:10px 20px !important;border-top:1px solid var(--vristo-line);color:var(--vristo-muted);font-size:12px;}
html[data-portal-ui="vristo"] .portal-global-company-result-foot span {display:inline-flex;align-items:center;gap:4px;}
html[data-portal-ui="vristo"] .portal-global-company-result-foot kbd {min-width:22px;padding:1px 5px;border:1px solid #e0e6ed;border-bottom-width:2px;border-radius:4px;background:#fff;color:#506690;font-family:inherit;font-size:11px;font-weight:700;text-align:center;}
html[data-portal-ui="vristo"] .portal-global-company-results > .portal-global-company-result-message > span {display:flex;align-items:center;gap:8px;padding:16px 20px;color:var(--vristo-muted);font-size:13px;}
@keyframes portal-vristo-mega-in {from {clip-path:inset(0 0 100% 0);transform:translateY(-6px);} to {clip-path:inset(0 0 0 0);transform:none;}}

/* Keep the search chrome visible; only result lists own vertical scrolling. */
html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-results {display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;align-items:stretch;max-height:min(70dvh,calc(100dvh - 9rem),640px);overflow:hidden;}
html[data-portal-ui="vristo"] .portal-global-company-result-columns {min-height:0;overflow:hidden;}
html[data-portal-ui="vristo"] .portal-global-company-result-columns > ul {height:100%;min-height:0;grid-template-columns:repeat(auto-fit,minmax(0,1fr));}
/* daisyUI .menu li wraps flex items: a column that is shorter than its list would put the list beside the title. */
html[data-portal-ui="vristo"] .portal-global-company-result-columns .portal-global-company-result-group {display:flex;flex-direction:column;flex-wrap:nowrap;min-height:0;overflow:hidden;}
html[data-portal-ui="vristo"] .portal-global-company-result-group > .menu-title {flex:none;}
html[data-portal-ui="vristo"] .portal-global-company-result-group-list {min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;}
html[data-portal-ui="vristo"] .portal-global-company-result-group-list > li {flex:none;}
html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-result-group-list > .ps__rail-y {display:block;}

/* Dark (graphite) */
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-company-search-slot .portal-global-company-search-input {border-color:#17263c;background:#121e32;}
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-company-search-slot .portal-global-company-search-input:focus-within {border-color:var(--vristo-primary);}
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header .btn.portal-vristo-search-trigger {background:rgb(27 46 75 / .6);color:#d0d2d6;}
html[data-portal-ui="vristo"][data-theme="graphite"] :is(.portal-vristo-search-kbd,.portal-global-company-result-foot kbd) {border-color:#253b5c;background:#1b2e4b;color:#bfc9d4;}
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-company-search-slot .portal-global-company-results {background:#0e1726;border-color:#1b2e4b;box-shadow:0 14px 30px -10px rgb(0 0 0 / .6);}
html[data-portal-ui="vristo"][data-theme="graphite"] :is(.portal-global-company-result-bar,.portal-global-company-result-foot) {border-color:#1b2e4b;}
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-company-result-columns .portal-global-company-result-group + .portal-global-company-result-group {border-color:#1b2e4b;}
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-company-result-filters > button {border-color:#253b5c;}
html[data-portal-ui="vristo"][data-theme="graphite"] :is(.portal-global-company-result-filters > button > b,.portal-global-company-result-group > .menu-title > b) {background:#1b2e4b;}

/* Tablets and phones: one column per row; on phones the round icon reveals the field */
@media (max-width:767px) {
  html[data-portal-ui="vristo"] .portal-global-company-result-columns > ul {grid-template-columns:1fr;grid-auto-rows:minmax(0,1fr);}
  html[data-portal-ui="vristo"] .portal-global-company-result-columns .portal-global-company-result-group + .portal-global-company-result-group {border-top:1px solid var(--vristo-line);border-left:0;}
  html[data-portal-ui="vristo"] .portal-global-company-result-foot {display:none !important;}
  html[data-portal-ui="vristo"] .portal-company-search-slot .portal-global-company-results {max-height:calc(100dvh - 9rem);}
  /* Phones and tablets: groups stack at full height and the whole result area scrolls once (no nested scroll boxes). */
  html[data-portal-ui="vristo"] .portal-global-company-result-columns {overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;}
  html[data-portal-ui="vristo"] .portal-global-company-result-columns > ul {height:auto;grid-auto-rows:auto;}
  html[data-portal-ui="vristo"] .portal-global-company-result-columns .portal-global-company-result-group {overflow:visible;}
  html[data-portal-ui="vristo"] .portal-global-company-result-columns .portal-global-company-result-group-list {overflow:visible;}
}
@media (max-width:639px) {
  html[data-portal-ui="vristo"] .portal-global-header .btn.portal-vristo-search-trigger {display:inline-grid;place-items:center;}
  html[data-portal-ui="vristo"] .portal-global-header.portal-vristo-search-open .portal-global-header-surface #portal-company-search-slot {position:absolute;top:100%;right:0;left:0;z-index:131;display:block;width:auto;max-width:none;padding:10px 12px;border-top:1px solid var(--vristo-line);border-radius:0 0 6px 6px;background:var(--vristo-panel);box-shadow:0 14px 30px -12px rgb(14 23 38 / .28);animation:portal-vristo-mega-in 200ms cubic-bezier(.4,0,.2,1);}
  html[data-portal-ui="vristo"] .portal-global-header.portal-vristo-search-open .portal-global-header-surface {border-bottom-right-radius:0;border-bottom-left-radius:0;}
  html[data-portal-ui="vristo"] .portal-global-header.portal-vristo-search-open #portal-company-search-slot:has(.portal-global-company-results:not(.hidden)) {border-radius:0;box-shadow:none;}
  html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header.portal-vristo-search-open .portal-global-header-surface #portal-company-search-slot {border-color:#1b2e4b;background:#0e1726;box-shadow:0 14px 30px -10px rgb(0 0 0 / .6);}
  html[data-portal-ui="vristo"] .portal-global-header.portal-vristo-search-open .portal-global-company-search {max-width:none;}
  html[data-portal-ui="vristo"] .portal-global-header.portal-vristo-search-open .btn.portal-vristo-search-trigger {background:var(--vristo-primary);color:#fff;}
  html[data-portal-ui="vristo"] .portal-global-company-result-bar {padding:10px 12px !important;}
}
@media (max-width:1279px) {
  html[data-portal-ui="vristo"] .portal-vristo-search-kbd {display:none;}
}

/* ── Header logo and menu buttons (24. 9. 2026) ─────────────────────────────
 * vristo-html-main index.html .horizontal-logo: the logo sits in the header on
 * mobile and on desktop while the vertical sidebar is hidden (.vertical.toggle-sidebar),
 * followed by the round .collapse-icon. The name shows from 1024 px (Vristo: md); below
 * that the header also carries the search field and five utilities. */
html[data-portal-ui="vristo"] .portal-vristo-header-logo {display:none;flex:none;align-items:center;gap:8px;min-width:0;color:var(--vristo-ink);text-decoration:none;}
html[data-portal-ui="vristo"] .portal-vristo-header-logo-mark {color:var(--vristo-primary);font-size:28px;font-weight:700;line-height:1;transform:translateY(-3px);}
html[data-portal-ui="vristo"] .portal-vristo-header-logo-name {display:none;font-size:20px;font-weight:700;line-height:1;white-space:nowrap;}
html[data-portal-ui="vristo"] .portal-vristo-header-logo:focus-visible {outline:2px solid var(--vristo-primary);outline-offset:4px;border-radius:4px;}
html[data-portal-ui="vristo"] .portal-global-header .navbar-start > label.btn,
html[data-portal-ui="vristo"] .portal-global-header .btn.portal-sidebar-expand {width:36px;height:36px;min-height:36px;padding:0;border:0;border-radius:999px;background:rgb(224 230 237 / .4);color:var(--vristo-ink);}
html[data-portal-ui="vristo"] .portal-global-header .navbar-start > label.btn:hover,
html[data-portal-ui="vristo"] .portal-global-header .btn.portal-sidebar-expand:hover,
html[data-portal-ui="vristo"] .portal-global-header .btn.portal-sidebar-expand:focus-visible {background:rgb(224 230 237 / .9);color:var(--vristo-primary);}
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header .navbar-start > label.btn,
html[data-portal-ui="vristo"][data-theme="graphite"] .portal-global-header .btn.portal-sidebar-expand {background:rgb(27 46 75 / .6);color:#d0d2d6;}
@media (max-width:1023px) {
  html[data-portal-ui="vristo"] .portal-vristo-header-logo {display:inline-flex;}
}
@media (min-width:1024px) {
  html[data-portal-ui="vristo"] .portal-vristo-header-logo-name {display:inline;}
}
@media (min-width:1024px) {
  html[data-portal-ui="vristo"][data-portal-sidebar="collapsed"] .portal-vristo-header-logo {display:inline-flex;margin-right:4px;}
}

/* ── Page entrance (24. 9. 2026) ─────────────────────────────────────────────
 * animate.css animate__fadeIn as used by Vristo's .dvanimation main content:
 * opacity only, so nothing shifts and sticky/fixed children keep their place. */
@keyframes portal-vristo-fade-in {from {opacity:0;} to {opacity:1;}}
html[data-portal-ui="vristo"] #portal-main-container {animation:portal-vristo-fade-in 600ms ease backwards;}
@media (prefers-reduced-motion:reduce) {
  html[data-portal-ui="vristo"] #portal-main-container {animation:none;}
}

/* ── Breadcrumb row position (24. 9. 2026) ─────────────────────────────────────
 * Every page shows its breadcrumb where the dashboard does: a 40 px row (text 10 px
 * below the top of the content) and the first panel 60 px from the top. Registry-style
 * and account-list headings use the same values in their own stylesheets. */
html[data-portal-ui="vristo"] #portal-main-container :is(.vristo-profile-page > .breadcrumbs, .breadcrumbs.mb-5) {display:flex;align-items:center;min-height:40px;padding-block:0;}