/*
survey css
mark@worrell.co.za
*/
@media screen and (max-width: 767px) {
    .mediaSpacer {
        margin-top: 5%;
    }

    .aq-alert{
        height: 30vw;
    }
}

html {
    width: 100%;
    height: 100%;
    margin: 0;
}

body{
    background: #FFFFFF;
    width: 100%;
    height: 100%;
    margin: 0;
}

.pointer {cursor: pointer;}

.inspection-micron-td{
    background: lightgray;
    text-align: center;
    margin: 0px;
    padding: 0px;
}

.aq-alert{
    height: 6.6vw;
}

#baking-full{
    display: block !important;
}
    
#baking-small{
    display: none !important;
}

#baking-mobile{
    display: none !important;
}

ul {
    list-style-type: none;
}

.bg {
    background-image: url("/images/home.jpg");
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.btn-dark {
    background: #02243c;
    color: #ffffff;
}

.btn-dark:hover, .btn-dark:focus, .btn-dark:active, .btn-dark.active, .open > .dropdown-toggle.btn-dark {
    background: #12254d;
    color: #ffffff;
}

.btn-grey {
    background: #e6e6e6;
    border-color: #d5d5d5;
    color: #666666;
}

.btn-grey:hover, .btn-grey:focus, .btn-grey:active, .btn-grey.active, .open > .dropdown-toggle.btn-grey {
    background: #d5d5d5;
    color: #ffffff;
}

.btn-rose {
    background: #f26b8b;
    color: #ffffff;
}

.bg-audit-info {
    background: #d9edf7;
    color: #31708f;
}

.bg-audit-beige {
    background: #fcf8e3;
    color: #8a6d3b;
}

.bg-audit-danger {
    background: #f2dede;
    color: #a94442;
}

.bg-audit-success {
    background: #dff0d8;
    color: #3c763d;
}

.bg-audit-grey{
    background: #e6e6e6;
    color: #666666;
}

.bg-dark{
    color: lightgray;
}

.btn-rose:hover, .btn-rose:focus, .btn-rose:active, .btn-rose.active, .open > .dropdown-toggle.btn-rose {
    background: #f05479;
    color: #ffffff;
}

.btn-orange {
    background: #f0c358;
    color: #666666;
}

.btn-orange:hover, .btn-orange:focus, .btn-orange:active, .btn-orange.active, .open > .dropdown-toggle.btn-orange {
    background: #f0c358;
    color: #666666;
}

input[readonly].readonlyclass{
    background-color:transparent;
}

.spacer{
    margin-top: 2%;
}

.spacersm{
    margin-top: 1%;
}

.minusSpacersm{
    margin-bottom: -1%;
}

.btn-group
{
    margin: 0.5% 0 0.5% 0;
}

.input-red
{
    color: red;
}

.specify, #audit-reports-div, #sub-panel, #sub-prep, #sub-paint, #sub-polish, #sub-quality, #bespoke-reporting, #standard-reporting,#oem-reporting,
#audit-todo, #inspection-todo, #paint-todo, #bodyshop-todo,#scale-todo, #mixing-todo, #training-todo, #airflow-todo, #airquality-todo, #baking-todo, #lux-todo, #add_new_client, .defect, #submit-complete-mixing, 
#showComplete, #showAdditionalComplete, #teqex-todo, #followup-todo, #gpakpi-todo, #opportunities-todo, #complaints-todo{
    display: none;
}

.preloader{
    display: none;
    position: fixed;
    height: 100%;
    width: 100%;
    z-index: 1000000;
    top: 0;
    left: 0;
    background-color: rgba(255,255,255,0.5);
}

.preloader-div{
    top: 40%;
    left: 50%;
    z-index: 1000001;
    position: fixed;
}

.view-image, .delete-image, .audit-manage, #audit-reports, .gpakpi-bg{
    cursor: pointer;
}

.gpakpi-bg{
    background: red;
}

.no-curs{
    cursor: default !important;
}

.modal-header{
    background-color: #428bca;
    color: #FFFFFF;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.modal-header-danger{
    background-color: #d9534f;
}

.modal-footer{
    background-color: #EEEEEE;
}

.panel-rose {
    border-color: #f26b8b;
}
.panel-rose > .panel-heading {
    background: #f26b8b; 
    color: #ffffff;
    border-color: #f26b8b;
}

.panel-grey {
    border-color: #e6e6e6;
}
.panel-grey > .panel-heading {
    background: #e6e6e6; 
    color: #666666;
    border-color: #e6e6e6;
}

.panel-dark {
    border-color: #12254d;
}
.panel-dark > .panel-heading {
    background: #12254d; 
    color: #ffffff;
    border-color: #12254d;
}

.panel-red {
    border-color: #bf0000;
}
.panel-red > .panel-heading {
    background: #bf0000; 
    color: #ffffff;
    border-color: #bf0000;
}

.borderless tr td {
    border: none !important;
}

.alertSM {
    padding: 5px 0px 5px 10px;
}

