/* --- OVERALL THEME & BACKGROUND --- */
body {
    font-family: 'Yanone Kaffeesatz', sans-serif;
    background-color: #323232;
    color: #E0E0E0;
    padding: 50px 20px;
    margin: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    min-height: 100vh;
    box-sizing: border-box;
}

/* --- 1. WELCOME & FORM PAGE SHARED STYLES --- */
#logo-container { width: 90%; max-width: 700px; margin-bottom: 30px; }
#logo-container img { width: 100%; height: auto; }

#welcome-container, #form-container, .thank-you-container {
    background-color: #404040;
    padding: 40px 50px;
    border-radius: 8px;
    border: 1px solid #555;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
    width: 90%;
    max-width: 550px;
}
#welcome-container { text-align: center; }
.welcome-text p { font-size: 1.5rem; line-height: 1.6; color: #ccc; margin: 0 0 15px 0; }
.enter-hint { display: block; margin-top: 10px; font-size: 1.1rem; color: #999; }


/* --- 2. FORM-SPECIFIC STYLES --- */
.form-steps-container { position: relative; transition: height 0.4s ease-in-out; }
.form-step { position: absolute; top: 0; left: 0; width: 100%; opacity: 0; visibility: hidden; transition: opacity 0.4s ease-in-out, visibility 0.4s; }
.form-step.active { opacity: 1; visibility: visible; }

label { display: block; color: #D9D9D9; font-size: 2.2rem; font-weight: 700; margin-bottom: 20px; }
.required-star { color: #DBBF8D; vertical-align: super; font-size: 1.5rem; margin-left: 5px; }

input, textarea {
    width: 100%; padding: 15px; background-color: #323232; border: 2px solid #666; border-radius: 6px;
    font-family: 'Yanone Kaffeesatz', sans-serif; font-size: 1.5rem; color: #FFFFFF;
    box-sizing: border-box; margin-bottom: 25px; transition: border-color 0.3s, box-shadow 0.3s;
    resize: none; overflow-y: hidden;
}
#date-picker { cursor: pointer; }
a.start-btn:focus, input:focus, textarea:focus { border-color: #DBBF8D; box-shadow: 0 0 10px rgba(219, 191, 141, 0.5); outline: none; }
::placeholder { color: #888; opacity: 1; }
.instructions { font-size: 1.1rem; color: #999; text-align: right; margin-top: -15px; margin-bottom: 25px; }
.error-message { color: #ff8a8a; font-size: 1.1rem; text-align: left; margin-top: -20px; margin-bottom: 25px; height: 1.2rem; }

.radio-options-container { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-bottom: 15px; }
.radio-options-container input[type="radio"] { position: absolute; opacity: 0; width: 0; height: 0; }
.radio-options-container label { display: block; width: 100%; padding: 15px; border: 2px solid #666; border-radius: 6px; text-align: center; font-size: 1.3rem; font-weight: 400; color: #E0E0E0; cursor: pointer; transition: all 0.2s ease-in-out; }
.radio-options-container input[type="radio"]:checked + label { border-color: #DBBF8D; background-color: rgba(219, 191, 141, 0.1); color: #DBBF8D; font-weight: 700; }
.radio-options-container input[type="radio"]:focus-visible + label { box-shadow: 0 0 10px rgba(219, 191, 141, 0.5); }
.other-input-wrapper { max-height: 0; overflow: hidden; transition: max-height 0.4s ease-in-out; }
.other-input-wrapper.active { max-height: 120px; }
.other-input-wrapper input { margin-bottom: 25px; }
@media (max-width: 600px) { .radio-options-container { grid-template-columns: 1fr; } }

a.start-btn, button {
    background-color: #DBBF8D; color: #323232; border: none; padding: 15px 25px; border-radius: 6px;
    font-family: 'Yanone Kaffeesatz', sans-serif; font-size: 1.4rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 1px; cursor: pointer; transition: background-color 0.2s, transform 0.2s, box-shadow 0.3s;
    text-decoration: none; display: inline-block;
}
a.start-btn:hover, button:hover { background-color: #c9a66d; transform: translateY(-2px); }

.button-container { display: flex; align-items: center; justify-content: flex-end; }
.next-btn, .submit-btn { margin-left: 20px; }
.button-container > :first-child:not(:last-child) { margin-right: auto; }
.prev-btn {
    background-color: transparent; border: 2px solid #666; border-radius: 50%; width: 54px; height: 54px;
    padding: 0; display: flex; justify-content: center; align-items: center; transition: border-color 0.2s, background-color 0.2s;
}
.prev-btn svg { fill: #DBBF8D; transition: fill 0.2s; }
.prev-btn:hover { background-color: rgba(219, 191, 141, 0.1); border-color: #DBBF8D; transform: none; }

/* --- 3. THANK YOU / SUMMARY PAGE --- */
.thank-you-container { text-align: center; }
.thank-you-container h2 { font-size: 2.5rem; font-weight: 700; }
.summary {
    text-align: left; background-color: #323232; border: 1px solid #555; border-radius: 8px;
    padding: 25px; margin-top: 20px;
}
.summary p { margin: 10px 0; font-size: 1.2rem; }
.summary strong { color: #DBBF8D; }
.summary blockquote { margin: 10px 0 0 0; padding-left: 15px; border-left: 4px solid #DBBF8D; font-size: 1.4rem; font-style: italic; color: #ccc; white-space: pre-wrap; }

/* --- Custom Dark Theme for Pikaday Calendar --- */
.pika-single.dark-theme { color: #E0E0E0; background: #404040; border: 1px solid #555; border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.4); }
.dark-theme .pika-label { color: #E0E0E0; background-color: #323232; }
.dark-theme .pika-table th { color: #ccc; }
.dark-theme .pika-button { color: #E0E0E0; background: transparent; border-radius: 4px; }
.dark-theme .pika-button:hover { background-color: #555; }
.dark-theme .is-today .pika-button { text-decoration: underline; }
.dark-theme .is-selected .pika-button { color: #323232; background: #DBBF8D; font-weight: bold; box-shadow: none; }
.dark-theme .is-disabled .pika-button, .dark-theme .is-outside-current-month .pika-button { color: #666; }

/* --- THE FIX: Styles for the new Contact Info Box --- */
#contact-info-container {
    width: 90%;
    max-width: 550px;
    text-align: center;
    margin-top: 40px;
    
    /* New box properties */
    background-color: #323232; /* Darker than the main box */
    padding: 40px 50px;
    border-radius: 8px;
    border: 1px solid #555;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}
#contact-info-container h2 {
    font-size: 1.8rem;
    color: #DBBF8D;
    margin-top: 0;
    margin-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: 1px;
}
#contact-info-container p {
    font-size: 1.2rem;
    line-height: 1.8;
    color: #ccc;
    margin: 5px 0;
}
#contact-info-container a {
    color: #E0E0E0;
    text-decoration: none;
    transition: color 0.2s ease-in-out;
}
#contact-info-container a:hover {
    color: #DBBF8D;
    text-decoration: underline;
}pacing: 1px;
}
#contact-info-container p {
    font-size: 1.2rem;
    line-height: 1.8;
    color: #ccc;
    margin: 5px 0;
}
#contact-info-container a {
    color: #E0E0E0;
    text-decoration: none;
    transition: color 0.2s ease-in-out;
}
#contact-info-container a:hover {
    color: #DBBF8D;
    text-decoration: underline;
}