/*
 * FastAPI/Jinja bridge for Unfold Admin.
 * Tokens and component measurements below mirror the MIT-licensed sources in:
 *   static/unfold/css/styles.css
 *   unfold/settings.py
 *   unfold/templates/unfold/components/*
 * No screenshot-derived visual values are used here.
 */

:root {
  --border-radius: 6px;

  --color-base-50: oklch(98.5% .002 247.839);
  --color-base-100: oklch(96.7% .003 264.542);
  --color-base-200: oklch(92.8% .006 264.531);
  --color-base-300: oklch(87.2% .01 258.338);
  --color-base-400: oklch(70.7% .022 261.325);
  --color-base-500: oklch(55.1% .027 264.364);
  --color-base-600: oklch(44.6% .03 256.802);
  --color-base-700: oklch(37.3% .034 259.733);
  --color-base-800: oklch(27.8% .033 256.848);
  --color-base-900: oklch(21% .034 264.665);
  --color-base-950: oklch(13% .028 261.692);

  --color-primary-50: oklch(97.7% .014 308.299);
  --color-primary-100: oklch(94.6% .033 307.174);
  --color-primary-200: oklch(90.2% .063 306.703);
  --color-primary-300: oklch(82.7% .119 306.383);
  --color-primary-400: oklch(71.4% .203 305.504);
  --color-primary-500: oklch(62.7% .265 303.9);
  --color-primary-600: oklch(55.8% .288 302.321);
  --color-primary-700: oklch(49.6% .265 301.924);
  --color-primary-800: oklch(43.8% .218 303.724);
  --color-primary-900: oklch(38.1% .176 304.987);
  --color-primary-950: oklch(29.1% .149 302.717);

  --color-font-subtle-light: var(--color-base-500);
  --color-font-subtle-dark: var(--color-base-400);
  --color-font-default-light: var(--color-base-600);
  --color-font-default-dark: var(--color-base-300);
  --color-font-important-light: var(--color-base-900);
  --color-font-important-dark: var(--color-base-100);

  /* Compatibility aliases while the existing feature templates are migrated. */
  --color-brand-50: var(--color-primary-50);
  --color-brand-100: var(--color-primary-100);
  --color-brand-200: var(--color-primary-200);
  --color-brand-300: var(--color-primary-300);
  --color-brand-400: var(--color-primary-400);
  --color-brand-500: var(--color-primary-500);
  --color-brand-600: var(--color-primary-600);
  --color-brand-700: var(--color-primary-700);
  --color-brand-800: var(--color-primary-800);
  --color-brand-900: var(--color-primary-900);
  --color-brand-950: var(--color-primary-950);
}

[x-cloak] { display: none !important; }

body {
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
}

/* Exact navigation treatment from unfold/helpers/app_list.html. */
.unfold-nav-item {
  align-items: center;
  border-radius: var(--border-radius);
  display: flex;
  height: 38px;
  margin-inline: -0.75rem;
  padding-inline: 0.75rem;
}

.unfold-nav-item:hover {
  color: var(--color-primary-600);
}

.unfold-nav-item.active {
  background: var(--color-base-100);
  color: var(--color-primary-600);
  font-weight: 600;
}

.dark .unfold-nav-item:hover,
.dark .unfold-nav-item.active {
  color: var(--color-primary-500);
}

.dark .unfold-nav-item.active {
  background: rgb(255 255 255 / 0.06);
}

.dealvy-runtime-label {
  display: inline;
}

/* LLM settings use one card rhythm across both columns. */
.llm-card-header {
  min-height: 80px;
}

.llm-provider-grid {
  display: grid;
  gap: 0.5rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.llm-provider-button {
  min-width: 0;
}

@media (min-width: 640px) {
  .llm-provider-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1536px) {
  .llm-provider-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

/* Component bridge: same border, radius and elevation as Unfold card.html. */
#content :is(section, div, a).rounded-default.border.bg-white {
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
}

/* Table rhythm from unfold/components/table.html. */
#content table {
  border-collapse: separate;
  border-spacing: 0;
  font-variant-numeric: tabular-nums;
}

#content thead tr {
  background: var(--color-base-50);
}

#content th {
  border-bottom-color: var(--color-base-200);
  font-weight: 600;
  padding-block: 0.5rem;
}

#content td {
  border-color: var(--color-base-200);
  min-height: 45px;
}

.dark #content thead tr {
  background: var(--color-base-900);
}

.dark #content th,
.dark #content td {
  border-color: var(--color-base-800);
}

/* The feature templates use Tailwind divide utilities that are not emitted by
   the upstream Unfold build; keep their divider color on the official palette. */
