/* Shared theme toggle */
.theme-toggle {
  display: grid;
  width: 50px;
  height: 50px;
  position: relative;
  left: auto;
  margin-left: -60px;
  padding: 0;
  place-items: center;
  flex: 0 0 50px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--navy);
  cursor: pointer;
  transition:
    background-color 240ms ease,
    color 240ms ease,
    transform 240ms ease;
}

.theme-toggle:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 4px;
}

.theme-toggle:hover {
  background: rgba(210, 216, 220, 0.1);
}

.theme-icon {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.45;
  transition: transform 240ms ease;
}

.theme-toggle:hover .theme-icon {
  transform: scale(0.94);
}

.theme-icon-sun {
  display: block;
  width: 25px;
  height: 25px;
  color: #ff7f3e;
}

.theme-icon-sun circle {
  fill: currentColor;
}

.theme-icon-moon {
  display: none;
}

html[data-theme="dark"] .theme-icon-moon {
  display: block;
  color: #e8b529;
}

html[data-theme="dark"] .theme-icon-moon path {
  fill: currentColor;
}

html[data-theme="dark"] .theme-icon-sun {
  display: none;
}

@media (min-width: 1181px) {
  .original-header nav {
    position: absolute;
    right: 30px;
    margin-left: 0;
  }
}

@media (max-width: 1180px) {
  .original-header nav > .original-button {
    bottom: 48px;
  }

  .original-header nav > .theme-toggle {
    position: absolute;
    right: auto;
    bottom: 55px;
    left: 8vw;
    width: 50px;
    height: 50px;
    margin: 0;
    opacity: 0;
    transform: translateY(12px);
    transition:
      background-color 240ms ease,
      color 240ms ease,
      opacity 280ms ease,
      transform 280ms ease;
  }

  .original-header nav.open > .theme-toggle {
    opacity: 1;
    transform: translateY(0);
  }

  .original-header nav.is-closing > .theme-toggle {
    transition:
      background-color 240ms ease,
      color 240ms ease,
      opacity 280ms ease,
      transform 280ms ease;
  }
}

/* Dark palette */
html[data-theme="dark"] {
  --gold: #e8b529;
}

html[data-theme="dark"] body,
html[data-theme="dark"] .original-home,
html[data-theme="dark"] .replica-page {
  background: var(--navy);
  color: rgba(255, 255, 255, 0.9);
}

html[data-theme="dark"] .original-header,
html[data-theme="dark"] .replica-page .original-header,
html[data-theme="dark"] .original-header nav,
html[data-theme="dark"] .original-footer {
  border-color: rgba(255, 255, 255, 0.16);
  background: var(--navy);
  color: rgba(255, 255, 255, 0.86);
}

html[data-theme="dark"] .original-footer {
  background: var(--deep);
}

html[data-theme="dark"] .original-header nav > a:not(.original-button) {
  color: rgba(255, 255, 255, 0.9) !important;
}

html[data-theme="dark"] .original-header nav > a:not(.original-button):hover {
  color: rgba(255, 255, 255, 0.65) !important;
}

html[data-theme="dark"] .original-header nav > a:not(.original-button)::after {
  background: var(--gold);
}

html[data-theme="dark"] .original-header .menu span {
  background: #fff;
}

html[data-theme="dark"] .original-header .original-button {
  border-color: #fff;
  background: #fff;
  color: var(--navy) !important;
}

html[data-theme="dark"] .original-header .original-button:hover {
  border-color: #fff;
  background: var(--navy);
  color: #fff !important;
}

html[data-theme="dark"] .theme-toggle {
  color: #fff;
}

html[data-theme="dark"] .theme-toggle:hover {
  background: rgba(210, 216, 220, 0.1);
}

html[data-theme="dark"] .original-logo img {
  content: url("../img/logo-lite.png");
}

html[data-theme="dark"] .original-footer a,
html[data-theme="dark"] .original-footer p {
  color: #fff;
}

html[data-theme="dark"] .original-footer h3 {
  color: rgba(255, 255, 255, 0.58);
}

html[data-theme="dark"] .original-copyright {
  color: rgba(255, 255, 255, 0.5) !important;
}

