/* Can Revizyonlar */


.card-items-5 {
    display: grid;
    grid-template-columns: repeat(5, auto);
    gap: 16px;
    justify-content: center;
    /* tüm grid’i ortalar */


}

.card-items-3 {
    display: grid;
    grid-template-columns: repeat(3, auto);
    gap: 16px;
    justify-content: center;
    /* tüm grid’i ortalar */


}

.kurs-card {
    max-height: inherit;
    height: 100%;

}

.kurs-card .card-header {
    height: auto;
}

.kurs-card .card-header img {
    aspect-ratio: 416 / 226;
    width: 100%;
}

.kurs-card .card-body {
    padding: 12px;
}

.kurs-card .card-body h3 {
    font-size: 18px;
    line-height: 25px;
    font-weight: 600;
    color: #010101;
    transition: color 0.2s ease-in-out;
}

.kurs-card .card-body p {
    height: auto;
    font-size: 12px;
    font-weight: 400;
    margin: 8px 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 100%;
    line-height: 1.5;
    color: #374957;
}

.kurs-card .card-body .certificate img {
    width: unset !important;
}

.kurs-card .card-footer {
    display: flex;
    align-items: center;
    border-top: 1px solid #E8ECEF;
    margin: 0 16px 10px;
    padding: 16px 0 10px;
}

.kurs-card .card-footer .btn {
    font-weight: 300;
    font-size: 14px;
    line-height: 18px;
    background: var(--page-btn-color);
}

.kurs-card .card-footer .btn:hover {
    background: var(--color-white);
    color: var(--page-btn-color);
    border-color: var(--page-btn-color);
}


.ashk-card {
    text-align: center;
    /* max-width: 300px; */
}

.ashk-card .image-wrapper {
    overflow: hidden;
    border-radius: 10px;
}

.ashk-card .image-wrapper img {
    width: 100%;
    border-radius: 10px;
    transition: transform 0.4s ease, filter 0.4s ease;
}

/* Hover efekti */
.ashk-card:hover .image-wrapper img {
    transform: scale(1.08);
    filter: brightness(1.1);
}

.ashk-card:hover .card-text h3 {
    color: var(--page-btn-color);
}

.ashk-card .card-text {
    margin-top: 10px;

}

.ashk-card .card-text h3 {
    font-size: 18px;
    line-height: 25px;
    font-weight: 600;
    color: #010101;
    transition: color 0.2s ease-in-out;
}


footer .f-item a {
    font-size: 14px;
    line-height: 1.5;
}

footer .f-item a i {
    vertical-align: middle;
}



.footer-area {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    /* PC: 4 sütun */
    gap: 20px;
    /* kutular arası boşluk */
}

.f-item {
    padding: 10px;
}


.btn-kurs-kayit {
    /* max-width: 200px !important; */
    margin-top: 20px !important;
}


#kurs_kayit_modal {
    background: var(--color-white);
    padding: 24px;
    text-align: left;
    max-width: 775px;
    width: 100%;
    margin: 40px auto;
    position: relative;
    border-radius: 16px;
}

#kurs_kayit_modal.kurs-kayit:focus {
    border-color: var(--page-btn-color);
}

#kurs_kayit_modal.kurs-kayit h3 {
    color: var(--page-btn-color);
    font-size: 32px;
    line-height: 35px;
    font-weight: 700;
}

#kurs_kayit_modal.kurs-kayit {
    z-index: 99999999999 !important;
}

#kurs_kayit_modal .modal-header {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border: none;
    gap: 12px;
}

#kurs_kayit_modal .modal-header i {
    color: #98A4AC;
    cursor: pointer;
    transition: color 0.2s ease-in-out;
}

#kurs_kayit_modal .modal-header i:hover {
    color: #767f85;
    transition: color 0.2s ease-in-out;
}

#kurs_kayit_modal.kurs-kayit a {
    font-weight: 500;
    margin: auto;
}

#kurs_kayit_modal .row {
    margin: 10px 0;
    gap: 10px;
}

#kurs_kayit_modal .form-group .checkbox {
    padding: 0 0 0 16px;
}

#kurs_kayit_modal .checkbox p {
    margin: 0px;
}

.page-links ul {
    gap: 20px;
}

.page-links a,
.page-links .dropdown button,
.page-links .dropdown button:focus,
.show>.btn-secondary.dropdown-toggle {
    font-size: 15px;
}

header .btn-area {
    justify-content: end;
    gap: 0px;
}

.kurs-video img {
    width: 100%;
}

