/* CloudAI007 lightweight theme overlay. Served by nginx, injected into New API HTML. */
:root {
  --cloudai-bg-0: #02040c;
  --cloudai-bg-1: #06152d;
  --cloudai-bg-2: #220842;
  --cloudai-cyan: #22d7ff;
  --cloudai-blue: #1677ff;
  --cloudai-violet: #9b5cff;
  --cloudai-pink: #ff4fd8;
  --cloudai-text: #f4fbff;
  --cloudai-muted: #9fb7d6;
  --cloudai-border: rgba(90, 220, 255, 0.26);
  --cloudai-glass: rgba(7, 15, 35, 0.72);
}

html,
body {
  background: var(--cloudai-bg-0) !important;
}

body:has(.public-page-content) {
  color: var(--cloudai-text);
}

.semi-layout-header > header {
  background: rgba(3, 7, 18, 0.76) !important;
  border-bottom: 1px solid rgba(88, 210, 255, 0.18);
  box-shadow: 0 14px 42px rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(22px) saturate(1.4);
}

.semi-layout-header h4,
.semi-layout-header nav a,
.semi-layout-header .semi-button,
.semi-layout-header .semi-icon,
.semi-layout-header .semi-button-content,
.semi-layout-header .semi-button-content span {
  color: var(--cloudai-text) !important;
  opacity: 1 !important;
}

.semi-layout-header nav a {
  border: 1px solid transparent;
}

.semi-layout-header nav a:hover {
  color: #7ee9ff !important;
  background: rgba(34, 215, 255, 0.08);
  border-color: rgba(34, 215, 255, 0.18);
  box-shadow: 0 0 20px rgba(34, 215, 255, 0.12);
}

.semi-layout-header .semi-button {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.semi-layout-header .semi-button:hover {
  background: rgba(34, 215, 255, 0.14) !important;
  border-color: rgba(34, 215, 255, 0.3) !important;
}

.semi-layout-header a[href="/login"] .semi-button {
  color: #eafcff !important;
  background: rgba(126, 233, 255, 0.11) !important;
  border: 1px solid rgba(126, 233, 255, 0.22) !important;
  box-shadow: 0 0 18px rgba(34, 215, 255, 0.1);
}

.semi-layout-header a[href="/login"] .semi-button * {
  color: #eafcff !important;
}

.semi-layout-header .semi-button-primary.semi-button-solid {
  background: linear-gradient(135deg, var(--cloudai-cyan), var(--cloudai-blue) 48%, var(--cloudai-violet)) !important;
  border-color: rgba(126, 233, 255, 0.5) !important;
  box-shadow: 0 0 24px rgba(34, 215, 255, 0.24);
}

.semi-layout-header img[alt="logo"] {
  border-radius: 12px !important;
  box-shadow: 0 0 0 1px rgba(126, 233, 255, 0.35), 0 0 22px rgba(34, 215, 255, 0.35);
}

.public-page-content,
.public-page-content .classic-page-fill {
  background:
    linear-gradient(135deg, rgba(2, 4, 12, 0.98) 0%, rgba(6, 21, 45, 0.98) 46%, rgba(34, 8, 66, 0.98) 100%) !important;
  color: var(--cloudai-text) !important;
}

.public-page-content .classic-page-fill {
  position: relative;
  isolation: isolate;
  min-height: 100vh;
}

.public-page-content .classic-page-fill::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(34, 215, 255, 0.075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(155, 92, 255, 0.075) 1px, transparent 1px),
    linear-gradient(120deg, transparent 0%, rgba(34, 215, 255, 0.1) 38%, rgba(255, 79, 216, 0.12) 62%, transparent 100%);
  background-size: 72px 72px, 72px 72px, 100% 100%;
  mask-image: linear-gradient(to bottom, transparent 0%, black 18%, black 82%, transparent 100%);
}

.public-page-content .classic-page-fill::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 50% 8%, rgba(34, 215, 255, 0.18), transparent 38%),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.02), transparent 38%);
}

.public-page-content .blur-ball {
  display: none !important;
}

.classic-home-hero {
  border-bottom-color: rgba(34, 215, 255, 0.18) !important;
  min-height: calc(100vh - 48px);
}

.classic-home-hero h1,
.public-page-content h1,
.public-page-content h2,
.public-page-content h3,
.public-page-content h4,
.public-page-content .semi-typography {
  color: var(--cloudai-text) !important;
}

.classic-home-hero h1 {
  text-shadow: 0 0 30px rgba(34, 215, 255, 0.18), 0 0 54px rgba(155, 92, 255, 0.14);
}

