body {
    background-color: #f6f8fb;
}
.has-error .col-form-label, .error-summary, .has-error .control-label, .has-error .error, .has-error .help-block, .has-error .input-icon>i {
    color: #e74c3c;
}
.body-wrapper .container-fluid, .body-wrapper .container-sm, .body-wrapper .container-md, .body-wrapper .container-lg, .body-wrapper .container-xl, .body-wrapper .container-xxl {
    padding-top: 100px;
}
.app-header {
    top: 0;
}

#main-wrapper[data-layout=vertical][data-sidebar-position=fixed] .left-sidebar {
    top: 0;
}

@media (max-width: 575.98px) {
    .app-header {
        top: 0;
    }

    .body-wrapper .container-fluid, .body-wrapper .container-sm, .body-wrapper .container-md, .body-wrapper .container-lg, .body-wrapper .container-xl, .body-wrapper .container-xxl {
        padding-top: 100px;
    }
}

@media (max-width: 991.98px) {
    .app-header {
        top: 0;
    }

    .body-wrapper .container-fluid, .body-wrapper .container-sm, .body-wrapper .container-md, .body-wrapper .container-lg, .body-wrapper .container-xl, .body-wrapper .container-xxl {
        padding-top: 100px;
    }
}

.control-label {
    margin-bottom: .5rem;
    font-weight: 600;
    color: #2a3547;
}
.form-group {
    margin-bottom: 1rem;
}
.table td, .table th {
    padding: 0.75rem;
}

.select2-container--default .select2-selection--single {
    height: 40px !important;
    border: 1px solid #dfe5ef;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 40px;
    padding-left: 8px;
    padding-right: 20px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px;
    line-height: 40px;
    right: 10px;
}
body .select2-container {
    display: block!important;
}
.left-sidebar .scroll-sidebar {
    height: 100vh!important;
}

.table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 0!important;
    border: none!important;
    margin: 0!important;
}

.disabled>.page-link, .page-link.disabled {
    background-color: inherit;
}

/* =====================================
FORM WIZARD STARTS
======================================== */
.wizard-layout{
    display:flex;
    background:#f4f6f9;
    min-height:600px;
}

/*left sidebar*/
.wizard-sidebar{
    width:240px;
    background:#1f2a44;
    color:#cbd3e3;
    height:auto;
    padding-top:20px;
}

.wizard-menu{
    list-style:none;
    padding:0;
    margin:0;
    /*keeps items stacked properly*/
    display:flex;
    flex-direction:column;
}

.wizard-menu li{
    padding:18px 15px;
    cursor:pointer;
    display:flex;
    align-items:center;
    font-size:15px;
}

.wizard-menu li .step-circle{
    background:#2f3b59;
    width:28px;
    height:28px;
    line-height:28px;
    border-radius:50%;
    text-align:center;
    margin-right:12px;
    flex-shrink:0;
}

.wizard-menu li.active{
    background:#e53935;
    color:white;
}
/*main section*/
.wizard-main{
    flex:1;
    padding:20px;
    min-width:0;
    min-height:0;
    display:flex;
    flex-direction:column;
}

.wizard-title {
    font-weight:600;
    margin-bottom:20px;
}
/*Horizontal wizard*/
.wizard-progress {
    display:flex;
    flex-wrap:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-behavior:smooth;
    list-style:none;
    padding:0;
    margin-bottom:25px;
    background:#ffffff;
    border-radius:6px;
    border:1px solid #e6e6e6;
    white-space:nowrap;
    width:100%;              /* ensure container width is fixed */
    flex-shrink:0; /*stops the step bar from collapsing when the card grows*/

    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling:touch; /*enables momentum scrolling on iOS*/
}

.wizard-progress li{
    display:inline-flex;
    align-items:center;

    padding:10px 25px 10px 20px;
    margin-right:5px;

    white-space:nowrap;
    background:#ffffff;
    color:#495057;
    font-size:14px;

    position:relative;

    border-top:1px solid #e6e6e6;
    border-bottom:1px solid #e6e6e6;

    flex:0 0 auto;   /* prevents shrinking */

    /*ensures the browser cannot skip steps while scrolling fast*/
    scroll-snap-align:start;
    scroll-snap-stop:always;
}

.wizard-progress li:after{
    content:"";
    position:absolute;
    top:0;
    right:-20px;

    width:0;
    height:0;

    border-top:20px solid transparent;
    border-bottom:20px solid transparent;
    border-left:20px solid #ffffff;

    z-index:2;
}

.wizard-progress li:before{
    content:"";
    position:absolute;
    top:0;
    right:-21px;

    width:0;
    height:0;

    border-top:20px solid transparent;
    border-bottom:20px solid transparent;
    border-left:20px solid #e6e6e6;

    z-index:1;
}

.wizard-progress li:last-child:after,
.wizard-progress li:last-child:before{
    display:none;
}

.wizard-progress li + li{
    margin-left:20px;
}

.wizard-progress li.active{
    color:#e53935;
    border-bottom:3px solid #e53935;
}