.new-header-menu {
    display: grid;
    grid-template-columns: 2fr 8fr 2fr;
    align-items: center;
}

.kurs-detay .title {
    margin: 0 0 36px 0;
}

.kurs-detay .accordion img {
    margin: 0px;
}

.kurs-detay .playbtn {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}


.editor-content p {
    color: #000 !important;
    margin-bottom: 20px !important;

}
.editor-content ul {
    list-style-type: none;
    padding-left: 0; 
}

.editor-content ul li {
    position: relative;
    padding-left: 25px; 
    margin-bottom: 8px;
    color: #000;
}

.editor-content ul li::before {
    content: ''; 
    position: absolute;
    left: 0;
    top: 50%; 
    transform: translateY(-50%); 
    background-image: url('./../../assets/img/icon/check-icon.png');
    background-size: contain; 
    background-repeat: no-repeat;
    width: 20px; 
    height: 20px; 
}

.card-wrapper {
    grid-template-columns: repeat(3, 1fr); 
}

.card-wrapper.second {
    margin: 9em 0 9em;
}


.kurs-card .date {
    gap: 5px !important;
    justify-content: left;
    margin-bottom: 8px;
}
.kurs-card .date span{
    color: #18ca98 !important;
    font-size: 12px !important;
    line-height: 14px !important;
    margin: 0px !important;
}
.kurs-card .card-footer .btn {
    margin: 0px;
}
.kurs-card .card-footer {
    justify-content: space-between !important;
}
.kurs-card .card-footer .last-price{
    font-size: 14px;
}
.kurs-card .certificate{
    display: flex !important;
    justify-content: space-between !important;
}
.kurs-card .certificate .sepet-area button{
        padding: 0px;
    height: unset;
    margin: 0px !important;
    background: transparent;
    margin-bottom: 8px !important;
}
.kurs-card .certificate i{
    font-size: 16px;
    color: #18ca98 ;
}
.kurs-card .certificate .sepet-area button i{
    color: #374957;
}
.kurs-card .certificate .sepet-area button:hover i{
    color: var(--page-btn-color);
}

.kurs-modal-btns {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 20px;
    margin-top: 20px;
}

.kurs-detay .info .price {
    margin-bottom: 15px;
    display: inline-block;
    line-height: 1;
}

.date.detail {
    gap: 5px !important;
    justify-content: left;
    margin: 4px 0 12px 0;
}
.date.detail span{
    color: #18ca98 !important;
    font-size: 14px !important;
    line-height: 14px !important;
    margin: 0px !important;
}
.date.detail i{
    color: #18ca98 !important;
    font-size: 14px !important;
    line-height: 14px !important;
    margin: 0px !important;
}

.kurs-detay .swiper.first .card {
    height: auto;
}


/* --- Ana Sarmalayıcı --- */
.custom-file-upload-wrapper {
    /* İsterseniz buraya genel wrapper stilleri ekleyebilirsiniz, örn: margin */
    margin-top: 20px; 
}

/* --- Grup Stili --- */
.custom-file-upload-wrapper .csu-group {
    /* margin-bottom: 1rem; Artık wrapper'da */
}

/* --- Etiket Stili --- */
/* .custom-file-upload-wrapper .csu-group label {
    display: inline-block;
    margin-bottom: 0.5rem; 
    font-weight: 500;      
    color: #343a40;       
} */

/* --- Özel Buton (Input Görünümlü) Stili --- */
/* Görseldeki form-control stiline benzeyen temel stiller */
.custom-file-upload-wrapper .csu-button {
    display: block;
    width: 100%;
    height: 49px; 
    padding: .375rem .75rem;           
    font-size: 14px;                 
    font-weight: 400;
    line-height: 20px;
    color: #818181; /* Başlangıçta placeholder rengi */
    background-color: #fff;          
    background-clip: padding-box;
    border: 1px solid #ced4da;       
    border-radius: 16px;              
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    box-sizing: border-box;          
    text-align: left;       
    cursor: pointer;        
    overflow: hidden;       
    white-space: nowrap;    
    text-overflow: ellipsis;
    appearance: none; /* Tarayıcı varsayılan görünümünü kaldır */
}

/* Dosya seçildiğinde butonun yazı rengini değiştir */
.custom-file-upload-wrapper .csu-button.has-file {
    color: #495057; /* Normal input yazı rengi */
}

/* --- Seçilen Dosya Adı Metni --- */
.custom-file-upload-wrapper .csu-text {
    font-size: 0.875em;    
    color: #6c757d;        
    margin-top: 0.25rem;   
    display: block;        
}