html[data-theme="dark"] .section-title,
html[data-theme="dark"] .floor-heading,
html[data-theme="dark"] .rates-intro h3,
html[data-theme="dark"] .rate-card-heading h3,
html[data-theme="dark"] .rate-card-price,
html[data-theme="dark"] .rate-card-meta > span:last-child,
html[data-theme="dark"] .service-card-header strong,
html[data-theme="dark"] .service-replica-grid h3,
html[data-theme="dark"] .services-disclaimer strong,
html[data-theme="dark"] .about-eyebrow,
html[data-theme="dark"] .about-intro h1,
html[data-theme="dark"] .about-story-columns .about-story-lead,
html[data-theme="dark"] .camera-step-copy h2,
html[data-theme="dark"] .camera-finish {
  color: #fff;
}

html[data-theme="dark"] .section-title--ornament::after,
html[data-theme="dark"] .floor-heading::after {
  color: var(--gold);
  background:
    linear-gradient(var(--gold), var(--gold)) left center / 48px 1px no-repeat,
    linear-gradient(var(--gold), var(--gold)) right center / 48px 1px no-repeat;
}

/* Home */
html[data-theme="dark"] .original-rooms,
html[data-theme="dark"] .original-start {
  background: var(--navy);
}

html[data-theme="dark"] .original-start-inner {
  background: var(--deep);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.15);
}

html[data-theme="dark"] .original-start ol {
  border-color: rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] .original-start li {
  border-color: rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] .original-start li::before {
  border-color: rgba(255, 255, 255, 0.55);
  color: #fff;
}

html[data-theme="dark"] .original-start a:not(.original-button) {
  color: #fff;
}

html[data-theme="dark"] .original-start .original-button {
  border-color: #fff;
  background: #fff;
  color: var(--navy) !important;
}

html[data-theme="dark"] .original-start .original-button:hover {
  background: transparent;
  color: #fff !important;
}

html[data-theme="dark"] .original-room-copy h3,
html[data-theme="dark"] .original-room-copy p,
html[data-theme="dark"] .original-room-link,
html[data-theme="dark"] .original-start p,
html[data-theme="dark"] .original-start li,
html[data-theme="dark"] .original-start-inner > p:last-of-type {
  color: rgba(255, 255, 255, 0.86);
}

html[data-theme="dark"] .original-room-card {
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: var(--deep);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12);
}

html[data-theme="dark"] .original-home a.original-room-card:hover,
html[data-theme="dark"] .service-replica-grid article:hover {
  border-color: rgba(255, 255, 255, 0.28);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
}

html[data-theme="dark"] .original-room-copy {
  border: 0;
}

html[data-theme="dark"] .original-room-link b {
  color: #fff;
}

html[data-theme="dark"] .original-reviews {
  background: var(--deep);
}

/* Rates */
html[data-theme="dark"] .rates-intro,
html[data-theme="dark"] .room-catalog,
html[data-theme="dark"] .services-replica {
  background: var(--navy);
}

html[data-theme="dark"] .room-catalog {
  background: var(--deep);
}

html[data-theme="dark"] .rate-card-capacity,
html[data-theme="dark"] .rate-card-price small,
html[data-theme="dark"] .rate-card-meta,
html[data-theme="dark"] .service-card-header small,
html[data-theme="dark"] .services-replica > .services-lead {
  color: rgba(255, 255, 255, 0.62);
}

html[data-theme="dark"] .rate-card-description,
html[data-theme="dark"] .service-replica-grid p,
html[data-theme="dark"] .services-note {
  color: rgba(255, 255, 255, 0.82);
}

html[data-theme="dark"] .rate-card-meta {
  border-color: rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] .capacity-icons img {
  filter: brightness(0) invert(1);
}

html[data-theme="dark"] .service-replica-grid article,
html[data-theme="dark"] .services-disclaimer {
  border-color: rgba(255, 255, 255, 0.16);
  background: var(--deep);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12);
}

/* About */
html[data-theme="dark"] .about-story,
html[data-theme="dark"] .join-replica {
  background: var(--navy);
}

html[data-theme="dark"] .about-intro {
  background: var(--deep);
}

