/* src/styles.css */
:root {
  --brand-magenta: #eb00dc;
  --brand-purple: #7900d5;
  --brand-indigo: #2400a5;
  --brand-gradient:
    linear-gradient(
      135deg,
      var(--brand-magenta),
      var(--brand-purple) 54%,
      var(--brand-indigo));
  --brand-soft: #f5efff;
  --page-background: #faf9ff;
  --surface: #ffffff;
  --surface-raised: #fcfaff;
  --text-primary: #11152f;
  --text-secondary: #666b82;
  --border: #e8e8f1;
  --success: #18864b;
  --success-soft: #e7f5ed;
  --warning: #9a6100;
  --warning-soft: #fff4d6;
  --info: #5b4bcc;
  --info-soft: #eeecff;
  --danger: #c93c55;
  --danger-soft: #fcecef;
  --action: #b45400;
  --action-soft: #ffe8cc;
  --focus-ring: rgba(121, 0, 213, 0.22);
  --shadow-sm: 0 1px 2px rgba(35, 20, 55, 0.07);
  --shadow-lg: 0 16px 40px rgba(38, 0, 90, 0.16);
}
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
html,
body {
  height: 100%;
  font-family:
    Inter,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Oxygen,
    Ubuntu,
    Cantarell,
    sans-serif;
  background: var(--page-background);
  color: var(--text-primary);
}
button,
input,
select,
textarea {
  font: inherit;
}
button,
a {
  -webkit-tap-highlight-color: transparent;
}
:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 2px;
}
::selection {
  background: #e8d0fa;
  color: var(--text-primary);
}
:root[data-theme=dark] {
  --brand-purple: #a83be0;
  --brand-indigo: #6552ff;
  --brand-soft: #2c193f;
  --page-background: #100b18;
  --surface: #191221;
  --surface-raised: #22182d;
  --text-primary: #f5f0f8;
  --text-secondary: #bdb2c7;
  --border: #3a2b46;
  --success: #58d68d;
  --success-soft: #173526;
  --warning: #f6c85f;
  --warning-soft: #3a2d13;
  --info: #a99cff;
  --info-soft: #292347;
  --danger: #ff8293;
  --danger-soft: #3b1c28;
  --action: #ffb15c;
  --action-soft: #3d2a10;
  --focus-ring: rgba(207, 92, 255, .35);
  --shadow-sm: 0 1px 4px rgba(0, 0, 0, .32);
  --shadow-lg: 0 24px 60px rgba(0, 0, 0, .45);
}
:root[data-theme=dark] body {
  background: var(--page-background);
  color: var(--text-primary);
}
:root[data-theme=dark] :is(.topbar, .stat-card, .projects-table-wrap, .project-card, .header-card, .info-card, .section-card, .staging-card, .loading-state, .error-state, .modal-content, .blueprint-modal, .auth-card, .upload-section, .file-info, .related-item, .review-panel, .branding-panel, .preset-swatch, .processing-card) {
  background-color: var(--surface) !important;
  color: var(--text-primary) !important;
  border-color: var(--border) !important;
  box-shadow: var(--shadow-sm) !important;
}
:root[data-theme=dark] .approval-banner {
  background: var(--action-soft) !important;
  border-color: var(--action) !important;
}
:root[data-theme=dark] :is(.review-header, .branding-title, .round-label) {
  color: var(--text-primary) !important;
}
:root[data-theme=dark] :is(h1, h2, h3, h4, h5, .project-name, .stat-number, .detail-value, .value, label) {
  color: var(--text-primary) !important;
}
:root[data-theme=dark] :is(p, .subtitle, .welcome-sub, .stat-label, .detail-label, .label, .date-cell, .topbar-user, .hint) {
  color: var(--text-secondary) !important;
}
:root[data-theme=dark] :is(input, select, textarea) {
  background: #15101f !important;
  color: var(--text-primary) !important;
  border-color: var(--border) !important;
}
:root[data-theme=dark] :is(.projects-table th, .source-table th, .modal-table th) {
  background: #241a30 !important;
  color: var(--text-secondary) !important;
  border-color: var(--border) !important;
}
:root[data-theme=dark] :is(.projects-table td, .source-table td, .modal-table td, .section-header, .collapsible, .collapsible-body) {
  border-color: var(--border) !important;
}
:root[data-theme=dark] :is(.projects-table tr:hover td, .project-card:hover, .section-header:hover, .file-item:hover) {
  background-color: #251a31 !important;
}
:root[data-theme=dark] :is(.btn-outline, .btn-back, .btn-link, .modal-tab, .blueprint-modal-close) {
  color: #d89cff !important;
}
:root[data-theme=dark] .collapsible-header {
  background: #241a30 !important;
  color: var(--text-primary) !important;
}
:root[data-theme=dark] .profile-popover {
  background: var(--surface);
  border-color: var(--border);
}
:root[data-theme=dark] ::selection {
  background: #6f288f;
  color: #fff;
}
body {
  line-height: 1.5;
  transition: background-color .18s ease, color .18s ease;
}
.page-content > * {
  display: block;
  width: 100%;
  max-width: 1440px;
  margin-inline: auto;
}
:is(.stat-card, .projects-table-wrap, .project-card, .header-card, .info-card, .section-card, .staging-card, .loading-state, .empty-state, .error-state, .modal-content, .blueprint-modal, .auth-card, .upload-section, .file-info, .related-item, .form-card, .config-card, .summary-card) {
  background: var(--surface) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  box-shadow: var(--shadow-sm) !important;
}
:is(h1, h2, h3, h4, h5, h6, .project-name, .stat-number, .detail-value, .value) {
  color: var(--text-primary) !important;
}
:is(p, .subtitle, .welcome-sub, .stat-label, .detail-label, .label, .date-cell, .hint, .project-id) {
  color: var(--text-secondary) !important;
}
:is(input, select, textarea) {
  background: var(--surface) !important;
  color: var(--text-primary) !important;
  border-color: var(--border) !important;
  border-radius: 6px !important;
}
:is(input, select, textarea):focus {
  border-color: var(--brand-purple) !important;
  box-shadow: 0 0 0 3px var(--focus-ring) !important;
}
:is(.btn-primary, .btn-download, .btn-submit, .btn-generate, .btn-create, .btn-add, .btn-deploy) {
  background: var(--brand-purple) !important;
  border: 1px solid var(--brand-purple) !important;
  color: #fff !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}
button:disabled {
  cursor: not-allowed !important;
  opacity: .58 !important;
}
:is(.btn, .btn-primary, .btn-success, .btn-danger, .btn-outline, .btn-secondary, .btn-run, .btn-stop, .btn-open, .btn-download, .btn-retry, .btn-create, .btn-generate, .btn-add, .btn-deploy, .btn-remove, .btn-docker-run, .btn-docker-stop, .btn-docker-logs, .btn-open-app) {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 18px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  box-sizing: border-box !important;
}
:is(.btn-sm, .btn-delete, .btn-delete-sm, .btn-docker-run-sm, .btn-docker-stop-sm) {
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 12px !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  border-radius: 5px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  box-sizing: border-box !important;
}
:is(.btn-lg, .btn-large, .btn-create-lg, .btn-new-project, .btn-submit) {
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 26px !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  border-radius: 7px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  box-sizing: border-box !important;
}
:is(.step, .stack-step) {
  background: var(--surface) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  box-shadow: var(--shadow-sm) !important;
}
.step.completed {
  border-left: 4px solid var(--success) !important;
}
.step-num {
  background: var(--brand-purple) !important;
}
.upload-area {
  background: var(--surface-raised) !important;
  border-color: #bda8cc !important;
}
.upload-area.drag-over {
  background: var(--brand-soft) !important;
  border-color: var(--brand-purple) !important;
}
.tech-card {
  background: var(--surface) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border) !important;
  border-radius: 7px !important;
}
.tech-card:hover {
  background: var(--brand-soft) !important;
  border-color: #b88ad6 !important;
}
:is(.tech-card.selected-blue, .tech-card.selected-green) {
  background: var(--brand-soft) !important;
  border: 2px solid var(--brand-purple) !important;
}
:is(.tech-card-label, .tech-section-title, .version-label, .selected-stack-label) {
  color: var(--text-primary) !important;
}
.tech-card-subtitle {
  color: var(--text-secondary) !important;
  font-style: normal !important;
}
:is(.source-app-box, .selected-stack-box, .summary) {
  background: var(--surface-raised) !important;
  border: 1px solid var(--border);
}
.btn-success {
  background: var(--brand-purple) !important;
  color: #fff !important;
}
:is(.btn-primary, .btn-download, .btn-submit, .btn-generate, .btn-create, .btn-add, .btn-deploy):hover:not(:disabled) {
  background: #6200b4 !important;
  border-color: #6200b4 !important;
  transform: none !important;
}
:is(.btn-secondary, .btn-outline, .btn-back, .btn-cancel, .btn-link) {
  background: transparent !important;
  color: var(--brand-purple) !important;
  border-color: var(--brand-purple) !important;
  box-shadow: none !important;
}
:is(.projects-table, .source-table, .modal-table) th {
  background: var(--surface-raised) !important;
  color: var(--text-secondary) !important;
  border-color: var(--border) !important;
}
:is(.projects-table, .source-table, .modal-table) td {
  border-color: var(--border) !important;
}
:is(.projects-table, .source-table, .modal-table) tr:hover td {
  background: var(--brand-soft) !important;
}
.pill-completed {
  background: var(--success-soft) !important;
  color: var(--success) !important;
}
.pill-processing {
  background: var(--info-soft) !important;
  color: var(--info) !important;
}
.pill-pending {
  background: var(--warning-soft) !important;
  color: var(--warning) !important;
}
.pill-awaiting_approval {
  background: var(--action-soft) !important;
  color: var(--action) !important;
}
.pill-failed {
  background: var(--danger-soft) !important;
  color: var(--danger) !important;
}
.pill-completed .pill-dot {
  background: var(--success) !important;
}
.pill-processing .pill-dot {
  background: var(--info) !important;
}
.pill-pending .pill-dot {
  background: var(--warning) !important;
}
.pill-awaiting_approval .pill-dot {
  background: var(--action) !important;
}
.pill-failed .pill-dot {
  background: var(--danger) !important;
}
.approval-banner {
  background: var(--action-soft) !important;
  border: 1px solid var(--action) !important;
  border-radius: 8px !important;
}
.approval-banner-text strong {
  color: var(--action) !important;
}
:is(.review-panel, .branding-panel, .preset-swatch) {
  background: var(--surface) !important;
  border-color: var(--border) !important;
}
.review-header,
.branding-title {
  color: var(--text-primary) !important;
}
.preset-swatch.selected {
  border-color: var(--brand-purple) !important;
}
:root[data-theme=dark] :is(.btn-primary, .btn-download, .btn-submit, .btn-generate, .btn-create, .btn-add, .btn-deploy) {
  background: #a43ad2 !important;
  border-color: #a43ad2 !important;
}
:root[data-theme=dark] :is(.btn-primary, .btn-download, .btn-submit, .btn-generate, .btn-create, .btn-add, .btn-deploy):hover:not(:disabled) {
  background: #b74ce5 !important;
  border-color: #b74ce5 !important;
}
:root[data-theme=dark] :is(.btn-secondary, .btn-outline, .btn-back, .btn-cancel, .btn-link) {
  color: #d89cff !important;
  border-color: #9d56bd !important;
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* angular:styles/global:styles */
/*# sourceMappingURL=styles.css.map */
