Custom Shipping Method Description Tooltips

/**
 * Snippet Name:     Custom Shipping Method Description Tooltips
 * Snippet Author:   coding-bunny.com
 * Description:      Adds a custom description field for each WooCommerce shipping method and displays it as a tooltip next to the method title on the checkout page.
 */

// Initialize the process to add a custom field for each shipping method
add_action( 'init', 'cb_init_shipping_description', 100 );
function cb_init_shipping_description() {
    // Get all available shipping methods in WooCommerce
    $shipping_methods = WC()->shipping->get_shipping_methods();

    // Loop through each method and apply filter to add custom description field
    foreach ( $shipping_methods as $id => $shipping_method ) {
        add_filter( "woocommerce_shipping_instance_form_fields_$id", 'cb_add_shipping_description_field' );
    }
}

/**
 * Add a custom description field to each shipping method in the WooCommerce admin area.
 */
function cb_add_shipping_description_field( $fields ) {
    // Define the new description field
    $new_fields = array(
        'description' => array(
            'title' => 'Description',
            'type'  => 'textarea',
            'css'   => 'width: 100%;',
        ),
    );

    // Insert the new description field right after the 'title' field
    $keys  = array_keys( $fields );
    $index = array_search( 'title', $keys, true );
    $pos   = false === $index ? count( $fields ) : $index + 1;

    return array_merge( array_slice( $fields, 0, $pos ), $new_fields, array_slice( $fields, $pos ) );
}

/**
 * Store the custom description field as metadata for each shipping method.
 */
add_filter( 'woocommerce_shipping_method_add_rate_args', 'cb_save_shipping_description_meta', 10, 2 );
function cb_save_shipping_description_meta( $args, $method ) {
    $args['meta_data']['description'] = htmlentities( $method->get_option( 'description' ) );
    return $args;
}

/**
 * Display the description as a tooltip next to the shipping method title on the checkout page.
 */
add_action( 'woocommerce_after_shipping_rate', 'cb_display_shipping_description_tooltip', 10 );
function cb_display_shipping_description_tooltip( $method ) {
    // Retrieve metadata for the description field
    $meta_data = $method->get_meta_data();

    // Check if a description exists, then display it in a tooltip
    if ( array_key_exists( 'description', $meta_data ) ) {
        $description = apply_filters( 'cb_description_output', html_entity_decode( $meta_data['description'] ), $method );

        if ( $description ) {
            $html = '<div class="tooltip"> 
                        <i class="fa fa-question-circle" style="color: #E8363C;" aria-hidden="true"></i>
                        <span class="tooltiptext">' . wp_kses( $description, wp_kses_allowed_html( 'post' ) ) . '</span>
                     </div>';
            echo apply_filters( 'cb_description_output_html', $html, $description, $method );
        }
    }
}      

/* Tooltip container */
.tooltip {
    position: relative;
    display: inline-block;
    float: right;
    text-align: right;
}

/* Tooltip text */
.tooltip .tooltiptext {
    visibility: hidden;
    width: 150px;
    background-color: #2d2d2d;
    color: #ffffff;
    text-align: center;
    border-radius: 3px;
    padding: 15px;
    position: absolute;
    z-index: 1;
    bottom: 100%;
    left: 50%;
    margin-left: -75px; /* Center alignment for tooltip */
    font-size: 12px;
    line-height: 1.5;
    opacity: 0;
    transition: opacity 0.3s;
}

/* Tooltip arrow */
.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #2d2d2d transparent transparent transparent;
}

/* Show tooltip text on hover */
.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}