@media (min-width: 769px) {
    .desktop-cart-button, .desktop-menu-button {
        position: fixed;
        width: 60px;
        height: 60px;
        background-color: #ed5c1e; /* Matches header background */
        border-radius: 50%;
        border: none;
        cursor: pointer;
        z-index: 900;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.2s ease;
        left: max(70px, calc((100vw - 1500px) / 2));
    }
    .scroll-to-top {
        width: 60px;
        height: 60px;
        background-color: #ed5c1e; /* Matches header background */
        left: max(70px, calc((100vw - 1500px) / 2));
        bottom: 170px;
    }
    
    .scroll-to-top::before {
        color: #FFFFFF;
        font-size: 43px;
    }
    .desktop-cart-button {
        bottom: 100px;
    }
    .desktop-menu-button {
        bottom: 30px;
    }

    .desktop-cart-button:hover, .desktop-menu-button:hover {
        background-color: #ed5c1ea6; /* Matches city-button hover in header.css */
        transform: scale(1.1);
    }

    .desktop-cart-button img {
        width: 40px;
        height: 40px;
        filter: brightness(0) invert(1); /* Makes cart icon white */
    }

    /* Hamburger icon for menu button */
    .desktop-menu-button .hamburger {
        width: 30px;
        height: 3px;
        background: #FFFFFF;
        position: relative;
    }

    .desktop-menu-button .hamburger::before,
    .desktop-menu-button .hamburger::after {
        content: '';
        width: 30px;
        height: 3px;
        background: #FFFFFF;
        position: absolute;
        left: 0;
    }

    .desktop-menu-button .hamburger::before {
        top: -9px;
    }

    .desktop-menu-button .hamburger::after {
        bottom: -9px;
    }

    .mobile-menu.active-desktop {
        display: block;
        left: 0;
    }

    /* Contact button styles */
    .contact-button {
        position: fixed;
        width: 60px;
        height: 60px;
        background-color: #4CAF50; /* Green color */
        border-radius: 50%;
        border: none;
        cursor: pointer;
        z-index: 900;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.2s ease;
        right: max(20px, calc((100vw - 1500px) / 2));
        bottom: 20px;
    }

    .contact-button:hover {
        background-color: #45a049; /* Slightly darker green on hover */
        transform: scale(1.1);
    }

    .contact-button .contact-icon {
        width: 30px;
        height: 30px;
        filter: brightness(0) invert(1); /* Makes phone icon white */
    }
}

@media (max-width: 768px) {
    .contact-button {
        position: fixed;
        width: 50px;
        height: 50px;
        background-color: #4CAF50; /* Green color */
        border-radius: 50%;
        border: none;
        cursor: pointer;
        z-index: 900;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.2s ease;
        right: 15px;
        bottom: 15px;
    }

    .contact-button:hover {
        background-color: #45a049; /* Slightly darker green on hover */
        transform: scale(1.1);
    }

    .contact-button .contact-icon {
        width: 25px;
        height: 25px;
        filter: brightness(0) invert(1); /* Makes phone icon white */
    }
}