@font-face {
  font-family: "Geist";
  src: url("/gitaaa-assets/geist-sans.woff2") format("woff2");
  font-display: swap;
}

@font-face {
  font-family: "Geist Mono";
  src: url("/gitaaa-assets/geist-mono.woff2") format("woff2");
  font-display: swap;
}

:root {
  color-scheme: dark;
  --gitaaa-bg: #0a0a0a;
  --gitaaa-panel: #0a0a0a;
  --gitaaa-panel-2: #171717;
  --gitaaa-line: #262626;
  --gitaaa-text: #fafafa;
  --gitaaa-muted: #a1a1a1;
  --gitaaa-green: #24765f;
  --gitaaa-green-soft: rgba(36, 118, 95, .18);
  --gitaaa-amber: #f5b847;
  --gitaaa-red: #ef6461;
  --gitaaa-surface: #111;
  --gitaaa-surface-2: #181818;
}

html,
body,
#root {
  background: var(--gitaaa-bg) !important;
  color: var(--gitaaa-text) !important;
  font-family: "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: var(--gitaaa-bg);
}

.gitaaa-panel-workspace::before {
  background:
    linear-gradient(rgba(255, 255, 255, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .02) 1px, transparent 1px),
    var(--gitaaa-bg);
  background-size: 42px 42px;
}

.gitaaa-workspace-title,
.gitaaa-kpi-strip {
  width: min(1180px, calc(100vw - 40px));
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.gitaaa-workspace-title {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  padding: 30px 0 18px;
}

.gitaaa-workspace-kicker {
  display: inline-flex;
  border: 1px solid var(--gitaaa-line);
  border-radius: 999px;
  color: var(--gitaaa-muted);
  background: var(--gitaaa-surface);
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 700;
}

.gitaaa-workspace-title h1 {
  margin: 14px 0 7px;
  color: var(--gitaaa-text);
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.08;
  font-weight: 750;
  letter-spacing: 0;
}

.gitaaa-workspace-title p {
  margin: 0;
  color: var(--gitaaa-muted);
  font-size: 15px;
}

.gitaaa-action-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.gitaaa-action-row a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  border: 1px solid var(--gitaaa-line);
  border-radius: 7px;
  background: var(--gitaaa-surface-2);
  color: var(--gitaaa-text);
  padding: 0 13px;
  font-size: 13px;
  font-weight: 750;
  text-decoration: none;
}

.gitaaa-action-row a:first-child {
  background: var(--gitaaa-green);
  border-color: var(--gitaaa-green);
  color: #fff;
}

.gitaaa-kpi-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.gitaaa-kpi-strip > div {
  border: 1px solid var(--gitaaa-line);
  border-radius: 8px;
  background: rgba(17, 17, 17, .92);
  padding: 14px 16px;
}

.gitaaa-kpi-strip strong {
  display: block;
  color: var(--gitaaa-muted);
  font-size: 12px;
  font-weight: 650;
}

.gitaaa-kpi-strip span {
  display: block;
  margin-top: 8px;
  color: var(--gitaaa-text);
  font-family: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 20px;
  font-weight: 800;
}

#root > * {
  position: relative;
  z-index: 1;
}

#root,
#root > div,
#root main,
#root .MuiBox-root,
.gitaaa-panel-shell {
  background-color: var(--gitaaa-bg) !important;
}

.gitaaa-panel-workspace #root {
  width: 100%;
  margin: 0;
}

.gitaaa-panel-workspace #root main,
.gitaaa-panel-workspace [class*="mainContent"] {
  width: 100% !important;
  min-height: auto !important;
  margin-top: 88px !important;
  margin-right: auto !important;
  padding: 0 24px 48px !important;
  border-radius: 0 !important;
}

.gitaaa-panel-workspace [class*="mainContent"] > * {
  max-width: 1120px;
  margin-left: auto !important;
  margin-right: auto !important;
}

#root .MuiPaper-root .MuiBox-root,
#root .MuiCard-root .MuiBox-root {
  background-color: transparent !important;
}

#root .css-11mv7m2 {
  background-color: var(--gitaaa-bg) !important;
}

.MuiAppBar-root {
  background: rgba(10, 10, 10, .96) !important;
  border-bottom: 1px solid var(--gitaaa-line) !important;
  color: var(--gitaaa-text) !important;
  backdrop-filter: blur(16px);
  box-shadow: none !important;
}

.MuiAppBar-root .MuiToolbar-root {
  min-height: 58px !important;
  gap: 12px;
}

.gitaaa-brand-logo,
.gitaaa-brand-logo *,
.MuiAppBar-root a[href="/"],
.MuiAppBar-root a[href="/"] * {
  color: var(--gitaaa-text) !important;
  text-decoration: none !important;
}

.gitaaa-brand-logo,
.MuiAppBar-root a[href="/"] {
  cursor: pointer;
}

.MuiDrawer-paper,
.MuiPaper-root {
  background-color: var(--gitaaa-panel) !important;
  background-image: none !important;
  color: var(--gitaaa-text) !important;
  border-color: var(--gitaaa-line) !important;
  box-shadow: none !important;
}

