/* Hide obsolete Summary button without removing
   the DOM node used by legacy dashboard JS. */
#summaryBtn {
    display:
        none !important;
}


.aoCalibrationOverlay {

    position:
        fixed;

    inset:
        0;

    z-index:
        20000;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        24px;

    background:
        rgba(
            3,
            9,
            18,
            .76
        );

    backdrop-filter:
        blur(4px);
}


.aoCalibrationWindow {

    width:
        min(
            1100px,
            100%
        );

    max-height:
        86vh;

    display:
        flex;

    flex-direction:
        column;

    overflow:
        hidden;

    border:
        1px solid
        rgba(
            148,
            163,
            184,
            .20
        );

    border-radius:
        16px;

    background:
        #0f1b2d;

    color:
        #eef4ff;

    box-shadow:
        0 30px 90px
        rgba(
            0,
            0,
            0,
            .50
        );
}


.aoCalibrationHeader {

    padding:
        20px 22px;

    display:
        flex;

    align-items:
        flex-start;

    justify-content:
        space-between;

    gap:
        20px;

    border-bottom:
        1px solid
        rgba(
            148,
            163,
            184,
            .14
        );
}


.aoCalibrationTitle {

    font-size:
        22px;

    font-weight:
        800;
}


.aoCalibrationSubtitle {

    margin-top:
        4px;

    color:
        #8fa0b8;

    font-size:
        12px;
}


.aoCalibrationClose {

    width:
        36px;

    height:
        36px;

    border:
        1px solid #33455f;

    border-radius:
        8px;

    background:
        #17263b;

    color:
        white;

    cursor:
        pointer;

    font-size:
        20px;
}


.aoCalibrationSummary {

    padding:
        14px 22px;

    color:
        #9aabc0;

    font-size:
        12px;

    border-bottom:
        1px solid
        rgba(
            148,
            163,
            184,
            .10
        );
}


.aoCalibrationBody {

    overflow:
        auto;

    padding:
        0 22px 22px;
}


.aoCalibrationTable {

    width:
        100%;

    border-collapse:
        collapse;

    font-size:
        13px;
}


.aoCalibrationTable th {

    position:
        sticky;

    top:
        0;

    z-index:
        1;

    padding:
        13px 10px;

    text-align:
        left;

    color:
        #91a2b9;

    background:
        #0f1b2d;

    border-bottom:
        1px solid #263851;

    font-size:
        11px;

    text-transform:
        uppercase;

    letter-spacing:
        .04em;
}


.aoCalibrationTable td {

    padding:
        13px 10px;

    border-bottom:
        1px solid
        rgba(
            148,
            163,
            184,
            .10
        );
}


.aoCalibrationVehicle {

    font-weight:
        750;
}


.aoCalibrationDays {

    font-weight:
        800;
}


.aoCalibrationDays.ok {

    color:
        #86efac;
}


.aoCalibrationDays.soon {

    color:
        #fde68a;
}


.aoCalibrationDays.urgent {

    color:
        #fca5a5;
}


.aoCalibrationNoData {

    color:
        #718096;
}


.aoCalibrationLoading {

    padding:
        50px 20px;

    text-align:
        center;

    color:
        #94a3b8;
}


@media (
    max-width: 760px
) {

    .aoCalibrationOverlay {

        padding:
            10px;
    }


    .aoCalibrationWindow {

        max-height:
            94vh;
    }


    .aoCalibrationBody {

        padding:
            0 12px 16px;
    }


    .aoCalibrationTable {

        font-size:
            11px;
    }
}