/* ============================================================
   Seitenspezifische Styles für wann-mensa-heute
   (Corporate Layout liegt in style.css)
   ============================================================ */

/* Eingabe + Button nebeneinander */
#time_suggestion {
    display         : flex;
    flex-wrap       : wrap;
    gap             : 8px;
}

/* Platz für KI-Antwort & Gericht:
   Höhe reicht für ~280 Zeichen, damit nichts springt */
.answer-box {
    min-height      : 5em;
    margin-top      : 16px;
    padding         : 12px 16px;
    background      : #fff;
    border          : 2px solid var(--ink);
    border-radius   : 8px;
}

#gericht {
    font-size       : 1.3em;
}

.rotate {
    animation       : rotate 2s ease-in-out;
}

@keyframes rotate {
    0%   { transform: rotateX(0deg); }
    50%  { transform: rotateX(720deg); }
    100% { transform: rotateX(0deg); }
}

#loading {
    margin-top      : 12px;
    color           : var(--purple);
}

/* Badges */
.badges {
    display         : flex;
    flex-wrap       : wrap;
    gap             : 16px;
}

.badges img {
    width           : 200px;
    height          : 200px;
    object-fit      : cover;
    border          : 3px solid var(--ink);
    border-radius   : 12px;
}

/* Label nur für Screenreader */
.visually-hidden {
    position        : absolute;
    width           : 1px;
    height          : 1px;
    overflow        : hidden;
    clip            : rect(0 0 0 0);
    white-space     : nowrap;
}