.MuiPopper-root {
  z-index: 1500 !important;
}

.MuiPopper-root .MuiPaper-root,
.MuiPopper-root .MuiCard-root,
.MuiPopper-root .MuiList-root,
.MuiClickAwayListener-root .MuiPaper-root {
  background: #111 !important;
  border: 1px solid var(--gitaaa-line) !important;
  border-radius: 10px !important;
  color: var(--gitaaa-text) !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, .48) !important;
}

.MuiPopper-root .MuiListItemButton-root,
.MuiPopper-root .MuiListItemText-primary,
.MuiPopper-root .MuiTypography-root,
.MuiPopper-root .MuiSvgIcon-root {
  color: var(--gitaaa-text) !important;
}

.MuiPopper-root .MuiListItemIcon-root {
  color: var(--gitaaa-muted) !important;
  min-width: 42px !important;
}

.MuiPopper-root .MuiListItemButton-root {
  min-height: 56px;
  margin: 5px 8px !important;
  padding: 10px 14px !important;
}

.MuiPopper-root .MuiListItemButton-root:hover {
  background: var(--gitaaa-green-soft) !important;
}

.MuiDrawer-paper {
  background: #111 !important;
}

.MuiListItemButton-root,
.MuiMenuItem-root {
  border-radius: 6px !important;
  margin: 2px 8px !important;
  color: var(--gitaaa-muted) !important;
}

.MuiListItemButton-root:hover,
.MuiMenuItem-root:hover,
.Mui-selected {
  background: var(--gitaaa-green-soft) !important;
  color: var(--gitaaa-text) !important;
}

.MuiListItemIcon-root,
.MuiSvgIcon-root {
  color: currentColor !important;
}

main,
[class*="mainContent"] {
  background: var(--gitaaa-bg) !important;
}

.MuiTypography-root,
.MuiListItemText-primary,
.MuiTableCell-root,
.MuiInputBase-input,
.MuiFormLabel-root,
.MuiFormHelperText-root {
  color: var(--gitaaa-text) !important;
  letter-spacing: 0 !important;
}

.MuiTypography-colorTextSecondary,
.MuiListItemText-secondary,
.MuiFormHelperText-root {
  color: var(--gitaaa-muted) !important;
}

.MuiTypography-h4,
.MuiTypography-h5,
.MuiTypography-h6 {
  font-weight: 650 !important;
}

.MuiButton-contained,
.MuiButton-containedPrimary {
  background: var(--gitaaa-green) !important;
  color: #fff !important;
  border-radius: 5px !important;
  box-shadow: none !important;
}

.MuiButton-outlined,
.MuiButton-text {
  color: var(--gitaaa-text) !important;
  border-color: var(--gitaaa-line) !important;
}

.MuiButton-root {
  min-height: 36px;
  text-transform: none !important;
  font-weight: 600 !important;
}

.MuiCard-root,
.MuiTableContainer-root,
.MuiOutlinedInput-root,
.MuiInputBase-root,
.MuiMenu-paper,
.MuiDialog-paper,
.MuiPopover-paper {
  background: var(--gitaaa-panel-2) !important;
  border: 1px solid var(--gitaaa-line) !important;
  color: var(--gitaaa-text) !important;
  border-radius: 8px !important;
}

.gitaaa-panel-workspace .MuiCard-root,
.gitaaa-panel-workspace .MuiPaper-root {
  background: var(--gitaaa-surface) !important;
  border-color: var(--gitaaa-line) !important;
}

.gitaaa-panel-workspace .MuiCardHeader-root {
  padding: 16px 18px 12px !important;
}

.gitaaa-panel-workspace .MuiCardHeader-title,
.gitaaa-panel-workspace .MuiCardHeader-title .MuiTypography-root {
  color: var(--gitaaa-text) !important;
  font-size: 16px !important;
  font-weight: 750 !important;
}

.gitaaa-panel-workspace .MuiCardContent-root {
  padding: 16px 18px !important;
}

.MuiCard-root {
  padding: 2px;
}

.MuiCardContent-root {
  padding: 18px !important;
}

.MuiCardContent-root:last-child {
  padding-bottom: 18px !important;
}

main .MuiGrid-container {
  align-items: stretch;
}

main .MuiGrid-container:first-of-type {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 14px !important;
}

main .MuiGrid-container:first-of-type > .MuiGrid-item {
  max-width: none !important;
  flex-basis: auto !important;
  width: auto !important;
}

.MuiInputBase-input,
input,
textarea {
  background-color: #171717 !important;
  color: var(--gitaaa-text) !important;
}

.MuiInputBase-input::placeholder,
input::placeholder,
textarea::placeholder {
  color: #a1a1a1 !important;
  opacity: 1 !important;
}

.MuiOutlinedInput-notchedOutline {
  border-color: var(--gitaaa-line) !important;
}

.MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline,
.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: var(--gitaaa-green) !important;
}

.MuiDivider-root,
.MuiTableCell-root {
  border-color: var(--gitaaa-line) !important;
}

