/*
Theme Name: Pepcore Child
Theme URI: https://shop.pepcore.net
Description: Custom child theme of Astra for Pepcore — pixel-perfect match to pepcore.net Next.js site
Author: Pepcore
Author URI: https://pepcore.net
Template: astra
Version: 1.4.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: pepcore-child
*/

/* ============================================================
   PEPCORE BRAND CSS for shop.pepcore.net (WordPress + Astra)
   Version 2 — 2026-05-18 — Header + Footer match to pepcore.net
   Paste this whole file into WP Customizer → Additional CSS
   (Replace any previous Pepcore CSS in that box)
   ============================================================ */

/* === Typography === */
body, p, li, td { font-family: 'Sora', sans-serif; color: #5c6580; }
h1, h2, h3, h4, h5, h6 { font-family: 'Sora', sans-serif; color: #2e3650; font-weight: 700; }

/* ============================================================
   HEADER — Dark navy (matches pepcore.net rgb(8,13,35))
   ============================================================ */
.site-header,
.ast-primary-header-bar,
.ast-above-header,
.main-header-bar {
  background: rgb(8,13,35) !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important;
  box-shadow: none !important;
}

/* Brand text "Pepcore" - white */
.site-title a,
.ast-site-title-wrap .site-title a,
.site-branding .site-title a {
  color: #ffffff !important;
  font-weight: 800 !important;
  font-family: 'Sora', sans-serif !important;
  font-size: 22px !important;
  letter-spacing: 0.2px;
}

/* Tagline (if shown) */
.site-description, .ast-site-description {
  color: #c0c8df !important;
}

/* Header nav links — light gray, white hover, uppercase like pepcore.net */
.main-header-menu a,
.main-header-menu .menu-item > a,
.ast-primary-header .main-header-menu .menu-item > a,
.ast-primary-header-bar .main-header-menu .menu-item > a {
  color: #c0c8df !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  letter-spacing: 0.5px;
  text-transform: uppercase !important;
  transition: color 0.2s !important;
  font-family: 'Sora', sans-serif !important;
}
.main-header-menu a:hover,
.main-header-menu .current-menu-item > a,
.main-header-menu .current_page_item > a {
  color: #ffffff !important;
}

/* Mobile menu toggle - white */
.ast-mobile-menu-buttons-fill,
.menu-toggle,
.ast-button-wrap .menu-toggle {
  background: transparent !important;
  color: #ffffff !important;
}
.menu-toggle .menu-toggle-icon,
.menu-toggle svg { fill: #ffffff !important; color: #ffffff !important; }

/* WooCommerce cart icon - white with teal badge */
.ast-cart-menu-wrap,
.ast-site-header-cart,
.ast-site-header-cart a {
  color: #ffffff !important;
}
.ast-cart-menu-wrap .count,
.ast-site-header-cart .count {
  background: #60a5fa !important;
  color: #ffffff !important;
}

/* Submenu / dropdown styling */
.main-header-menu .sub-menu,
.main-header-menu .children {
  background: rgb(12,18,44) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
}
.main-header-menu .sub-menu a {
  color: #c0c8df !important;
}
.main-header-menu .sub-menu a:hover {
  color: #ffffff !important;
  background: rgba(45,122,255,.08) !important;
}

/* ============================================================
   BUTTONS — Gradient blue
   ============================================================ */
.button, .wp-block-button__link,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce .single_add_to_cart_button {
  background: linear-gradient(135deg, #3b82f6, #1d4ed8) !important;
  border: none !important;
  border-radius: 24px !important;
  padding: 11px 24px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  font-family: 'Sora', sans-serif !important;
  transition: opacity 0.2s !important;
  letter-spacing: 0.3px;
}
.button:hover, .woocommerce a.button:hover { opacity: 0.92 !important; }

/* ============================================================
   PRODUCT CARDS — pepcore.net style
   ============================================================ */
.woocommerce ul.products,
.woocommerce-page ul.products {
  gap: 24px !important;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  background: #ffffff !important;
  border: 1px solid #e2e6f0 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  padding: 0 0 20px 0 !important;
  margin-bottom: 24px !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 1px 3px rgba(8,13,35,.04) !important;
  text-align: center !important;
  position: relative !important;
}

.woocommerce ul.products li.product:hover {
  border-color: rgba(45,122,255,0.3) !important;
  box-shadow: 0 12px 32px rgba(45,122,255,0.15) !important;
  transform: translateY(-3px) !important;
}

/* Product image area */
.woocommerce ul.products li.product .wp-post-image,
.woocommerce ul.products li.product img:not(.ast-woocommerce-svg-icon) {
  display: block !important;
  margin: 0 auto !important;
  padding: 20px 20px 12px !important;
  max-width: 100% !important;
  height: auto !important;
  background: transparent !important;
}

/* Category label — teal, small, uppercase */
.woocommerce ul.products li.product .ast-woocommerce-categories,
.woocommerce ul.products li.product .ast-product-cat,
.woocommerce ul.products li.product .ast-woo-product-category {
  color: #60a5fa !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 1.2px !important;
  text-transform: uppercase !important;
  margin: 16px 16px 6px !important;
  padding: 0 !important;
  text-align: center !important;
  font-family: 'Sora', sans-serif !important;
}

/* Product title */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3 {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #2e3650 !important;
  margin: 4px 16px 8px !important;
  padding: 0 !important;
  text-align: center !important;
  line-height: 1.3 !important;
  font-family: 'Sora', sans-serif !important;
}

/* Price */
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .woocommerce-Price-amount {
  color: #2e3650 !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  margin: 8px 16px 16px !important;
  text-align: center !important;
  display: block !important;
  font-family: 'Sora', sans-serif !important;
}
.woocommerce ul.products li.product .price ins {
  background: transparent !important;
  text-decoration: none !important;
}
.woocommerce ul.products li.product .price del {
  color: #7c87a5 !important;
  opacity: 0.7;
  margin-right: 6px;
}

/* Add to cart button — centered, not full width */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button {
  display: inline-block !important;
  margin: 12px auto 0 !important;
  width: auto !important;
  font-size: 14px !important;
  padding: 10px 28px !important;
  text-align: center !important;
  border-radius: 28px !important;
}

/* Make sure the product card text wrapper centers the button */
.woocommerce ul.products li.product {
  text-align: center !important;
}
.woocommerce ul.products li.product .button-wrap,
.woocommerce ul.products li.product .ast-on-card-button {
  text-align: center !important;
}

/* Rating stars (if shown) */
.woocommerce ul.products li.product .star-rating {
  margin: 4px auto 8px !important;
  font-size: 12px !important;
  color: #2d7aff !important;
}

/* Sale badge — top-right corner */
.woocommerce ul.products li.product .onsale {
  background: linear-gradient(135deg, #3b82f6, #1d4ed8) !important;
  color: #ffffff !important;
  border-radius: 12px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  padding: 4px 10px !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  top: 12px !important;
  right: 12px !important;
  left: auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  line-height: 1.4 !important;
  border: none !important;
}

/* Out of stock badge */
.woocommerce ul.products li.product .outofstock {
  opacity: 0.6;
}

/* === Page Titles === */
.entry-title, .post-title, .woocommerce-products-header__title {
  font-size: 36px !important;
  font-weight: 800 !important;
  color: #2e3650 !important;
}
.woocommerce div.product .product_title {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #2e3650 !important;
}
.woocommerce div.product .price {
  color: #2d7aff !important;
  font-size: 28px !important;
  font-weight: 700 !important;
}

/* ============================================================
   FOOTER — Dark navy #060b1f with 3-column structure
   ============================================================ */
.site-footer,
.site-below-footer-wrap,
.footer-widget-area,
[data-section="section-footer-builder"] {
  background: #060b1f !important;
  color: #c0c8df !important;
}

.site-footer {
  padding: 48px 24px 24px !important;
}

/* All footer text should be light by default */
.site-footer p,
.site-footer li,
.site-footer span,
.site-footer div {
  color: #c0c8df !important;
}

.site-footer a {
  color: #c0c8df !important;
  transition: color 0.2s;
  text-decoration: none !important;
}
.site-footer a:hover {
  color: #2d7aff !important;
}

/* Footer column headings — teal, uppercase, small (pepcore.net style) */
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer h5,
.site-footer .widget-title,
.site-footer .widgettitle {
  color: #60a5fa !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  margin-bottom: 16px !important;
  font-family: 'Sora', sans-serif !important;
}

/* Footer link lists — clean, no bullets, small spacing */
.site-footer ul,
.site-footer .menu {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.site-footer ul li,
.site-footer .menu li {
  margin-bottom: 10px !important;
  font-size: 13px !important;
  border: none !important;
}

/* ============================================================
   BELOW FOOTER (copyright bar) — full width dark navy
   ============================================================ */
.ast-small-footer,
.ast-small-footer-wrap,
.site-below-footer-wrap,
[data-section="section-below-footer-builder"],
.ast-builder-grid-row-container.site-below-footer-wrap,
footer.site-footer .site-below-footer-wrap,
.site-footer .ast-builder-grid-row-container.site-below-footer-wrap {
  background: #060b1f !important;
  border-top: 1px solid rgba(255,255,255,.04) !important;
  color: #c0c8df !important;
  padding: 24px !important;
  width: 100% !important;
}

/* === NUCLEAR: force EVERYTHING inside footer to transparent === */
.site-footer *,
.site-footer *::before,
.site-footer *::after,
.site-below-footer-wrap *,
.site-primary-footer-wrap *,
.ast-builder-layout-element,
.ast-builder-layout-element *,
.site-footer-focus-item,
.site-footer-focus-item *,
.site-footer-section,
.site-footer-section > *,
.ast-builder-html-element,
.ast-builder-html-element *,
.ast-footer-copyright,
.ast-footer-copyright *,
.menu-navigation-container,
.menu-navigation-container *,
.widget,
.widget *,
.widget_nav_menu,
.widget_nav_menu *,
.widget_custom_html,
.widget_custom_html *,
.wp-block-group,
.wp-block-group * {
  background: transparent !important;
  background-color: transparent !important;
}

/* Then set ONLY the outer wrapper backgrounds back to dark navy */
.site-footer,
.site-primary-footer-wrap,
.site-below-footer-wrap,
.ast-builder-grid-row-container.site-below-footer-wrap,
.ast-builder-grid-row-container.site-primary-footer-wrap,
[data-section="section-primary-footer-builder"],
[data-section="section-below-footer-builder"] {
  background: #060b1f !important;
  background-color: #060b1f !important;
}

/* Reset padding/border on widget boxes so they don't look like cards */
.site-footer .widget,
.site-footer .ast-builder-html-element,
.site-footer .menu-navigation-container,
.site-footer .widget_nav_menu,
.site-footer .widget_custom_html,
.site-footer .wp-block-group {
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  box-shadow: none !important;
}

/* Footer menu items styling (Navigate / Legal) */
.site-footer .menu li a,
.site-below-footer-wrap .menu li a,
.site-primary-footer-wrap .menu li a {
  color: #c0c8df !important;
  font-size: 13px !important;
  font-family: 'Sora', sans-serif !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  padding: 2px 0 !important;
  display: inline-block !important;
}
.site-footer .menu li a:hover {
  color: #2d7aff !important;
}
.site-footer .menu li {
  padding: 4px 0 !important;
  border: none !important;
  list-style: none !important;
}
.site-footer .menu {
  padding: 0 !important;
  margin: 0 !important;
}

/* Inner row container - transparent so dark navy from wrapper shows through */
.site-below-footer-wrap .ast-builder-grid-row-container-inner,
.site-below-footer-wrap .ast-builder-grid-row,
.site-below-footer-wrap > div {
  background: transparent !important;
}

/* Copyright element — transparent bg, centered text, full width */
.site-below-footer-wrap .ast-copyright-content,
.site-below-footer-wrap .ast-builder-html-element,
.site-below-footer-wrap .ast-builder-text-element,
.site-below-footer-wrap .ast-footer-copyright,
.site-below-footer-wrap p {
  background: transparent !important;
  color: #c0c8df !important;
  padding: 14px 24px !important;
  margin: 0 !important;
  text-align: center !important;
  width: 100% !important;
  font-size: 11px !important;
  font-family: 'JetBrains Mono', 'Courier New', monospace !important;
  letter-spacing: 0.3px;
  line-height: 1.6;
}

.ast-small-footer-wrap a,
.site-below-footer-wrap a {
  color: #c0c8df !important;
}
.ast-small-footer-wrap a:hover,
.site-below-footer-wrap a:hover {
  color: #2d7aff !important;
}

/* Footer Newsletter input (if widget present) */
.site-footer input[type="email"],
.site-footer input[type="text"] {
  background: rgba(12,18,44,.95) !important;
  border: 1.5px solid rgba(45,122,255,.35) !important;
  color: #ffffff !important;
  border-radius: 10px !important;
  padding: 12px 16px !important;
  font-family: 'Sora', sans-serif !important;
}
.site-footer input::placeholder {
  color: #7c87a5 !important;
}

/* ============================================================
   PAGE BACKGROUND
   ============================================================ */
body { background: #f7f9fc !important; }
.site-content { background: #ffffff !important; }

/* ============================================================
   PEPCORE CUSTOM FOOTER (pepcore.net exact replica)
   Used by child theme footer.php override
   ============================================================ */
.pc-site-footer {
  background: #060b1f !important;
  width: 100% !important;
  color: #c0c8df !important;
  padding: 0 !important;
  margin-top: 0 !important;
  font-family: 'Sora', sans-serif !important;
  display: block !important;
  clear: both !important;
}
.pc-footer-inner,
.pc-footer-full {
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px 24px 32px;
  color: #c0c8df;
  font-family: 'Sora', sans-serif;
}

/* Hide any remaining Astra footer elements that try to render */
.site-footer:not(.pc-site-footer),
.site-primary-footer-wrap,
.site-below-footer-wrap,
[data-section="section-footer-builder"],
[data-section="section-primary-footer-builder"],
[data-section="section-below-footer-builder"] {
  display: none !important;
}

/* Footer menu styling (rendered by wp_nav_menu) */
.pc-footer-menu {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.pc-footer-menu li {
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: none !important;
  list-style: none !important;
}
.pc-footer-menu li a {
  color: #c0c8df !important;
  font-size: 13px !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
  font-family: 'Sora', sans-serif !important;
}
.pc-footer-menu li a:hover {
  color: #2d7aff !important;
}

/* Newsletter top section */
.pc-newsletter {
  text-align: center;
  padding-bottom: 48px;
  margin-bottom: 48px;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.pc-newsletter h2 {
  color: #ffffff !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  margin: 0 0 8px !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  font-family: 'Sora', sans-serif !important;
}
.pc-newsletter p {
  font-size: 13px !important;
  color: #7c87a5 !important;
  margin: 0 0 24px !important;
  text-align: center !important;
}
.pc-newsletter-form {
  display: flex !important;
  max-width: 480px;
  margin: 0 auto;
  gap: 8px;
  padding: 4px;
  background: rgba(12,18,44,.95) !important;
  border: 1.5px solid rgba(45,122,255,.35) !important;
  border-radius: 12px !important;
  box-shadow: 0 0 24px rgba(45,122,255,0.1);
}
.pc-newsletter-form input[type="email"] {
  flex: 1;
  background: transparent !important;
  border: none !important;
  color: #ffffff !important;
  padding: 12px 16px !important;
  font-family: 'Sora', sans-serif !important;
  font-size: 14px !important;
  outline: none !important;
  width: auto !important;
  min-width: 0;
}
.pc-newsletter-form input[type="email"]::placeholder {
  color: #7c87a5 !important;
}
.pc-newsletter-form button {
  background: linear-gradient(135deg, #3b82f6, #1d4ed8) !important;
  border: none !important;
  border-radius: 8px !important;
  color: #ffffff !important;
  padding: 10px 22px !important;
  font-family: 'Sora', sans-serif !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  cursor: pointer;
  transition: opacity 0.2s;
}
.pc-newsletter-form button:hover { opacity: 0.92 !important; }
.pc-nl-success {
  display: none;
  margin-top: 14px;
  background: rgba(52,211,153,.12);
  color: #34d399 !important;
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 13px;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}

/* 3-column grid */
.pc-footer-grid {
  display: grid !important;
  grid-template-columns: 2fr 1fr 1fr !important;
  gap: 48px !important;
  margin-bottom: 48px !important;
  width: 100% !important;
}
@media (max-width: 768px) {
  .pc-footer-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
}

.pc-footer-col h3 {
  color: #60a5fa !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  margin: 0 0 18px !important;
  font-family: 'Sora', sans-serif !important;
}
.pc-footer-col ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.pc-footer-col li {
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: none !important;
  list-style: none !important;
}
.pc-footer-col a {
  color: #c0c8df !important;
  font-size: 13px !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
}
.pc-footer-col a:hover {
  color: #2d7aff !important;
}

.pc-footer-brand p {
  font-size: 13px !important;
  line-height: 1.6 !important;
  color: #c0c8df !important;
  margin: 0 !important;
}
.pc-footer-logo-wrap {
  margin-bottom: 16px;
}
.pc-footer-logo-text {
  color: #ffffff !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  letter-spacing: 0.2px;
  font-family: 'Sora', sans-serif !important;
}

/* Bottom: copyright + social */
.pc-footer-bottom {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap;
  gap: 16px;
  padding-top: 24px !important;
  border-top: 1px solid rgba(255,255,255,.04) !important;
}
.pc-copyright {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-family: 'JetBrains Mono', 'Courier New', monospace !important;
  color: #5c6580 !important;
  font-size: 10px !important;
  letter-spacing: 0.3px;
}
.pc-copyright span {
  color: #5c6580 !important;
}
.pc-social {
  display: flex !important;
  gap: 12px !important;
  align-items: center;
}
.pc-social-icon {
  width: 30px !important;
  height: 30px !important;
  border-radius: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: transform 0.2s !important;
  text-decoration: none !important;
}
.pc-social-icon:hover { transform: translateY(-2px) !important; }
.pc-wa { background: #25D366 !important; color: #ffffff !important; }
.pc-tg { background: #0088cc !important; color: #ffffff !important; }
.pc-email { background: #2d7aff !important; color: #ffffff !important; }
.pc-social-icon svg { fill: #ffffff !important; }

/* === Forms (catalog filters + checkout) === */
.woocommerce-ordering select {
  border: 1px solid #dde2ef !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  font-family: 'Sora', sans-serif !important;
  color: #5c6580 !important;
}
.woocommerce-result-count {
  color: #7c87a5 !important;
  font-style: italic;
}
.woocommerce-checkout .form-row input,
.woocommerce-checkout .form-row textarea,
.woocommerce .quantity .qty {
  border: 1px solid #dde2ef !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  font-family: 'Sora', sans-serif !important;
}

/* ============================================================
   PEPCORE CHILD THEME — Additional polish (v1.1.0)
   Fixes from first activation: logo size, footer bg, etc.
   ============================================================ */

/* Footer custom logo from Site Identity — keep it small */
.pc-footer-logo-wrap .custom-logo-link,
.pc-footer-logo-wrap .custom-logo,
.pc-footer-logo-wrap img {
  height: 32px !important;
  width: auto !important;
  max-width: 180px !important;
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Hide newsletter success message by default; show on submit via JS */
.pc-nl-msg {
  display: none !important;
  margin-top: 14px;
  background: rgba(52,211,153,.12);
  color: #34d399 !important;
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 13px;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.pc-nl-msg[style*="display: block"],
.pc-nl-msg[style*="display:block"] {
  display: block !important;
}

/* Force footer wrapper to be full-width dark navy (high specificity) */
body footer.pc-site-footer,
.site footer.pc-site-footer,
.hfeed footer.pc-site-footer {
  background: #060b1f !important;
  background-color: #060b1f !important;
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Make sure the page background doesn't show through behind footer */
.pc-site-footer::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 0;
}

/* Brand column: stack logo + tagline vertically, smaller logo */
.pc-footer-brand {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.pc-footer-logo-wrap {
  margin-bottom: 0 !important;
  display: block;
}
.pc-footer-tagline {
  font-size: 13px !important;
  line-height: 1.6 !important;
  color: #c0c8df !important;
  margin: 0 !important;
}

/* Better separator between newsletter and grid */
.pc-newsletter {
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

/* Make sure body bg doesn't bleed into footer area */
body.has-pc-footer .site-content {
  margin-bottom: 0 !important;
}

