.radzen-card-p {
    padding: 1.5rem;
    min-height: 600px;
}

.radzen-row-p {
    gap: 1rem;
    height: 100%;
}

.radzen-column-left-p {
    flex: 0 0 25%;
    max-width: 25%;
}

.radzen-column-middle-p {
    flex: 0 0 50%;
    max-width: 50%;
}

.radzen-column-right-p {
    flex: 0 0 25%;
    max-width: 25%;
}

.drag-drop-area-p {
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 1rem;
    background-color: #f8f9fa;
}

.drop-zone-p {
    border: 2px dashed #dee2e6;
    border-radius: 0.5rem;
    padding: 2rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transition: all 0.3s ease;
    background-color: #fafafa;
    position: relative;
    min-height: 200px;
    max-height: 200px;
}

    .drop-zone-p.drag-over-p {
        border-color: #007acc;
        background-color: #e6f3ff;
        transform: scale(1.02);
    }

.drop-zone-disabled-p {
    opacity: 0.6;
    cursor: not-allowed;
}

.drop-zone-content-p {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.input-file-p {
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.upload-icon-p {
    font-size: 64px;
    color: #007acc;
/*    margin-bottom: 1rem;*/
}

.browse-button-p {
    padding: 12px 24px;
    background-color: #007acc;
    color: white;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 500;
    transition: background-color 0.2s ease;
    margin: 1rem 0;
    border: none;
    cursor: pointer;
}

    .browse-button-p:hover {
        background-color: #005999;
    }

.browse-button-disabled-p {
    padding: 12px 24px;
    background-color: #6c757d;
    color: white;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 500;
    margin: 1rem 0;
    border: none;
    cursor: not-allowed;
}

.upload-progress-container-p {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.progress-bar-current-p {
    height: 6px;
    margin-top: 1rem;
}

.file-list-section-p {
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 1rem;
    background-color: #f8f9fa;
    margin-top: 1rem;
}

.file-item-p {
    background-color: #fff;
    transition: all 0.2s ease;
}

    .file-item-p:hover {
        background-color: #f8f9fa;
    }

.radzen-stack-p {
    gap: 0.5rem;
}

.radzen-icon-p {
    color: #28a745;
}

.file-item-content-p {
    flex-grow: 1;
}

.progress-bar-queue-p {
    height: 6px;
}

.uploaded-poc-container-p {
    height:430px;
    overflow-y: auto;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 0.5rem;
    background-color: #fff;
    margin-bottom:1.5rem;
}

.poc-list-container-p {
    max-height: 320px;
    overflow-y: auto;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 0.5rem;
}

.uppoc-list-container-p {
    max-height: 375px;
    overflow-y: auto;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 0.5rem;
}

.poc-item-p {
    display: flex;
    align-items: center;
    transition: all 0.2s ease;
    background-color: #fff;
}

    .poc-item-p:hover {
        background-color: #f8f9fa;
        border-color: #007acc !important;
        transform: translateY(-1px);
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }

.empty-state-p {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 2rem;
}

.empty-state-icon-p {
    font-size: 48px;
    color: #6c757d;
    margin-bottom: 1rem;
}

.separation-p {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.disabled-item-p {
    pointer-events: none;
    user-select: none;
}

.ml-2-p {
    margin-left: 0.5rem;
}

@media (max-width: 1200px) {
    .radzen-column-left-p {
        flex: 0 0 25%;
        max-width: 25%;
    }

    .radzen-column-middle-p {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .radzen-column-right-p {
        flex: 0 0 25%;
        max-width: 25%;
    }
}

@media (max-width: 768px) {
    .radzen-row-p {
        flex-direction: column;
    }

    .radzen-column-left-p,
    .radzen-column-middle-p,
    .radzen-column-right-p {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}


/* Layout container should not overflow */
/*.equal-height-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;*/ /* Reduced gap */
/*}*/

/* For top charts row - target the specific chart containers */
/*.top-chart-card {
    min-height: 370px;
    max-height: 470px;
    flex: 1;
}*/

/* Target the RadzenColumns containing the chart cards - simplified approach */
/*.rz-col-md-3:has(.top-chart-card) {
    flex: 0 0 29% !important;*/ /* Sector Responses takes 32% */
    /*max-width: 29% !important;
    padding-right: 0.5rem;
    padding-left: 0;
}
.rz-col-md-2:has(.top-chart-card) {
    flex: 0 0 22% !important;*/ /* Sector Responses takes 32% */
    /*max-width: 22% !important;
    padding-right: 0.5rem;
    padding-left: 0;
}

.rz-col-md-9:has(.top-chart-card) {
    flex: 0 0 70% !important;*/ /* Sector Performance takes 67% */
    /*max-width: 70% !important;
    padding-left: 0.5rem;
    padding-right: 0;
}*/

/* For feedback row - all cards equal width */
/*.feedback-card {
    min-height: 460px;
    max-height: 470px;
    flex: 1;
}*/

/* Target feedback row RadzenColumns for equal spacing */
/*.equal-height-row .rz-col-md-3 {
    flex: 1 !important;
    max-width: calc(25% - 0.5rem) !important;
    padding: 0 0.25rem;
}

    .equal-height-row .rz-col-md-3:first-child {
        padding-left: 0;
    }

    .equal-height-row .rz-col-md-3:last-child {
        padding-right: 0;
    }*/

/* Remove conflicting margins and paddings */
/*.top-chart-card {
    margin-right: 0;
}*/

/* Override Radzen's default spacing only for chart rows */
/*.dashboard .rz-row:not(.equal-height-row) {
    gap: 0.75rem;
    margin-bottom: 1rem;
}*/

/* Ensure proper box-sizing */
/** {
    box-sizing: border-box;
}*/

/* Card styling */
/*.card-body {
    padding: 0.5rem;
    height: calc(100% - 40px);
}

.pzcard {
    overflow: hidden;
}

.card {
    margin-bottom: 1rem;
}

.summary-card {
    margin-bottom: 1rem;
}

.display-4 {
    font-size: 2.5rem;
    font-weight: bold;
    color: #17a2b8;
}*/

/*.text-center {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}*/

/* Responsive adjustments */
/*@media (max-width: 992px) {
    .rz-col-md-3:has(.top-chart-card),
    .rz-col-md-9:has(.top-chart-card) {
        flex: 1 !important;
        max-width: 100% !important;
        margin-bottom: 1rem;
        padding: 0;
    }

    .equal-height-row .rz-col-md-3 {
        flex: 1 !important;
        max-width: 100% !important;
        margin-bottom: 1rem;
        padding: 0;
    }
}*/








/* For top charts row - target the specific chart containers */
.top-chart-card {
    min-height: 370px;
    max-height: 470px;
    flex: 1;
}

/* Ensure all cards in feedback row have consistent height */
.rz-row:has([id="weeklyAssessmentChart"]) .top-chart-card {
    min-height: 420px !important;
    max-height: 420px !important;
    height: 420px;
}

/* Fix chart rendering issues with proper container sizing */
#feedbackPieChart,
#benchmarkDoughnutChart {
    height: 320px !important;
    width: 100% !important;
}

/* Ensure proper padding and height for chart containers */
.rz-row:has([id="weeklyAssessmentChart"]) .card-body.pzcard {
    padding: 1rem 0.5rem;
    height: calc(100% - 60px) !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Center the percentage text properly */
.rz-row:has([id="weeklyAssessmentChart"]) .text-center {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}


    .rz-row:has([id="weeklyAssessmentChart"]) .text-center .card-body {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
        padding: 1rem;
    }

/* Specific sizing for feedback row cards to accommodate charts properly */
.top-chart-card:has([id="weeklyAssessmentChart"]),
.top-chart-card:has([id="benchmarkDoughnutChart"]) {
    min-height: 400px;
    max-height: 450px;
}

.mid-chart-card {
    min-height: 216px !important;
    max-height: 260px !important;
}







/* Ensure chart containers have proper dimensions */
/*#feedbackPieChart,
#benchmarkDoughnutChart {
    min-height: 300px;
    width: 100%;
}*/
.rz-col-md-2:has(.top-chart-card) {
    flex: 0 0 22% !important;
   /* Sector Responses takes 32% */
    max-width: 22% !important;
    padding-right: 0.5rem;
    padding-left: 0;
}

/* Adjust padding for better chart visibility */
    .top-chart-card .card-body.pzcard {
    padding: 0.75rem;
    height: calc(100% - 50px);
}

/* Ensure equal spacing for all feedback row cards */
.rz-row:has([id="feedbackPieChart"]) .rz-col-md-3:first-child,
.rz-row:has([id="feedbackPieChart"]) .rz-col-md-2 {
    padding-left: 0;
}

    .rz-row:has([id="feedbackPieChart"]) .rz-col-md-2:last-child {
        padding-right: 0;
    }
/* Layout container should not overflow */
.equal-height-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem; /* Reduced gap */
}


/* For top charts row - target the specific chart containers */
.top-chart-card {
    min-height: 370px;
    max-height: 470px;
    flex: 1;
}

/* Target the RadzenColumns containing the chart cards - simplified approach */
.rz-col-md-3:has(.top-chart-card) {
    flex: 0 0 29% !important; /* Sector Responses takes 32% */
    max-width: 29% !important;
    padding-right: 0.5rem;
    padding-left: 0;
}

.rz-col-md-9:has(.top-chart-card) {
    flex: 0 0 70% !important; /* Sector Performance takes 67% */
    max-width: 70% !important;
    padding-left: 0.5rem;
    padding-right: 0;
}

/* For feedback row - all cards equal width */
.feedback-card {
    min-height: 460px;
    max-height: 470px;
    flex: 1;
}

/* Target feedback row RadzenColumns for equal spacing */
.equal-height-row .rz-col-md-3 {
    flex: 1 !important;
    max-width: calc(25% - 0.5rem) !important;
    padding: 0 0.25rem;
}

    .equal-height-row .rz-col-md-3:first-child {
        padding-left: 0;
    }

    .equal-height-row .rz-col-md-3:last-child {
        padding-right: 0;
    }

/* Remove conflicting margins and paddings */
.top-chart-card {
    margin-right: 0;
}

/* Override Radzen's default spacing only for chart rows */
.dashboard .rz-row:not(.equal-height-row) {
    gap: 0.75rem;
    margin-bottom: 1rem;
}

/* Ensure proper box-sizing */
* {
    box-sizing: border-box;
}

/* Card styling */
.card-body {
    padding: 0.5rem;
    height: calc(100% - 40px);
}

.pzcard {
    overflow: hidden;
}

.card {
    margin-bottom: 1rem;
}

.summary-card {
/*    margin-bottom: 1rem;*/
}

.display-4 {
    font-size: 2.5rem;
    font-weight: bold;
    color: #17a2b8;
}

.text-center {
   
    justify-content: center;
    align-items: center;
    height: 100%;
}

/* Responsive adjustments */
@media (max-width: 992px) {
    .rz-col-md-3:has(.top-chart-card),
    .rz-col-md-9:has(.top-chart-card) {
        flex: 1 !important;
        max-width: 100% !important;
        margin-bottom: 1rem;
        padding: 0;
    }

    .equal-height-row .rz-col-md-3 {
        flex: 1 !important;
        max-width: 100% !important;
        margin-bottom: 1rem;
        padding: 0;
    }
}
.top-chart-card .card-body.pzcard {
    padding: 0.75rem;
    height: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

#feedbackPieChart,
#benchmarkDoughnutChart {
    height: 100% !important;
    width: 100% !important;
    max-height: 300px;
    overflow: hidden;
}

.rz-row:has([id="feedbackPieChart"]) .top-chart-card {
    min-height: 420px !important;
    max-height: 420px !important;
    height: 420px;
    display: flex;
    flex-direction: column;
}
#feedbackPieChart svg {
    width: 100%;
    height: 100%;
}