.classic-home-hero .shine-text,
.public-page-content .shine-text {
  color: transparent !important;
  background: linear-gradient(95deg, #ffffff 0%, #7ee9ff 36%, #9b5cff 68%, #ff76dd 100%);
  -webkit-background-clip: text;
  background-clip: text;
  text-shadow: none;
}

.public-page-content p,
.public-page-content .text-semi-color-text-1,
.public-page-content .text-gray-600,
.public-page-content .text-gray-800 {
  color: var(--cloudai-muted) !important;
}

.public-page-content .semi-input-wrapper {
  color: var(--cloudai-text) !important;
  background: rgba(4, 12, 28, 0.72) !important;
  border: 1px solid rgba(126, 233, 255, 0.2) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02), 0 0 26px rgba(34, 215, 255, 0.08);
  backdrop-filter: blur(16px);
}

.public-page-content .semi-input,
.public-page-content input,
.public-page-content textarea {
  color: var(--cloudai-text) !important;
  caret-color: var(--cloudai-cyan);
}

.public-page-content .semi-input::placeholder,
.public-page-content input::placeholder,
.public-page-content textarea::placeholder {
  color: rgba(198, 222, 255, 0.54) !important;
}

.public-page-content .semi-input-prefix,
.public-page-content .semi-input-suffix,
.public-page-content .semi-icon {
  color: rgba(126, 233, 255, 0.78) !important;
}

.public-page-content .semi-card {
  color: var(--cloudai-text) !important;
  background:
    linear-gradient(180deg, rgba(12, 25, 54, 0.82), rgba(5, 10, 24, 0.78)) !important;
  border: 1px solid var(--cloudai-border) !important;
  border-radius: 22px !important;
  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.42),
    0 0 54px rgba(34, 215, 255, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(24px) saturate(1.35);
}

.public-page-content .semi-form-field-label,
.public-page-content .semi-form-field-label-text {
  color: rgba(230, 246, 255, 0.92) !important;
  font-weight: 650;
}

.public-page-content a {
  color: #7ee9ff !important;
}

.public-page-content a:hover {
  color: #ff8bea !important;
}

.public-page-content .semi-button-primary.semi-button-solid,
.public-page-content .semi-button-primary:not(.semi-button-light):not(.semi-button-borderless) {
  color: #ffffff !important;
  background: linear-gradient(135deg, var(--cloudai-cyan), var(--cloudai-blue) 46%, var(--cloudai-violet) 78%, var(--cloudai-pink)) !important;
  border: 1px solid rgba(126, 233, 255, 0.42) !important;
  box-shadow: 0 16px 38px rgba(22, 119, 255, 0.32), 0 0 26px rgba(34, 215, 255, 0.24);
}

.public-page-content .semi-button-primary.semi-button-solid:hover,
.public-page-content .semi-button-primary:not(.semi-button-light):not(.semi-button-borderless):hover {
  transform: translateY(-1px);
  box-shadow: 0 20px 48px rgba(155, 92, 255, 0.34), 0 0 34px rgba(34, 215, 255, 0.3);
}

.public-page-content .semi-button-light,
.public-page-content .semi-button-tertiary {
  color: #bfefff !important;
  background: rgba(126, 233, 255, 0.1) !important;
  border: 1px solid rgba(126, 233, 255, 0.18) !important;
}

.public-page-content .semi-button-light:hover,
.public-page-content .semi-button-tertiary:hover {
  background: rgba(155, 92, 255, 0.16) !important;
  border-color: rgba(255, 118, 221, 0.24) !important;
}

.classic-home-hero .semi-input-wrapper-large {
  border-radius: 999px !important;
}

.classic-home-hero .semi-scrolllist,
.classic-home-hero .semi-scrolllist-body,
.classic-home-hero .semi-scrolllist-selector {
  background: transparent !important;
  color: #7ee9ff !important;
}

.classic-home-hero img,
.classic-home-hero svg {
  filter: drop-shadow(0 0 10px rgba(34, 215, 255, 0.22));
}

.classic-home-hero main img,
.classic-home-hero img[alt="logo"] {
  filter: none;
}

.public-page-content footer,
.public-page-content .classic-home-page + div {
  color: rgba(198, 222, 255, 0.72) !important;
}

@media (max-width: 768px) {
  .semi-layout-header > header {
    background: rgba(3, 7, 18, 0.88) !important;
  }

  .classic-home-hero {
    min-height: auto;
  }

  .classic-home-hero h1 {
    font-size: clamp(2.25rem, 10.8vw, 3.25rem) !important;
    line-height: 1.02 !important;
  }

  .classic-home-hero .shine-text {
    white-space: nowrap;
  }

  .public-page-content .classic-page-fill::before {
    background-size: 48px 48px, 48px 48px, 100% 100%;
  }
}
