/* OMS Infopedia — Bootstrap theme bridge + only what utilities cannot express */

:root,
[data-bs-theme="light"] {
  --font-heading: "Titillium Web", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;

  --color-dark: #031323;
  --color-bg-light-blue: #edf6ff;
  --color-primary-100: #6d9fd4;
  --color-primary-70: #99bce1;
  --color-secondary-100: #cb842a;

  --text-placeholder-color: #aeaeae;

  /* Primary button (Bootstrap .btn-primary) */
  --color-btn-primary-hover: #4584c5;
  --color-btn-primary-hover-rgb: 69, 132, 197;
  --bs-btn-primary-radius: 10px;

  --bs-body-font-family: var(--font-body);
  --bs-body-color: #afaeae;
  --bs-body-bg: #edf6ff;
  --bs-heading-color: #031323;
  --bs-primary: #6d9fd4;
  --bs-primary-rgb: 109, 159, 212;
  --bs-secondary: #cb842a;
  --bs-secondary-rgb: 203, 132, 42;
  --bs-dark: #031323;
  --bs-dark-rgb: 3, 19, 35;
  --bs-link-color: var(--bs-primary);
  --bs-link-hover-color: #5a8fc9;
  --bs-border-color: rgba(3, 19, 35, 0.12);
  --bs-border-radius: 0.625rem;

  --home-hero-logo-max: clamp(6.5rem, 18vw, 13rem);
  --home-orbit-r: clamp(8.25rem, 21vw, 12rem);
  --home-orbit-ring: rgba(var(--bs-primary-rgb), 0.32);
  --home-search-form-max: 36rem;
  --home-category-shade: linear-gradient(to top, rgba(3, 19, 35, 0.88), rgba(3, 19, 35, 0) 62%);
}

[data-bs-theme="dark"] {
  color-scheme: dark;

  --color-primary-70: #99bce1;

  --bs-body-bg: #031323;
  --bs-body-color: #99bce1;
  --bs-heading-color: #edf6ff;
  --bs-primary: #6d9fd4;
  --bs-primary-rgb: 109, 159, 212;
  --bs-secondary: #cb842a;
  --bs-secondary-rgb: 203, 132, 42;
  --bs-link-color: var(--color-primary-70);
  --bs-link-hover-color: #b6cfe9;
  --bs-border-color: rgba(237, 246, 255, 0.14);

  --home-category-shade: linear-gradient(to top, rgba(0, 0, 0, 0.78), rgba(0, 0, 0, 0) 62%);

  --home-orbit-r: clamp(7.5rem, 20vw, 11.5rem);
  --home-orbit-ring: rgba(var(--bs-primary-rgb), 0.4);

  --text-placeholder-color: #aeaeae;

  --color-btn-primary-hover: #4584c5;
  --color-btn-primary-hover-rgb: 69, 132, 197;
  --bs-btn-primary-radius: 10px;
}

input::placeholder,
textarea::placeholder,
.form-control::placeholder,
.form-select::placeholder {
  color: var(--text-placeholder-color);
  opacity: 1;
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--color-primary-100);
  --bs-btn-border-color: var(--color-primary-100);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-btn-primary-hover);
  --bs-btn-hover-border-color: var(--color-btn-primary-hover);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-btn-primary-hover);
  --bs-btn-active-border-color: var(--color-btn-primary-hover);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--color-primary-100);
  --bs-btn-disabled-border-color: var(--color-primary-100);
  --bs-btn-focus-shadow-rgb: var(--color-btn-primary-hover-rgb);
  --bs-btn-border-radius: var(--bs-btn-primary-radius);
}

/* Login-style outline: tan border & text, white fill, ~10px radius */
.btn-outline-brand {
  --bs-btn-color: var(--color-secondary-100);
  --bs-btn-border-color: var(--color-secondary-100);
  --bs-btn-bg: #fff;
  --bs-btn-hover-color: var(--color-secondary-100);
  --bs-btn-hover-bg: rgba(var(--bs-secondary-rgb), 0.1);
  --bs-btn-hover-border-color: var(--color-secondary-100);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-secondary-100);
  --bs-btn-active-border-color: var(--color-secondary-100);
  --bs-btn-disabled-color: var(--color-secondary-100);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--color-secondary-100);
  --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
  --bs-btn-border-radius: 10px;
  --bs-btn-padding-y: 0.5rem;
  --bs-btn-padding-x: 1.35rem;
  --bs-btn-font-weight: 600;
}

[data-bs-theme="dark"] .btn-outline-brand {
  --bs-btn-bg: var(--bs-body-bg);
  --bs-btn-hover-bg: rgba(var(--bs-secondary-rgb), 0.18);
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: var(--font-heading);
  font-weight: 600;
}

.font-heading {
  font-family: var(--font-heading);
}

.home-hero-mark {
  max-height: var(--home-hero-logo-max);
  width: auto;
}

.home-orbit {
  position: relative;
  width: min(92vw, calc(var(--home-orbit-r) * 2 + 10rem));
  max-width: 32rem;
  aspect-ratio: 1;
  margin-inline: auto;
}

.home-orbit__track {
  position: absolute;
  left: 50%;
  top: 50%;
  width: calc(var(--home-orbit-r) * 2);
  height: calc(var(--home-orbit-r) * 2);
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 1px solid var(--home-orbit-ring);
  pointer-events: none;
  z-index: 0;
}

.home-orbit__ring {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  z-index: 1;
}

.home-orbit__item {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0;
  height: 0;
}

.home-orbit__body {
  position: absolute;
  left: 0;
  top: 0;
  width: max-content;
  max-width: 9rem;
  text-align: center;
  transform: translate(-50%, -50%) rotate(calc(var(--i) * 36deg - 90deg))
    translateY(calc(-1 * var(--home-orbit-r))) rotate(calc(-1 * (var(--i) * 36deg - 90deg)));
}

@media (max-width: 575.98px) {
  .home-orbit {
    --home-orbit-r: clamp(6.25rem, 36vw, 8rem);
  }

  .home-orbit__body {
    max-width: 5.75rem;
    font-size: 0.8125rem;
  }
}

.home-hero-search {
  max-width: var(--home-search-form-max);
}

.home-hero-search .form-control:focus {
  box-shadow: none;
}

.home-category-card {
  transition: box-shadow 0.15s ease;
}

.home-category-card:hover,
.home-category-card:focus-visible {
  box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), 0.95);
}

.home-category-card__shade {
  background: var(--home-category-shade);
}