/*
Theme Name: thegrafxguy
Author: Chad Michael Elliott
Description: Core global styles and WooCommerce layout overrides.
Version: 1.0
*/

/* ============================================================
   GLOBAL DEFAULTS
============================================================ */

body {
    margin: 0;
    padding: 0;
    background: #0b0b0d;
    color: #e5e5e5;
    font-family: 'Inter', Arial, sans-serif;
    font-size: 16px;
    line-height: 1.55;
}

/* ============================================================
   HEADINGS — TEKO
============================================================ */

h1, h2, h3, h4, h5, h6 {
    font-family: 'Teko', sans-serif;
    font-weight: 600;
    margin: 0 0 0.4em 0;
    line-height: 1.1;
    color: #e5e5e5;
}

h1 { font-size: 3rem; }
h2 { font-size: 2.4rem; }
h3 { font-size: 2rem; }
h4 { font-size: 1.6rem; }
h5 { font-size: 1.3rem; }
h6 { font-size: 1.1rem; }

@media (max-width: 768px) {
    h1 { font-size: 2.4rem; }
    h2 { font-size: 2rem; }
    h3 { font-size: 1.7rem; }
}

/* ============================================================
   PRODUCT TITLES — TEKO
============================================================ */

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce div.product .product_title {
    font-family: 'Teko', sans-serif;
    font-weight: 600;
    font-size: 2rem;
    line-height: 1.1;
}

/* ============================================================
   CATEGORY TITLES — TEKO
============================================================ */

.woocommerce-products-header__title {
    font-family: 'Teko', sans-serif;
    font-weight: 600;
    font-size: 2.6rem;
    line-height: 1.1;
}

/* ============================================================
   BUTTONS — GLOBAL
============================================================ */

button,
.button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    font-family: 'Inter', Arial, sans-serif;
    font-weight: 500;
    letter-spacing: 0.3px;
}

/* ============================================================
   PRICE FONT — TEKO (GLOBAL + FIXED BDI)
============================================================ */

.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .price,
.woocommerce-Price-amount,
.price,
.amount,
.woocommerce div.product .price bdi {
    font-family: 'Teko', sans-serif !important;
    font-weight: 600 !important;
    color: #f4ff00 !important;
    font-size: 1.4rem !important;
}

/* ============================================================
   PRODUCT CARD CORNERS
============================================================ */

ul.products li.product {
    border-radius: 8px;
    overflow: hidden;
}

/* ============================================================
   FEATURED PRODUCTS TITLE
============================================================ */

.section-title {
    font-family: 'Teko', sans-serif !important;
    font-size: 32px !important;
    font-weight: 600 !important;
    color: #5a9a00 !important;
    text-align: center !important;
    letter-spacing: 1px !important;
    margin: 0 0 25px !important;
}

@media (max-width: 600px) {
    .section-title { font-size: 24px !important; }
}

/* ============================================================
   GRADIENT DROPDOWN HIDE
============================================================ */

.tgg-gradient {
    display: none;
}

/* ============================================================
   WRITE A REVIEW BUTTON
============================================================ */

.tgg-write-review-btn,
.tgg-write-review-btn:link,
.tgg-write-review-btn:visited {
    display: inline-block;
    background: #5a9a00;
    color: #000 !important;
    padding: 12px 24px;
    border-radius: 0;
    font-size: 18px;
    font-weight: 600;
    margin: 40px 0 20px;
    cursor: pointer;
    text-decoration: none !important;
    border: none;
}

.tgg-write-review-btn:hover {
    background: #f4ff00 !important;
    color: #000 !important;
}

/* ============================================================
   REVIEWS + RELATED TITLES
============================================================ */

#reviews h2,
#reviews .woocommerce-Reviews-title {
    color: #5a9a00 !important;
    font-size: 32px !important;
    margin-top: 40px;
}

.related.products h2 {
    color: #5a9a00 !important;
    font-size: 32px !important;
    text-align: center;
    margin-top: 60px;
}

/* ============================================================
   REVIEW FORM TOGGLE
============================================================ */

#commentform {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: opacity 0.3s ease, max-height 0.3s ease;
}

#commentform:target {
    opacity: 1;
    max-height: 2000px;
}

/* ============================================================
   STAR RATING — FORM
============================================================ */

#review_form .comment-form-rating label {
    display: none !important;
}

#review_form p.stars {
    display: inline-block !important;
    text-align: left !important;
}

#review_form .stars span {
    display: inline-flex !important;
    flex-direction: row !important;
    gap: 4px;
}

#review_form .stars a {
    display: inline-block;
    width: 24px;
    height: 24px;
    text-indent: -9999px;
    background-size: 24px 24px;
    background-repeat: no-repeat;
    cursor: pointer;
    background-image: url('data:image/svg+xml;utf8,<svg fill="%23cccccc" height="24" width="24" xmlns="http://www.w3.org/2000/svg"><polygon points="12,2 15,9 22,9 17,14 19,21 12,17 5,21 7,14 2,9 9,9"/></svg>');
}

