/* ============================================
   Services Icons Display Fix
   Ensures all icons show properly with consistent colors
   ============================================ */

/* Force default icons to be visible */
.finance-section .finance-wrapper .caption {
    overflow: visible !important;
}

/* Default icon - make all icons white/light colored */
.finance-section .finance-wrapper .caption > img:first-child {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 45px !important;
    height: auto !important;
    max-width: 45px !important;
    max-height: 45px !important;
    padding: 0 !important;
    padding-top: 0 !important;
    margin: 0 !important;
    z-index: 2 !important;
    filter: brightness(0) invert(1) !important; /* Make all icons white */
}

/* Hover icon container - ensure it's positioned correctly */
.finance-section .finance-wrapper .caption .hover-icon {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 45px !important;
    height: 45px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 0 !important;
    visibility: hidden !important;
    z-index: 3 !important;
    transition: all 0.3s ease !important;
}

/* Hover icon image - make all hover icons orange/colored (remove white filter) */
.finance-section .finance-wrapper .caption .hover-icon img {
    width: 45px !important;
    height: auto !important;
    max-width: 45px !important;
    max-height: 45px !important;
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    filter: none !important; /* Show original icon colors on hover */
}

/* On hover - hide default icon, show hover icon */
.finance-section .finance-wrapper:hover .caption > img:first-child {
    opacity: 0 !important;
    visibility: hidden !important;
}

.finance-section .finance-wrapper:hover .caption .hover-icon {
    opacity: 1 !important;
    visibility: visible !important;
}

.finance-section .finance-wrapper:hover .caption .hover-icon img {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

/* Ensure caption background is visible */
.finance-section .finance-wrapper .caption {
    background-color: #f36d38 !important;
}

.finance-section .finance-wrapper:hover .caption {
    background-color: #fff !important;
}

/* Fix for Bookkeeping and General Financial - ensure hover icons show */
.finance-section .finance-wrapper .caption .hover-icon {
    pointer-events: none !important;
}

.finance-section .finance-wrapper:hover .caption .hover-icon {
    pointer-events: auto !important;
}
