/* * Silvatree Capacity Exchange - Mobile Specific
 * Folder: public/
 * Filename: mobile.css
 */

@media screen and (max-width: 768px) {
    body {
        background-color: white; /* Often mobile wizards look better on pure white */
    }

    main {
        padding: 1.5rem;
        align-items: flex-start; /* Start cards from top on small screens */
        padding-top: 4rem;
    }

    .card {
        border-radius: 1.25rem;
        box-shadow: none;
        border: none;
        padding: 1.5rem !important;
    }

    h1 {
        font-size: 1.875rem !important;
    }

    h2 {
        font-size: 1.5rem !important;
    }

    /* Buttons are larger and full-width on mobile */
    button {
        height: 3.5rem;
        font-size: 1rem !important;
    }

    /* Ensure form elements have enough tap target space */
    select, input {
        height: 3.5rem;
        font-size: 1rem !important;
    }

    .wizard-step {
        width: 100%;
    }

    /* Make results pop more on mobile */
    #result-value {
        font-size: 3.5rem !important;
    }
    .appointment_widgets-sm--revamp{
        border: none;
    }
    #wizard-container{
        padding-top: 10px;
        zoom: 100%;
}
}