#review_form .stars a:hover,
#review_form .stars a.active {
    background-image: url('data:image/svg+xml;utf8,<svg fill="%235a9a00" height="24" width="24" xmlns="http://www.w3.org/2000/svg"><polygon points="12,2 15,9 22,9 17,14 19,21 12,17 5,21 7,14 2,9 9,9"/></svg>');
}

/* ============================================================
   STAR RATING — PRODUCT PAGE
============================================================ */

.woocommerce-product-rating .star-rating {
    display: inline-block;
    position: relative;
    font-size: 0;
    width: 120px;
    height: 24px;
    background-size: 24px 24px;
    background-repeat: repeat-x;
    background-image: url('data:image/svg+xml;utf8,<svg fill="%23cccccc" height="24" width="24" xmlns="http://www.w3.org/2000/svg"><polygon points="12,2 15,9 22,9 17,14 19,21 12,17 5,21 7,14 2,9 9,9"/></svg>');
}

.woocommerce-product-rating .star-rating span {
    display: block;
    height: 24px;
    background-size: 24px 24px;
    background-repeat: repeat-x;
    background-image: url('data:image/svg+xml;utf8,<svg fill="%23f4ff00" height="24" width="24" xmlns="http://www.w3.org/2000/svg"><polygon points="12,2 15,9 22,9 17,14 19,21 12,17 5,21 7,14 2,9 9,9"/></svg>');
    text-indent: -9999px;
}

/* ============================================================
   STAR RATING — REVIEW SECTION
============================================================ */

#reviews .star-rating {
    display: inline-block;
    position: relative;
    font-size: 0;
    width: 120px;
    height: 24px;
    background-size: 24px 24px;
    background-repeat: repeat-x;
    background-image: url('data:image/svg+xml;utf8,<svg fill="%23cccccc" height="24" width="24" xmlns="http://www.w3.org/2000/svg"><polygon points="12,2 15,9 22,9 17,14 19,21 12,17 5,21 7,14 2,9 9,9"/></svg>');
}

#reviews .star-rating span {
    display: block;
    height: 24px;
    background-size: 24px 24px;
    background-repeat: repeat-x;
    background-image: url('data:image/svg+xml;utf8,<svg fill="%23f4ff00" height="24" width="24" xmlns="http://www.w3.org/2000/svg"><polygon points="12,2 15,9 22,9 17,14 19,21 12,17 5,21 7,14 2,9 9,9"/></svg>');
    text-indent: -9999px;
}

/* ============================================================
   REVIEW AVATAR + LIST CLEANUP
============================================================ */

#reviews .comment_container img.avatar {
    display: none !important;
}

#reviews .commentlist li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

#reviews .commentlist li::marker {
    display: none !important;
}

#reviews .comment_container {
    display: flex;
    align-items: flex-start;
}

#reviews .comment_container .comment-text {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* ============================================================
   REVIEW FORM — TEXTAREA WIDTH
============================================================ */

#review_form p.comment-form-comment label {
    display: block !important;
    margin-bottom: 6px !important;
}

#review_form p.comment-form-comment textarea {
    width: 75% !important;
    max-width: 75% !important;
    display: block !important;
}

#review_form p.comment-form-comment {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-top: 15px !important;
}

/* ============================================================
   REVIEW FORM — NAME + EMAIL WIDTH
============================================================ */

#review_form p.comment-form-author label,
#review_form p.comment-form-email label {
    display: block !important;
    margin-bottom: 6px !important;
}

#review_form p.comment-form-author input,
#review_form p.comment-form-email input {
    width: 25% !important;
    max-width: 25% !important;
    display: block !important;
}

#review_form p.comment-form-author,
#review_form p.comment-form-email {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-top: 15px !important;
}

/* ============================================================
   WOO BLOCKS — CART PAGE PRODUCT TILES
============================================================ */

#review_form #reply-title,
#reviews #reply-title,
.comment-reply-title {
    display: none !important;
}

/* Move product rating below the short description */
.single-product .woocommerce-product-rating {
    order: 3;
    margin-top: 20px;
}

/* Ensure the summary area is a flex column so order works */
.single-product .summary {
    display: flex;
    flex-direction: column;
}

/* ============================================================
   CATEGORY PAGE TITLES — FINAL CLEAN VERSION
============================================================ */

.category-title {
    font-family: 'Teko', sans-serif;
    font-weight: 500 !important;
    font-size: 32px;
    color: #5a9a00;
    text-align: center;
}
/* REMOVE STAR RATING FROM PRODUCT TILES ONLY */
ul.products li.product .star-rating {
    display: none !important;
}
/* TGG: tighten product grids site-wide */
.woocommerce ul.products,
.category-products ul.products {
    max-width: 1500px;
    margin: 0 auto;
    padding: 0 20px;
}