* {
    font-size: 20px;
    text-decoration: none;
}

body{
    background: #3139FB;
    display: flex;
    align-items: center;
    justify-content: center;

    height: 100svh;
    width: 100svw;
    padding: 30px;
    box-sizing: border-box;
}


body:before {
    content: "";
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='650%25' height='650%25' filter='url(%23a)'/%3E%3C/svg%3E");
    background-repeat: repeat;
    background-size: 150.5px;
    opacity: 0.3;
    position: absolute;
    width: 100%;
    height: 100%;
    mix-blend-mode: color-dodge;
}

a>img {
    position: absolute;
    top: 30px;
    left: 30px;
    height: 40px;
    transition: 0.1s ease;
}

a>img:hover {
    scale: 1.05;
}

form {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.hidden-input {
    
  display: none;
}

button:disabled {
  cursor: not-allowed !important;
}

/* 2. Target the button top, AND explicitly override the hover/active states */
button:disabled .button_top,
button:disabled:hover .button_top,
button:disabled:active .button_top {
    
  background: #e0e0e0;     /* Light grey background */
  color: #999;             /* Faded text */
  border-color: #999;      /* Faded border */
  transform: translateY(0); /* Force it to stay flat */
  pointer-events: none;    /* Stop it from receiving mouse events */
}

/* From Uiverse.io by Voxybuns */ 
button {
    
  /* Variables */
  --button_radius: 0.75em;
  --button_color: #e8e8e8;
  --button_outline_color: #000000;
  font-size: 17px;
  font-weight: bold;
  border: none;
  cursor: pointer;
  border-radius: var(--button_radius);
  background: var(--button_outline_color);
  padding: 0;
}

.button_top {
  display: block;
  box-sizing: border-box;
  border: 2px solid var(--button_outline_color);
  border-radius: var(--button_radius);
  padding: 0.75em 1.5em;
  background: var(--button_color);
  color: var(--button_outline_color);
  transform: translateY(-0.2em);
  transition: transform 0.1s ease;

}

button:hover .button_top {
  /* Pull the button upwards when hovered */
  transform: translateY(-0.33em);
}

button:active .button_top {
  /* Push the button downwards when pressed */
  transform: translateY(0);
}