.MuiTableContainer-root {
  overflow: auto;
}

.gitaaa-panel-workspace .MuiTableContainer-root {
  border-radius: 8px !important;
  background: var(--gitaaa-surface) !important;
  max-height: none;
}

.MuiTable-root {
  min-width: 760px;
}

.MuiTableHead-root .MuiTableCell-root {
  background: #111 !important;
  color: var(--gitaaa-muted) !important;
  font-family: "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  white-space: nowrap;
}

.gitaaa-panel-workspace .MuiTableHead-root .MuiTableCell-root {
  height: 44px;
  background: #151515 !important;
  color: #b8b8b8 !important;
  text-align: left !important;
}

.MuiTableBody-root .MuiTableCell-root {
  background: transparent !important;
  font-size: 13px !important;
}

.gitaaa-panel-workspace .MuiTableBody-root .MuiTableCell-root {
  height: 50px;
  color: #ececec !important;
  text-align: left !important;
}

.MuiTableRow-root:hover .MuiTableCell-root {
  background: rgba(255, 255, 255, .035) !important;
}

.gitaaa-panel-workspace .MuiFormControl-root,
.gitaaa-panel-workspace .MuiTextField-root {
  margin-top: 8px !important;
  margin-bottom: 10px !important;
}

.gitaaa-panel-workspace .MuiInputBase-root,
.gitaaa-panel-workspace .MuiOutlinedInput-root {
  background: #101010 !important;
  border-radius: 7px !important;
}

.gitaaa-panel-workspace .MuiButton-root {
  border-radius: 7px !important;
}

.gitaaa-panel-workspace .MuiButton-contained {
  background: var(--gitaaa-green) !important;
}

.gitaaa-panel-page-token .MuiTableContainer-root,
.gitaaa-panel-page-log .MuiTableContainer-root,
.gitaaa-panel-page-user .MuiTableContainer-root,
.gitaaa-panel-page-redemption .MuiTableContainer-root {
  min-height: 360px;
}

.gitaaa-panel-page-topup .MuiCard-root,
.gitaaa-panel-page-profile .MuiCard-root,
.gitaaa-panel-page-setting .MuiCard-root {
  max-width: 960px;
}

.MuiChip-root {
  background: #262626 !important;
  color: var(--gitaaa-muted) !important;
  border: 1px solid #404040 !important;
}

.MuiAppBar-root .MuiChip-root {
  background: var(--gitaaa-green) !important;
  border-color: rgba(255, 255, 255, .14) !important;
  color: #fff !important;
}

.MuiAppBar-root .MuiChip-root .MuiChip-label,
.MuiAppBar-root .MuiChip-root .MuiSvgIcon-root {
  color: #fff !important;
}

.MuiAppBar-root .MuiAvatar-root {
  background: #dff5ed !important;
  color: var(--gitaaa-green) !important;
}

.MuiAlert-root {
  background: #151515 !important;
  border: 1px solid var(--gitaaa-line) !important;
  color: var(--gitaaa-text) !important;
  border-radius: 8px !important;
}

.MuiAlert-standardSuccess,
.MuiAlert-filledSuccess {
  border-color: rgba(36, 118, 95, .55) !important;
}

.MuiAlert-standardWarning,
.MuiAlert-filledWarning {
  border-color: rgba(245, 184, 71, .45) !important;
}

.MuiAlert-standardError,
.MuiAlert-filledError {
  border-color: rgba(239, 100, 97, .45) !important;
}

.MuiPaginationItem-root,
.MuiTablePagination-root,
.MuiTablePagination-selectLabel,
.MuiTablePagination-displayedRows {
  color: var(--gitaaa-muted) !important;
}

.MuiPaginationItem-root.Mui-selected {
  background: var(--gitaaa-green) !important;
  color: #fff !important;
}

.MuiCircularProgress-root {
  color: var(--gitaaa-green) !important;
}

.apexcharts-text,
.apexcharts-legend-text,
.apexcharts-title-text,
.apexcharts-xaxis-label,
.apexcharts-yaxis-label {
  fill: var(--gitaaa-muted) !important;
  color: var(--gitaaa-muted) !important;
}

.apexcharts-gridline,
.apexcharts-xaxis-tick {
  stroke: var(--gitaaa-line) !important;
}

.apexcharts-tooltip,
.apexcharts-tooltip-title {
  background: #111 !important;
  border-color: var(--gitaaa-line) !important;
  color: var(--gitaaa-text) !important;
}

a {
  color: inherit;
}

code,
pre,
.MuiTableCell-root {
  font-family: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

.MuiPaper-root,
.MuiCard-root {
  animation: gitaaaFadeUp .26s ease both;
}

@media (max-width: 720px) {
  .MuiAppBar-root .MuiToolbar-root {
    min-height: 54px !important;
  }

  main .MuiGrid-container:first-of-type {
    grid-template-columns: 1fr;
  }

  .MuiCardContent-root {
    padding: 14px !important;
  }
}

@keyframes gitaaaFadeUp {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
