/* ==========================
   INVENTORY PRICE PANEL
   ========================== */

.element-type-inventorylistprice .inventory-price-container {
    padding: 14px 16px !important;

    text-align: center;

    border-radius: 8px;
    box-sizing: border-box;
}


/* ==========================
   INTERNET PRICE
   ========================== */

.element-type-inventorylistprice .internetpricelabel {
    margin: 0 0 2px;

    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
}

.element-type-inventorylistprice .internetpricelabel + .pricevalue1 {
    margin-bottom: 9px;

    color: #e00000 !important;

    font-size: 21px !important;
    font-weight: 700;

    line-height: 1.2;
}


/* ==========================
   ADDITIONAL FEES
   ========================== */

.element-type-inventorylistprice .disclosedfee {
    margin-top: 5px;

    font-size: 13px;
    font-weight: 400;
    line-height: 1.3;
}

.element-type-inventorylistprice .disclosedfeevalue {
    margin-top: 1px;

    color: #555 !important;

    font-size: 16px !important;
    font-weight: 600;

    line-height: 1.2;
}


/* ==========================
   PURCHASE PRICE
   ========================== */

.element-type-inventorylistprice .purchaseprice {
    margin-top: 12px;
    padding-top: 10px;

    border-top: 1px solid rgba(0, 0, 0, 0.12);

    font-size: 15px;
    font-weight: 600;
    line-height: 1.3;
}

.element-type-inventorylistprice .purchasepricevalue {
    margin-top: 2px;

    color: #e00000 !important;

    font-size: 25px !important;
    font-weight: 700;

    line-height: 1.15;
}


/* ==========================
   PRICE NOTE
   ========================== */

.element-type-inventorylistprice .pricenote {
    padding-top: 8px !important;

    font-size: 12px;
    line-height: 1.35;
}


/* ==========================
   MOBILE
   ========================== */

@media (max-width: 767px) {

    .element-type-inventorylistprice .inventory-price-container {
        padding: 12px 14px !important;
    }

    .element-type-inventorylistprice .internetpricelabel {
        font-size: 13px;
    }

    .element-type-inventorylistprice .internetpricelabel + .pricevalue1 {
        font-size: 20px !important;
    }

    .element-type-inventorylistprice .disclosedfee {
        font-size: 12px;
    }

    .element-type-inventorylistprice .disclosedfeevalue {
        font-size: 15px !important;
    }

    .element-type-inventorylistprice .purchaseprice {
        font-size: 14px;
    }

    .element-type-inventorylistprice .purchasepricevalue {
        font-size: 23px !important;
    }
}

/* ==========================
   ADDITIONAL FEE COLORS
   ========================== */

.element-type-inventorylistprice .disclosedfee {
    color: #2f2f2f !important;
    font-weight: 500;
}

.element-type-inventorylistprice .disclosedfeevalue {
    color: #006fca !important;
    font-weight: 700;
}



/* ==========================
   VDP PRICE SECTION
   ========================== */

.vehicle-details-panel:has(.internetlabel) {
    padding: 12px 20px !important;
    box-sizing: border-box;
}


/* ==========================
   DESKTOP / TABLET
   ========================== */

