:root {
  --vindev-cuba-bg: #f8f9fc;
  --vindev-cuba-surface: #ffffff;
  --vindev-cuba-surface-soft: #f4f6fb;
  --vindev-cuba-border: #e8e9f1;
  --vindev-cuba-text: #2b2b2b;
  --vindev-cuba-muted: #7d8493;
  color-scheme: light;
}

html.vindev-public-dark {
  --vindev-cuba-bg: #1d2029;
  --vindev-cuba-surface: #252936;
  --vindev-cuba-surface-soft: #20242e;
  --vindev-cuba-border: #3b4351;
  --vindev-cuba-text: #eef2f7;
  --vindev-cuba-muted: #9ca8ba;
  color-scheme: dark;
}

.vindev-public-theme-toggle {
  display: inline-grid;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  place-items: center;
  padding: 0;
  border: 1px solid #dde1eb;
  border-radius: 12px;
  color: #5f6676;
  background: #fff;
  box-shadow: 0 7px 20px rgba(31, 35, 48, .08);
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease, color .2s ease, transform .2s ease;
}

.vindev-public-theme-toggle:hover,
.vindev-public-theme-toggle:focus-visible {
  border-color: #bdb6ff;
  color: #5b50d4;
  background: #f5f3ff;
  outline: none;
  transform: translateY(-1px);
}

.vindev-public-theme-icon {
  width: 18px;
  height: 18px;
}

.vindev-public-theme-icon-sun,
.vindev-public-logo-dark {
  display: none;
}

html.vindev-public-dark .vindev-public-theme-icon-moon,
html.vindev-public-dark .vindev-public-logo-light {
  display: none;
}

html.vindev-public-dark .vindev-public-theme-icon-sun,
html.vindev-public-dark .vindev-public-logo-dark {
  display: block;
}

html.vindev-public-dark .vindev-public-theme-toggle {
  border-color: #3b4351;
  color: #cbd5e1;
  background: #252936;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .24);
}

html.vindev-public-dark .vindev-public-theme-toggle:hover,
html.vindev-public-dark .vindev-public-theme-toggle:focus-visible {
  border-color: #5f6b80;
  color: #8db5ff;
  background: #303642;
}

.public-project-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 24px;
}

.public-project-toolbar .public-back-link {
  margin: 0 !important;
}

.public-project-brand {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
  color: var(--vindev-cuba-text);
  text-decoration: none;
}

.public-project-brand:hover,
.public-project-brand:focus-visible {
  color: #7366ff;
  text-decoration: none;
}