.divide-base-100 > :not(:last-child) {
  border-color: var(--color-base-100);
}

.divide-base-200 > :not(:last-child) {
  border-color: var(--color-base-200);
}

.dark .divide-base-100 > :not(:last-child),
.dark .divide-base-200 > :not(:last-child) {
  border-color: var(--color-base-800);
}

/* Existing segmented controls now use unfold/components/navigation.html. */
.unfold-tabs {
  align-items: center;
  background: var(--color-base-100);
  border-radius: var(--border-radius);
  display: inline-flex;
  gap: 0.25rem !important;
  padding: 0.25rem;
}

.unfold-tabs > :is(a, button) {
  border: 0 !important;
  border-radius: var(--border-radius) !important;
  box-shadow: none !important;
  min-height: 32px;
  padding: 5px 0.625rem !important;
}

.unfold-tabs > .bg-primary-500,
.unfold-tabs > .bg-primary-600 {
  background: white !important;
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05) !important;
  color: var(--color-font-important-light) !important;
}

.dark .unfold-tabs {
  background: rgb(255 255 255 / 0.04);
}

.dark .unfold-tabs > .bg-primary-500,
.dark .unfold-tabs > .bg-primary-600 {
  background: var(--color-base-900) !important;
  color: var(--color-font-important-dark) !important;
}

/* A notification link lands on the exact Open Line instead of only reloading
   the scope page. The target state is persistent and does not rely on motion. */
.dealvy-openline-row {
  min-height: 68px;
  scroll-margin-top: 5.5rem;
}

/* Header and rows share one roomy grid. Controls never compete for the same
   pixels; smaller viewports scroll the table instead of crushing labels. */
.dealvy-openline-table {
  min-width: 1440px;
}

.dealvy-openline-grid {
  grid-template-columns:
    44px
    minmax(230px, 1fr)
    152px
    136px
    168px
    minmax(218px, 0.9fr)
    104px
    58px
    66px
    58px
    66px;
}

.dealvy-openline-row:target {
  background-color: var(--color-primary-50);
  box-shadow: inset 3px 0 0 var(--color-primary-500);
  outline: none;
}

.dark .dealvy-openline-row:target {
  background-color: rgb(255 255 255 / 0.04);
  box-shadow: inset 3px 0 0 var(--color-primary-500);
}

/* Manager-attention details use the browser's accessible top layer while the
   panel follows the same surface, border and elevation tokens as Unfold. */
.dealvy-manager-row {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: minmax(0, 1fr);
  min-height: 76px;
}

.dealvy-manager-row__icon {
  display: none;
}

.dealvy-manager-row__action {
  width: 100%;
}

.dealvy-manager-dialog {
  background: transparent;
  border: 0;
  color: var(--color-font-default-light);
  margin: auto;
  max-height: calc(100dvh - 2rem);
  max-width: min(44rem, calc(100vw - 2rem));
  padding: 0;
  width: 100%;
}

.dealvy-manager-dialog::backdrop {
  backdrop-filter: blur(2px);
  background: rgb(15 23 42 / 0.55);
}

.dealvy-manager-dialog__panel {
  background: white;
  border: 1px solid var(--color-base-200);
  border-radius: var(--border-radius);
  box-shadow: 0 24px 48px -12px rgb(15 23 42 / 0.28);
  display: flex;
  flex-direction: column;
  max-height: calc(100dvh - 2rem);
  overflow: hidden;
}

.dealvy-manager-dialog__body {
  overflow-y: auto;
  overscroll-behavior: contain;
}

.dark .dealvy-manager-dialog {
  color: var(--color-font-default-dark);
}

.dark .dealvy-manager-dialog__panel {
  background: var(--color-base-900);
  border-color: var(--color-base-700);
  box-shadow: 0 24px 48px -12px rgb(0 0 0 / 0.6);
}

@media (prefers-reduced-motion: no-preference) {
  .dealvy-manager-dialog[open] .dealvy-manager-dialog__panel {
    animation: dealvy-modal-enter 180ms ease-out;
  }

  @keyframes dealvy-modal-enter {
    from { opacity: 0; transform: translateY(8px) scale(0.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
  }
}

@media (max-width: 1279px) {
  #content { width: 100%; }
}

@media (min-width: 640px) {
  .dealvy-manager-row {
    align-items: center;
    grid-template-columns: 2.25rem minmax(0, 1fr) 7rem;
  }

  .dealvy-manager-row__icon {
    display: flex;
  }

  .dealvy-manager-row__action {
    min-width: 7rem;
    width: auto;
  }
}

@media (max-width: 767px) {
  .dealvy-runtime-label { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}