﻿/* Containment: no horizontal overflow */
.ttc-gallery {
    max-width: 100%;
    overflow-x: hidden;
}

/* Responsive grid */
.gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 12px;
}

/* Keep a stable layout (no CLS) and crop nicely */
.gallery-item {
    position: relative;
    display: block;
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 16 / 10; /* adjust if your images are taller */
    background: #f3f3f3; /* placeholder while loading */
}

    .gallery-item img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        filter: blur(8px);
        transform: scale(1.03);
        transition: filter .3s ease, transform .3s ease;
    }

        .gallery-item img.is-loaded {
            filter: blur(0);
            transform: none;
        }

/* Tiny lightbox (uses <dialog>) */
#ttc-lightbox {
    padding: 0;
    border: 0;
    max-width: 95vw;
    max-height: 95vh;
    background: transparent;
}

    #ttc-lightbox::backdrop {
        background: rgba(0,0,0,.75);
    }

    #ttc-lightbox img {
        display: block;
        max-width: 95vw;
        max-height: 95vh;
        width: auto;
        height: auto;
        border-radius: 12px;
    }

    #ttc-lightbox .close {
        position: fixed;
        top: 12px;
        right: 16px;
        background: rgba(0,0,0,.6);
        color: #fff;
        border: 0;
        border-radius: 10px;
        padding: 6px 10px;
        cursor: pointer;
    }

.white { 
    color:white!important;
}
.title-heading {
    background-color:black;
    padding:10px;
}
.btn-nav {
    color: #fff;
    border-color: #75ac2d;
    background-color: darkorange;
}

.btn-nav:hover {
    color: #fff;
    border-color: #5a8422;
    background-color: #608e25;
}
.btn-nav:focus,
.btn-nav.focus {
    box-shadow: 0 0 0 .2rem rgba(117, 172, 45, .5);
}

.btn-nav.disabled,
.btn-nav:disabled {
    color: #fff;
    border-color: #75ac2d;
    background-color: #75ac2d;
}

.btn-nav:not(:disabled):not(.disabled):active,
.btn-nav:not(:disabled):not(.disabled).active,
.show > .btn-nav.dropdown-toggle {
    color: #fff;
    border-color: #537920;
    background-color: #5a8422;
}

.btn-nav:not(:disabled):not(.disabled):active:focus,
.btn-nav:not(:disabled):not(.disabled).active:focus,
.show > .btn-nav.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(117, 172, 45, .5);
}

.tile-overlay-orange {
    background-color: rgba(255, 120, 0, .9)!important;    
}

.tile-overlay-green {
    background-color: rgba(19, 116, 3, .9) !important;
}
.tile-overlay-blue {
    background-color: rgba(39, 73, 105, .9) !important;
}
.tile-overlay-red {
    background-color: rgba(196, 3, 3, .9) !important;
}
.tile-overlay-yellow {
    background-color: rgba(252, 255, 0, .9) !important;
}
.subpage-title-heading {
    background-color: black;
    padding: 10px;
    margin-top:130px;
}
.discountPromo {
    padding: 20px;
    background-color: #28a745 !important;
    color: white;
    font-weight: bold;
    text-align: center;
}
.discountPromoText {
    color: #28a745 !important;
}
.discountPromoTotal {
    background-color: #28a745 !important;
    color: white;
    font-weight: bold;
}
.discountText {
    text-decoration: line-through;
    color: red;
}

.ui-datepicker td span, .ui-datepicker td a {
    text-align: center !important;
}

.ui-datepicker {
    width: 100% !important;
}

#pWarning {
    color: white;
    font-weight: bold;
    text-align: center;
    margin-bottom: 0px;
}