/* ============================================================
   Starforge: modified Cosmos space theme (MIT)
   https://codeberg.org/kevindowling/theme-adotinthecosmos
   ============================================================ */
   
@import "theme-forgejo-dark.css";

@font-face {
  font-family: "Helvetica";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/helvetica.woff2") format("woff2");
}

:root {
  /* --- Cosmic violet primary ramp --- */
  --color-primary: #8b7cff;
  --color-primary-contrast: #ffffff;
  --color-primary-dark-1: #9d90ff;
  --color-primary-dark-2: #b0a5ff;
  --color-primary-dark-3: #c4bbff;
  --color-primary-dark-4: #d7d1ff;
  --color-primary-dark-5: #e8e4ff;
  --color-primary-dark-6: #f1efff;
  --color-primary-dark-7: #f8f7ff;
  --color-primary-light-1: #7b6bf0;
  --color-primary-light-2: #6a59e0;
  --color-primary-light-3: #5a49c8;
  --color-primary-light-4: #4a3aa8;
  --color-primary-light-5: #3d2f8c;
  --color-primary-light-6: #2f2470;
  --color-primary-light-7: #241b58;
  --color-primary-alpha-10: #8b7cff19;
  --color-primary-alpha-20: #8b7cff33;
  --color-primary-alpha-30: #8b7cff4b;
  --color-primary-alpha-40: #8b7cff66;
  --color-primary-alpha-50: #8b7cff80;
  --color-primary-alpha-60: #8b7cff99;
  --color-primary-alpha-70: #8b7cffb3;
  --color-primary-alpha-80: #8b7cffcc;
  --color-primary-alpha-90: #8b7cffe1;
  --color-primary-hover: var(--color-primary-light-1);
  --color-primary-active: var(--color-primary-light-2);

  /* --- Deep-space surfaces --- */
  --color-body: #0a0a18;
  --color-footer: #070710;
  --color-nav-bg: #070710;
  --color-atmosphere: #1b2240;

  /* --- UI elements --- */
  --color-label-bg: #1b2240;
  --color-label-bg-alt: #2a3351;

  --color-button: #1b2240;
  --color-hover: #2a3351;

  --color-input-border: #9615de40;
  --color-input-border-hover: rgb(139,124,255);
  --color-input-background: #1b2240;

  --color-hover: #2a3351;
  --color-nav-hover-bg: #1b2240;
  --color-active: #2a3351;

  --color-menu: #1b2240;
  --color-secondary: rgb(139,124,255,0.3);
  --color-secondary-bg: rgb(139,124,255,0.1);

  --color-box-header: #1b2240;
  --color-box-body: #070710;

  --fonts-proportional: 'Helvetica', sans-serif !important;
  color-scheme: dark;
}

