/*
|--------------------------------------------------------------------------
| TechPackHub Client Portal v2
| Global Responsive Styles
|--------------------------------------------------------------------------
*/

/* ==========================================================
   Large Desktop
   ≤ 1400px
========================================================== */

@media (max-width:1400px){

    .tph-container{
        max-width:1200px;
    }

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

    .tph-project-layout{
        grid-template-columns:2fr 1fr;
    }

}

/* ==========================================================
   Desktop
   ≤ 1200px
========================================================== */

@media (max-width:1200px){

    .tph-container{
        padding:30px 24px;
    }

    .tph-dashboard-grid,
    .tph-grid-4{
        grid-template-columns:repeat(2,1fr);
    }

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

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

    .tph-sidebar{
        order:2;
    }

    .tph-main-content{
        order:1;
    }

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

}

/* ==========================================================
   Tablet
   ≤ 992px
========================================================== */

@media (max-width:992px){

    .tph-container{
        padding:24px 20px;
    }

    .tph-page-header{
        flex-direction:column;
        align-items:flex-start;
        gap:20px;
    }

    .tph-dashboard-grid,
    .tph-grid-4,
    .tph-project-card-grid{
        grid-template-columns:1fr;
    }

    .tph-info-grid{
        grid-template-columns:1fr;
    }

    .tph-card-header{
        flex-direction:column;
        align-items:flex-start;
        gap:12px;
    }

    .tph-project-meta{
        grid-template-columns:1fr;
    }

    .tph-btn-group{
        flex-wrap:wrap;
    }

    .tph-download-row{
        flex-wrap:wrap;
    }

}

/* ==========================================================
   Mobile
   ≤ 768px
========================================================== */

@media (max-width:768px){

    .tph-container{
        padding:20px 16px;
    }

    .tph-page-header{
        padding:24px;
    }

    .tph-page-header h1{
        font-size:28px;
    }

    .tph-card-body{
        padding:20px;
    }

    .tph-card-header{
        padding:18px 20px;
    }

    .tph-stat-card{
        flex-direction:column;
        text-align:center;
    }

    .tph-stat-icon{
        margin:0 auto;
    }

    .tph-project-header{
        flex-direction:column;
        align-items:flex-start;
    }

    .tph-project-actions{
        width:100%;
    }

    .tph-project-actions .tph-btn{
        width:100%;
    }

    .tph-download-row{
        flex-direction:column;
        align-items:flex-start;
        gap:16px;
    }

    .tph-download-row .tph-btn{
        width:100%;
    }

    .tph-btn,
    .tph-btn-block{
        width:100%;
        justify-content:center;
    }

    .tph-btn-group{
        flex-direction:column;
    }

    .tph-table{
        display:block;
        overflow-x:auto;
        white-space:nowrap;
    }

    .tph-modal{
        width:95%;
        margin:20px auto;
    }

    .tph-progress-info{
        flex-direction:column;
        align-items:flex-start;
        gap:10px;
    }

}

/* ==========================================================
   Small Mobile
   ≤ 576px
========================================================== */

@media (max-width:576px){

    .tph-container{
        padding:16px;
    }

    .tph-page-header{
        padding:20px;
    }

    .tph-page-header h1{
        font-size:24px;
    }

    .tph-card-body{
        padding:18px;
    }

    .tph-card-header{
        padding:16px 18px;
    }

    .tph-project-title{
        font-size:18px;
    }

    .tph-stat-value{
        font-size:28px;
    }

    .tph-info-item{
        padding:16px;
    }

    .tph-download-row{
        padding:16px;
    }

    .tph-note-card{
        padding:18px;
    }

    .tph-current-stage{
        padding:18px;
    }

    .tph-progress-value{
        font-size:13px;
    }

    .tph-badge{
        font-size:12px;
        padding:5px 10px;
    }

    .tph-btn{
        font-size:14px;
        padding:12px 16px;
    }

}

/* ==========================================================
   Landscape Phones
========================================================== */

@media (max-height:600px){

    .tph-modal{
        max-height:90vh;
        overflow-y:auto;
    }

}

/* ==========================================================
   Print
========================================================== */

@media print{

    .tph-btn,
    .tph-sidebar,
    .tph-navigation,
    .tph-footer,
    .tph-actions,
    .tph-download-btn{
        display:none !important;
    }

    .tph-card{

        box-shadow:none;

        border:1px solid #ddd;

        break-inside:avoid;

    }

    .tph-page-header{

        margin-bottom:30px;

    }

    body{

        background:#fff;

    }

}