@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Marcellus&display=swap');

body.design-theme-spectral-manor {
  --bg: #080e18;
  --surface: #111b27;
  --text: #ecf2f5;
  --primary: #8ecbcf;
  --primary-hover: #b6e7e8;
  --secondary: #9daec8;
  --secondary-hover: #c0cce0;
  --accent: #b3e5e3;
  --accent-hover: #d6fbf5;
  --muted: #253747;
  --spectral-line: rgba(170, 212, 224, .35);
  --spectral-panel: rgba(8, 17, 30, .91);
  isolation: isolate;
  min-height: 100vh;
  color: var(--text);
  font-family: 'DM Sans', sans-serif;
  background: linear-gradient(180deg, rgba(5, 12, 24, .20), rgba(5, 12, 24, .64) 62%, #080e18), url('assets/spectral-manor-hall.png') center top / cover fixed no-repeat;
}

body.design-theme-spectral-manor::before,
body.design-theme-spectral-manor::after {
  content: '';
  position: fixed;
  width: clamp(140px, 21vw, 350px);
  height: clamp(220px, 35vw, 560px);
  background: url('assets/spectral-manor-ghosts.png') center / contain no-repeat;
  pointer-events: none;
  z-index: 0;
  filter: drop-shadow(0 0 32px rgba(146, 224, 239, .52));
}

body.design-theme-spectral-manor::before {
  top: 12%;
  left: -12%;
  opacity: .39;
  animation: spectral-ghost-drift 28s ease-in-out infinite alternate;
}

body.design-theme-spectral-manor::after {
  bottom: -12%;
  right: 1%;
  opacity: .26;
  transform: scale(.75) scaleX(-1);
  animation: spectral-ghost-rise 23s ease-in-out infinite alternate;
}

@keyframes spectral-ghost-drift {
  from { transform: translate3d(-12vw, 24px, 0) rotate(-4deg); opacity: .08; }
  42% { opacity: .47; }
  to { transform: translate3d(49vw, -60px, 0) rotate(5deg); opacity: .22; }
}

@keyframes spectral-ghost-rise {
  from { transform: translate3d(30px, 60px, 0) scale(.75) scaleX(-1); opacity: .08; }
  55% { opacity: .32; }
  to { transform: translate3d(-19vw, -24vh, 0) scale(.83) scaleX(-1); opacity: .12; }
}

body.design-theme-spectral-manor :is(.header-wrap, #search-container, #bundles, .owner-admin-shell, .sales-shell, .checkout-shell, .static-message, .pagination) {
  position: relative;
  z-index: 1;
}

body.design-theme-spectral-manor :is(h1, h2, h3, .site-title) {
  color: #dceff2;
  font-family: Marcellus, Georgia, serif;
  font-weight: 400;
  letter-spacing: .055em;
  text-shadow: 0 0 22px rgba(164, 220, 236, .48), 0 4px 20px #020812;
}

body.design-theme-spectral-manor .site-title {
  font-size: clamp(2.6rem, 5vw, 5rem);
  line-height: 1;
}
body.design-theme-spectral-manor .banner-img { border: 1px solid var(--spectral-line); box-shadow: 0 14px 46px #020812; }

body.design-theme-spectral-manor :is(.static-message, #search-bar-container, #dropdowns-container, .bundle, .sales-summary-card, .sales-order-card) {
  background: var(--spectral-panel);
  border: 1px solid var(--spectral-line);
  border-radius: 12px;
  box-shadow: 0 18px 54px rgba(0, 4, 14, .55), inset 0 1px rgba(219, 250, 255, .07);
  backdrop-filter: blur(8px);
}

body.design-theme-spectral-manor .static-message {
  max-width: 920px;
  line-height: 1.6;
}

body.design-theme-spectral-manor :is(.static-message .highlight, .bundle-price, .sales-section-heading, .sales-summary-card strong) { color: #a6e5e9; }
body.design-theme-spectral-manor :is(.static-message a, .bundle-highlighted-trait) { color: #d5edf6; }
body.design-theme-spectral-manor #bundles {
  max-width: 1584px;
  margin-inline: auto;
  gap: 1rem;
  padding-inline: 20px;
}
body.design-theme-spectral-manor .bundle { background: linear-gradient(145deg, rgba(13, 27, 43, .96), rgba(7, 15, 28, .94)); }
body.design-theme-spectral-manor .bundle:hover { border-color: #a6e5e9; box-shadow: 0 22px 58px rgba(0, 6, 20, .72), 0 0 24px rgba(142, 219, 229, .20); }
body.design-theme-spectral-manor .bundle.gold-frame { border-color: #d7d8bf; }
body.design-theme-spectral-manor :is(.bundle-file-id, .dropdown-group label) { color: #b8c9d3; }

body.design-theme-spectral-manor :is(#search-bar, .dropdown-group select, .owner-sort-select, .owner-settings-modal input, .owner-settings-modal textarea, .owner-settings-modal select, .sales-filter-grid input[type="date"]) {
  background: #091525;
  border: 1px solid var(--spectral-line);
  border-radius: 8px;
  color: var(--text);
}

body.design-theme-spectral-manor :is(#search-bar, .dropdown-group select, .owner-sort-select):focus-visible { outline: 2px solid #9cdee8; outline-offset: 2px; }

body.design-theme-spectral-manor :is(#search-button, .contact-button, .owner-admin-panel-toggle, .sales-shell .contact-button) {
  background: linear-gradient(155deg, #b2e7e6, #5a9aaa);
  border: 1px solid #c6eff1;
  border-radius: 8px;
  color: #081522;
  box-shadow: 0 8px 22px rgba(2, 10, 27, .5);
  font-weight: 700;
}

body.design-theme-spectral-manor :is(#copy-link-button, .reset-button, .pedigree-button, .teleport-button, .pagination a, .pagination span) {
  background: linear-gradient(155deg, #253c56, #142336);
  border: 1px solid var(--spectral-line);
  border-radius: 8px;
  color: var(--text);
}

body.design-theme-spectral-manor :is(#search-button, #copy-link-button, .contact-button, .reset-button, .pedigree-button, .owner-admin-panel-toggle):hover { filter: brightness(1.13); box-shadow: 0 0 23px rgba(165, 232, 241, .35); }
body.design-theme-spectral-manor .pagination .current-page,
body.design-theme-spectral-manor .cart-count { background: #91d6db; border-color: #c3f2ef; color: #0b1925; }

body.design-theme-spectral-manor :is(.cart-widget, .cart-modal, .owner-settings-modal, .owner-storage-modal, .owner-sib-set-edit-panel, .sales-filter-form) {
  background: rgba(9, 19, 34, .97);
  border: 1px solid var(--spectral-line);
  border-radius: 12px;
  color: var(--text);
  box-shadow: 0 28px 70px rgba(1, 5, 15, .72);
}

body.design-theme-spectral-manor :is(.modal-overlay, .owner-settings-overlay, .owner-storage-overlay) { background: rgba(2, 8, 21, .78); backdrop-filter: blur(8px); }
body.design-theme-spectral-manor .owner-top-controls { --control-surface: rgba(7, 20, 36, .95); --control-line: rgba(166, 219, 229, .55); }
body.design-theme-spectral-manor .owner-theme-form .theme-picker {
  --picker-surface: #0d2034;
  --picker-hover: #254259;
  --picker-ink: #effaff;
  --picker-line: rgba(166, 219, 229, .55);
  --picker-accent: #91d6db;
  --picker-selected-ink: #091726;
}
.theme-picker-menu [data-theme="spectral-manor"], .owner-theme-form [data-theme="spectral-manor"] { --option-color: #9de5ea; }
body.design-theme-spectral-manor .owner-maintenance-status { background: rgba(9, 38, 49, .93); border-color: rgba(150, 216, 221, .5); }
body.design-theme-spectral-manor .sales-meta-chip { background: #1b3145; border-color: var(--spectral-line); color: var(--text); }
body.design-theme-spectral-manor .sales-meta-chip strong { color: #9de5ea; }

body.design-theme-spectral-manor .sib-set-filter-toggle {
  background: rgba(8, 21, 36, .96);
  border: 1px solid var(--spectral-line);
  border-radius: 8px;
}
body.design-theme-spectral-manor .sib-set-filter-toggle-pill { background: #35536a; }
body.design-theme-spectral-manor .sib-set-filter-toggle-knob { background: #e6f6f8; }
body.design-theme-spectral-manor .sib-set-filter-toggle input:checked + .sib-set-filter-toggle-pill { background: #75bfc8; }
body.design-theme-spectral-manor .sib-set-filter-toggle-label { color: #b9e6eb; }
body.design-theme-spectral-manor .owner-maintenance-toggle-button.disabled .owner-maintenance-toggle-pill { background: #35536a; }
body.design-theme-spectral-manor .owner-maintenance-toggle-button.enabled .owner-maintenance-toggle-pill { background: #75bfc8; }
body.design-theme-spectral-manor .owner-maintenance-toggle-knob { background: #e6f6f8; }

body.design-theme-spectral-manor .owner-admin-button-row :is(.owner-admin-panel-toggle, .owner-admin-danger-button, .owner-sort-select-inline) {
  box-sizing: border-box;
  height: 44px;
  min-height: 44px;
  padding-block: 0;
}
body.design-theme-spectral-manor .owner-admin-button-row .owner-admin-danger-button {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.1;
}

body.design-theme-spectral-manor #search-bar-container {
  box-sizing: border-box;
  padding: 8px 10px;
}

body.design-theme-spectral-manor #search-bar-container > :is(#search-button, #copy-link-button, #reset-dropdowns-button) {
  box-sizing: border-box;
  height: 38px;
  min-height: 38px;
  margin: 0;
  padding: 0 13px;
  border-radius: 8px;
  font: 700 .78rem/1 'DM Sans', sans-serif;
  white-space: nowrap;
}

@media (max-width: 700px) {
  body.design-theme-spectral-manor { background-size: cover, auto 100vh; }
  body.design-theme-spectral-manor #bundles { padding-inline: 12px; }
  body.design-theme-spectral-manor::after { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  body.design-theme-spectral-manor::before,
  body.design-theme-spectral-manor::after { animation: none; }
}

body.design-theme-spectral-manor.sib-set-add-mode #bundles {
  width: calc(100% - min(30vw, 580px) - 32px);
  max-width: none;
  margin-left: 0;
  margin-right: auto;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (max-width: 900px) {
  body.design-theme-spectral-manor.sib-set-add-mode #bundles {
    width: 100%;
    margin-inline: auto;
  }
}
