@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700&family=Space+Grotesk:wght@400;500;700&display=swap");

:root {
  --slate-bg-0: #e3eaf4;
  --slate-bg-1: #d2dcee;
  --slate-bg-2: #dbe4f2;
  --slate-ink: #131c2e;
  --slate-ink-soft: #384b68;
  --slate-title: #0e1726;
  --slate-link: #2d5cc4;
  --slate-link-hover: #5582ec;
  --slate-panel: rgba(7, 12, 30, 0.93);
  --slate-panel-2: rgba(13, 22, 54, 0.85);
  --slate-paper: rgba(238, 244, 255, 0.92);
  --slate-paper-2: rgba(218, 230, 250, 0.82);
  --slate-line: rgba(45, 78, 148, 0.22);
  --slate-line-soft: rgba(45, 78, 148, 0.15);
  --slate-shadow: 0 24px 80px rgba(7, 12, 30, 0.24);
  --slate-accent-1: #3460e0;
  --slate-accent-2: #1c42b4;
  --slate-accent-1-hover: #4674f4;
  --slate-accent-2-hover: #2852cc;
}

body {
  color: var(--slate-ink);
  background:
    radial-gradient(ellipse at top left, rgba(68, 112, 228, 0.36), transparent 42%),
    radial-gradient(ellipse at top right, rgba(100, 72, 196, 0.24), transparent 36%),
    radial-gradient(ellipse at bottom center, rgba(38, 66, 140, 0.14), transparent 44%),
    linear-gradient(180deg, var(--slate-bg-0) 0%, var(--slate-bg-1) 48%, var(--slate-bg-2) 100%);
  background-attachment: fixed;
}

.card,
.stream-card,
#cards-cat-sidebar,
.modal-content,
.colorless-modal-content,
.cards-filter-bar {
  border-color: rgba(144, 184, 248, 0.18) !important;
  background: linear-gradient(160deg, var(--slate-panel), var(--slate-panel-2)) !important;
}

.heading,
.card-title,
.modal .heading,
.colorless-modal-heading,
.coll-fset,
.cards-cat-sidebar-list-cat {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(144, 184, 248, 0.18) !important;
  color: #c4d8ff !important;
}

.heading {
  border-radius: 10px 10px 0 0;
}

.heading,
.card-title,
.modal .heading,
.colorless-modal-heading {
  background: linear-gradient(135deg, rgba(52, 96, 224, 0.26), rgba(100, 72, 196, 0.16)) !important;
  border: 1px solid rgba(96, 148, 255, 0.24) !important;
  box-shadow: inset 0 1px 0 rgba(176, 210, 255, 0.22), 0 10px 28px rgba(7, 12, 30, 0.22) !important;
  color: #c4d8ff !important;
}

.card-title {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  margin-bottom: 4px;
  padding-top: 4px;
  padding-bottom: 2px;
  letter-spacing: 0;
}

.cards-cat-sidebar-list-cat.selected,
.selected {
  background: linear-gradient(180deg, rgba(52, 96, 224, 0.38), rgba(100, 72, 196, 0.26)) !important;
}

.content input[type="text"],
.modal textarea,
fieldset,
input[type="file"],
.card-search-text,
.cards-filter-bar select,
#settings-theme {
  border-color: rgba(144, 184, 248, 0.18) !important;
  background: rgba(4, 8, 20, 0.44) !important;
  color: #d0e2ff !important;
}

.bitton:not(.mobile-hartree-menu-btn):not(.mobile-fios-menu-btn),
.btn:not(.mobile-hartree-menu-btn):not(.mobile-fios-menu-btn),
button:not(.mobile-hartree-menu-btn):not(.mobile-fios-menu-btn) {
  background: linear-gradient(180deg, var(--slate-accent-1), var(--slate-accent-2)) !important;
  border-color: rgba(44, 78, 180, 0.34) !important;
  text-shadow: none !important;
}

.bitton:not(.mobile-hartree-menu-btn):not(.mobile-fios-menu-btn):hover,
.btn:not(.mobile-hartree-menu-btn):not(.mobile-fios-menu-btn):hover,
button:not(.mobile-hartree-menu-btn):not(.mobile-fios-menu-btn):hover {
  background: linear-gradient(180deg, var(--slate-accent-1-hover), var(--slate-accent-2-hover)) !important;
}

#SITE_PAGES h1,
#SITE_PAGES h2,
#SITE_PAGES h3,
#SITE_PAGES .font_3,
#SITE_PAGES .font_4 {
  color: var(--slate-title);
  text-shadow: none;
}

h1 .wixui-rich-text__text,
h2 .wixui-rich-text__text,
h3 .wixui-rich-text__text,
h4 .wixui-rich-text__text,
.font_3.wixui-rich-text__text,
.font_4.wixui-rich-text__text {
  font-family: "Playfair Display", Georgia, serif;
  letter-spacing: 0.03em;
}


.card {
  margin: 2px 1px;
  border-radius: 10px;
  border: 0;
}
