/* ==========================
   INVENTORY PRICING
   ========================== */

/* ===== ALL LABELS ===== */

.element-type-inventorylistprice
.inventory-price-container:has(.purchasepricevalue)
.pricelabel {
    color: #ffffff !important;

    font-size: 13px !important;
    font-weight: 500 !important;
}


/* ===== INTERNET PRICE LABEL ===== */

.element-type-inventorylistprice
.inventory-price-container:has(.purchasepricevalue)
.internetpricelabel {
    color: #ffffff !important;

    font-size: 14px !important;
    font-weight: 600 !important;
}


/* ===== INTERNET PRICE VALUE ===== */

.element-type-inventorylistprice
.inventory-price-container:has(.purchasepricevalue)
.internetpricelabel + .pricevalue1 {
    color: #ffffff !important;

    font-size: 24px !important;
    font-weight: 800 !important;
}


/* ==========================
   FEES
   ========================== */

.element-type-inventorylistprice
.inventory-price-container:has(.purchasepricevalue)
.disclosedfee {
    color: #ffffff !important;

    font-size: 13px !important;
    font-weight: 500 !important;
}

.element-type-inventorylistprice
.inventory-price-container:has(.purchasepricevalue)
.disclosedfeevalue {
    color: #ffffff !important;

    font-size: 18px !important;
    font-weight: 700 !important;
}


/* ==========================
   TOTAL PRICE
   ========================== */

.element-type-inventorylistprice
.inventory-price-container:has(.purchasepricevalue)
.purchaseprice {
    color: #ffffff !important;

    font-size: 14px !important;
    font-weight: 700 !important;

    text-transform: uppercase !important;
    letter-spacing: 0.4px !important;
}

.element-type-inventorylistprice
.inventory-price-container:has(.purchasepricevalue)
.purchasepricevalue {
    color: #ffffff !important;

    font-size: 30px !important;
    font-weight: 800 !important;
}


/* ==========================
   MOBILE
   ========================== */

@media (max-width: 767px) {

    .element-type-inventorylistprice
    .inventory-price-container:has(.purchasepricevalue)
    .internetpricelabel + .pricevalue1 {
        font-size: 22px !important;
    }

    .element-type-inventorylistprice
    .inventory-price-container:has(.purchasepricevalue)
    .disclosedfeevalue {
        font-size: 16px !important;
    }

    .element-type-inventorylistprice
    .inventory-price-container:has(.purchasepricevalue)
    .purchasepricevalue {
        font-size: 27px !important;
    }
}

/* ==========================
   VDP PRICING
   ========================== */

/* ==========================
   DESKTOP
   ========================== */

@media (min-width: 768px) {

    /* ===== MAIN PRICE ROW ===== */

    .vehicle-details-panel
    > div[style*="padding: 5px 0px"]
    > div[style*="text-align: center"][style*="font-weight: bold"]:first-of-type {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        justify-content: center !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 14px 18px !important;

        box-sizing: border-box !important;

        text-align: center !important;
    }


    /* ==========================
       EACH PRICE GROUP
       ========================== */

    .vehicle-details-panel
    > div[style*="padding: 5px 0px"]
    > div[style*="text-align: center"][style*="font-weight: bold"]:first-of-type
    > div[style*="display: inline-block"] {
        display: flex !important;
        flex: 1 1 0 !important;

        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;

        min-width: 0 !important;

        margin: 0 !important;
        padding: 5px 18px !important;

        box-sizing: border-box !important;
    }


    /* ==========================
       SUBTLE SEPARATION
       ========================== */

    .vehicle-details-panel
    > div[style*="padding: 5px 0px"]
    > div[style*="text-align: center"][style*="font-weight: bold"]:first-of-type
    > div[style*="display: inline-block"]
    + div[style*="display: inline-block"] {
        border-left: 1px solid rgba(0, 0, 0, 0.08);
    }


    /* ==========================
       LABELS
       ========================== */

    .vehicle-details-panel .internetlabel,
    .vehicle-details-panel .disclosedfeelabel,
    .vehicle-details-panel .purchasepricelabel {
        display: block !important;

        margin: 0 0 5px !important;
        padding: 0 !important;

        color: #222222 !important;

        font-family: inherit !important;
        font-size: 12px !important;
        font-weight: 600 !important;

        line-height: 1.25 !important;

        text-align: center !important;

        white-space: normal !important;
    }


    /* ==========================
       INTERNET PRICE
       ========================== */

    .vehicle-details-panel .internetvalue {
        display: block !important;

        margin: 0 !important;
        padding: 0 !important;

        color: #111111 !important;

        font-family: inherit !important;
        font-size: 24px !important;
        font-weight: 800 !important;

        line-height: 1.08 !important;

        text-align: center !important;

        white-space: nowrap !important;
    }


    /* ==========================
       FEES
       ========================== */

    .vehicle-details-panel .disclosedfeevalue {
        display: block !important;

        margin: 0 !important;
        padding: 0 !important;

        color: #333333 !important;

        font-family: inherit !important;
        font-size: 17px !important;
        font-weight: 700 !important;

        line-height: 1.1 !important;

        text-align: center !important;

        white-space: nowrap !important;
    }


    /* ==========================
       TOTAL PRICE
       ========================== */

    .vehicle-details-panel .purchasepricelabel {
        font-size: 13px !important;
        font-weight: 700 !important;

        text-transform: uppercase;
        letter-spacing: 0.4px;
    }

    .vehicle-details-panel .purchasepricevalue {
        display: block !important;

        margin: 0 !important;
        padding: 0 !important;

        font-family: inherit !important;
        font-size: 30px !important;
        font-weight: 800 !important;

        line-height: 1.05 !important;

        text-align: center !important;

        white-space: nowrap !important;
    }
}


