/* ==========================================================================
   ISSUES SPRINT FIX PACK — #23, #24, #27, #28
   Extracted from style.css to keep the main file focused.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Issue #23: Review form — stars on own line, compact labels
   -------------------------------------------------------------------------- */

/* Stars appear directly below the "Your Rating" label, not inline */
.woocommerce .comment-form-rating {
    flex-direction: column !important;
    align-items: flex-start !important;
}

.woocommerce .comment-form-rating label {
    display: block !important;
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 6px;
}

.woocommerce .comment-form-rating .stars {
    display: block !important;
    margin-left: 0;
    line-height: 1;
}

/* "Your review" label — same compact size */
.woocommerce #review_form .comment-form-comment label {
    font-size: 0.85rem;
    font-weight: 600;
}

/* Name + Email fields side by side on tablet and up (matches image8 reference) */
@media (min-width: 480px) {

    .woocommerce #review_form .comment-form-author,
    .woocommerce #review_form .comment-form-email {
        display: inline-block !important;
        width: calc(50% - 8px) !important;
        vertical-align: top;
        box-sizing: border-box;
    }

    .woocommerce #review_form .comment-form-author {
        margin-right: 8px;
    }
}

/* On very narrow screens Name + Email stack full-width */
@media (max-width: 479px) {

    .woocommerce #review_form .comment-form-author,
    .woocommerce #review_form .comment-form-email {
        display: block !important;
        width: 100% !important;
        margin-right: 0;
    }
}

/* --------------------------------------------------------------------------
   Issue #24: Mobile — sticky bar covers bottom product page content.
   Add body padding so the last visible content is never hidden behind the bar.
   -------------------------------------------------------------------------- */

@media (max-width: 640px) {
    body.single-product {
        padding-bottom: 60px;
    }
}


/* --------------------------------------------------------------------------
   Issue #28: Home page — reduce section padding gap between product rows
   Both .log-products and .log-products--trending use padding:100px 0 which
   creates a ~200px gap when they're adjacent. Reduce to 60px each.
   -------------------------------------------------------------------------- */

.log-products {
    padding: 60px 0;
}

.log-products--trending {
    padding: 60px 0;
}

@media (max-width: 767px) {
    .log-products {
        padding: 40px 0;
    }

    .log-products--trending {
        padding: 40px 0;
    }
}

/* --------------------------------------------------------------------------
   Mobile/Tablet: Page content top spacing
   Covers all pages (.page) and WooCommerce cart (.woocommerce-cart),
   plus any future pages added to the site.
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {

    body.woocommerce-cart #primary {
        margin-top: 2em;
    }
}