@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");

:root {
  color-scheme: dark;
  --app-bg: #0b1118;
  --app-bg-accent: #111a25;
  --app-surface: #121a24;
  --app-surface-2: #182231;
  --app-surface-3: #1f2b3d;
  --app-border: #29384d;
  --app-border-strong: #38506b;
  --app-text: #edf3fb;
  --app-text-soft: #a8b6cb;
  --app-text-dim: #7f90a8;
  --app-accent: #62a7ff;
  --app-accent-strong: #3d8fff;
  --app-good: #34d399;
  --app-warn: #f59e0b;
  --app-danger: #fb7185;
  --app-shadow: 0 18px 40px rgba(2, 8, 20, 0.36);
  --app-radius: 14px;
  --app-font: "Inter", "Aptos", "Segoe UI", "SF Pro Text", system-ui, sans-serif;
}

html,
body {
  background:
    radial-gradient(circle at top left, rgba(98, 167, 255, 0.12), transparent 28%),
    radial-gradient(circle at top right, rgba(52, 211, 153, 0.08), transparent 22%),
    linear-gradient(180deg, var(--app-bg-accent) 0%, var(--app-bg) 18%, #081018 100%) !important;
  color: var(--app-text) !important;
  font-family: var(--app-font) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

* {
  scrollbar-color: var(--app-border-strong) var(--app-surface);
}

::selection {
  background: rgba(98, 167, 255, 0.32);
  color: #ffffff;
}

a,
a:visited,
.link-cell {
  color: #9fcbff !important;
}

a:hover,
.link-cell:hover {
  color: #d3e7ff !important;
}

.card,
.modal,
.report-card,
.quotesPanel,
.rfqSection,
.pill,
.report-table-wrap,
table,
#footer,
header {
  background: rgba(18, 26, 36, 0.92) !important;
  color: var(--app-text) !important;
  border-color: var(--app-border) !important;
  box-shadow: var(--app-shadow);
  backdrop-filter: blur(10px);
}

.card,
.modal,
.report-card,
.quotesPanel,
.rfqSection,
.pill {
  border-radius: var(--app-radius) !important;
}

.muted,
.small,
.hint,
label,
th,
.selCount,
#subhdr,
#msg {
  color: var(--app-text-soft) !important;
}

.typeTag {
  background: rgba(98, 167, 255, 0.16) !important;
  color: #dbeafe !important;
}

input,
select,
textarea,
button,
.btn {
  font-family: var(--app-font) !important;
}

input,
select,
textarea {
  background: rgba(17, 24, 36, 0.96) !important;
  color: var(--app-text) !important;
  border: 1px solid var(--app-border) !important;
  border-radius: 12px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

select,
select.btn {
  appearance: auto;
  -webkit-appearance: menulist;
  background-color: #182231 !important;
  color: var(--app-text) !important;
}

select option,
select optgroup {
  background: #121a24 !important;
  color: #edf3fb !important;
}

input::placeholder,
textarea::placeholder {
  color: var(--app-text-dim) !important;
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--app-accent) !important;
  box-shadow:
    0 0 0 3px rgba(98, 167, 255, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.02) !important;
}

button,
.btn,
a.btn,
input[type="button"],
input[type="submit"] {
  background: linear-gradient(180deg, #1a2635 0%, #121b27 100%) !important;
  color: var(--app-text) !important;
  border: 1px solid var(--app-border-strong) !important;
  border-radius: 12px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 8px 20px rgba(3, 10, 25, 0.28) !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
  transition:
    transform 120ms ease,
    border-color 120ms ease,
    box-shadow 120ms ease,
    background 120ms ease;
}

button:hover,
.btn:hover,
a.btn:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
  transform: translateY(-1px);
  border-color: #4b6686 !important;
  background: linear-gradient(180deg, #223145 0%, #162233 100%) !important;
  filter: none !important;
}

button:active,
.btn:active,
a.btn:active {
  transform: translateY(0);
}

button:disabled,
.btn:disabled {
  opacity: 0.55 !important;
  box-shadow: none !important;
}

.btn.primary,
button.primary,
a.btn.primary {
  background: linear-gradient(180deg, #4f9bff 0%, #337de0 100%) !important;
  border-color: #6fb0ff !important;
  color: #f8fbff !important;
}

.btn.good,
button.good {
  background: linear-gradient(180deg, #1db980 0%, #119f6b 100%) !important;
  border-color: #52d8aa !important;
  color: #f3fffb !important;
}

.btn.warn,
.btn.danger,
button.warn,
button.danger {
  background: linear-gradient(180deg, #3b1921 0%, #271117 100%) !important;
  border-color: #7f2f3e !important;
  color: #ffd8df !important;
}

.btn.softWarn,
button.softWarn {
  background: linear-gradient(180deg, #51311b 0%, #392112 100%) !important;
  border-color: #8a5b2c !important;
  color: #ffe8bf !important;
}

@media print {
  html,
  body {
    background: #ffffff !important;
    color: #111111 !important;
  }

  .card,
  .modal,
  .report-card,
  .quotesPanel,
  .rfqSection,
  .pill,
  .report-table-wrap,
  table,
  #footer,
  header,
  .rfqTable,
  .reportTable,
  .meetingTable {
    background: #ffffff !important;
    color: #111111 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    border-color: #d1d5db !important;
  }

  .muted,
  .small,
  .hint,
  label,
  th,
  td,
  .selCount,
  #subhdr,
  #msg,
  a,
  a:visited,
  .link-cell {
    color: #111111 !important;
  }

  input,
  select,
  textarea {
    background: #ffffff !important;
    color: #111111 !important;
    border-color: #d1d5db !important;
    box-shadow: none !important;
  }
}

table,
.report-table,
.rfqTable {
  border-color: var(--app-border) !important;
}

thead,
th {
  background: rgba(20, 31, 45, 0.95) !important;
}

td,
th {
  border-color: rgba(41, 56, 77, 0.78) !important;
}

tbody tr:hover,
.pickRow:hover {
  background: rgba(98, 167, 255, 0.08) !important;
}

code,
pre {
  background: rgba(18, 28, 42, 0.95) !important;
  color: #d8e7fb !important;
  border: 1px solid rgba(56, 80, 107, 0.65);
}

.status.Open,
.ok,
.statusOK {
  color: #86efac !important;
}

.status.Closed {
  color: #cbd5e1 !important;
}

.status.Cancelled,
.bad,
.statusERR,
.expired {
  color: #fda4af !important;
}

.poDone,
.awardedQuote {
  background: rgba(16, 185, 129, 0.18) !important;
  color: #9ef3cc !important;
}

.lineCancelled {
  background: rgba(125, 31, 53, 0.18) !important;
}

hr {
  border-color: var(--app-border) !important;
}

@media print {
  :root {
    color-scheme: light;
  }

  html,
  body,
  .card,
  .modal,
  .report-card,
  .quotesPanel,
  .rfqSection,
  .pill,
  .report-table-wrap,
  table,
  #footer,
  header {
    background: #ffffff !important;
    color: #111827 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }

  th,
  td,
  .muted,
  .small,
  .hint,
  label,
  #subhdr,
  #msg {
    color: #334155 !important;
  }
}