/* CONSISTENT PRACTICE LAB NAVIGATION + HOME UTILITIES V1 */

.practice-global-nav {
  position: relative;
  z-index: 9900;
  width: min(calc(100% - 24px), 1120px);
  margin: 10px auto 12px;
  color: var(--text, #fff6ed);
}

.practice-global-nav__inner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 8px;
  border: 1px solid rgba(255, 157, 58, 0.38);
  border-radius: 15px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(255, 148, 31, 0.11),
      transparent 44%
    ),
    rgba(22, 15, 11, 0.975);
  box-shadow: 0 13px 38px rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(12px);
}

.practice-global-nav__brand,
.practice-global-nav__link,
.practice-global-nav__more-button,
.practice-global-nav__more-item {
  color: inherit;
  font: inherit;
  text-decoration: none;
}

.practice-global-nav__brand {
  padding: 8px 10px;
  border-radius: 10px;
  color: var(--orange-2, #ffb15c);
  font-size: 10px;
  font-weight: 950;
  white-space: nowrap;
}

.practice-global-nav__brand:hover,
.practice-global-nav__brand:focus-visible {
  background: rgba(255, 148, 31, 0.1);
}

.practice-global-nav__brand-short {
  display: none;
}

.practice-global-nav__primary {
  display: flex;
  gap: 4px;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
}

.practice-global-nav__primary::-webkit-scrollbar {
  display: none;
}

.practice-global-nav__link,
.practice-global-nav__more-button {
  display: grid;
  place-items: center;
  min-height: 36px;
  padding: 7px 10px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  font-size: 9px;
  font-weight: 900;
  white-space: nowrap;
  cursor: pointer;
}

.practice-global-nav__link:hover,
.practice-global-nav__link:focus-visible,
.practice-global-nav__more-button:hover,
.practice-global-nav__more-button:focus-visible,
.practice-global-nav__link.is-active {
  border-color: rgba(255, 173, 85, 0.36);
  background: rgba(255, 148, 31, 0.1);
}

.practice-global-nav__link.is-active {
  color: #180b03;
  border-color: transparent;
  background: linear-gradient(135deg, #ff941f, #ffb967);
}

.practice-global-nav__more-wrap {
  position: relative;
}

.practice-global-nav__more-button {
  color: var(--orange-2, #ffb15c);
}

.practice-global-nav__more-menu {
  position: absolute;
  top: calc(100% + 7px);
  right: 0;
  display: grid;
  width: min(280px, calc(100vw - 24px));
  padding: 8px;
  border: 1px solid rgba(255, 157, 58, 0.42);
  border-radius: 13px;
  background: rgba(20, 14, 10, 0.995);
  box-shadow: 0 24px 65px rgba(0, 0, 0, 0.68);
}

.practice-global-nav__more-menu[hidden] {
  display: none;
}

.practice-global-nav__more-item {
  min-height: 39px;
  padding: 10px;
  border-radius: 8px;
  font-size: 10px;
  font-weight: 850;
}

.practice-global-nav__more-item:hover,
.practice-global-nav__more-item:focus-visible,
.practice-global-nav__more-item.is-active {
  color: var(--orange-2, #ffb15c);
  background: rgba(255, 148, 31, 0.1);
}

.practice-global-nav__more-item.is-disabled {
  color: var(--muted, #cdbeb1);
  cursor: not-allowed;
  opacity: 0.55;
}

.practice-home-utilities {
  margin: 12px 0;
  padding: 15px;
  border: 1px solid rgba(255, 157, 58, 0.3);
  border-radius: 17px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(255, 148, 31, 0.085),
      transparent 46%
    ),
    rgba(25, 18, 13, 0.94);
}

.practice-home-utilities__heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 0.65fr);
  gap: 14px;
  align-items: end;
  margin-bottom: 12px;
}

.practice-home-utilities__kicker,
.practice-home-utility-card__kicker {
  color: var(--orange-2, #ffb15c);
  font-size: 8px;
  font-weight: 950;
  letter-spacing: 0.16em;
}

.practice-home-utilities h2 {
  margin: 5px 0 0;
  color: var(--text, #fff6ed);
  font-size: clamp(22px, 3.4vw, 34px);
  line-height: 1;
}

.practice-home-utilities__heading p {
  margin: 0;
  color: var(--muted, #cdbeb1);
  font-size: 10px;
  line-height: 1.5;
}

.practice-home-utilities__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
  gap: 8px;
}

.practice-home-utility-card {
  position: relative;
  display: grid;
  align-content: start;
  min-height: 156px;
  padding: 13px;
  border: 1px solid rgba(255, 173, 85, 0.25);
  border-radius: 13px;
  color: var(--text, #fff6ed);
  background: rgba(255, 255, 255, 0.025);
  text-decoration: none;
  transition:
    transform 140ms ease,
    border-color 140ms ease,
    background 140ms ease;
}

.practice-home-utility-card:hover,
.practice-home-utility-card:focus-visible {
  border-color: var(--orange, #ff941f);
  background: rgba(255, 148, 31, 0.08);
  transform: translateY(-2px);
}

.practice-home-utility-card strong {
  display: block;
  margin-top: 7px;
  font-size: 17px;
  line-height: 1.1;
}

.practice-home-utility-card__description {
  display: block;
  margin-top: 8px;
  color: var(--muted, #cdbeb1);
  font-size: 10px;
  line-height: 1.45;
}

.practice-home-utility-card__action {
  align-self: end;
  display: block;
  margin-top: 13px;
  color: var(--orange-2, #ffb15c);
  font-size: 9px;
  font-weight: 950;
}

.practice-home-utility-card.is-planned {
  border-style: dashed;
}

.practice-home-utility-card.is-disabled {
  opacity: 0.58;
  cursor: not-allowed;
}

.practice-backup-help-link {
  position: relative !important;
}

.practice-backup-tooltip {
  position: absolute;
  right: 0;
  bottom: calc(100% + 9px);
  z-index: 12000;
  width: min(390px, calc(100vw - 30px));
  padding: 12px 13px;
  border: 1px solid rgba(255, 173, 85, 0.52);
  border-radius: 12px;
  color: var(--text, #fff6ed);
  background: rgba(21, 14, 10, 0.995);
  box-shadow: 0 22px 62px rgba(0, 0, 0, 0.68);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.5;
  text-align: left;
  white-space: normal;
  opacity: 0;
  transform: translateY(6px);
  pointer-events: none;
  transition:
    opacity 140ms ease,
    transform 140ms ease;
}

.practice-backup-help-link:hover .practice-backup-tooltip,
.practice-backup-help-link:focus-visible .practice-backup-tooltip,
.practice-backup-help-link:focus-within .practice-backup-tooltip {
  opacity: 1;
  transform: translateY(0);
}

.practice-settings-page {
  width: min(calc(100% - 24px), 1040px);
  margin: 0 auto;
  padding: 18px 0 110px;
}

.practice-settings-hero,
.practice-settings-panel {
  padding: 18px;
  border: 1px solid rgba(255, 157, 58, 0.32);
  border-radius: 17px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(255, 148, 31, 0.09),
      transparent 45%
    ),
    rgba(24, 17, 13, 0.96);
}

.practice-settings-hero h1 {
  margin: 5px 0 8px;
  font-size: clamp(38px, 7vw, 70px);
  line-height: 0.95;
  letter-spacing: -0.055em;
}

.practice-settings-hero p,
.practice-settings-panel p {
  margin: 0;
  color: var(--muted, #cdbeb1);
  line-height: 1.55;
}

.practice-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.practice-settings-panel h2 {
  margin: 5px 0 8px;
  font-size: 24px;
}

.practice-settings-panel a {
  display: inline-block;
  margin-top: 13px;
  color: var(--orange-2, #ffb15c);
  font-size: 10px;
  font-weight: 950;
  text-decoration: none;
}

.practice-settings-panel.is-planned {
  border-style: dashed;
}

@media (max-width: 820px) {
  .practice-global-nav__inner {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .practice-global-nav__brand-full {
    display: none;
  }

  .practice-global-nav__brand-short {
    display: inline;
  }

  .practice-global-nav__primary {
    justify-content: flex-start;
  }

  .practice-home-utilities__heading {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .practice-global-nav {
    width: calc(100% - 14px);
    margin-top: 7px;
  }

  .practice-global-nav__inner {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 4px;
    padding: 5px;
  }

  .practice-global-nav__brand {
    padding: 7px;
    font-size: 8px;
  }

  .practice-global-nav__link,
  .practice-global-nav__more-button {
    min-height: 34px;
    padding: 6px 8px;
    font-size: 8px;
  }

  .practice-global-nav__more-menu {
    position: fixed;
    top: auto;
    right: 7px;
    bottom: 70px;
    left: 7px;
    width: auto;
  }

  .practice-home-utilities__grid,
  .practice-settings-grid {
    grid-template-columns: 1fr;
  }

  .practice-home-utility-card {
    min-height: 128px;
  }

  .practice-backup-tooltip {
    right: auto;
    left: 0;
    width: min(340px, calc(100vw - 28px));
  }
}
