/* Professional Header Message - Fixed Layout */
.header-top {
    background: linear-gradient(135deg, #7cbc42 0%, #8fd750 100%);
    color: white;
}

/* Only center the message itself, not the entire header structure */
.header-top__message.simple-message {
    color: white;
    font-weight: 600;
    font-size: 0.9rem;
    padding: 0.75rem 1rem;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.2;
    width: 100%;
}

/* Make phone number same color as rest of text */
.header-top__message .header-phone {
    color: white !important;
    font-weight: 600;
    text-decoration: none;
}

/* DON'T center the header-top-desktop - leave it as is */
.header-top-desktop {
    /* Remove centering that was breaking layout */
}

/* DON'T center header-top__left - leave the grid system intact */
.header-top__left {
    /* Remove centering that was moving Sign In/Basket */
}

/* Keep user info and cart in their proper position (header-top__right) */
.header-top__right {
    text-align: right;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

/* Style user info and cart properly on green background */
.header-top__right .user-info,
.header-top__right #_desktop_cart {
    color: white;
}

.header-top__right .header-block__action-btn {
    color: white !important;
    text-decoration: none;
}

.header-top__right .header-block__title {
    color: white !important;
}

.header-top__right .header-block__icon {
    color: white !important;
}

.header-top__right .header-block__badge {
    background: rgba(255, 255, 255, 0.2) !important;
    color: white !important;
    border: 1px solid rgba(255, 255, 255, 0.3);
}

/* Make payment icons smaller and more professional */
.header-payment-icons {
    opacity: 0.9;
    justify-content: flex-end;
    display: flex;
    align-items: center;
}

.header-payment-icons img {
    height: 28px !important;
    width: auto !important;
    margin: 0 3px !important;
    border-radius: 3px;
    filter: drop-shadow(0 1px 3px rgba(0,0,0,0.2));
    transition: transform 0.2s ease;
}

.header-payment-icons img:hover {
    transform: scale(1.05);
}

/* Mobile responsiveness */
@media (max-width: 768px) {
    .header-top__message.simple-message {
        font-size: 0.8rem;
        padding: 0.5rem;
        white-space: normal;
        line-height: 1.3;
    }

    .header-top__right {
        margin-top: 0.5rem;
    }

    @media (max-width: 480px) {
        .header-top__message.simple-message {
            font-size: 0.75rem;
            padding: 0.4rem;
        }
    }
}

/* Professional header styling for main header */
.header-bottom {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    background: white;
    padding: 5px;    
}

.logo img {
    max-height: 70px !important;
    transition: transform 0.3s ease;
}

.logo:hover img {
    transform: scale(1.02);
}

/* Override any conflicting styles */
.header-top a,
.header-top span {
    color: rgb(32, 32, 32) !important;
}

/* Ensure proper spacing */
.header-top .container-md {
    padding: 0 1rem;
}