/* --- Erişilebilirlik İçin Odak Stili --- */
/* Gizli input'a odaklanıldığında butona stil ver */
.custom-file-upload-wrapper .csu-real-input:focus + .csu-button {
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.bilgi-talep {
    text-align: center;
        display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 40px;
    margin-bottom: 5em;
    
}

.bilgi-talep .btn-purple {
    margin: auto;
}
.bilgi-talep .wrapper {
        background-color: #F7F6EF;
    padding: 60px 20px;
    border-radius: 16px;
    box-shadow: 0 4px 14px rgba(141, 155, 164, 0.2);
}

.input-form-error p {
    font-size: 10px;
    color: #dc3545;
}

        .form-group label {
            display: flex;
            margin: 8px 0px;
        }


        .component-padding {
   padding: 70px 0;
   margin: 0px !important;  
}

.sepetim .coupon-code button {
    background-color: #373743;
}
.sepetim .coupon-code button:hover {
    background-color: #18ca98;
    color: #fff;
}

.card-wrapper span,
.kurs-card .card-body h3,
.kurs-card .certificate .sepet-area button i,
.card-footer span,
.tab-container h2,
.ashk-card .card-text h3,
.bilgi-talep h2,
.footer-logo p,
.page-links a, .page-links .dropdown button,
.banner h1, .about-cards h2,
.about-cards h3,
.kurslar .tab-container .card-body h3, .kurslar .tab-container .card-body a, .kurs-detay .course .card-body a,
.kurs-detay .item .link,
.blog-detay .banner h1, .blog-detay .slider-head h2, .kurs-detay .slider-head h2,
#kurs_kayit_modal.kurs-kayit h3,
.egitmen-basvuru .banner h1, .bilgi-talep-formu .banner h1, .blog .banner h1, .sinavlar .banner h1, .sinav-detay h1, .kurslar h1, .kurs-detay h1, .faq-page .banner h1, .iletisim .banner h1, .aydinlatma-metni .banner h1, .banka-hesaplari .banner h1,
.cards-wrapper h3, .blog-detay .card h3,
.pagination button,
.iletisim p, .iletisim a,
.iletisim .form-group h2,
.banner p,
.hesabim h1, .sepetim h1, .odeme h1, .odeme-mesaj h1,
.sepetim table .text h3,
.sepetim table th, .sepetim table td,
.sepetim h2, .banka-hesaplari .eft-form h2,
.odeme .form .head-item h2,
.odeme aside h2,
.banka-hesaplari .inner-border b



{
    color: #373743;
}

.style-of-select {
    font-size: 14px;
    line-height: 20px;
    color: #818181;
    border-radius: 16px;
    height: 49px !important;
    padding-right: 40px;
    /* Standart oku gizler */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

    /* Kendi okunuzu ekleyin */
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23818181%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat;
    
    /* OKUN KONUMU BURADAN AYARLANIR */
    background-position: right 20px top 50%; /* Sağdan 20px içerde, dikeyde ortalı */
    background-size: 12px auto; /* Okun boyutu */
}
.style-of-select:focus {
    box-shadow: none;
    border-color: var(--form-btn-color);
}


/* Tablo Genel Çerçevesi */
.table-custom-pcd {
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    overflow: hidden;
    font-size: 14px;
}

/* Başlık Alanı */
.table-custom-pcd thead th {
    background-color: #F5F8FA;
    color: #374957;
    font-weight: 700;
    border-bottom: none;
    border-top: none;
    border-right: 1px solid #dee2e6;
    padding: 15px;
    vertical-align: middle;
}

/* Hücreler ve Dikey Çizgiler */
.table-custom-pcd td {
    padding: 15px;
    vertical-align: middle;
    border-top: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6; /* Görseldeki dikey ince çizgiler */
    color: #64748b;
}

/* Son sütundaki dikey çizgiyi kaldır */
.table-custom-pcd td:last-child, 
.table-custom-pcd th:last-child {
    border-right: none;
}

/* Satır Üzerine Gelince Renk Değişimi */
.table-custom-pcd tbody tr:hover {
    background-color: #fcfdfe;
}

.text-pcd h2{
    color: #373743;
    font-size: 32px;
    line-height: 40px;
    font-weight: 700;
}
.text-pcd p{
    font-size: 16px;
    line-height: 20px;
    margin: 13px 0 25px 0;
    font-weight: 400;
    color: #6F6F6F;
}



/* Responsive Düzenleme */
@media (max-width: 768px) {
    .table-custom-pcd {
        font-size: 12px;
    }
    .table-custom-pcd td, .table-custom-pcd th {
        padding: 10px 5px;
    }
}


/* Standart Durum */
.btn-outline-success {
    color: #18ca98;
    background-color: transparent;
    background-image: none;
    border-color: #18ca98;
    transition: all 0.3s ease-in-out; /* Geçişlerin yumuşak olması için */
}

/* Üzerine Gelince (Hover) */
.btn-outline-success:hover {
    color: #fff;
    background-color: #18ca98;
    border-color: #18ca98;
}

/* Tıklanma ve Odaklanma (Focus & Active) */
.btn-outline-success:focus, 
.btn-outline-success.focus {
    box-shadow: 0 0 0 0.2rem rgba(24, 202, 152, 0.5); /* Buton renginde hafif gölge */
}

.btn-outline-success:not(:disabled):not(.disabled):active, 
.btn-outline-success:not(:disabled):not(.disabled).active,
.show > .btn-outline-success.dropdown-toggle {
    color: #fff;
    background-color: #14ad82; /* Biraz daha koyu ton */
    border-color: #14ad82;
}

/* Pasif Durum (Disabled) */
.btn-outline-success:disabled, 
.btn-outline-success.disabled {
    color: #18ca98;
    background-color: transparent;
    opacity: 0.5;
}


.kurs-card .certificate {
    position: absolute;
    right: 12px;
    margin: 0;
}
.kurs-card .card-body h3 {
    padding-right: 20px;
}


@media (min-width:1600px) {

    .page-links a,
    .page-links .dropdown button,
    .page-links .dropdown button:focus,
    .show>.btn-secondary.dropdown-toggle {
        font-size: 18px;
    }
}

@media (max-width:1199.98px) {
    .card-items-5 {

        grid-template-columns: repeat(auto-fit, minmax(300px, auto));


    }

    .card-items-3 {

        grid-template-columns: repeat(auto-fit, minmax(300px, auto));


    }
}
@media (min-width:992px) and (max-width:1199.98px) {
    .new-header-menu .page-links ul {
        gap: 12px;
    }
    .new-header-menu .page-links a {
        font-size: 13px;
        line-height: 1.3;
    }
}

@media (min-width:992px) {
    .footer-area .f-item:nth-of-type(1) {}

    .footer-area .f-item:nth-of-type(2) {
        margin: 0 auto;
    }

    .footer-area .f-item:nth-of-type(3) {}

    .footer-area .f-item:nth-of-type(4) {}

}

@media (max-width:991.98px) {
    .card-items-5 {

        grid-template-columns: repeat(auto-fit, minmax(300px, auto));


    }

    .card-items-3 {

        grid-template-columns: repeat(auto-fit, minmax(300px, auto));

    }

    .footer-area {
        grid-template-columns: repeat(2, 1fr);
        /* 2x2 */
    }


    .new-header-menu {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .new-header-menu .logo-area img {
        width: 200px;
    }

    .component-padding {
    padding: 50px 0;
    }



}

@media (max-width:767.98px) {
    .card-items-5 {
        grid-template-columns: repeat(auto-fit, minmax(300px, auto));
    }

    .card-items-3 {
        grid-template-columns: repeat(auto-fit, minmax(300px, auto));
    }

    footer {
        overflow: hidden;
    }

    .card-wrapper {
        grid-template-columns: repeat(2, 1fr); 
    }

        .date.detail {
        margin: 8px 0;
    }


}

@media (max-width:575.98px) {
    .card-items-5 {
        grid-template-columns: repeat(auto-fit, minmax(300px, auto));
    }

    .card-items-3 {
        grid-template-columns: repeat(auto-fit, minmax(300px, auto));
    }

    .footer-area {
        grid-template-columns: 1fr;
        /* Alt alta */
    }

    .new-header-menu .logo-area img {
        width: 130px;
    }

    header .btn-area {
        gap: 10px;
    }


        .card-wrapper {
        grid-template-columns: repeat(1, 1fr); 
    }

    .kurs-modal-btns {

        grid-template-columns: repeat(1,1fr);

    }

    #kurs_kayit_modal .row .col-lg , #kurs_kayit_modal .row .col-lg-12 {
        padding-left: 0px;
        padding-right: 0px;
    }


    .mbx-sm {
        margin-bottom: 20px;
    }

    .bilgi-talep {
        grid-template-columns: repeat(1,1fr);
    }

    .component-padding {
        padding: 30px 0;
    }

}