/* =====================================
   CEIPAL Careers Pro
   responsive.css
===================================== */

/* =========================
   Large Tablets (1024px)
========================= */
@media (max-width: 1024px) {

    .ccp-layout{
        grid-template-columns: 350px 1fr;
        gap:20px;
    }

    .ccp-detail-title{
        font-size:34px;
    }

    .ccp-search-bar{
        flex-wrap:wrap;
    }

    .ccp-search-btn{
        width:100%;
    }
}

/* =========================
   Tablets (768px)
========================= */
@media (max-width: 768px) {

    .ccp-layout{
        grid-template-columns: 1fr;
    }

    .ccp-job-list{
        order:2;
    }

    .ccp-job-details{
        order:1;
        padding:25px;
    }

    .ccp-detail-title{
        font-size:28px;
    }

    .ccp-search-bar{
        flex-direction:column;
    }

    .ccp-search-group{
        width:100%;
    }

    .ccp-search-btn{
        width:100%;
    }

    .ccp-filters{
        flex-direction:column;
    }

    .ccp-sort select{
        width:100%;
    }

    .ccp-job-card{
        padding:16px;
    }
}

/* =========================
   Mobile (576px)
========================= */
@media (max-width: 576px) {

    .ccp-container{
        margin:20px auto;
        padding:0 12px;
    }

    .ccp-detail-title{
        font-size:22px;
        line-height:1.3;
    }

    .ccp-job-title{
        font-size:18px;
    }

    .ccp-job-card{
        padding:14px;
    }

    .ccp-job-details{
        padding:18px;
    }

    .ccp-apply-btn{
        width:100%;
        min-width:auto;
    }

    .ccp-search-group input,
    .ccp-search-group select{
        height:48px;
        font-size:14px;
    }

    .ccp-search-btn{
        height:48px;
        font-size:14px;
    }

    .ccp-filter-grid{
        grid-template-columns:1fr;
    }

    .ccp-filter-actions{
        flex-direction:column;
    }

    .ccp-filter-btn,
    .ccp-reset-btn{
        width:100%;
    }
}

/* =========================
   Small Mobile (400px)
========================= */
@media (max-width: 400px) {

    .ccp-detail-title{
        font-size:20px;
    }

    .ccp-job-title{
        font-size:16px;
    }

    .ccp-job-location,
    .ccp-job-type{
        font-size:13px;
    }

    .ccp-search-group input{
        height:44px;
    }

    .ccp-search-btn{
        height:44px;
    }
}

/* =========================
   Mobile Filter Drawer Support
========================= */
@media (max-width: 768px) {

    .ccp-mobile-filter-btn{
        display:block;
    }

    .ccp-filter-drawer{
        display:none;
    }

    .ccp-filter-drawer.active{
        display:block;
        position:fixed;
        top:0;
        left:0;
        width:100%;
        height:100%;
        background:#fff;
        z-index:9999;
        overflow:auto;
        padding:20px;
    }
}

/* =========================
   Touch Improvements
========================= */
@media (hover:none) {

    .ccp-job-card:hover{
        background:transparent;
    }

    .ccp-job-card:active{
        background:#f1f5f9;
    }

    .ccp-search-btn,
    .ccp-apply-btn,
    .ccp-filter-btn{
        min-height:48px;
    }
}

/* =========================
   Ultra Wide Screens
========================= */
@media (min-width: 1600px) {

    .ccp-container{
        max-width:1500px;
    }

    .ccp-detail-title{
        font-size:46px;
    }
}