/* Common Styles for gyyp Theme */

/* Top Bar & Header */
.top-bar-wrapper { background-color: #f6f3f0; }
.top-bar-content { color: #333333; }
.top-bar-promotion { color: #e33545; }
.main-header-wrapper { background-color: #ffffff; }

/* Main Navigation & Header Styles */
.main-nav-menu { color: #333333; font-size: 15px; }
.main-nav-menu a { transition: color 0.3s ease; }
.main-nav-menu a:hover, .active-link { color: #f05a28; }
.active-link { position: relative; padding-bottom: 4px; }
.active-link::after { content: ''; position: absolute; bottom: -2px; left: 0; width: 100%; height: 3px; background-color: #333333; }

.header-icons { color: #333333; }
.header-icon-btn { color: #333333; transition: color 0.3s ease; }
.header-icon-btn:hover { color: #f05a28; }
.cart-badge { background-color: #f05a28; color: #ffffff; }

/* Local CSS for custom colors replacing Tailwind arbitrary values */
.from-theme-orange { --tw-gradient-from: #f05a28; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(240, 90, 40, 0)); }
.bg-theme-peach { background-color: #f8d5c4; }
.text-theme-dark { color: #333333; }
.hover-text-theme-orange:hover { color: #f05a28; }
.bg-theme-dark { background-color: #333333; }
.border-theme-dark { border-color: #333333; }
.hover-bg-theme-dark:hover { background-color: #333333; }
.text-theme-gray { color: #666666; }
.bg-theme-orange { background-color: #f05a28; }
.text-theme-orange { color: #f05a28; }
.bg-theme-light-gray { background-color: #f5f5f5; }
.bg-theme-red { background-color: #e33545 !important; } /* Add red color for 404 button */
.text-404-huge { font-size: 10rem; line-height: 1; letter-spacing: -0.02em; font-weight: 900; }
@media (min-width: 768px) {
    .text-404-huge { font-size: 16rem; }
}
.card-stack-bottom { transform: rotate(4deg) translate(12px, 12px); transform-origin: center; }
.card-stack-middle { transform: rotate(2deg) translate(6px, 6px); transform-origin: center; }
.shadow-404 { box-shadow: 2px 4px 12px rgba(0,0,0,0.15); }
.bg-404-pattern {
    background-color: #f5f5f5;
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M54.636 17.58A2.977 2.977 0 0052.4 16.5H16.623l-1.3-5.2A2.997 2.997 0 0012.41 9H4.5a1.5 1.5 0 100 3h7.91l1.137 4.545 4.318 17.274a2.997 2.997 0 002.913 2.271h25.925a2.998 2.998 0 002.913-2.271l4.545-13.636a2.977 2.977 0 00.474-2.597V17.58zM45 45a4.5 4.5 0 11-9 0 4.5 4.5 0 019 0zm-21 0a4.5 4.5 0 11-9 0 4.5 4.5 0 019 0z' fill='%23e0e0e0' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
    background-repeat: repeat;
    background-size: 80px 80px;
}

/* Best Sellers / Products Common */
.bestsellers-section { background-color: #faf8f5; }
.bestseller-title { color: #333333; font-size: 24px; }
@media (min-width: 768px) { .bestseller-title { font-size: 36px; } }
.bestseller-view-all { color: #f05a28; font-size: 14px; }
.bestseller-view-all:hover { color: #d0481c; }
.product-card-title { color: #333333; font-size: 14px; line-height: 1.4; }
.product-card-price { color: #e33545; font-size: 18px; }
.product-card-btn { border: 1px solid #333333; color: #333333; background-color: #ffffff; font-size: 12px; }
.product-card-btn:hover { background-color: #333333; color: #ffffff; }

/* Feature Card Common */
.feature-card { background-color: #fafafa; }
.feature-title { color: #333333; font-size: 20px; line-height: 1.5; }
.feature-desc { color: #666666; font-size: 14px; }
/* Single Product Page Customization */
.gyyp-single-product .woocommerce-breadcrumb {
    font-size: 0.875rem;
    color: #666666;
    margin-bottom: 1rem;
}
.gyyp-single-product .woocommerce-breadcrumb a {
    color: #333333;
}
.gyyp-single-product .product_title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #333333;
    margin-bottom: 1rem;
}
.gyyp-single-product p.price {
    font-size: 1.25rem;
    font-weight: 700;
    color: #333333;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.gyyp-single-product p.price del {
    color: #999999;
    font-size: 1rem;
    font-weight: 400;
}
.gyyp-single-product p.price ins {
    text-decoration: none;
    color: #333333;
}
.gyyp-single-product .woocommerce-product-details__short-description {
    font-size: 0.875rem;
    color: #666666;
    margin-bottom: 1.5rem;
}
.gyyp-single-product .woocommerce-product-rating {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
    font-size: 0.875rem;
    color: #333333;
}
.gyyp-single-product .star-rating {
    color: #e33545;
}
.gyyp-single-product .product_meta {
    border-top: 1px solid #eeeeee;
    padding-top: 1.5rem;
    margin-top: 2rem;
    font-size: 0.875rem;
    color: #666666;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.gyyp-single-product .product_meta .sku_wrapper,
.gyyp-single-product .product_meta .posted_in,
.gyyp-single-product .product_meta .tagged_as {
    display: flex;
    gap: 0.25rem;
}
.gyyp-single-product .product_meta span.sku {
    color: #333333;
    font-weight: 600;
}
.gyyp-single-product .product_meta a {
    color: #333333;
    font-weight: 600;
}
.gyyp-single-product .onsale {
    position: absolute;
    top: 1rem;
    left: 1rem;
    background-color: #e33545;
    color: #ffffff;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    z-index: 10;
}
.gyyp-single-product .woocommerce-product-gallery {
    position: relative;
}
.gyyp-single-product .woocommerce-product-gallery .flex-control-nav {
    display: flex;
    gap: 1rem;
    margin-top: 1rem;
    list-style: none;
    padding: 0;
}
.gyyp-single-product .woocommerce-product-gallery .flex-control-nav li {
    width: 25%;
    cursor: pointer;
}
.gyyp-single-product .woocommerce-product-gallery .flex-control-nav img {
    border-radius: 0.25rem;
    opacity: 0.6;
    transition: opacity 0.3s;
}
.gyyp-single-product .woocommerce-product-gallery .flex-control-nav img.flex-active {
    opacity: 1;
}

/* Variations Form */
.gyyp-single-product form.cart {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    margin-bottom: 2rem;
}
.gyyp-single-product table.variations {
    width: 100%;
}
.gyyp-single-product table.variations th {
    text-align: left;
    font-size: 0.75rem;
    color: #999999;
    text-transform: uppercase;
    font-weight: 600;
    padding-bottom: 0.5rem;
}
.gyyp-single-product table.variations td {
    padding-bottom: 1rem;
}
.gyyp-single-product table.variations select {
    width: 100%;
    padding: 0.75rem;
    border: 1px solid #e0e0e0;
    border-radius: 0.25rem;
    background-color: #ffffff;
    font-size: 0.875rem;
}

/* Quantity & Add to Cart */
.gyyp-single-product .single_variation_wrap {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.gyyp-single-product .woocommerce-variation-add-to-cart {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: stretch;
}
.gyyp-single-product .quantity {
    display: flex;
    border: 1px solid #e0e0e0;
    border-radius: 0.25rem;
    overflow: hidden;
    flex: 0 0 auto;
}
.gyyp-single-product .quantity input.qty {
    width: 3rem;
    text-align: center;
    border: none;
    font-size: 1rem;
    -moz-appearance: textfield;
}
.gyyp-single-product .quantity input.qty::-webkit-outer-spin-button,
.gyyp-single-product .quantity input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.gyyp-single-product .quantity button {
    width: 2.5rem;
    background-color: #ffffff;
    border: none;
    font-size: 1.25rem;
    color: #666666;
    cursor: pointer;
}
.gyyp-single-product .buy_now_button {
    flex: 1;
    border: 1px solid #e0e0e0;
    background-color: #ffffff;
    color: #333333;
    font-weight: 700;
    font-size: 0.875rem;
    text-transform: uppercase;
    border-radius: 0.25rem;
    cursor: pointer;
    transition: background-color 0.3s;
}
.gyyp-single-product .buy_now_button:hover {
    background-color: #f5f5f5;
}
.gyyp-single-product button.single_add_to_cart_button {
    width: 100%;
    background-color: #333333;
    color: #ffffff;
    font-weight: 700;
    font-size: 0.875rem;
    padding: 1rem;
    border-radius: 0.25rem;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.3s;
}
.gyyp-single-product button.single_add_to_cart_button:hover {
    background-color: #000000;
}

/* Tabs */
.gyyp-single-product .woocommerce-tabs ul.tabs {
    display: flex;
    gap: 2rem;
    list-style: none;
    padding: 0;
    margin: 0 0 2rem 0;
    border-bottom: 1px solid #e0e0e0;
}
.gyyp-single-product .woocommerce-tabs ul.tabs li {
    padding-bottom: 1rem;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 600;
    color: #999999;
    text-transform: uppercase;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
}
.gyyp-single-product .woocommerce-tabs ul.tabs li.active {
    color: #333333;
    border-bottom-color: #333333;
}
.gyyp-single-product .woocommerce-Tabs-panel {
    font-size: 0.875rem;
    color: #666666;
    line-height: 1.6;
}

/* Reviews List Styles */
.gyyp-single-product .commentlist .avatar {
    display: none !important;
}
.gyyp-single-product .commentlist .star-rating {
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
}
.gyyp-single-product .commentlist .description {
    font-size: 0.875rem;
    color: #333333;
    line-height: 1.5;
}
.gyyp-single-product .commentlist .description p {
    margin-bottom: 0.5rem;
}
.gyyp-single-product .commentlist .description p:last-child {
    margin-bottom: 0;
}

/* Cart Page Quantity */
.woocommerce-cart .quantity {
    display: inline-flex;
    align-items: stretch;
}
.woocommerce-cart .quantity input.qty {
    width: 3rem;
    -moz-appearance: textfield;
}
.woocommerce-cart .quantity input.qty::-webkit-outer-spin-button,
.woocommerce-cart .quantity input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.woocommerce-cart .quantity button {
    width: 2.5rem;
    background-color: #ffffff;
    border: none;
    font-size: 1.25rem;
    color: #666666;
    cursor: pointer;
    flex-shrink: 0;
}
.woocommerce-cart .quantity button:hover {
    color: #333333;
}

/* Cart Page Overrides */
.woocommerce-cart .cart-collaterals .cart_totals {
    width: 100% !important;
    float: none !important;
    background-color: #f9f6f3;
    padding: 2.5rem !important;
    border-radius: 0.25rem;
}
.woocommerce-cart .cart-collaterals .cart_totals table.shop_table {
    border: none !important;
    border-radius: 0 !important;
    margin-bottom: 2rem !important;
}
.woocommerce-cart .cart-collaterals .cart_totals table.shop_table th,
.woocommerce-cart .cart-collaterals .cart_totals table.shop_table td {
    border-top: none !important;
    border-bottom: 1px solid rgba(0,0,0,0.05) !important;
    padding: 1rem 0 !important;
    background: transparent !important;
}
.woocommerce-cart .cart-collaterals .cart_totals table.shop_table th {
    text-align: left !important;
}
.woocommerce-cart .cart-collaterals .cart_totals table.shop_table td {
    text-align: right !important;
}
.woocommerce-cart .cart-collaterals .cart_totals table.shop_table tr:last-child th,
.woocommerce-cart .cart-collaterals .cart_totals table.shop_table tr:last-child td {
    border-bottom: none !important;
}
.woocommerce-cart .cart-collaterals .cart_totals table.shop_table tr.order-total th,
.woocommerce-cart .cart-collaterals .cart_totals table.shop_table tr.order-total td {
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    padding-top: 1.5rem !important;
}
.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout {
    padding: 0 !important;
}
.woocommerce-cart .cart-collaterals .cart_totals .checkout-button {
    background-color: #333333 !important;
    color: #ffffff !important;
    border-radius: 0 !important;
    text-transform: uppercase;
    font-weight: 700;
    padding: 1.2rem !important;
    display: block;
    width: 100%;
    text-align: center;
    margin-bottom: 1.5rem;
    transition: background-color 0.3s;
}
.woocommerce-cart .cart-collaterals .cart_totals .checkout-button:hover {
    background-color: #000000 !important;
}
.woocommerce-cart .cart-collaterals .cart_totals .payment-icons {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1rem;
}
.woocommerce-cart .cart-collaterals .cart_totals .payment-icons img {
    height: 1.5rem;
    width: auto;
    background-color: #ffffff;
    border-radius: 0.125rem;
    padding: 0.125rem;
    border: 1px solid #d1d5db;
}