/* Space gradient */
/* These have to be explicitly defined for some reason. */
body {
  background: radial-gradient(ellipse at bottom, #1b2240 0%, #0a0a18 55%, #070710 100%) !important;
  background-attachment: fixed !important;
}

body {
    position: relative;
    background: radial-gradient( ellipse at bottom, #1b2240 0%, #0a0a18 55%, #070710 100%) fixed !important;
}

/* Starfield */
body::before,
body::after,
html::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background-repeat: repeat;
    width: calc(100% + 600px);
    height: 100%;
    will-change: transform;
}

body::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600' viewBox='0 0 600 600'%3E%3Ccircle cx='80.6' cy='508.5' r='0.5' fill='%23a5f3fc' opacity='0.58'/%3E%3Ccircle cx='456.6' cy='283.3' r='0.5' fill='%23ffffff' opacity='0.9'/%3E%3Ccircle cx='17' cy='501.5' r='0.6' fill='%23ffffff' opacity='0.82'/%3E%3Ccircle cx='417.5' cy='159.8' r='0.7' fill='%23c4bbff' opacity='0.65'/%3E%3Ccircle cx='540.9' cy='18.4' r='0.4' fill='%23ffffff' opacity='0.84'/%3E%3Ccircle cx='528.7' cy='411.9' r='0.6' fill='%23ffffff' opacity='0.88'/%3E%3Ccircle cx='458.2' cy='563.5' r='0.5' fill='%23ffffff' opacity='0.65'/%3E%3Ccircle cx='131.3' cy='275.8' r='0.5' fill='%23ffffff' opacity='0.97'/%3E%3Ccircle cx='549.8' cy='553.3' r='0.7' fill='%23ffffff' opacity='0.63'/%3E%3Ccircle cx='516' cy='72.5' r='0.7' fill='%23ffffff' opacity='0.95'/%3E%3Ccircle cx='300.5' cy='580.3' r='0.6' fill='%23ffffff' opacity='0.92'/%3E%3Ccircle cx='182' cy='352.5' r='0.6' fill='%23ffffff' opacity='0.93'/%3E%3Ccircle cx='353.4' cy='20.7' r='0.5' fill='%23ffffff' opacity='0.88'/%3E%3Ccircle cx='398.8' cy='220.3' r='0.6' fill='%23ddd6fe' opacity='0.9'/%3E%3Ccircle cx='51.9' cy='398.3' r='0.6' fill='%23ffffff' opacity='0.9'/%3E%3Ccircle cx='236' cy='293.8' r='0.5' fill='%23ffffff' opacity='0.76'/%3E%3Ccircle cx='509' cy='368.9' r='0.5' fill='%23ffffff' opacity='0.73'/%3E%3Ccircle cx='301.3' cy='589.2' r='0.7' fill='%23a5f3fc' opacity='0.64'/%3E%3Ccircle cx='329' cy='242.7' r='0.6' fill='%23ffffff' opacity='0.98'/%3E%3Ccircle cx='275.5' cy='161.6' r='0.6' fill='%23ffffff' opacity='0.82'/%3E%3Ccircle cx='230.2' cy='514.2' r='0.5' fill='%23ddd6fe' opacity='0.78'/%3E%3Ccircle cx='466.4' cy='123.3' r='0.5' fill='%23ffffff' opacity='0.77'/%3E%3Ccircle cx='332.6' cy='564.6' r='0.5' fill='%23ffffff' opacity='0.77'/%3E%3Ccircle cx='207.6' cy='323.1' r='0.5' fill='%23ffffff' opacity='0.9'/%3E%3Ccircle cx='359.9' cy='482.7' r='0.6' fill='%23ffffff' opacity='0.63'/%3E%3Ccircle cx='516.6' cy='479.1' r='0.7' fill='%23c4bbff' opacity='0.93'/%3E%3Ccircle cx='19.5' cy='566.1' r='0.4' fill='%23ffffff' opacity='0.59'/%3E%3Ccircle cx='8.7' cy='453.4' r='0.6' fill='%23ffffff' opacity='0.67'/%3E%3Ccircle cx='110.8' cy='174.2' r='0.6' fill='%23ffffff' opacity='0.62'/%3E%3Ccircle cx='100.9' cy='163.7' r='0.6' fill='%23ddd6fe' opacity='0.68'/%3E%3Ccircle cx='297.9' cy='68.5' r='0.5' fill='%23ffffff' opacity='0.72'/%3E%3Ccircle cx='112.8' cy='65.3' r='0.5' fill='%23ddd6fe' opacity='0.78'/%3E%3Ccircle cx='363.4' cy='490.2' r='0.5' fill='%23ffffff' opacity='0.65'/%3E%3Ccircle cx='21.2' cy='575.9' r='0.6' fill='%23ffffff' opacity='0.87'/%3E%3Ccircle cx='326.8' cy='132.4' r='0.6' fill='%23ffffff' opacity='0.91'/%3E%3Ccircle cx='133.9' cy='389.1' r='0.6' fill='%23ffffff' opacity='0.85'/%3E%3Ccircle cx='395.9' cy='255.8' r='0.7' fill='%23ddd6fe' opacity='0.68'/%3E%3Ccircle cx='525.3' cy='183.8' r='0.7' fill='%23ffffff' opacity='0.69'/%3E%3Ccircle cx='446.3' cy='249.7' r='0.6' fill='%23ffffff' opacity='0.61'/%3E%3Ccircle cx='510.3' cy='354.4' r='0.6' fill='%23ffffff' opacity='0.98'/%3E%3Ccircle cx='102.9' cy='520.7' r='0.6' fill='%23a5f3fc' opacity='0.87'/%3E%3Ccircle cx='226.8' cy='208.2' r='0.7' fill='%23ffffff' opacity='0.81'/%3E%3Ccircle cx='354.8' cy='295.4' r='0.6' fill='%23ffffff' opacity='0.73'/%3E%3Ccircle cx='10.3' cy='367.3' r='0.4' fill='%23ffffff' opacity='0.95'/%3E%3Ccircle cx='120.5' cy='196.6' r='0.5' fill='%23ffffff' opacity='0.9'/%3E%3Ccircle cx='127.8' cy='404.7' r='0.5' fill='%23ffffff' opacity='0.97'/%3E%3C/svg%3E");
    animation: stars-small 240s linear infinite;
}

