/*
 Theme Name:   Bricks Child Theme
 Template:     bricks
 Version:      1.9
*/

/* Global Layout - Max Width 1440px */
#brxe-topbar,
#brxe-mainheader {
    max-width: 1440px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

#brx-content {
    max-width: 1440px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

#brx-content > .brxe-section {
    max-width: 1440px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Menu - spacing */
#brxe-nav-menu ul.bricks-nav-menu {
    display: flex !important;
    gap: 32px !important;
}

#brxe-nav-menu ul.bricks-nav-menu > li.bricks-menu-item {
    margin: 0 !important;
}

/* CTA Button - matching DEV styles */
#brxe-cta-btn.bricks-button {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    white-space: nowrap !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    /* Match DEV styles */
    border-radius: 16px !important;
    padding: 12px 20px !important;
    font-size: 14px !important;
}

#brxe-cta-btn.bricks-button::after {
    content: '' !important;
    display: inline-block !important;
    width: 16px !important;
    height: 16px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23272154' stroke-width='2'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3Cpolyline points='12 5 19 12 12 19'%3E%3C/polyline%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    flex-shrink: 0 !important;
    transition: transform 0.3s ease !important;
}

/* CTA Button hover effects */
#brxe-cta-btn.bricks-button:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 20px rgba(84, 53, 118, 0.25) !important;
}

#brxe-cta-btn.bricks-button:hover::after {
    transform: translateX(4px) !important;
}

/* ===== FOOTER STYLES ===== */

/* Footer buttons with arrows */
#brxe-ft-btn-consult.bricks-button,
#brxe-ft-btn-visit.bricks-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    white-space: nowrap !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease !important;
}

#brxe-ft-btn-consult.bricks-button::after,
#brxe-ft-btn-visit.bricks-button::after {
    content: '' !important;
    display: inline-block !important;
    width: 16px !important;
    height: 16px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFDF9' stroke-width='2'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3Cpolyline points='12 5 19 12 12 19'%3E%3C/polyline%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    flex-shrink: 0 !important;
    transition: transform 0.3s ease !important;
}

/* Footer button hover effects */
#brxe-ft-btn-consult.bricks-button:hover,
#brxe-ft-btn-visit.bricks-button:hover {
    background-color: rgba(255, 253, 249, 0.1) !important;
    transform: translateY(-2px) !important;
}

#brxe-ft-btn-consult.bricks-button:hover::after,
#brxe-ft-btn-visit.bricks-button:hover::after {
    transform: translateX(4px) !important;
}

/* Footer links hover */
#brx-footer a:hover {
    opacity: 0.8 !important;
}

/* Footer container max-width */
#brxe-ft-container {
    max-width: 1440px !important;
}

/* Footer logo - white version via CSS filter */
#brxe-ft-logo img {
    filter: brightness(0) invert(1) !important;
}

/* Fix: Footer logo selector - img has the ID directly */
img#brxe-ft-logo {
    filter: brightness(0) invert(1) !important;
    width: 180px !important;
    height: auto !important;
}
