.tausta-kuva {
    position: relative; /* Luodaan perusta kerroksille */
    min-height: 100vh;
    margin: 0;
}

.tausta-kuva::before {
    content: "";
    background-image: url('../Kuvat/alexander-grey-eMP4sYPJ9x0-unsplash\ \(taustakuva\).jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    
    /* TÄMÄ SÄÄTÄÄ LÄPINÄKYVYYDEN (0.1 - 1.0) */
    opacity: 0.3; 

    /* Pakotetaan taustakuva koko ruudun kokoiseksi ja muiden alle */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1; /* Pitää kuvan tekstin takana */
}

/* Luokka sivuille, joissa on paperin sävyinen taustaväri */
.paperi-tausta {
    background-color: #f8f1e5 !important;
    min-height: 100vh; /* Varmistaa, että väri jatkuu sivun loppuun asti */
    color: #212529;    /* Varmistetaan tekstin hyvä kontrasti */
}

.haku-kokonaisuus {
    min-height: 85vh; /* 85% ruudun korkeudesta */
    background: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.2)), url('../Kuvat/markus-spiske--3ia78f62RM-unsplash\(iso\ kuva\).jpg');
    background-size: cover;
    background-position: center;
    display: block; /* Varmistetaan, että rivit pinoituvat allekkain */
}

.haku-sisalto {
    background: rgba(255, 255, 255, 0.9); 
    border-radius: 12px;
    /* Pidetään huoli, ettei laatikko leviä liikaa */
    margin-left: auto;
    margin-right: auto;
}

.star-rating {
  display: flex;
  flex-direction: row-reverse; /* Tärkeä, jotta valinta toimii loogisesti */
  justify-content: center;
  font-size: 2rem;
}

.star-rating input {
  display: none; /* Piilotetaan radio-pallerot */
}

.star-rating label {
  color: #ccc; /* Harmaa tähti oletuksena */
  cursor: pointer;
  transition: color 0.2s;
}

/* Kun tähti on valittu tai sen päälle viedään hiiri, se muuttuu kullaksi */
.star-rating input:checked ~ label,
.star-rating label:hover,
.star-rating label:hover ~ label {
  color: #ffc107; 
}