<?php
/**
 * Custom Single Product Template - Courses (Udemy Style)
 *
 * Overrides WooCommerce single product layout for <?php echo $product_type; ?>s.
 */

if (!defined('ABSPATH')) {
    exit; // Exit if accessed directly
}

get_header('shop');

do_action('woocommerce_before_main_content');

global $product;
if (!$product || !is_a($product, 'WC_Product')) {
    $product = wc_get_product(get_the_ID());
}

$product_type = esc_attr($product->get_type());
?>
		<?php while ( have_posts() ) : ?>
			<?php the_post(); ?>
<?php
echo "<style>
    .$product_type-layout {
        max-width: 1100px;
        margin: auto;
        padding: 30px;
        display: grid;
        grid-template-columns: 2fr 1fr;
        gap: 30px;
        background: #fff;
        border-radius: 10px;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    }

    .$product_type-header {
        text-align: center;
        padding-bottom: 15px;
        border-bottom: 2px solid #ddd;
    }

    .$product_type-main {
        padding: 20px;
    }

    .$product_type-sidebar {
        background: #f7f7f7;
        padding: 20px;
        border-radius: 10px;
        position: sticky;
        top: 20px;
    }

    .$product_type-sidebar .price {
        font-size: 26px;
        font-weight: bold;
        margin-bottom: 10px;
    }

    .$product_type-sidebar .$product_type-enrollment button {
        width: 100%;
        padding: 12px;
        font-size: 18px;
        border: none;
        background: #ff5500;
        color: #fff;
        cursor: pointer;
        border-radius: 5px;
        transition: 0.3s;
    }
    .$product_type-sidebar .$product_type-enrollment button:hover {
        background: #cc4400;
    }
    .woocommerce div.$product_type-images div.images .woocommerce-product-gallery__trigger {
        position: absolute;
        top: .5em;
        left: .5em;
        font-size: 2em;
        z-index: 9;
        width: 36px;
        height: 36px;
        background: #fff;
        text-indent: -9999px;
        border-radius: 100%;
        box-sizing: content-box;
    }

    .woocommerce div.$product_type-images div.images .woocommerce-product-gallery__trigger::before {
        content: '';
        display: block;
        width: 10px;
        height: 10px;
        border: 2px solid #000;
        border-radius: 100%;
        position: absolute;
        top: 9px;
        right: 9px;
        box-sizing: content-box;
    }

    .woocommerce div.$product_type-images div.images .woocommerce-product-gallery__trigger::after {
        content: '';
        display: block;
        width: 2px;
        height: 8px;
        background: #000;
        border-radius: 6px;
        position: absolute;
        top: 19px;
        right: 22px;
        transform: rotate(45deg);
        box-sizing: content-box;
    }

    .woocommerce div.$product_type-images div.images.woocommerce-product-gallery {
        position: relative;
    }

    section.related.products {
    margin-top: 5%;
}
.$product_type-sidebar .quantity {
        margin: 10px 0;
    }
    .$product_type-sidebar {
        text-align: center;
    }


    @media (max-width: 768px) {
        .$product_type-layout {
            grid-template-columns: 1fr;
        }
    }
</style>";

wc_print_notices();
?>


<div class="<?php echo $product_type; ?>-layout">
    <div class="product <?php echo $product_type; ?>-main">
        <h1 class="<?php echo $product_type; ?>-title"><?php the_title(); ?></h1>
        <div class="woocommerce-product-rating">
            <?php woocommerce_template_single_rating(); ?>
        </div>
        <p class="<?php echo $product_type; ?>-meta"><?php echo $product->get_short_description(); ?></p>
        <div class="<?php echo $product_type; ?>-description">
            <?php woocommerce_output_product_data_tabs(); ?>
        </div>
    </div>
    <aside class="<?php echo $product_type; ?>-sidebar">
        <div class="<?php echo $product_type; ?>-images">
            <?php woocommerce_show_product_images(); ?>
        </div>
        <div class="<?php echo $product_type; ?>-enrollment">
            <p class="price"> <?php echo $product->get_price_html(); ?></p>
            <?php do_action('woocommerce_single_product_summary'); ?>
        </div>
    </aside>
</div>

<?php woocommerce_output_related_products(); ?>
<?php endwhile; // end of the loop. ?>

<?php

do_action('woocommerce_after_main_content');
get_footer('shop');
?>
