/* Basic styles for Matroschka Booking forms */
.matroschka-booking-form .field,
.matroschka-voucher-form .field {
    margin-bottom: 1rem;
}
.matroschka-booking-form label,
.matroschka-voucher-form label {
    display: block;
    margin-bottom: 0.25rem;
    font-weight: 600;
    /* Set text color to black so labels remain legible on light backgrounds. If a dark background is used, adjust via theme CSS. */
    color: #000;
}
.matroschka-booking-form input[type="text"],
.matroschka-booking-form input[type="email"],
.matroschka-booking-form input[type="tel"],
.matroschka-booking-form select,
.matroschka-booking-form textarea,
.matroschka-voucher-form input[type="number"],
.matroschka-voucher-form input[type="text"],
.matroschka-voucher-form input[type="email"],
.matroschka-voucher-form textarea {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}
.matroschka-booking-form #mb_price_display {
    font-size: 1.2rem;
    font-weight: bold;
    /* Price display uses black text for better contrast on light backgrounds */
    color: #000;
}
.matroschka-booking-form .button,
.matroschka-voucher-form .button {
    padding: 0.5rem 1rem;
    font-size: 1rem;
}
/* Responsive layout */
@media (min-width: 600px) {
    .matroschka-booking-form .field,
    .matroschka-voucher-form .field {
        display: flex;
        align-items: center;
    }
    .matroschka-booking-form .field label,
    .matroschka-voucher-form .field label {
        flex: 0 0 30%;
        margin-bottom: 0;
    }
    .matroschka-booking-form .field input,
    .matroschka-booking-form .field select,
    .matroschka-booking-form .field textarea,
    .matroschka-voucher-form .field input,
    .matroschka-voucher-form .field textarea {
        flex: 1;
    }
}