body::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600' viewBox='0 0 600 600'%3E%3Ccircle cx='573.6' cy='568.7' r='2.5' fill='%23ffffff' opacity='0.13'/%3E%3Ccircle cx='573.6' cy='568.7' r='1' fill='%23ffffff' opacity='0.59'/%3E%3Ccircle cx='101.5' cy='485.4' r='2.3' fill='%23ffffff' opacity='0.15'/%3E%3Ccircle cx='101.5' cy='485.4' r='0.9' fill='%23ffffff' opacity='0.66'/%3E%3Ccircle cx='21.4' cy='408.7' r='3' fill='%23ffffff' opacity='0.18'/%3E%3Ccircle cx='21.4' cy='408.7' r='1.2' fill='%23ffffff' opacity='0.84'/%3E%3Ccircle cx='516.1' cy='305.4' r='2.6' fill='%23ffffff' opacity='0.17'/%3E%3Ccircle cx='516.1' cy='305.4' r='1' fill='%23ffffff' opacity='0.79'/%3E%3Ccircle cx='160.9' cy='21.6' r='3.2' fill='%23ffffff' opacity='0.16'/%3E%3Ccircle cx='160.9' cy='21.6' r='1.2' fill='%23ffffff' opacity='0.71'/%3E%3Ccircle cx='544.7' cy='254.2' r='2.3' fill='%23ffffff' opacity='0.14'/%3E%3Ccircle cx='544.7' cy='254.2' r='0.9' fill='%23ffffff' opacity='0.62'/%3E%3Ccircle cx='138.4' cy='106' r='2.7' fill='%23ffffff' opacity='0.13'/%3E%3Ccircle cx='138.4' cy='106' r='1' fill='%23ffffff' opacity='0.61'/%3E%3Ccircle cx='-0.8' cy='404.7' r='2.6' fill='%23ffffff' opacity='0.22'/%3E%3Ccircle cx='-0.8' cy='404.7' r='1' fill='%23ffffff' opacity='1.0'/%3E%3Ccircle cx='599.2' cy='404.7' r='2.6' fill='%23ffffff' opacity='0.22'/%3E%3Ccircle cx='599.2' cy='404.7' r='1' fill='%23ffffff' opacity='1.0'/%3E%3Ccircle cx='248.8' cy='315.2' r='2.8' fill='%23a5f3fc' opacity='0.16'/%3E%3Ccircle cx='248.8' cy='315.2' r='1.1' fill='%23a5f3fc' opacity='0.71'/%3E%3Ccircle cx='217.1' cy='515.4' r='3' fill='%23ffffff' opacity='0.14'/%3E%3Ccircle cx='217.1' cy='515.4' r='1.1' fill='%23ffffff' opacity='0.62'/%3E%3Ccircle cx='429.1' cy='276.8' r='2.4' fill='%23ffffff' opacity='0.15'/%3E%3Ccircle cx='429.1' cy='276.8' r='0.9' fill='%23ffffff' opacity='0.66'/%3E%3Ccircle cx='298.8' cy='309.2' r='3.1' fill='%23c4bbff' opacity='0.16'/%3E%3Ccircle cx='298.8' cy='309.2' r='1.2' fill='%23c4bbff' opacity='0.71'/%3E%3Ccircle cx='539.8' cy='276.6' r='2.7' fill='%23ffffff' opacity='0.19'/%3E%3Ccircle cx='539.8' cy='276.6' r='1.1' fill='%23ffffff' opacity='0.88'/%3E%3Ccircle cx='273.9' cy='395.3' r='3.1' fill='%23ffffff' opacity='0.2'/%3E%3Ccircle cx='273.9' cy='395.3' r='1.2' fill='%23ffffff' opacity='0.92'/%3E%3Ccircle cx='526' cy='369.8' r='2.4' fill='%23a5f3fc' opacity='0.21'/%3E%3Ccircle cx='526' cy='369.8' r='0.9' fill='%23a5f3fc' opacity='0.96'/%3E%3Ccircle cx='574.4' cy='423.7' r='2.7' fill='%23ffffff' opacity='0.18'/%3E%3Ccircle cx='574.4' cy='423.7' r='1' fill='%23ffffff' opacity='0.8'/%3E%3C/svg%3E");
    animation: stars-medium 120s linear infinite;
}