.alertMD {
    padding: 10px 0px 0px 10px;
}

.paint-label{
    font-weight: bold;
    text-decoration: underline;
}

.paint-img, .teqex-img{
    background-size:100% auto;
    background-repeat: no-repeat;
    width: 95%;
    height: 95%;
}

.red-text {
    color: red;
}

.tooltipevent{
    width:400px;
    background:#ccc;
    position:absolute;
    z-index:10001;
    transform:translate3d(-50%,-100%,0);
    font-size: 0.8rem;
    box-shadow: 1px 1px 3px 0px #888888;
    line-height: 1.5rem;
}
.tooltipevent div{
    padding:10px;
}
.tooltipevent div:first-child{
    font-weight:bold;
    color:White;
    background-color:#888888;
    border:solid 1px black;
}
.tooltipevent div:last-child{
    background-color:whitesmoke;
    position:relative;
}
.tooltipevent div:last-child::after, .tooltipevent div:last-child::before{
    width:0;
    height:0;
    border:solid 5px transparent;
    border-bottom:0;
    border-top-color:whitesmoke;
    position: absolute;
    display: block;
    content: "";
    bottom:-4px;
    left:50%;
    transform:translateX(-50%);
}
.tooltipevent div:last-child::before{
    border-top-color:#888888;
    bottom:-5px;
}

@media screen and (max-width: 846px) {
    .aq-alert{
        height: 15vw;
    }

    .container {
        display: inline-block;
    }
    .card{
        width: 128%;
    }
    #baking-full{
        display: none !important;
    }

    #baking-small{
        display: none !important;
    }
    
    #baking-mobile{
        display: block !important;
    }

    .paint-label{
        font-weight: bold;
        text-decoration: underline;
    }

    /* group 1*/
    #workDone1{
        padding: 14% 0% 0% 24%;
    }
    
    #workDone2{
        padding: 14% 0% 0% 15%;
    }
    
    #workDone3{
        padding: 14% 0% 0% 11%;
    }
    
    #workDone4{
        padding: 14% 0% 0% 20%;
    }

    /* group 2*/

    #workDone5{
        padding: 15% 0% 0% 10%;
    }
    
    #workDone6{
        padding: 15% 0% 0% 6.5%;
    }
    
    #workDone7{
        padding: 15% 0% 0% 19.5%;
    }
    
    #workDone8{
        padding: 15% 0% 0% 36%;
    }
    
    #workDone9{
        padding: 15% 0% 0% 10%;
    }

    /* group 3*/

    #workDone10{
        padding: 15% 0% 10% 24%;
    }
    
    #workDone11{
        padding: 15% 0% 10% 15%;
    }
    
    #workDone12{
        padding: 15% 0% 10% 11%;
    }
    
    #workDone13{
        padding: 15% 0% 10% 20%;
    }
}

@media screen and (max-width: 414px) {
    .aq-alert{
        height: 25vw;
    }

    #baking-full{
        display: none !important;
    }

    #baking-small{
        display: block !important;
    }
    
    #baking-mobile{
        display: none !important;
    }

    /* group 1*/
    #workDone1{
        padding: 11% 0% 0% 22%;
    }
    
    #workDone2{
        padding: 11% 0% 0% 10%;
    }
    
    #workDone3{
        padding: 11% 0% 0% 11%;
    }
    
    #workDone4{
        padding: 11% 0% 0% 10%;
    }

    /* group 2*/

    #workDone5{
        padding: 9% 0% 0% 10%;
    }
    
    #workDone6{
        padding: 9% 0% 0% 4%;
    }
    
    #workDone7{
        padding: 9% 0% 0% 12%;
    }
    
    #workDone8{
        padding: 9% 0% 0% 30%;
    }
    
    #workDone9{
        padding: 9% 0% 0% 10%;
    }

    /* group 3*/

    #workDone10{
        padding: 5% 0% 10% 22%;
    }
    
    #workDone11{
        padding: 5% 0% 10% 11%;
    }
    
    #workDone12{
        padding: 5% 0% 10% 10%;
    }
    
    #workDone13{
        padding: 5% 0% 10% 10%;
    }
}

#training_signed small{
    font-size: 100% !important;
}

/* Signature canvas styles */
.signature-canvas {
    border: 1px solid #ccc;
    cursor: crosshair;
    width: 400px;
    height: 400px;
}

/* Training signed container */
#training_signed {
    border: lightgray solid 1px;
}

/* Mobile responsive styles */
@media screen and (max-width: 767px) {
    .signature-canvas {
        width: 100%;
        aspect-ratio: 1/1;
    }
    
    #training_signed {
        border: none;
    }
}

/* Icon column styling for report tables */
.table .icon-cell {
    width: 50px;
    text-align: center;
    padding: 0.75rem 0.5rem !important;
}
.table .icon-cell i {
    font-size: 1.25rem;
}

/* Header title styling for consistent vertical centering */
.header-title-container {
    display: flex;
    align-items: center;
    height: 100%;
}
.header-title-container h4 {
    margin: 0;
}