/* ==========================
   MOBILE
   ========================== */

@media (max-width: 767px) {

    /* ===== MAIN LIST ===== */

    .vehicle-details-panel
    > div[style*="padding: 5px 0px"]
    > div[style*="text-align: center"][style*="font-weight: bold"]:first-of-type {
        display: block !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 10px 14px !important;

        box-sizing: border-box !important;

        text-align: left !important;
    }


    /* ==========================
       EACH ROW
       ========================== */

    .vehicle-details-panel
    > div[style*="padding: 5px 0px"]
    > div[style*="text-align: center"][style*="font-weight: bold"]:first-of-type
    > div[style*="display: inline-block"] {
        display: grid !important;

        grid-template-columns:
            minmax(0, 1fr)
            auto !important;

        align-items: center !important;

        column-gap: 16px !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 8px 0 !important;

        border: 0 !important;

        box-sizing: border-box !important;
    }


    /* ==========================
       TOTAL PRICE SEPARATION
       ========================== */

    .vehicle-details-panel
    div:has(> .purchasepricelabel) {
        margin-top: 4px !important;

        padding-top: 11px !important;

        border-top: 1px solid rgba(0, 0, 0, 0.10) !important;
    }


    /* ==========================
       MOBILE LABELS
       ========================== */

    .vehicle-details-panel .internetlabel,
    .vehicle-details-panel .disclosedfeelabel,
    .vehicle-details-panel .purchasepricelabel {
        display: block !important;

        margin: 0 !important;
        padding: 0 !important;

        color: #222222 !important;

        font-family: inherit !important;
        font-size: 12px !important;
        font-weight: 600 !important;

        line-height: 1.3 !important;

        text-align: left !important;

        white-space: normal !important;
    }


    /* ==========================
       MOBILE VALUES
       ========================== */

    .vehicle-details-panel .internetvalue,
    .vehicle-details-panel .disclosedfeevalue,
    .vehicle-details-panel .purchasepricevalue {
        display: block !important;

        margin: 0 !important;
        padding: 0 !important;

        font-family: inherit !important;

        line-height: 1.15 !important;

        text-align: right !important;

        white-space: nowrap !important;
    }


    /* ===== INTERNET PRICE ===== */

    .vehicle-details-panel .internetvalue {
        color: #111111 !important;

        font-size: 21px !important;
        font-weight: 800 !important;
    }


    /* ===== FEES ===== */

    .vehicle-details-panel .disclosedfeevalue {
        color: #333333 !important;

        font-size: 15px !important;
        font-weight: 700 !important;
    }


    /* ===== TOTAL PRICE ===== */

    .vehicle-details-panel .purchasepricelabel {
        font-weight: 700 !important;
    }

    .vehicle-details-panel .purchasepricevalue {
        font-size: 25px !important;
        font-weight: 800 !important;
    }
}