@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@300;400;500;700&display=swap');

:root {
    --primary-text-color: #ffffff;
    --alt-text-color: #5c5f6b;
    --primary-red: #fa2139;
    --alt-red: #e1dad3;
    --primary-bg: #000000;
    --alt-bg: #0a0a0a;
    --border-color: rgba(225,218,211,0.3);
}

body {
    margin: 0;
    background-color: var(--primary-bg);
    min-height: 100vh;
    width: 100%;
    font-family: "Roboto Mono", monospace;
    color: var(--primary-text-color)
}

.highlighter-rouge {
    overflow-x: scroll;
}

.alt-backing {
    background-color: var(--alt-bg);
    border: 1px solid var(--border-color);
    border-radius: 10px;
}

.info {
    color: var(--alt-text-color);
}

@font-face {
  font-family: 'MesloNerdFont';
  src: url('/assets/fonts/Meslo/MesloLGLDZNerdFontMono-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

.icon {
  font-family: 'MesloNerdFont';
}

a:link {
    color: var(--primary-red);
}

a:visited {
    color: var(--primary-red);
}

a:hover {
    color: var(--alt-red);
}

.cursor {
    color: var(--primary-red);
    animation: blink 1s step-end infinite;
}

@keyframes blink {
    50% { opacity: 0; }
}