/* Base icon styles */
    .fas,
    .fab,
    .far {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* Fix for all circular icons */
    .rounded-circle {
        width: 32px;
        height: 32px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        padding: 0 !important;
    }

    .rounded-circle i {
        font-size: 16px;
        width: auto;
        height: auto;
    }

    /* Card header icons */
    .card-header i {
        width: 24px;
        height: 24px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-left: 8px;
    }

    /* List icons */
    .list-group-item i {
        width: 20px;
        height: 20px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-left: 8px;
    }

    /* Fix for sticky positioning */
    @media (min-width: 992px) {
        .sticky-lg-top {
            position: sticky;
            top: 100px;
            z-index: 1030 !important;
        }

        /* Ensure help box stays below sticky card */
        .card.mt-4.border-info {
            position: relative;
            z-index: 1020;
        }
    }

    /* Mobile adjustments */
    @media (max-width: 991.98px) {
        .sticky-lg-top {
            position: relative !important;
            top: 0 !important;
            margin-bottom: 1rem;
        }

        /* Adjust icon sizes for mobile */
        .card-header i {
            font-size: 20px;
        }

        .rounded-circle {
            width: 28px;
            height: 28px;
        }

        .rounded-circle i {
            font-size: 14px;
        }

        /* Improve spacing */
        .card-body {
            padding: 1rem !important;
        }
    }

    /* Smooth transitions */
    .sticky-lg-top {
        transition: all 0.3s ease;
    }

    i {
        transition: all 0.2s ease;
    }

    /* Fix for accordion icons */
    .accordion-button::after {
        margin-right: 8px;
        margin-left: 0;
    }

    /* Fix for question mark icon in help box */
    .bg-info.text-white.rounded-circle {
        width: 32px;
        height: 32px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        border-radius: 50% !important;
        padding: 0 !important;
    }

    .bg-info.text-white.rounded-circle i {
        font-size: 16px;
        width: auto;
        height: auto;
    }