/* =========================================================
   ComprasApp V3.5 purchase order create fixes
   Purpose: keep date fields inside their frame and make item search
   results compact enough for phone operation.
   ========================================================= */

.purchase-order-form,
.purchase-order-form *{
    box-sizing:border-box;
}

.purchase-order-form label{
    min-width:0 !important;
}

.purchase-order-form input[type="date"],
.purchase-order-form input[type="text"],
.purchase-order-form input[type="number"],
.purchase-order-form select,
.purchase-order-form textarea{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
}

.purchase-order-form input[type="date"]{
    appearance:auto !important;
    -webkit-appearance:auto !important;
    font-size:13px !important;
    padding-inline:8px !important;
}

.purchase-order-form .purchase-item-results{
    width:100% !important;
    max-width:100% !important;
    max-height:230px !important;
    overflow:auto !important;
    margin-top:6px !important;
    border:1px solid rgba(0,0,0,.10) !important;
    border-radius:12px !important;
    background:#fff !important;
    box-shadow:0 10px 24px rgba(0,0,0,.10) !important;
}

.purchase-order-form .purchase-item-results .purchase-item-result{
    min-height:0 !important;
    border-radius:0 !important;
    padding:7px 9px !important;
    font-size:12px !important;
    line-height:1.18 !important;
    font-weight:650 !important;
}

.purchase-order-form .purchase-item-results .purchase-item-result strong{
    display:block !important;
    font-size:12.5px !important;
    line-height:1.18 !important;
    font-weight:850 !important;
}

.purchase-order-form .purchase-item-results .purchase-item-result .muted{
    display:block !important;
    margin-top:2px !important;
    font-size:10.5px !important;
    line-height:1.2 !important;
}

@media(max-width:760px){
    .purchase-order-form > .grid.three{
        grid-template-columns:1fr !important;
    }

    .purchase-order-form > .grid.three label{
        width:100% !important;
    }

    .purchase-order-form input[type="date"]{
        min-height:36px !important;
    }
}
