/*
  pages.css – Ostatní stránky: Můj účet, Kontakt, Vznik NANDES, právní stránky.

  Pravidla: viz .claude/skills/SKILL.md. Selektor vždy ověřit na živém elementu,
  !important jen proti inline stylu (a napsat proč).
*/

/* Stránka /hodnoceni/ – formulář recenzí z e-mailu (inc/34-recenze-z-emailu.php, REC-1). */
.nandes-hodnoceni {
    max-width: 640px;
    margin: 0 auto;
}

.nandes-hodnoceni__blok {
    margin: 0 0 24px;
    padding: 0;
    border: 0;
}

.nandes-hodnoceni__blok legend {
    margin-bottom: 8px;
    font-size: 20px;
    font-weight: 700;
}

.nandes-hodnoceni label {
    display: block;
    margin: 12px 0 4px;
}

.nandes-hodnoceni textarea,
.nandes-hodnoceni select,
.nandes-hodnoceni input[type="text"],
.nandes-hodnoceni input[type="email"] {
    width: 100%;
    box-sizing: border-box;
}

/* 16px: iOS Safari jinak při psaní přibližuje (Moderno má 13px). */
.nandes-hodnoceni .nandes-hodnoceni__blok textarea,
.nandes-hodnoceni select,
.nandes-hodnoceni input[type="text"],
.nandes-hodnoceni input[type="email"] {
    font-size: 16px;
}

.nandes-hodnoceni textarea {
    resize: vertical;
}

.nandes-hodnoceni__chyba {
    color: var(--nandes-red);
    font-weight: 700;
}

.nandes-hodnoceni__info {
    margin-top: 16px;
    font-size: 14px;
    opacity: 0.75;
}

/* Honeypot – mimo obrazovku, ne display:none (některé roboty ho přeskakují). */
.nandes-hodnoceni__past {
    position: absolute;
    left: -9999px;
}

/*
  Hvězdičky: radio 1→5. Ve skupině s výběrem jsou červené všechny, šedé zůstanou
  ty za vybranou (`:checked + label ~ label`).
*/
.nandes-hvezdicky {
    position: relative;
    display: inline-flex;
    margin-top: 8px;
}

/* !important: Moderno (min.css) má na radio `position: relative !important` a okraj 12px. */
.nandes-hodnoceni .nandes-hvezdicky input[type="radio"] {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: 0;
    opacity: 0;
}

/* Plocha pro dotyk 44×44 px. */
.nandes-hodnoceni .nandes-hvezdicky label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    margin: 0;
    font-size: 36px;
    line-height: 1;
    color: #ccc;
    cursor: pointer;
}

.nandes-hvezdicky label::before {
    content: "★";
}

.nandes-hodnoceni .nandes-hvezdicky:has(input:checked) label {
    color: var(--nandes-red);
}

.nandes-hodnoceni .nandes-hvezdicky input:checked + label ~ label {
    color: #ccc;
}

.nandes-hvezdicky input:focus-visible + label {
    outline: 2px solid var(--nandes-black);
    outline-offset: 2px;
}

.nandes-hodnoceni--dekujeme {
    text-align: center;
}