.public-project-brand > span {
  display: grid;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  place-items: center;
  border-radius: 13px;
  color: #fff;
  background: linear-gradient(135deg, #7366ff, #554ad4);
  box-shadow: 0 10px 24px rgba(85, 74, 212, .25);
  font-weight: 900;
}

.public-project-brand strong {
  overflow: hidden;
  color: inherit;
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.public-project-brand .vindev-public-logo,
.cp-public-brand .cp-theme-logo {
  width: auto;
  max-width: 148px;
  height: 40px;
  flex: 0 1 auto;
  border-radius: 0;
  object-fit: contain;
}

.public-project-brand .vindev-public-logo-light,
.cp-public-brand .vindev-public-logo-light {
  display: block;
}

.public-project-brand .vindev-public-logo-dark,
.cp-public-brand .vindev-public-logo-dark {
  display: none;
}

html.vindev-public-dark .public-project-brand .vindev-public-logo-light,
html.vindev-public-dark .cp-public-brand .vindev-public-logo-light {
  display: none;
}

html.vindev-public-dark .public-project-brand .vindev-public-logo-dark,
html.vindev-public-dark .cp-public-brand .vindev-public-logo-dark {
  display: block;
}

.public-project-brand.has-logo strong,
.cp-public-brand.has-logo strong {
  display: none;
}

.cp-public-brand {
  min-width: 0;
}

.cp-public-brand.has-logo {
  gap: 0;
}

.cp-public-nav-actions {
  flex: 0 0 auto;
}

html.vindev-public-dark .public-project-card .alert-secondary {
  border-color: #424b5c;
  color: #cbd5e1;
  background: #20242e;
}

html.vindev-public-dark .public-project-card .btn-outline-primary {
  border-color: #7366ff;
  color: #a9a1ff;
}

html.vindev-public-dark .public-project-card .btn-outline-primary:hover,
html.vindev-public-dark .public-project-card .btn-outline-primary:focus-visible {
  color: #fff;
  background: #7366ff;
}

html.vindev-public-dark .cp-public-body {
  color: #d9e0ea;
  background: radial-gradient(circle at 15% 0, rgba(115, 102, 255, .18), transparent 30%), radial-gradient(circle at 90% 12%, rgba(56, 189, 248, .08), transparent 30%), #1d2029;
}

html.vindev-public-dark .cp-public-nav {
  border-bottom-color: rgba(59, 67, 81, .9);
  background: rgba(29, 32, 41, .88);
  box-shadow: 0 10px 35px rgba(0, 0, 0, .16);
}

html.vindev-public-dark .cp-public-brand,
html.vindev-public-dark .cp-public-brand strong {
  color: #eef2f7;
}

html.vindev-public-dark .cp-public-nav-actions a:not(.cp-public-nav-button) {
  color: #aab4c3;
}

html.vindev-public-dark .cp-public-nav-actions a:not(.cp-public-nav-button):hover,
html.vindev-public-dark .cp-public-nav-actions a:not(.cp-public-nav-button):focus-visible {
  color: #8db5ff;
}

html.vindev-public-dark .cp-public-lookup-card {
  border-color: rgba(143, 154, 175, .22);
  box-shadow: 0 30px 80px rgba(0, 0, 0, .32);
}

html.vindev-public-dark .cp-public-search-input {
  border: 1px solid #424b5c;
  background: #1d2029;
}

html.vindev-public-dark .cp-public-search-input input {
  color: #eef2f7;
  -webkit-text-fill-color: #eef2f7;
}

html.vindev-public-dark .cp-public-search-input input::placeholder {
  color: #7f8b9e;
  -webkit-text-fill-color: #7f8b9e;
}

html.vindev-public-dark .cp-public-search-input > svg {
  color: #9ca8ba;
}

html.vindev-public-dark .cp-public-project-head,
html.vindev-public-dark .cp-stage-track,
html.vindev-public-dark .cp-panel,
html.vindev-public-dark .cp-public-how-grid article {
  border-color: #3b4351;
  background: #252936;
  box-shadow: 0 16px 46px rgba(0, 0, 0, .22);
}

html.vindev-public-dark .cp-public-project-head h2,
html.vindev-public-dark .cp-panel-head h3,
html.vindev-public-dark .cp-public-how-grid strong,
html.vindev-public-dark .cp-timeline-top strong,
html.vindev-public-dark .cp-empty-state h3 {
  color: #eef2f7;
}

html.vindev-public-dark .cp-public-project-head p,
html.vindev-public-dark .cp-panel-head p,
html.vindev-public-dark .cp-public-how-grid p,
html.vindev-public-dark .cp-timeline-top small,
html.vindev-public-dark .cp-timeline-card p {
  color: #9ca8ba;
}

html.vindev-public-dark .cp-public-project-head code {
  color: #a9a1ff;
}

html.vindev-public-dark .cp-public-copy-button {
  border-color: #4a5162;
  color: #b8b2ff;
  background: #303642;
}

html.vindev-public-dark .cp-public-copy-button:hover,
html.vindev-public-dark .cp-public-copy-button:focus-visible {
  border-color: #7366ff;
  color: #fff;
  background: #4f46c8;
}

html.vindev-public-dark .cp-stage-step {
  color: #8f9bad;
}

html.vindev-public-dark .cp-stage-step:not(:last-child)::after {
  background: #424b5c;
}

html.vindev-public-dark .cp-stage-step span {
  border-color: #4a5364;
  color: #b7c0cd;
  background: #20242e;
}

html.vindev-public-dark .cp-stage-step.is-active:not(:last-child)::after {
  background: #8175ef;
}

html.vindev-public-dark .cp-panel-head {
  border-bottom-color: #3b4351;
}

html.vindev-public-dark .cp-count-pill,
html.vindev-public-dark .cp-stage-mini,
html.vindev-public-dark .cp-update-meta span {
  color: #b8b2ff;
  background: #36324f;
}

html.vindev-public-dark .cp-timeline::before {
  background: #41495a;
}

html.vindev-public-dark .cp-timeline-marker {
  border-color: #252936;
  box-shadow: 0 0 0 2px #4b456f;
}

html.vindev-public-dark .cp-timeline-card,
html.vindev-public-dark .cp-empty-state {
  border-color: #3b4351;
  background: #20242e;
}

html.vindev-public-dark .cp-empty-state {
  color: #9ca8ba;
}

html.vindev-public-dark .cp-update-attachment {
  border-color: #4a456c;
  color: #c3beff;
  background: #302d45;
}

html.vindev-public-dark .cp-update-attachment:hover,
html.vindev-public-dark .cp-update-attachment:focus-visible {
  color: #fff;
  background: #3d385c;
}

html.vindev-public-dark .cp-update-attachment small {
  color: #9994bd;
}

html.vindev-public-dark .cp-public-privacy-note {
  border-color: #36594d;
  color: #9ed8bf;
  background: #20352f;
}

html.vindev-public-dark .cp-public-how-grid article > span {
  color: #c2bcff;
  background: #38334f;
}

html.vindev-public-dark .cp-payment-gate {
  border-color: #5e5135;
  background: linear-gradient(145deg, #2d2a24, #342d20);
  box-shadow: 0 14px 34px rgba(0, 0, 0, .22);
}

html.vindev-public-dark .cp-payment-gate h2 {
  color: #f4ead2;
}

html.vindev-public-dark .cp-payment-gate p {
  color: #c6bda9;
}

html.vindev-public-dark .cp-public-status-block span,
html.vindev-public-dark .cp-public-status-block small {
  color: #d5b978;
}

html.vindev-public-dark .cp-public-footer {
  color: #778295;
}

@media (max-width: 575.98px) {
  .public-project-toolbar {
    align-items: center;
  }

  .public-project-brand .vindev-public-logo,
  .cp-public-brand .cp-theme-logo {
    max-width: 112px;
    height: 36px;
  }

  .cp-public-nav-actions {
    gap: 8px;
  }

  .cp-public-nav-home {
    display: none;
  }

  .cp-public-nav-actions .cp-public-nav-button {
    padding: 9px 12px;
  }
}