html::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600' viewBox='0 0 600 600'%3E%3Ccircle cx='142.8' cy='326.5' r='4' fill='%23ffffff' opacity='0.29'/%3E%3Ccircle cx='142.8' cy='326.5' r='1.5' fill='%23ffffff' opacity='0.96'/%3E%3Ccircle cx='348.5' cy='363.4' r='3.5' fill='%23ffffff' opacity='0.2'/%3E%3Ccircle cx='348.5' cy='363.4' r='1.4' fill='%23ffffff' opacity='0.67'/%3E%3Ccircle cx='-2.6' cy='282.2' r='4.2' fill='%23ffffff' opacity='0.23'/%3E%3Ccircle cx='-2.6' cy='282.2' r='1.6' fill='%23ffffff' opacity='0.76'/%3E%3Ccircle cx='597.4' cy='282.2' r='4.2' fill='%23ffffff' opacity='0.23'/%3E%3Ccircle cx='597.4' cy='282.2' r='1.6' fill='%23ffffff' opacity='0.76'/%3E%3Ccircle cx='90.4' cy='380.9' r='3.1' fill='%23ffffff' opacity='0.22'/%3E%3Ccircle cx='90.4' cy='380.9' r='1.2' fill='%23ffffff' opacity='0.73'/%3E%3Ccircle cx='466.3' cy='95.6' r='4.5' fill='%23ffffff' opacity='0.17'/%3E%3Ccircle cx='466.3' cy='95.6' r='1.7' fill='%23ffffff' opacity='0.57'/%3E%3Ccircle cx='494.1' cy='161.7' r='4.7' fill='%23ffffff' opacity='0.26'/%3E%3Ccircle cx='494.1' cy='161.7' r='1.8' fill='%23ffffff' opacity='0.87'/%3E%3Ccircle cx='428.5' cy='552.7' r='4.1' fill='%23ffffff' opacity='0.26'/%3E%3Ccircle cx='428.5' cy='552.7' r='1.6' fill='%23ffffff' opacity='0.88'/%3E%3Ccircle cx='578.5' cy='80.5' r='3.4' fill='%23ffffff' opacity='0.18'/%3E%3Ccircle cx='578.5' cy='80.5' r='1.3' fill='%23ffffff' opacity='0.59'/%3E%3C/svg%3E");
    animation: stars-large 60s linear infinite;
}

@keyframes stars-small {
    to { transform: translate3d(-150px, 0 ,0); }
}

@keyframes stars-medium {
    to { transform: translate3d(-300px, 0, 0); }
}

@keyframes stars-large {
    to { transform: translate3d(-600px, 0 ,0); }
}

@media (prefers-reduced-motion: reduce) {
    body::before {
        animation: none;
    }
}

/* Shooting stars*/
body::after {
    content: "";
    position: fixed;
    top: -10vh;
    left: -150px;

    width: 140px;
    height: 2px;

    pointer-events: none;
    z-index: 1;

    opacity: 0;

    background: linear-gradient(
        90deg,
        rgba(255,255,255,0),
        rgba(180,220,255,.6),
        rgba(255,255,255,1)
    );

    filter: drop-shadow(0 0 6px rgba(180,220,255,.8));

    animation: shooting-star 22s linear infinite;
}

@keyframes shooting-star {
    0%, 94% {
        opacity: 0;
        transform:
            translate(-200px, -100px)
            rotate(35deg);
    }

    95% {
        opacity: 1;
    }
    
    100% {
        opacity: 0;
        transform:
            translate(calc(100vw + 300px), calc(100vh + 300px))
            rotate(35deg);
    }
}

/* Round avatars */
.ui.avatar.tw-align-middle {
    border-radius: 50%;
    object-fit: cover;
}

.button.secondary:hover,
.ui.menu a.item:hover,
.ui.dropdown .menu > .item:hover,
.ui.menu details.item summary:hover,
.ui.vertical.menu .item .menu a.item:hover {
    background-color: #2a3351;
}