/* ==========================================================================
   COD Personal Pro — MAIN CSS (async-loaded, below-the-fold)
   Sections, cards, product grid, forms, footer, WooCommerce, funnel form.
   Media queries live in responsive.css.
   ========================================================================== */

/* ---- Sections ---- */
.home-section{padding:48px 0}
.section-title{text-align:center;font-size:1.5rem;margin-bottom:32px}
.page-content{padding:32px 0}
.page-header{margin-bottom:24px}
.page-title{font-size:1.75rem}

/* ---- 8px spacing utilities (used sparingly) ---- */
.mt-lg{margin-top:24px}.mb-lg{margin-bottom:24px}

/* ==========================================================================
   Product grid & cards (WooCommerce loop + shortcode output)
   ========================================================================== */
ul.products{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:0;padding:0;width:100%}
ul.products li.product,li.codpp-product-card{list-style:none;margin:0}
.codpp-card-inner,ul.products li.product{background:#fff;border:1px solid var(--border-color);border-radius:var(--border-radius);overflow:hidden;box-shadow:0 4px 6px rgba(0,0,0,.05);transition:transform .2s,box-shadow .2s;height:100%}
.codpp-card-inner:hover,ul.products li.product:hover{transform:translateY(-2px);box-shadow:0 10px 25px rgba(0,0,0,.12)}
.codpp-card-link{display:flex;flex-direction:column;height:100%;color:inherit}
.codpp-card-link:hover{text-decoration:none;color:inherit}
.codpp-card-media img,ul.products li.product img{width:100%;aspect-ratio:1/1;object-fit:cover;background:var(--light-gray)}
.codpp-card-body{padding:16px;display:flex;flex-direction:column;gap:6px}
.codpp-card-title{font-size:1rem;margin:0;color:var(--text-color)}
.codpp-card-desc{font-size:.875rem;color:#555;margin:0}
.codpp-card-price,.price{color:var(--primary-color);font-weight:700;font-size:1.05rem}
.price del{color:#999;font-weight:400;margin-right:6px}
.price ins{text-decoration:none}
/* WooCommerce shortcode/loop titles when not using our card link */
ul.products li.product .woocommerce-loop-product__title{font-size:1rem;padding:12px 16px 4px}
ul.products li.product .price{display:block;padding:0 16px 16px}
ul.products li.product a img{margin:0}
/* Hide any stray add-to-cart button that slips through in COD mode */
.codfp-active ul.products li.product a.add_to_cart_button,
.codfp-active ul.products li.product a.button.product_type_simple{display:none!important}
span.onsale{position:absolute;top:8px;left:8px;background:var(--secondary-color);color:#fff;padding:4px 10px;border-radius:20px;font-size:.75rem;font-weight:600;z-index:2}
ul.products li.product{position:relative}

/* ==========================================================================
   Homepage: categories, testimonials, FAQ, contact
   ========================================================================== */
.category-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.category-card{position:relative;display:block;border-radius:var(--border-radius);overflow:hidden;aspect-ratio:1/1}
.category-card-img{width:100%;height:100%;object-fit:cover}
.category-card-name{position:absolute;inset-inline:0;bottom:0;background:linear-gradient(transparent,rgba(0,0,0,.7));color:#fff;padding:24px 12px 12px;font-weight:600;text-align:center}

.testimonial-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.testimonial-card{background:#fff;border:1px solid var(--border-color);border-radius:var(--border-radius);padding:20px;box-shadow:0 4px 6px rgba(0,0,0,.05);margin:0}
.stars{color:#f59e0b;font-size:1.1rem;letter-spacing:2px;margin-bottom:8px}
.testimonial-quote{margin:0 0 12px;font-style:italic;color:#333}
.testimonial-name{font-weight:600}

.faq-accordion{max-width:760px;margin:0 auto}
.faq-item{border-bottom:1px solid var(--border-color)}
.faq-question{width:100%;background:none;border:none;padding:18px 0;font-size:1.05rem;font-weight:600;color:var(--text-color);display:flex;justify-content:space-between;align-items:center;gap:16px;cursor:pointer;text-align:start;min-height:48px}
.faq-icon{font-size:1.5rem;line-height:1;color:var(--primary-color);flex-shrink:0;transition:transform .2s}
.faq-question[aria-expanded="true"] .faq-icon{transform:rotate(45deg)}
.faq-answer{padding:0 0 18px}
.faq-answer[hidden]{display:none}

.contact-grid{display:grid;grid-template-columns:1fr;gap:32px}
.contact-list{margin:0 0 16px;display:flex;flex-direction:column;gap:8px}
.contact-list a{color:var(--text-color)}
.newsletter-form{display:flex;gap:8px;flex-wrap:wrap}
.newsletter-form input[type=email]{flex:1;min-width:200px}
.social-links{display:flex;gap:16px;flex-wrap:wrap}
.social-links a{color:var(--primary-color);font-weight:500}

/* ==========================================================================
   Forms (global)
   ========================================================================== */
input[type=text],input[type=email],input[type=tel],input[type=url],input[type=search],input[type=number],input[type=password],select,textarea{
  width:100%;padding:10px 12px;min-height:44px;border:1px solid var(--border-color);border-radius:6px;font-family:inherit;font-size:16px;background:#fff;color:var(--text-color)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--primary-color);outline-offset:0;border-color:var(--primary-color)}
label{display:block;margin-bottom:6px;font-weight:500}

/* ==========================================================================
   Single product  (revised brief PART D.2)
   Base = mobile: gallery + details stacked. Desktop 45/55 in responsive.css.
   ========================================================================== */
.woocommerce-page-wrap{padding:0}
.woocommerce-breadcrumb{max-width:1200px;margin:0 auto;padding:16px 16px 24px;font-size:12px;color:#777}
.crumb-sep{color:#bbb;margin:0 4px}

/* Two-column wrapper (see content-single-product.php) */
.single-product .product-main{display:grid;grid-template-columns:1fr;gap:24px;max-width:1200px;margin:0 auto;padding:0 16px}
.single-product div.product{margin:0}

/* Gallery: square 1:1, thumbnails below */
.product-gallery,.woocommerce-product-gallery{position:relative;max-width:100%}
.woocommerce-product-gallery__wrapper{margin:0}
.woocommerce-product-gallery__image img,.product-gallery img.wp-post-image{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:4px;background:var(--light-gray)}
.flex-control-thumbs{display:flex;gap:8px;margin:8px 0 0;padding:0;list-style:none;overflow-x:auto}
.flex-control-thumbs li{flex:0 0 60px}
.flex-control-thumbs img{width:60px;height:60px;object-fit:cover;border:2px solid transparent;border-radius:4px;cursor:pointer}
.flex-control-thumbs img.flex-active,.flex-control-thumbs img:hover{border-color:var(--primary-color)}

/* Details column typography + spacing */
.product-details{margin-top:0}
.product-details .product_title,.single-product .product_title{font-size:24px;font-weight:700;color:#1a1a1a;line-height:1.3;margin:0 0 8px}
.product-details .woocommerce-product-rating{margin:0 0 16px;font-size:14px}
.product-details .price,.summary .price{display:block;font-size:20px;font-weight:700;color:var(--primary-color);margin:0 0 16px}
.product-details .price del,.summary .price del{color:#999;font-weight:400;font-size:14px;margin-right:8px}
.product-details .price ins{text-decoration:none}
.product-details .stock{font-size:12px;margin:0 0 16px}
.product-details .stock.in-stock{color:var(--success)}
.product-details .stock.out-of-stock{color:var(--error)}
.woocommerce-product-details__short-description{font-size:14px;line-height:1.6;color:#444;margin:0 0 24px}
.woocommerce-product-details__short-description ul{list-style:disc;padding-inline-start:20px}
.product-details .product_meta{font-size:12px;color:#777;margin:0 0 24px}
.product-details .product_meta>span{margin-right:8px}

/* Funnel container (also bridged inline in inc/woocommerce.php) */
.codfp-form-container{background:#f9f9f9;border:1px solid var(--border-color);border-radius:var(--border-radius);padding:24px;margin:32px 0}
.codfp-form-container label{display:block;font-size:13px;font-weight:500;margin-bottom:6px}
.codfp-form-container input,.codfp-form-container select,.codfp-form-container textarea{margin-bottom:12px}
.codpp-funnel-placeholder{background:#fff8e1;border:1px dashed var(--warning);padding:16px;border-radius:6px;color:#7a5b00;font-size:.9rem}
.product-offers-wrapper{width:100%}

/* Product tabs (full width below product-main) */
.woocommerce-tabs{max-width:1200px;margin:48px auto 0;padding:0 16px}
.woocommerce-tabs ul.tabs{display:flex;gap:24px;flex-wrap:wrap;border-bottom:1px solid var(--border-color);padding:0;margin:0 0 16px}
.woocommerce-tabs ul.tabs li{list-style:none}
.woocommerce-tabs ul.tabs li a{display:block;padding:12px 0;font-weight:600;color:#777;border-bottom:2px solid transparent;min-height:44px}
.woocommerce-tabs ul.tabs li.active a{color:var(--primary-color);border-bottom-color:var(--primary-color)}
.woocommerce-tabs .panel{font-size:14px;line-height:1.6;color:#444;padding:24px 0}
.related.products,.upsells.products{max-width:1200px;margin:48px auto 0;padding:0 16px}
.related.products>h2,.upsells.products>h2{font-size:20px;font-weight:700;margin-bottom:24px}

/* ==========================================================================
   Shop layout (archive) — FULL WIDTH, NO SIDEBAR (revised brief PART D.3)
   ========================================================================== */
.shop-main{max-width:1200px;margin:0 auto;padding:24px 16px}
.shop-header{margin-bottom:24px}
.shop-header .page-title{margin-bottom:12px}
.term-description{color:#555;margin-bottom:12px}
.shop-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin:16px 0 0}
.woocommerce-result-count{margin:0;color:#666;font-size:.9rem}
.woocommerce-ordering select{max-width:220px}
/* ==========================================================================
   v2.1 AGGRESSIVE NO-SIDEBAR ENFORCEMENT
   Scoped to full-width storefront contexts so legitimate widget areas (footer)
   are never affected. PHP already prevents sidebars from rendering; this is the
   CSS backstop that guarantees full-width even if a plugin injects one.
   ========================================================================== */
.full-width-no-sidebar .sidebar,
.full-width-no-sidebar .widget-area,
.full-width-no-sidebar #secondary,
.full-width-no-sidebar aside.sidebar,
.single-product .sidebar,.single-product #secondary,
.archive .sidebar,.archive #secondary,
.post-type-archive-product .sidebar,
.woocommerce-page .woocommerce-sidebar,
.woocommerce-page .widget-area.shop-sidebar{
  display:none!important;visibility:hidden!important;
  width:0!important;height:0!important;overflow:hidden!important;
  position:absolute!important;left:-9999px!important;
}
/* Force main content to full width on these views. */
.full-width-no-sidebar .site-main,
.single-product .site-main,
.archive .site-main,
.post-type-archive-product .site-main,
.full-width-no-sidebar .woocommerce-page-wrap,
.single-product .woocommerce-page-wrap,
.archive .woocommerce-page-wrap{
  width:100%!important;max-width:100%!important;margin:0 auto!important;float:none!important;
}
.woocommerce-pagination ul{display:flex;gap:8px;list-style:none;padding:0;justify-content:center;margin:32px 0 0;flex-wrap:wrap}
.woocommerce-pagination a,.woocommerce-pagination span{display:inline-block;min-width:44px;min-height:44px;line-height:44px;text-align:center;border:1px solid var(--border-color);border-radius:6px;color:var(--text-color)}
.woocommerce-pagination .current{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}

/* ==========================================================================
   Cart (simplified in COD mode) / notices
   ========================================================================== */
.woocommerce-message,.woocommerce-info,.woocommerce-error{padding:12px 16px;border-radius:6px;margin:0 0 16px;list-style:none}
.woocommerce-message{background:#e7f7ee;border:1px solid var(--success);color:#0a6b43}
.woocommerce-info{background:#eef4ff;border:1px solid #93b4f5;color:#264f9e}
.woocommerce-error{background:#fdeaea;border:1px solid var(--error);color:#9e2626}
.cart_totals h2{font-size:1.25rem}
.checkout-button,.wc-proceed-to-checkout .button{display:inline-block;background:var(--primary-color);color:#fff;padding:14px 24px;border-radius:6px;font-weight:600;min-height:48px}

/* ==========================================================================
   Order received / thank-you
   ========================================================================== */
.codpp-thankyou{max-width:720px;margin:0 auto;padding:32px 16px}
.thankyou-hero{text-align:center;margin-bottom:32px}
.thankyou-sub{color:#555}
.order-overview{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;background:var(--light-gray);border-radius:var(--border-radius);padding:20px;margin:0 0 24px}
.order-overview li{display:flex;flex-direction:column;gap:2px}
.order-overview span{font-size:.8rem;color:#666;text-transform:uppercase;letter-spacing:.03em}
.order-overview strong{font-size:1.05rem}
.thankyou-actions{text-align:center;margin-top:24px}

/* ==========================================================================
   Blog / posts
   ========================================================================== */
.post-list{display:grid;grid-template-columns:1fr;gap:24px}
.post-card{background:#fff;border:1px solid var(--border-color);border-radius:var(--border-radius);overflow:hidden}
.post-card-body{padding:16px}
.post-card-title{font-size:1.15rem;margin-bottom:6px}
.post-meta{color:#777;font-size:.85rem;margin-bottom:8px}
.single-page .entry-content,.single-post .entry-content{max-width:760px}
.entry-content img{border-radius:var(--border-radius);margin:16px 0}
.entry-content h2{margin-top:1.5em}

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer{background:#111;color:#cfcfcf;margin-top:48px}
.footer-widgets{display:grid;grid-template-columns:1fr;gap:32px;padding:48px 16px}
.site-footer .widget-title{color:#fff;font-size:1.05rem;margin-bottom:12px}
.site-footer a{color:#cfcfcf}
.site-footer a:hover{color:#fff}
.footer-bottom{border-top:1px solid #2a2a2a}
.footer-bottom-inner{display:flex;flex-direction:column;gap:12px;padding:20px 16px;text-align:center}
.footer-copy{margin:0;font-size:.85rem;color:#999}
.site-footer .social-links{justify-content:center}
.site-footer .social-links a{color:#fff}

/* ==========================================================================
   Utility
   ========================================================================== */
.no-results{padding:48px 0;text-align:center}
[dir="rtl"] .primary-menu{flex-direction:row-reverse}