/* Osnovna tabela */
.lunin-koledar-table {
    width: 100%;
    border-collapse: collapse;
    color: white; /* Bele barve za besedilo v tabeli */
}

.lunin-koledar-table th, .lunin-koledar-table td {
    border: 1px solid #ccc;
    padding: 10px;
    text-align: center;
    color: white; /* Bele barve za besedilo v celicah */
}

/* Naslov H2 */
h2 {
    color: white; /* Bele barve za naslov */
    text-align: center;
    margin-bottom: 20px;
    font-size: 24px; /* Privzeta velikost naslova */
}

/* Slika lune */
.moon-image {
    width: 75px;
    height: auto;
}

/* Oblikovanje zodiakalnega simbola */
.zodiac-sign {
    font-family: 'AstroSvetSys';
    font-size: 1.5em;
    color: white; /* Bele barve za zodiakalne simbole */
}

/* Oblikovanje obrazca */
#as_lunin_koledar_form {
    text-align: center;
    margin-bottom: 20px;
}

/* Pull down (select input) */
#as_lunin_koledar_form select {
    padding: 10px; /* Padding za boljše oblikovanje */
    font-size: 16px; /* Večja pisava */
    margin-top: 5px; /* Dodan zgornji margin */
    margin-bottom: 5px; /* Dodan spodnji margin */
    border-radius: 4px; /* Zaobljeni robovi */
    border: 1px solid #ccc; /* Nežna obroba */
    background-color: #333; /* Temno ozadje za select */
    color: white; /* Bele barve za besedilo */
}

/* Submit gumb */
#as_lunin_koledar_form button {
    padding: 10px 20px; /* Notranji robovi */
    font-size: 16px;
    background-color: #4CAF50; /* Zeleno ozadje */
    color: white; /* Bele barve za besedilo */
    border: none; /* Odstrani obrobo */
    border-radius: 4px; /* Zaobljeni robovi */
    cursor: pointer;
}

#as_lunin_koledar_form button:hover {
    background-color: #45a049; /* Temnejši odtenek pri hoverju */
}

/* Mobilna prilagoditev */
@media (max-width: 768px) {
    .lunin-koledar-table {
        font-size: 12px; /* Manjša velikost fonta za tabelo */
    }

    .moon-image {
        width: 30px; /* Manjša slika na mobilnih napravah */
    }
    
    h2 {
        font-size: 18px; /* Manjša velikost naslova na mobilnih napravah */
    }

    /* Form prilagoditve za mobilne naprave */
    #as_lunin_koledar_form select, #as_lunin_koledar_form button {
        width: 100%; /* Elementi naj zavzamejo celotno širino */
        margin-bottom: 10px; /* Razmik spodaj */
    }

    /* Zmanjšanje velikosti fonta za select in button na mobilnih napravah */
    #as_lunin_koledar_form select, #as_lunin_koledar_form button {
        font-size: 14px; /* Zmanjšana velikost pisave na mobilnih napravah */
        padding: 8px; /* Manjši padding za boljšo uporabo na mobilnih napravah */
    }
}

/* Obarvanje vrstice za "Polno luno" in "Mlaj" brez vpliva na barvo besedila */
.highlight-row {
    background-color: rgba(255, 255, 0, 0.1); /* Transparentno rumeno ozadje z 10% vidljivostjo */
    color: white; /* Ohranimo belo barvo besedila */
}

/* Za vsak slučaj, če elementi v vrstici podedujejo barvo iz drugih CSS pravil */
.highlight-row td {
    color: white; /* Ohranimo belo barvo besedila v celicah */
}
/* Širina stolpca za datum */
.lunin-koledar-table td:first-child {
    width: 70px; /* Nastavi širino stolpca za datum */
    white-space: nowrap; /* Prepreči prelamljanje besedila */
}