.wizard-progress li.active .step-circle{
    background:#e53935;
    color:#ffffff;
}

.wizard-progress li.active .step-text{
    color:#e53935;
}

/*White card form*/
.wizard-card{
    background:#ffffff;
    border-radius:10px;
    width:100%;
    max-width:900px;
    box-shadow:0 3px 15px rgba(0,0,0,0.05);
    display:flex;
    flex-direction:column;
    flex:1;
    min-height:0;
    margin:auto;
}

.wizard-progress li .step-circle{
    width:26px;
    height:26px;
    line-height:26px;
    border-radius:50%;
    background:#e9ecef;
    text-align:center;
    margin-right:8px;
    flex-shrink:0;
    font-size:13px;
}

.wizard-progress::-webkit-scrollbar{
    display:none;
}

.wizard-progress li{
    flex:0 0 auto;
}

#wizard-content{
    max-width:900px;
    width:100%;
}

.wizard-menu li .step-text{
    white-space:normal;
}

.step-text {
    white-space:nowrap;
}

/*completed steps turn green with ✓ */
.step-circle.completed{
    background:#28a745!important;
    color:#fff;
    font-weight:bold;
}

.wizard-container {
    background:#ffffff;
    border-radius:12px;
    overflow:visible;
    box-shadow:0 3px 15px rgba(0,0,0,0.05);
    height:calc(100vh - 100px);
    display:flex;
    flex-direction:column;
}

.wizard-top-header {
    background:#ffffff;
    border-bottom:1px solid #e6e6e6;
    /*border-bottom:3px solid #e53935;*/
    padding:18px 25px;
    font-size:18px;
    font-weight:600;
    color:#2f3542;
}

.wizard-footer{
    border-top:1px solid #e9ecef;
    padding:15px 30px;
    display:flex;
    justify-content:flex-end;
    gap:10px;
    background:#ffffff;
    box-shadow:0 -2px 8px rgba(0,0,0,0.05);
    border-top:1px solid #e9ecef;
    flex-shrink:0;
}

.wizard-body{
    padding:30px;
    overflow-y:auto;
    overflow-x:hidden;
    flex:1;
}

@media (max-width: 992px){

    .wizard-sidebar{
        display:none;
    }
    /*sticks to the top while scrolling*/
    .wizard-progress{
        display:flex;
        position:sticky;
        top:0;
        z-index:5;
    }

    .wizard-main{
        width:100%;
        padding:20px;
    }
    /*When the sidebar hides, the layout grid should switch to one column.*/
    .wizard-layout{
        display:block;
    }
}

@media (max-width:576px){

    .wizard-footer{
        flex-direction:row;
        justify-content:space-between;
        gap:10px;
    }

    .wizard-footer .btn{
        width:auto;
        flex:1;
    }

}

@media (min-width: 993px){

    .wizard-progress{
        display:none;
    }

}
.wizard-menu li, .wizard-progress li{
    cursor:pointer;
}

.wizard-locked{
    opacity:.5;
    cursor:not-allowed!important;
}

/* remove border radius on select2 right side */
.input-group .select2-container--default .select2-selection--single{
    border-top-right-radius:0;
    border-bottom-right-radius:0;
}

/* plus button styling */
.btn-plus{
    border:1px solid #dee2e6;
    border-left:0;
    background:#f8f9fa;

    width:42px;
    height:40px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#6c757d;
    cursor:pointer;
}

.btn-plus:hover{
    color:#0d6efd;
}

.step-circle.partial{
    background:#ffc107!important;
    color:#000;
}

.container-card{
    border:1px solid #e5e7eb;
    border-radius:8px;
}

.container-card .card-header{
    background:#f9fafb;
}

.container-summary{
    font-size:14px;
}

.container-summary strong{
    color:#111827;
}

.input-group .select2-container {
    flex: 1 1 auto;
    width: 1% !important;
}

/* partial export */
table.dataTable tbody tr.row-partial > td{
    box-shadow: inset 0 0 0 9999px #fff3cd !important;
}

/* completed export */
table.dataTable tbody tr.row-complete > td{
    box-shadow: inset 0 0 0 9999px #d1e7dd !important;
}

.custom-timeline {
    list-style: none;
    padding-left: 0;
    position: relative;
}

.custom-timeline::before {
    content: '';
    position: absolute;
    left: 15px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #dee2e6;
}

.custom-timeline li {
    position: relative;
    margin-bottom: 25px;
    padding-left: 45px;
}

.timeline-icon {
    position: absolute;
    left: 0;
    top: 0;
    width: 30px;
    height: 30px;
    background: #e9ecef;
    border-radius: 50%;
    text-align: center;
    line-height: 30px;
}

.timeline-icon i {
    font-size: 14px;
}

.timeline-content {
    background: #f8f9fa;
    padding: 10px 15px;
    border-radius: 6px;
}

.custom-timeline li.active .timeline-icon {
    background: #0d6efd;
    color: #fff;
}

.custom-timeline li.active .timeline-content {
    border-left: 4px solid #0d6efd;
}