@media (min-width: 768px) {

    /* ===== PRICE LAYOUT ===== */

    .vehicle-details-panel:has(.internetlabel)
    > div
    > div:first-of-type {
        display: grid !important;

        grid-template-columns:
            minmax(180px, 1.25fr)
            minmax(120px, 0.8fr)
            minmax(120px, 0.8fr)
            minmax(180px, 1.25fr);

        width: 100%;

        align-items: stretch;

        text-align: center !important;
    }


    /* ===== PRICE GROUPS ===== */

    .vehicle-details-panel:has(.internetlabel)
    > div
    > div:first-of-type
    > div {
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        width: 100%;

        padding: 10px 20px !important;

        border-right: 1px solid rgba(0, 0, 0, 0.12);

        box-sizing: border-box;
    }

    .vehicle-details-panel:has(.internetlabel)
    > div
    > div:first-of-type
    > div:last-child {
        border-right: 0;
    }


    /* ===== INTERNET PRICE ===== */

    .vehicle-details-panel:has(.internetlabel) .internetlabel {
        padding: 0 !important;

        color: #333 !important;

        font-size: 15px !important;
        font-weight: 600;

        line-height: 1.3 !important;
    }

    .vehicle-details-panel:has(.internetlabel) .internetvalue {
        padding: 4px 0 0 !important;

        color: #e00000 !important;

        font-size: 22px !important;
        font-weight: 700 !important;

        line-height: 1.15 !important;
    }


    /* ===== ADDITIONAL FEES ===== */

    .vehicle-details-panel:has(.internetlabel) .disclosedfeelabel {
        padding: 0 !important;

        color: #333 !important;

        font-size: 13px !important;
        font-weight: 500;

        line-height: 1.3 !important;
    }

    .vehicle-details-panel:has(.internetlabel) .disclosedfeevalue {
        padding: 4px 0 0 !important;

        color: #0f3d63 !important;

        font-size: 17px !important;
        font-weight: 700 !important;

        line-height: 1.15 !important;

        white-space: nowrap;
    }


    /* ===== PURCHASE PRICE ===== */

    .vehicle-details-panel:has(.internetlabel) .purchasepricelabel {
        padding: 0 !important;

        color: #222 !important;

        font-size: 16px !important;
        font-weight: 700;

        line-height: 1.3 !important;
    }

    .vehicle-details-panel:has(.internetlabel) .purchasepricevalue {
        padding: 4px 0 0 !important;

        color: #e00000 !important;

        font-size: 26px !important;
        font-weight: 700 !important;

        line-height: 1.1 !important;
    }
}


/* ==========================
   MOBILE
   ========================== */

@media (max-width: 767px) {

    .vehicle-details-panel:has(.internetlabel) {
        padding: 10px 14px !important;
    }


    /* ===== PRICE LAYOUT ===== */

    .vehicle-details-panel:has(.internetlabel)
    > div
    > div:first-of-type {
        display: block !important;

        width: 100%;

        text-align: left !important;
    }


    /* ===== PRICE ROWS ===== */

    .vehicle-details-panel:has(.internetlabel)
    > div
    > div:first-of-type
    > div {
        display: grid !important;

        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;

        column-gap: 14px;

        width: 100%;

        padding: 5px 0 !important;

        border: 0 !important;

        box-sizing: border-box;
    }


    /* ===== INTERNET PRICE ===== */

    .vehicle-details-panel:has(.internetlabel) .internetlabel {
        padding: 0 !important;

        color: #333 !important;

        font-size: 14px !important;
        font-weight: 600;

        line-height: 1.3 !important;
    }

    .vehicle-details-panel:has(.internetlabel) .internetvalue {
        padding: 0 !important;

        color: #e00000 !important;

        font-size: 19px !important;
        font-weight: 700 !important;

        line-height: 1.2 !important;

        white-space: nowrap;
    }


    /* ===== ADDITIONAL FEES ===== */

    .vehicle-details-panel:has(.internetlabel) .disclosedfeelabel {
        padding: 0 !important;

        color: #333 !important;

        font-size: 13px !important;
        font-weight: 500;

        line-height: 1.3 !important;
    }

    .vehicle-details-panel:has(.internetlabel) .disclosedfeevalue {
        padding: 0 !important;

        color: #0f3d63 !important;

        font-size: 16px !important;
        font-weight: 700 !important;

        line-height: 1.2 !important;

        white-space: nowrap;
    }


    /* ===== PURCHASE PRICE ===== */

    .vehicle-details-panel:has(.internetlabel)
    div:has(> .purchasepricelabel) {
        display: grid !important;

        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;

        margin-top: 6px;

        padding: 10px 0 2px !important;

        border-top: 1px solid rgba(0, 0, 0, 0.14) !important;
    }

    .vehicle-details-panel:has(.internetlabel) .purchasepricelabel {
        padding: 0 !important;

        color: #222 !important;

        font-size: 15px !important;
        font-weight: 700;

        line-height: 1.3 !important;
    }

    .vehicle-details-panel:has(.internetlabel) .purchasepricevalue {
        padding: 0 !important;

        color: #e00000 !important;

        font-size: 23px !important;
        font-weight: 700 !important;

        line-height: 1.1 !important;

        white-space: nowrap;
    }
}

/* ==========================
   VDP FEE COLORS
   ========================== */

/* ===== FEE LABELS ===== */

.vehicle-details-panel:has(.internetlabel) .disclosedfeelabel {
    color: #2f2f2f !important;
    font-weight: 600;
}


/* ===== FEE VALUES ===== */

.vehicle-details-panel:has(.internetlabel) .disclosedfeevalue {
    color: #006fca !important;
    font-weight: 700 !important;
}