html[data-theme="dark"] .about-intro-copy > p:not(.about-eyebrow),
html[data-theme="dark"] .about-story-columns p,
html[data-theme="dark"] .about-reviews,
html[data-theme="dark"] .join-copy p {
  color: rgba(255, 255, 255, 0.8);
}

html[data-theme="dark"] .about-reviews {
  border-color: rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] .about-text-link,
html[data-theme="dark"] .about-reviews a,
html[data-theme="dark"] .join-replica a {
  color: #fff;
}

/* Cameras */
html[data-theme="dark"] .camera-main {
  background: var(--navy);
}

html[data-theme="dark"] .camera-intro,
html[data-theme="dark"] .camera-step-copy p,
html[data-theme="dark"] .camera-step-note,
html[data-theme="dark"] .camera-support,
html[data-theme="dark"] .camera-credentials {
  color: rgba(255, 255, 255, 0.76) !important;
}

html[data-theme="dark"] .camera-steps,
html[data-theme="dark"] .camera-steps > li,
html[data-theme="dark"] .camera-credentials p {
  border-color: rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] .camera-steps > li::before {
  border-color: rgba(255, 255, 255, 0.65);
  color: #fff;
}

html[data-theme="dark"] .camera-room-picker {
  border-color: rgba(255, 255, 255, 0.16);
  background: var(--deep);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12);
}

html[data-theme="dark"] .camera-room-picker label,
html[data-theme="dark"] .camera-step-copy a,
html[data-theme="dark"] .camera-support a {
  color: #fff;
}

html[data-theme="dark"] .camera-room-picker select {
  border-color: rgba(255, 255, 255, 0.38);
  background-color: var(--deep);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='11' viewBox='0 0 18 11'%3E%3Cpath d='m2 2 7 7 7-7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  color: #fff;
}

html[data-theme="dark"] .camera-room-picker select option {
  color: #fff;
  background: var(--deep);
}

html[data-theme="dark"] .camera-credentials,
html[data-theme="dark"] .camera-credentials p,
html[data-theme="dark"] .camera-credentials strong {
  color: #fff !important;
}

/* Guidelines */
html[data-theme="dark"] .faq-page {
  background: var(--navy);
  color: #fff;
}

html[data-theme="dark"] .faq-page h1,
html[data-theme="dark"] .faq-question,
html[data-theme="dark"] .faq-answer-inner,
html[data-theme="dark"] .guidelines-intro-copy a {
  color: #fff;
}

html[data-theme="dark"] .guidelines-title-ornament {
  color: var(--gold);
}

html[data-theme="dark"] .guidelines-title-ornament::before,
html[data-theme="dark"] .guidelines-title-ornament::after {
  background: var(--gold);
}

html[data-theme="dark"] .guidelines-intro-copy,
html[data-theme="dark"] .guidelines-search label,
html[data-theme="dark"] .guidelines-search-status,
html[data-theme="dark"] .guidelines-empty {
  color: rgba(255, 255, 255, 0.76);
}

html[data-theme="dark"] .guidelines-search-field svg {
  stroke: rgba(255, 255, 255, 0.72);
}

html[data-theme="dark"] .guidelines-search input {
  border-color: rgba(255, 255, 255, 0.45);
  background: rgba(255, 255, 255, 0.07);
  color: #fff;
}

html[data-theme="dark"] .guidelines-search input::placeholder {
  color: rgba(255, 255, 255, 0.55);
}

html[data-theme="dark"] .guidelines-search-clear {
  color: #fff;
}

html[data-theme="dark"] .faq-item:not(:first-child)::before {
  background: rgba(255, 255, 255, 0.35);
}

html[data-theme="dark"] .faq-question:hover,
html[data-theme="dark"] .faq-question:active {
  background: rgba(255, 255, 255, 0.07);
}

html[data-theme="dark"] .guidelines-results-clear {
  border-color: #fff;
  background: #fff;
  color: var(--navy) !important;
}

html[data-theme="dark"] .guidelines-results-clear:hover {
  border-color: #fff;
  background: var(--navy);
  color: #fff !important;
}

@media (max-width: 767px) {
  html[data-theme="dark"] .original-start-inner {
    box-shadow: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .theme-toggle,
  .theme-icon {
    transition: none;
  }
}