/* Mevcut stiller buraya ekleniyorsa, aşağıdaki yeni stilleri ekleyin */
#productFieldsModal .modal-dialog {
    max-width: 700px; /* Modal genişliğini artır */
}
#fields-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* Her satırda 2 sütun */
    gap: 15px; /* Sütunlar arasında boşluk */
    padding: 15px;
}
#fields-container .mb-3 {
    margin-bottom: 0 !important; /* Varsayılan margin'i sıfırla */
    width: 100%; /* Her alan tam genişlikte */
}
#fields-container .form-group {
    margin-bottom: 15px; /* Alanlar arasında boşluk */
}
@media (max-width: 576px) {
    #fields-container {
        grid-template-columns: 1fr; /* Küçük ekranlarda tek sütun */
    }
}
.bannertitle{
    font-size: 40px;
    line-height: 60px;
    text-shadow: 2px 1px black;
}
@media (max-width: 576px) {
    .video-section {
        height: 500px!important;
    }
    .bannertitle{
        font-size: 20px;
        line-height: 33px;
        text-shadow: none!important;
    }
    main.content-wrapper {
        margin-top: 372px!important;
    }
}
.mt-c-10 {
    margin-top: 10rem !important;
}
.loginuser{
    background: #fff;
    padding: 6px 10px !important;
    border-radius: 6px;
    color: #000 !important;
}
.contactno{
    line-height: 30px!important;
}
.custom-datepicker {
    z-index: 1050 !important; /* Tarih aralığı picker'ın üstte kalmasını sağlar */
}
main.content-wrapper{
    margin-top: 586px;
}
.equal-card-img {
    height: 123px;
    object-fit: cover;
    width: 100%;
}

.custom-card {
    transition: all 0.3s ease;
    border: none;
    box-shadow: 0 0 12px rgba(0,0,0,0.05);
}

.card-title {
    font-size: 15px;
    margin-bottom: 0;
    text-underline: none;
}

.custom-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 0 16px rgba(0,0,0,0.1);
}
.lead{
    font-size: 19px;
    font-weight: 500;
    line-height: 33px;
}
h3.animate-target{
    font-size: 16px;
    margin-bottom: 0;
}
.event-scroll-wrapper {
    overflow-x: auto;
    white-space: nowrap;
    padding-bottom: 1rem;
}

.event-scroll-item {
    display: inline-block;
    width: 220px;
    margin-right: 1rem;
    vertical-align: top;
}

@media (min-width: 768px) {
    .event-scroll-wrapper {
        display: flex;
        flex-wrap: wrap;
        gap: 1rem;
        overflow-x: visible;
        white-space: normal;
    }

    .event-scroll-item {
        display: block;
        width: calc(100% / 6 - 1rem);
        margin-right: 0;
    }
}
