/**
 * Copyright since 2009 Websenso
 * Websenso is a Digital Agency
 *
 * This file is licenced under the Software License Agreement.
 * With the purchase or the installation of the software in your application
 * you accept the licence agreement
 *
 * @author    Websenso <bonjour@websenso.com>
 * @copyright Since 2009 Websenso
 * @license   Commercial license (You can not resell or redistribute this software.)
 */
	
.header-banner.ws.default {
    .ws-widget {
        margin: 0 auto;
    }
}

.ws-widget.default {
    background-color: var(--ws-background-color);
    width: fit-content;
    max-width: fit-content;
    padding: 5px;

    .ws-title {
        font-weight: bold;
        text-align: center;
        color: var(--ws-title-color);
    }

    .ws-body-wrapper {
        display: grid;
        grid-template-columns: auto 50px;
        gap: 5px;
    }

    .ws-digits-wrapper {
        display: grid;
        grid-auto-flow: column;
        /* Align items in a row */
        grid-auto-columns: 1fr;
        /* Equal width for all columns */
        gap: 5px;
        /* Adjust as needed */
        width: max-content;
        /* Ensures container only takes the necessary width */

        .digit-wrapper {
            flex: 1;
            min-width: 45px;
            background-color: var(--ws-digit-wrapper-background-color);

            .digit {
                height: 45px;
                white-space: nowrap;
                display: grid;
                place-items: center;
                padding: 4px;
                background-color: var(--ws-digit-background-color);
                color: var(--ws-digit-text-color);
                text-align: center;
                border-radius: 4px;
                font-weight: bold;
                font-size: 20px;
            }

            .text {
                color: var(--ws-digit-label-color);
                display: block;
                text-align: center;
                font-size: 11px;
            }
        }
    }

    .ws-reminder-show {
        display: grid;
        place-items: center;
        font-size: 11px;
        text-align: center;
        line-height: 11px !important;
        color: var(--ws-notify-text-color) !important;
        background-color: var(--ws-notify-background-color);
        border-radius: 4px;

        i {
            font-size: 20px !important;
        }
    }

}

#ws-banner-1 {
    --ws-background-color: #262e2e;
    --ws-title-color: #f7bc28;
    --ws-digit-wrapper-background-color: #262e2e;
    --ws-digit-background-color: #262e2e;
    --ws-digit-label-color: #ffffff;
    --ws-digit-text-color: #f7bc28;
    --ws-notify-text-color: #f7bc28;
    --ws-notify-background-color: #262e2e;
}