/*
Theme Name: Peptofit Theme
Theme URI: https://peptofit.pl
Author: Peptofit
Author URI: https://peptofit.pl
Description: Custom theme for Peptofit — premium research peptides store. Pixel-perfect conversion of the React prototype, fully responsive, WooCommerce-compatible.
Version: 1.2.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: peptofit
Tags: e-commerce, custom-colors, custom-logo, custom-menu, featured-images, translation-ready, wide-blocks
*/

/* ==========================================================================
   BRAND VARIABLES
   ========================================================================== */
:root {
    --color-navy: #0F2A55;
    --color-blue: #20509A;
    --color-gold: #E3A345;
    --color-text: #333333;
    --color-cream: #fdfbf7;
    --color-gray-50: #f9fafb;
    --color-gray-100: #f3f4f6;
    --color-gray-200: #e5e7eb;
    --color-gray-300: #d1d5db;
    --color-gray-400: #9ca3af;
    --color-gray-500: #6b7280;
    --color-gray-600: #4b5563;
    --color-gray-800: #1f2937;
    --color-gray-900: #111827;
    --container-max: 1280px;
}

/* ==========================================================================
   RESET & BASE
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html, body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    color: var(--color-text);
    background: #ffffff;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

::selection { background: var(--color-blue); color: #ffffff; }

img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }

.container { max-width: var(--container-max); margin: 0 auto; padding: 0 16px; }
@media (min-width: 640px) { .container { padding: 0 24px; } }
@media (min-width: 1024px) { .container { padding: 0 32px; } }

.sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ==========================================================================
   TOP DISCLAIMER BAR
   ========================================================================== */
.disclaimer-bar {
    background: var(--color-navy);
    color: #ffffff;
    font-size: 12px;
    padding: 8px 16px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.disclaimer-bar svg { color: var(--color-gold); flex-shrink: 0; }

/* ==========================================================================
   HEADER
   ========================================================================== */
.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(255,255,255,0.9);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--color-gray-100);
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}
.header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 80px;
}
.site-logo img, .site-logo svg { height: 40px; width: auto; }
.site-logo { display: flex; align-items: center; }

.main-nav { display: none; gap: 32px; }
@media (min-width: 768px) { .main-nav { display: flex; } }
.main-nav a {
    color: var(--color-gray-600);
    font-weight: 500;
    transition: color 0.2s;
    font-size: 15px;
}
.main-nav a:hover, .main-nav a.current-menu-item, .main-nav .current_page_item a {
    color: var(--color-blue);
}

.header-actions { display: flex; align-items: center; gap: 16px; }

.cart-icon {
    position: relative;
    padding: 8px;
    color: var(--color-navy);
    transition: color 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}
.cart-icon:hover { color: var(--color-blue); }
.cart-count {
    position: absolute;
    top: 0; right: 0;
    background: var(--color-gold);
    color: #ffffff;
    font-size: 10px;
    font-weight: 700;
    border-radius: 9999px;
    padding: 2px 6px;
    transform: translate(25%,-25%);
    min-width: 18px;
    text-align: center;
    line-height: 1;
}

/* Mobile menu toggle */
.mobile-menu-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    color: var(--color-navy);
}
@media (min-width: 768px) { .mobile-menu-toggle { display: none; } }

.mobile-menu {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: #ffffff;
    z-index: 100;
    padding: 24px;
    flex-direction: column;
}
.mobile-menu.open { display: flex; }
.mobile-menu-close { align-self: flex-end; padding: 8px; color: var(--color-navy); }
.mobile-menu ul { list-style: none; padding: 0; margin: 32px 0 0; }
.mobile-menu li { padding: 16px 0; border-bottom: 1px solid var(--color-gray-100); }
.mobile-menu a { font-size: 20px; color: var(--color-navy); font-weight: 500; }

/* ==========================================================================
   HERO
   ========================================================================== */
.hero {
    position: relative;
    width: 100%;
    min-height: 550px;
    background-color: var(--color-cream);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 16px;
}
@media (min-width: 768px) { .hero { min-height: 80vh; } }

.hero-inner {
    position: relative;
    z-index: 10;
    display: flex;
    flex-direction: column;
    padding: 112px 16px 0;
    width: 100%;
    max-width: var(--container-max);
    margin: 0 auto;
    justify-content: flex-start;
}
@media (min-width: 640px) { .hero-inner { padding-left: 32px; padding-right: 32px; } }
@media (min-width: 768px) { .hero-inner { padding-top: 160px; } }
@media (min-width: 1024px) { .hero-inner { padding-left: 48px; padding-right: 48px; } }

.hero-text { max-width: 576px; margin-bottom: 32px; }
@media (min-width: 768px) { .hero-text { margin-bottom: 48px; } }

.hero-title {
    font-size: 36px;
    font-weight: 800;
    color: var(--color-blue);
    letter-spacing: -0.025em;
    margin: 0 0 24px 0;
    line-height: 1.1;
}
@media (min-width: 768px) { .hero-title { font-size: 48px; } }
@media (min-width: 1024px) { .hero-title { font-size: 60px; } }

.hero-desc {
    font-size: 18px;
    color: var(--color-blue);
    line-height: 1.6;
    font-weight: 500;
    max-width: 280px;
    margin: 0;
}
@media (min-width: 640px) { .hero-desc { max-width: 320px; font-size: 20px; } }
@media (min-width: 768px) { .hero-desc { max-width: 380px; font-size: 24px; } }

.hero-buttons {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
@media (min-width: 640px) { .hero-buttons { flex-direction: row; } }

.btn {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 16px 40px;
    font-size: 18px;
    border-radius: 6px;
    transition: all 0.2s;
    text-decoration: none;
    font-weight: 500;
    line-height: 1;
}
.btn-primary {
    background: var(--color-navy);
    color: #ffffff;
    font-weight: 700;
    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
}
.btn-primary:hover { background: var(--color-blue); }
.btn-secondary {
    background: #ffffff;
    color: var(--color-navy);
    border: 2px solid var(--color-navy);
    padding: 14px 40px; /* 2px less to offset border */
}
.btn-secondary:hover { background: var(--color-gray-50); }

/* ==========================================================================
   TRUST / QUALITY SECTION
   ========================================================================== */
.trust-section {
    padding: 64px 0;
    background: var(--color-gray-50);
    border-bottom: 1px solid var(--color-gray-100);
}
.trust-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}
@media (min-width: 768px) { .trust-grid { grid-template-columns: repeat(3, 1fr); } }

.trust-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 24px;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
    border: 1px solid var(--color-gray-100);
}
.trust-icon {
    width: 64px; height: 64px;
    border-radius: 9999px;
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 16px;
    background: rgba(32, 80, 154, 0.1);
    color: var(--color-blue);
}
.trust-icon.gold {
    background: rgba(227, 163, 69, 0.1);
    color: var(--color-gold);
}
.trust-card h3 {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-navy);
    margin: 0 0 8px 0;
}
.trust-card p {
    color: var(--color-gray-600);
    font-size: 14px;
    margin: 0;
    line-height: 1.5;
}

/* ==========================================================================
   SECTION HEADERS
   ========================================================================== */
.section-header { text-align: center; margin-bottom: 64px; }
.section-header h2 {
    font-size: 28px;
    font-weight: 700;
    color: var(--color-navy);
    margin: 0 0 16px 0;
}
@media (min-width: 768px) { .section-header h2 { font-size: 32px; } }
.section-header .divider {
    width: 96px; height: 4px;
    background: var(--color-blue);
    margin: 0 auto 24px;
    border-radius: 9999px;
}
.section-header p {
    color: var(--color-gray-600);
    max-width: 640px;
    margin: 0 auto;
    line-height: 1.6;
}

/* ==========================================================================
   PRODUCTS (WooCommerce + fallback)
   ========================================================================== */
.products-section { padding: 80px 0; background: #ffffff; }

.products-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    margin-bottom: 48px;
}
@media (min-width: 640px) { .products-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .products-grid { grid-template-columns: repeat(3, 1fr); } }

.product-card {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-radius: 12px;
    border: 1px solid var(--color-gray-200);
    overflow: hidden;
    transition: box-shadow 0.3s;
}
.product-card:hover {
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);
}
.product-card-image {
    aspect-ratio: 4 / 3;
    background: var(--color-gray-100);
    padding: 32px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.product-card-image::before {
    content: "";
    position: absolute; inset: 0;
    background: linear-gradient(to top right, var(--color-gray-200), var(--color-gray-50));
    opacity: 0.5;
}
.product-card-image img { position: relative; max-width: 100%; max-height: 100%; object-fit: contain; }
.product-card-image .flask-icon {
    position: relative;
    color: var(--color-blue);
    opacity: 0.2;
    transition: transform 0.5s;
}
.product-card:hover .product-card-image .flask-icon { transform: scale(1.1); }
.purity-badge {
    position: absolute;
    top: 16px; right: 16px;
    background: rgba(255,255,255,0.8);
    backdrop-filter: blur(4px);
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    color: var(--color-navy);
    border: 1px solid var(--color-gray-200);
    z-index: 1;
}
.product-card-body {
    padding: 24px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.product-card h3 {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-navy);
    margin: 0 0 8px 0;
}
.product-card-desc {
    font-size: 14px;
    color: var(--color-gray-500);
    margin: 0 0 16px 0;
    flex-grow: 1;
}
.product-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid var(--color-gray-100);
}
.product-price {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-blue);
}
.product-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--color-navy);
    color: #ffffff;
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    transition: background 0.2s;
}
.product-button:hover { background: var(--color-blue); }

/* WooCommerce overrides to match the card design */
.woocommerce ul.products { display: grid; grid-template-columns: 1fr; gap: 32px; margin: 0 !important; padding: 0 !important; }
@media (min-width: 640px) { .woocommerce ul.products { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .woocommerce ul.products { grid-template-columns: repeat(3, 1fr); } }
.woocommerce ul.products li.product {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #ffffff;
    border: 1px solid var(--color-gray-200);
    border-radius: 12px;
    overflow: hidden;
    transition: box-shadow 0.3s;
    float: none !important;
}
.woocommerce ul.products li.product:hover {
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1);
}
.woocommerce ul.products li.product a img {
    margin: 0 !important;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    background: var(--color-gray-100);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    padding: 16px 24px 4px !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    color: var(--color-navy) !important;
}
.woocommerce ul.products li.product .price {
    padding: 0 24px 16px !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--color-blue) !important;
}
.woocommerce ul.products li.product .button {
    margin: 0 24px 24px !important;
    background: var(--color-navy) !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    padding: 8px 16px !important;
    font-size: 14px !important;
}
.woocommerce ul.products li.product .button:hover { background: var(--color-blue) !important; }

/* ==========================================================================
   BLOG SECTION
   ========================================================================== */
.blog-section {
    padding: 80px 0;
    background: var(--color-gray-50);
    border-top: 1px solid var(--color-gray-100);
}
.blog-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}
@media (min-width: 768px) { .blog-grid { grid-template-columns: repeat(3, 1fr); } }

.blog-card {
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
    border: 1px solid var(--color-gray-100);
    transition: box-shadow 0.3s;
    display: flex;
    flex-direction: column;
}
.blog-card:hover {
    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1);
}
.blog-card-image {
    height: 192px;
    overflow: hidden;
    background: var(--color-gray-100);
}
.blog-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}
.blog-card:hover .blog-card-image img { transform: scale(1.05); }
.blog-card-body {
    padding: 24px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.blog-date {
    font-size: 12px;
    font-weight: 600;
    color: var(--color-gold);
    margin-bottom: 8px;
    display: block;
}
.blog-card h3 {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-navy);
    margin: 0 0 12px 0;
    line-height: 1.3;
}
.blog-card-excerpt {
    font-size: 14px;
    color: var(--color-gray-600);
    margin: 0 0 16px 0;
    flex-grow: 1;
    line-height: 1.5;
}
.read-more {
    display: inline-flex;
    align-items: center;
    color: var(--color-blue);
    font-weight: 700;
    font-size: 14px;
    transition: color 0.2s;
    margin-top: auto;
}
.read-more:hover { color: var(--color-navy); }
.read-more svg { margin-left: 4px; }

/* ==========================================================================
   SHIPPING / INPOST SECTION
   ========================================================================== */
.shipping-section {
    padding: 64px 0;
    background: var(--color-navy);
    color: #ffffff;
}
.shipping-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}
@media (min-width: 768px) {
    .shipping-inner { flex-direction: row; align-items: center; }
}
.shipping-text { width: 100%; }
@media (min-width: 768px) { .shipping-text { width: 50%; } }
.shipping-text h2 {
    font-size: 28px;
    font-weight: 700;
    margin: 0 0 16px 0;
}
@media (min-width: 768px) { .shipping-text h2 { font-size: 32px; } }
.shipping-text > p {
    color: var(--color-gray-300);
    margin: 0 0 24px 0;
    line-height: 1.6;
}
.shipping-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 16px; }
.shipping-list li { display: flex; align-items: flex-start; gap: 12px; }
.shipping-list .icon-wrap {
    margin-top: 4px;
    background: var(--color-gold);
    color: var(--color-navy);
    padding: 4px;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.shipping-list strong { display: block; color: #ffffff; font-weight: 700; }
.shipping-list span { color: var(--color-gray-400); font-size: 14px; }

.inpost-card {
    background: #ffffff;
    padding: 32px;
    border-radius: 12px;
    box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
    transform: rotate(2deg);
    transition: transform 0.3s;
    text-align: center;
}
.inpost-card:hover { transform: rotate(0); }
.inpost-card .inpost-logo {
    font-size: 36px;
    font-weight: 900;
    letter-spacing: -0.05em;
    color: #FFCE00;
}
.inpost-card .inpost-sub {
    display: block;
    font-size: 20px;
    font-weight: 700;
    color: var(--color-gray-800);
    margin-top: 4px;
}
.shipping-card-wrap { display: flex; justify-content: center; width: 100%; }
@media (min-width: 768px) { .shipping-card-wrap { width: 50%; } }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer {
    background: var(--color-gray-900);
    color: var(--color-gray-400);
    padding: 48px 0;
    border-top: 1px solid var(--color-gray-800);
}
.footer-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    margin-bottom: 32px;
}
@media (min-width: 768px) { .footer-grid { grid-template-columns: repeat(4, 1fr); } }
.footer-col-wide { grid-column: span 1; }
@media (min-width: 768px) { .footer-col-wide { grid-column: span 2; } }

.footer-logo { margin-bottom: 16px; display: block; }
.footer-logo img, .footer-logo svg { height: 40px; width: auto; filter: brightness(0) invert(1); }
.footer-desc {
    font-size: 14px;
    margin: 0 0 24px 0;
    max-width: 448px;
    line-height: 1.6;
}
.footer-notice {
    background: var(--color-gray-800);
    padding: 16px;
    border-radius: 8px;
    border: 1px solid var(--color-gray-800);
}
.footer-notice h4 {
    color: #ffffff;
    font-weight: 700;
    margin: 0 0 8px 0;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
}
.footer-notice h4 svg { color: var(--color-gold); }
.footer-notice p { font-size: 12px; line-height: 1.6; margin: 0; }

.footer-col h4 {
    color: #ffffff;
    font-weight: 700;
    margin: 0 0 16px 0;
    font-size: 16px;
}
.footer-col ul { list-style: none; padding: 0; margin: 0; }
.footer-col li { margin-bottom: 8px; font-size: 14px; }
.footer-col a { transition: color 0.2s; }
.footer-col a:hover { color: #ffffff; }

.footer-bottom {
    padding-top: 32px;
    border-top: 1px solid var(--color-gray-800);
    font-size: 14px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    text-align: center;
}
@media (min-width: 768px) { .footer-bottom { flex-direction: row; text-align: left; } }

/* ==========================================================================
   SINGLE POST / PAGE (for blog & standard pages)
   ========================================================================== */
.content-wrap { max-width: 768px; margin: 0 auto; padding: 64px 16px; }
.content-wrap h1 { color: var(--color-navy); font-size: 32px; margin: 0 0 16px 0; }
.content-wrap h2, .content-wrap h3 { color: var(--color-navy); }
.content-wrap a { color: var(--color-blue); }
.content-wrap a:hover { text-decoration: underline; }
.post-meta { color: var(--color-gray-500); font-size: 14px; margin-bottom: 32px; }
.post-thumbnail { margin-bottom: 32px; border-radius: 12px; overflow: hidden; }

/* ==========================================================================
   PRODUCT GRID (via [peptofit_products] shortcode)
   Matches the prototype card design: white bg, purity badge, blue price.
   ========================================================================== */
.peptofit-products-section { padding: 80px 0; background: #ffffff; }

.section-head { text-align: center; margin-bottom: 64px; }
.section-head h2 { color: var(--color-navy); font-size: 30px; font-weight: 700; margin: 0 0 16px 0; }
.section-head .divider { width: 96px; height: 4px; background: var(--color-blue); margin: 0 auto 24px; border-radius: 9999px; }
.section-head p { color: var(--color-gray-600); max-width: 640px; margin: 0 auto; line-height: 1.6; }

.product-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}
@media (min-width: 640px) { .product-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .product-grid { grid-template-columns: repeat(3, 1fr); } }

.product-card {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid var(--color-gray-200);
    border-radius: 12px;
    overflow: hidden;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.product-card:hover { box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1); transform: translateY(-2px); }

.product-card-image {
    position: relative;
    background: var(--color-gray-100);
    aspect-ratio: 4 / 3;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.product-card-image img { width: 100%; height: 100%; object-fit: cover; }
.product-placeholder { color: var(--color-blue); opacity: 0.2; }

.purity-badge {
    position: absolute;
    top: 16px;
    right: 16px;
    background: rgba(255,255,255,0.8);
    backdrop-filter: blur(4px);
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    color: var(--color-navy);
    border: 1px solid var(--color-gray-200);
}

.product-card-body { padding: 24px; display: flex; flex-direction: column; flex-grow: 1; }
.product-card-body h3 { color: var(--color-navy); font-size: 20px; font-weight: 700; margin: 0 0 8px 0; }
.product-card-body h3 a { color: inherit; }
.product-card-body h3 a:hover { color: var(--color-blue); }
.product-desc { color: var(--color-gray-500); font-size: 14px; margin: 0 0 16px 0; flex-grow: 1; }

.product-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid var(--color-gray-100);
}
.product-price, .product-price .amount { color: var(--color-blue); font-size: 18px; font-weight: 700; }
.product-price del { opacity: 0.5; margin-right: 4px; }

.btn-add-cart {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--color-navy);
    color: #ffffff !important;
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    transition: background 0.2s ease;
}
.btn-add-cart:hover { background: var(--color-blue); }
.btn-add-cart.added { display: none; } /* hide duplicate "added" button Woo injects */

.woo-missing-notice, .no-products-notice, .no-posts-notice {
    text-align: center;
    padding: 32px;
    background: var(--color-gray-50);
    border: 2px dashed var(--color-gray-300);
    border-radius: 12px;
    color: var(--color-gray-600);
}

/* ==========================================================================
   BLOG GRID (via [peptofit_blog] shortcode)
   ========================================================================== */
.peptofit-blog-section {
    padding: 80px 0;
    background: var(--color-gray-50);
    border-top: 1px solid var(--color-gray-100);
}

.blog-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}
@media (min-width: 768px) { .blog-grid { grid-template-columns: repeat(3, 1fr); } }

.blog-card {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid var(--color-gray-100);
    border-radius: 12px;
    overflow: hidden;
    transition: box-shadow 0.3s ease;
}
.blog-card:hover { box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1); }

.blog-card-image {
    display: block;
    height: 192px;
    overflow: hidden;
    background: var(--color-gray-100);
}
.blog-card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
.blog-card:hover .blog-card-image img { transform: scale(1.05); }
.blog-placeholder { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--color-blue); opacity: 0.3; }

.blog-card-body { padding: 24px; display: flex; flex-direction: column; flex-grow: 1; }
.blog-date { font-size: 12px; font-weight: 600; color: var(--color-gold); margin-bottom: 8px; }
.blog-card-body h3 { color: var(--color-navy); font-size: 20px; font-weight: 700; margin: 0 0 12px 0; line-height: 1.3; }
.blog-card-body h3 a { color: inherit; }
.blog-card-body h3 a:hover { color: var(--color-blue); }
.blog-card-body p { color: var(--color-gray-600); font-size: 14px; margin: 0 0 16px 0; flex-grow: 1; }

.read-more {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--color-blue);
    font-weight: 700;
    font-size: 14px;
    margin-top: auto;
    transition: color 0.2s ease;
}
.read-more:hover { color: var(--color-navy); }

/* ==========================================================================
   OVERRIDES: header logo size, nav alignment, footer logo visibility
   ========================================================================== */

/* Make header logo bigger */
.site-logo img, .site-logo svg { height: 64px !important; width: auto; }
@media (min-width: 768px) { .site-logo img, .site-logo svg { height: 72px !important; } }

/* Push nav to the right (remove centering), strip bullets */
.main-nav { margin-left: auto; margin-right: 32px; }
.main-nav ul,
.main-nav menu {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex;
    gap: 32px;
}
.main-nav li {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.main-nav li::before,
.main-nav li::marker { content: none !important; display: none !important; }

/* Footer logo — invert colors so it's visible on dark background */
.site-footer .footer-logo img,
.site-footer .footer-logo svg {
    height: 56px;
    width: auto;
    background: #ffffff;
    padding: 8px 12px;
    border-radius: 6px;
    display: block;
}
.site-footer .footer-logo { display: inline-block; margin-bottom: 16px; }

/* ==========================================================================
   LANGUAGE TOGGLE (header placeholder — wired to Polylang/WPML later)
   ========================================================================== */
.lang-toggle {
    display: none;
    align-items: center;
    gap: 8px;
    padding-right: 16px;
    border-right: 1px solid var(--color-gray-200);
    margin-right: 4px;
}
@media (min-width: 768px) { .lang-toggle { display: flex; } }

.lang-toggle .lang-globe { color: var(--color-gray-400); display: inline-flex; }
.lang-toggle .lang-link {
    font-size: 13px;
    font-weight: 700;
    color: var(--color-gray-400);
    transition: color 0.2s;
}
.lang-toggle .lang-link:hover { color: var(--color-navy); }
.lang-toggle .lang-link.is-active { color: var(--color-blue); }
.lang-toggle .lang-sep { color: var(--color-gray-300); }

/* Reduce nav right-margin so toggle fits nicely */
.main-nav { margin-right: 16px !important; }

/* ==========================================================================
   FOOTER LOGO — text-based (matches React prototype exactly)
   Three-span approach: PEP (blue) + TO (gold) + FIT (blue)
   ========================================================================== */
.site-footer .footer-logo img,
.site-footer .footer-logo svg {
    display: none !important;
}
.site-footer .footer-logo {
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
    margin-bottom: 24px;
    display: inline-flex;
    align-items: center;
    font-family: "Orbitron", "Eurostile", sans-serif;
    font-size: 32px;
    font-weight: 800;
    letter-spacing: 0.05em;
    line-height: 1;
}
.footer-logo-text .lt-blue { color: var(--color-blue); }
.footer-logo-text .lt-gold { color: var(--color-gold); }

/* Load Orbitron font via functions.php enqueue instead — @import here wouldn't work. */

/* ==========================================================================
   WOOCOMMERCE — Shared page styles
   ========================================================================== */
.woo-page { padding: 48px 0 80px; background: #ffffff; }
.woo-container { max-width: var(--container-max); margin: 0 auto; }

/* Breadcrumbs */
.woocommerce-breadcrumb {
    font-size: 13px;
    color: var(--color-gray-500);
    margin: 0 0 32px 0;
}
.woocommerce-breadcrumb a {
    color: var(--color-blue);
    transition: color 0.2s;
}
.woocommerce-breadcrumb a:hover { color: var(--color-navy); }

/* WooCommerce notices (cart updated, errors) */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    border-radius: 8px;
    padding: 16px 20px;
    margin: 0 0 24px 0;
    font-size: 14px;
    border-left: 4px solid;
    background: var(--color-gray-50);
}
.woocommerce-message { border-color: #10b981; color: #065f46; background: #ecfdf5; }
.woocommerce-info { border-color: var(--color-blue); color: var(--color-navy); }
.woocommerce-error { border-color: #ef4444; color: #991b1b; background: #fef2f2; }

.woocommerce-message .button,
.woocommerce-info .button {
    background: var(--color-navy);
    color: #ffffff !important;
    padding: 6px 14px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    margin-left: 12px;
}

/* ==========================================================================
   WOOCOMMERCE — Single Product Page
   ========================================================================== */
.single-product div.product {
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
    margin: 0 0 64px 0;
}
@media (min-width: 768px) {
    .single-product div.product {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 64px;
        align-items: start;
    }
}

/* Product image / gallery (left side) */
.single-product .woocommerce-product-gallery {
    background: var(--color-gray-50);
    border-radius: 12px;
    padding: 24px;
    position: relative;
    overflow: hidden;
}
.single-product .woocommerce-product-gallery img {
    width: 100%;
    height: auto;
    border-radius: 8px;
}
.single-product .woocommerce-product-gallery__trigger {
    position: absolute;
    top: 16px;
    right: 16px;
    background: #ffffff;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    z-index: 10;
    text-indent: -9999px;
}
.single-product .woocommerce-product-gallery__trigger::before {
    content: "🔍";
    text-indent: 0;
    font-size: 18px;
}
.single-product .flex-control-thumbs {
    display: flex;
    gap: 8px;
    margin-top: 12px;
    padding: 0;
    list-style: none;
}
.single-product .flex-control-thumbs li {
    width: 80px;
    height: 80px;
}
.single-product .flex-control-thumbs img {
    border: 2px solid transparent;
    cursor: pointer;
    border-radius: 6px;
    transition: border-color 0.2s;
}
.single-product .flex-control-thumbs img.flex-active,
.single-product .flex-control-thumbs img:hover {
    border-color: var(--color-blue);
}

/* Product summary (right side) */
.single-product .product .summary {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.single-product .product_title {
    color: var(--color-navy);
    font-size: 36px;
    font-weight: 800;
    margin: 0;
    line-height: 1.15;
}
.single-product .product .price,
.single-product .product .price .amount,
.single-product .product .price .woocommerce-Price-amount {
    color: var(--color-blue);
    font-size: 28px;
    font-weight: 700;
    margin: 0;
}
.single-product .product .price del { opacity: 0.45; margin-right: 8px; font-weight: 500; }
.single-product .product .price ins { text-decoration: none; }

.single-product .woocommerce-product-details__short-description {
    color: var(--color-gray-600);
    font-size: 15px;
    line-height: 1.7;
    padding: 16px 0;
    border-top: 1px solid var(--color-gray-100);
    border-bottom: 1px solid var(--color-gray-100);
}
.single-product .woocommerce-product-details__short-description p { margin: 0 0 8px 0; }
.single-product .woocommerce-product-details__short-description p:last-child { margin-bottom: 0; }

/* Cart form (quantity + add to cart) */
.single-product form.cart {
    display: flex;
    gap: 12px;
    align-items: stretch;
    margin: 8px 0 0 0;
    flex-wrap: wrap;
}
.single-product form.cart .quantity {
    display: flex;
    align-items: center;
}
.single-product form.cart input.qty {
    width: 80px;
    height: 48px;
    padding: 0 12px;
    border: 1px solid var(--color-gray-300);
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    color: var(--color-navy);
    background: #ffffff;
    -moz-appearance: textfield;
}
.single-product form.cart input.qty::-webkit-outer-spin-button,
.single-product form.cart input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.single-product form.cart button.single_add_to_cart_button,
.single-product form.cart button[type="submit"] {
    flex: 1;
    min-width: 200px;
    height: 48px;
    background: var(--color-navy);
    color: #ffffff !important;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
    padding: 0 32px;
    cursor: pointer;
    transition: background 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.single-product form.cart button.single_add_to_cart_button:hover {
    background: var(--color-blue);
}

/* Product meta (SKU, categories, tags) */
.single-product .product_meta {
    font-size: 13px;
    color: var(--color-gray-500);
    padding: 16px 0 0 0;
    border-top: 1px solid var(--color-gray-100);
    margin-top: 12px;
    line-height: 1.8;
}
.single-product .product_meta > span {
    display: block;
    margin-bottom: 4px;
}
.single-product .product_meta a {
    color: var(--color-blue);
}
.single-product .product_meta a:hover {
    color: var(--color-navy);
}

/* Stock status */
.single-product .stock.in-stock {
    color: #059669;
    font-size: 13px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.single-product .stock.in-stock::before {
    content: "●";
    color: #10b981;
    font-size: 12px;
}
.single-product .stock.out-of-stock {
    color: #dc2626;
    font-size: 13px;
    font-weight: 600;
}

/* Purity badge (requires product short description to include ">99%" — decorative) */
.single-product .product::before { display: none; }

/* ==========================================================================
   WOOCOMMERCE — Tabs (Description, Additional Info)
   ========================================================================== */
.woocommerce-tabs {
    margin: 0 0 64px 0;
    padding: 32px 0 0 0;
    border-top: 1px solid var(--color-gray-200);
}
.woocommerce-tabs ul.tabs {
    list-style: none;
    padding: 0;
    margin: 0 0 32px 0;
    display: flex;
    gap: 4px;
    border-bottom: 2px solid var(--color-gray-100);
    flex-wrap: wrap;
}
.woocommerce-tabs ul.tabs li {
    margin: 0;
    padding: 0;
}
.woocommerce-tabs ul.tabs li a {
    display: block;
    padding: 12px 24px;
    font-size: 15px;
    font-weight: 600;
    color: var(--color-gray-500);
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    transition: color 0.2s, border-color 0.2s;
}
.woocommerce-tabs ul.tabs li a:hover {
    color: var(--color-navy);
}
.woocommerce-tabs ul.tabs li.active a,
.woocommerce-tabs ul.tabs li.active {
    color: var(--color-blue);
    border-bottom-color: var(--color-blue);
}
.woocommerce-tabs .panel {
    color: var(--color-gray-600);
    font-size: 15px;
    line-height: 1.7;
}
.woocommerce-tabs .panel h2 {
    color: var(--color-navy);
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 16px 0;
}
.woocommerce-tabs .panel p { margin: 0 0 12px 0; }

/* Additional Info table */
.woocommerce-product-attributes {
    width: 100%;
    border-collapse: collapse;
}
.woocommerce-product-attributes th,
.woocommerce-product-attributes td {
    padding: 12px 16px;
    border: 1px solid var(--color-gray-200);
    font-size: 14px;
    text-align: left;
}
.woocommerce-product-attributes th {
    background: var(--color-gray-50);
    color: var(--color-navy);
    font-weight: 600;
    width: 30%;
}
.woocommerce-product-attributes td { color: var(--color-gray-600); }

/* ==========================================================================
   WOOCOMMERCE — Related Products
   ========================================================================== */
.related.products,
.upsells.products {
    margin: 0;
    padding: 48px 0 0 0;
    border-top: 1px solid var(--color-gray-200);
}
.related.products > h2,
.upsells.products > h2 {
    color: var(--color-navy);
    font-size: 26px;
    font-weight: 700;
    text-align: center;
    margin: 0 0 8px 0;
}
.related.products > h2::after {
    content: "";
    display: block;
    width: 64px;
    height: 3px;
    background: var(--color-blue);
    margin: 16px auto 32px;
    border-radius: 9999px;
}
.related.products ul.products,
.upsells.products ul.products {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}
@media (min-width: 640px) {
    .related.products ul.products,
    .upsells.products ul.products { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
    .related.products ul.products,
    .upsells.products ul.products { grid-template-columns: repeat(3, 1fr); }
}
.related.products li.product,
.upsells.products li.product {
    list-style: none;
    background: #ffffff;
    border: 1px solid var(--color-gray-200);
    border-radius: 12px;
    overflow: hidden;
    transition: box-shadow 0.3s, transform 0.3s;
    display: flex;
    flex-direction: column;
}
.related.products li.product:hover,
.upsells.products li.product:hover {
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1);
    transform: translateY(-2px);
}
.related.products li.product > a,
.upsells.products li.product > a {
    display: block;
    padding: 0;
}
.related.products li.product img,
.upsells.products li.product img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    background: var(--color-gray-100);
    margin: 0;
}
.related.products li.product .woocommerce-loop-product__title,
.upsells.products li.product .woocommerce-loop-product__title {
    color: var(--color-navy);
    font-size: 18px;
    font-weight: 700;
    padding: 16px 20px 4px;
    margin: 0;
}
.related.products li.product .price,
.upsells.products li.product .price {
    color: var(--color-blue);
    font-size: 18px;
    font-weight: 700;
    padding: 0 20px 16px;
    margin: 0;
    display: block;
}
.related.products li.product .button,
.upsells.products li.product .button {
    margin: 0 20px 20px;
    padding: 8px 16px;
    background: var(--color-navy);
    color: #ffffff !important;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    display: inline-block;
    transition: background 0.2s;
    text-align: center;
    align-self: flex-start;
}
.related.products li.product .button:hover,
.upsells.products li.product .button:hover {
    background: var(--color-blue);
}
.related.products li.product .button.added { display: none; }
.related.products li.product .added_to_cart { display: none; }

/* Sale badge on product cards */
li.product .onsale {
    position: absolute;
    top: 12px;
    left: 12px;
    background: var(--color-gold);
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 4px;
    z-index: 5;
}
li.product { position: relative; }

/* ==========================================================================
   OVERRIDE: Single Product — Option B Layout
   Layout:
     Top-left:  [Product image] + [Add-to-cart button below]
     Top-right: Title + Price + Description + Meta
     Bottom:    Related products full-width
   ========================================================================== */

/* Reset the earlier single-product grid so we can rebuild */
.single-product div.product {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-areas:
        "image"
        "summary";
    gap: 24px !important;
}
@media (min-width: 768px) {
    .single-product div.product {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        grid-template-areas: "image summary" !important;
        gap: 48px !important;
        align-items: start !important;
    }
}

/* Image column — contains gallery + cart form */
.single-product .woocommerce-product-gallery {
    grid-area: image;
    background: var(--color-gray-50);
    border-radius: 12px;
    padding: 24px;
    position: relative;
}

/* Summary column — title, price, short description, meta */
.single-product .product .summary {
    grid-area: summary;
    padding-top: 0;
}

/* Move the cart form OUT of summary and UNDER the image column.
   We do this by making the summary a flex col, then using order to push
   the cart form into a position below the gallery via negative margin tricks.
   Cleanest approach: use CSS to relocate. Since that's fragile, we instead
   render the cart form inline inside the summary but style it to visually
   belong to the image column by moving it down and left via grid. */

/* Cleaner alternative: keep cart form in summary but add it BELOW the image
   visually using a wrapper. See template-part override below. */

/* Hide the original cart form inside summary (we'll re-output it below image). */
.single-product .product .summary form.cart { display: none !important; }
.single-product .product .summary .stock { display: none !important; }

/* Our custom cart-under-image wrapper (injected via hook) */
.peptofit-product-cart-below {
    margin-top: 16px;
}
.peptofit-product-cart-below form.cart {
    display: flex !important;
    gap: 12px;
    align-items: stretch;
    flex-wrap: wrap;
}
.peptofit-product-cart-below form.cart .quantity {
    display: flex;
    align-items: center;
}
.peptofit-product-cart-below form.cart input.qty {
    width: 80px;
    height: 48px;
    padding: 0 12px;
    border: 1px solid var(--color-gray-300);
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    color: var(--color-navy);
    background: #ffffff;
}
.peptofit-product-cart-below form.cart button[type="submit"],
.peptofit-product-cart-below form.cart button.single_add_to_cart_button {
    flex: 1;
    min-width: 200px;
    height: 48px;
    background: var(--color-navy);
    color: #ffffff !important;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
    padding: 0 32px;
    cursor: pointer;
    transition: background 0.2s;
}
.peptofit-product-cart-below form.cart button[type="submit"]:hover,
.peptofit-product-cart-below form.cart button.single_add_to_cart_button:hover {
    background: var(--color-blue);
}
.peptofit-product-cart-below .stock {
    margin-top: 12px;
    font-size: 13px;
    font-weight: 600;
}
.peptofit-product-cart-below .stock.in-stock {
    color: #059669;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.peptofit-product-cart-below .stock.in-stock::before {
    content: "●";
    color: #10b981;
    font-size: 12px;
}

/* Tabs: span full width below both columns */
.woocommerce-tabs { grid-column: 1 / -1; }

/* Related products: full-width at bottom */
.related.products, .upsells.products { grid-column: 1 / -1; }

/* Hide any leftover sidebar widgets from WooCommerce */
.single-product .content-wrap .widget_search,
.single-product .content-wrap .widget_pages,
.single-product .content-wrap .widget_recent_entries,
.single-product .content-wrap .widget_archive,
.single-product .content-wrap .widget_categories,
.single-product .content-wrap .widget_meta,
.single-product #secondary,
.single-product .sidebar,
.single-product aside.widget-area { display: none !important; }

/* ==========================================================================
   SINGLE PRODUCT — Option B layout refinements
   Make sure: Image left + cart under it | Title+Price+Description right
             Related products full-width below
   ========================================================================== */

/* The short description IS the text under price in the summary.
   If it's empty, WooCommerce renders nothing — we style the container
   so it still looks balanced. */
.single-product .woocommerce-product-details__short-description:empty { display: none; }

/* Give the summary column breathing room so it doesn't look empty */
.single-product .product .summary {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 0;
}

/* Hide the WooCommerce tabs since we're now showing description inline */
.single-product .woocommerce-tabs { display: none !important; }

/* Render the full product description inline in the summary column
   (via PHP hook — see functions.php peptofit_add_description_to_summary). */
.peptofit-full-description {
    color: var(--color-gray-600);
    font-size: 15px;
    line-height: 1.7;
    padding: 16px 0;
    border-top: 1px solid var(--color-gray-100);
}
.peptofit-full-description h2,
.peptofit-full-description h3 {
    color: var(--color-navy);
    font-weight: 700;
    margin: 16px 0 8px;
}
.peptofit-full-description p { margin: 0 0 12px 0; }
.peptofit-full-description p:last-child { margin-bottom: 0; }
.peptofit-full-description ul,
.peptofit-full-description ol { padding-left: 20px; margin: 0 0 12px; }

/* ==========================================================================
   WOOCOMMERCE — CART PAGE (2-column: table left, totals right)
   ========================================================================== */
.woocommerce-cart .woo-page { padding: 48px 0 80px; }

.woocommerce-cart .woocommerce {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}
@media (min-width: 1024px) {
    .woocommerce-cart .woocommerce {
        grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr);
        gap: 48px;
        align-items: start;
    }
}

/* Page title (Koszyk) */
.woocommerce-cart h1.entry-title,
.woocommerce-cart .wc-block-cart__main-title {
    color: var(--color-navy);
    font-size: 32px;
    font-weight: 800;
    margin: 0 0 24px 0;
    grid-column: 1 / -1;
}

/* Cart form (left column — product table) */
.woocommerce-cart form.woocommerce-cart-form {
    background: #ffffff;
    border: 1px solid var(--color-gray-200);
    border-radius: 12px;
    padding: 0;
    overflow: hidden;
}

/* Cart table */
.woocommerce-cart table.cart {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
}
.woocommerce-cart table.cart thead {
    background: var(--color-gray-50);
    border-bottom: 1px solid var(--color-gray-200);
}
.woocommerce-cart table.cart thead th {
    padding: 14px 16px;
    color: var(--color-navy);
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-align: left;
}
.woocommerce-cart table.cart tbody td {
    padding: 20px 16px;
    border-bottom: 1px solid var(--color-gray-100);
    vertical-align: middle;
    font-size: 14px;
    color: var(--color-gray-700);
}
.woocommerce-cart table.cart tbody tr:last-child td { border-bottom: none; }

/* Remove-item (X) button */
.woocommerce-cart table.cart td.product-remove { width: 32px; padding-left: 16px; padding-right: 0; }
.woocommerce-cart table.cart td.product-remove a.remove {
    display: inline-flex;
    width: 24px;
    height: 24px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--color-gray-100);
    color: var(--color-gray-600) !important;
    font-size: 18px;
    line-height: 1;
    text-decoration: none !important;
    transition: background 0.2s, color 0.2s;
}
.woocommerce-cart table.cart td.product-remove a.remove:hover {
    background: #fee2e2;
    color: #dc2626 !important;
}

/* Product image thumbnail */
.woocommerce-cart table.cart td.product-thumbnail { width: 80px; }
.woocommerce-cart table.cart td.product-thumbnail img {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: 8px;
    background: var(--color-gray-50);
    display: block;
}

/* Product name link */
.woocommerce-cart table.cart td.product-name a {
    color: var(--color-navy);
    font-weight: 600;
    font-size: 15px;
}
.woocommerce-cart table.cart td.product-name a:hover { color: var(--color-blue); }

/* Price cells */
.woocommerce-cart table.cart td.product-price,
.woocommerce-cart table.cart td.product-subtotal {
    font-weight: 600;
    color: var(--color-navy);
}
.woocommerce-cart table.cart td.product-subtotal { color: var(--color-blue); font-weight: 700; }

/* Quantity input */
.woocommerce-cart .quantity input.qty {
    width: 70px;
    height: 40px;
    padding: 0 8px;
    border: 1px solid var(--color-gray-300);
    border-radius: 6px;
    font-size: 15px;
    font-weight: 600;
    text-align: center;
    color: var(--color-navy);
    background: #ffffff;
}

/* Actions row (coupon + update cart) */
.woocommerce-cart table.cart td.actions {
    padding: 20px 16px;
    background: var(--color-gray-50);
    border-top: 1px solid var(--color-gray-200);
}

/* Coupon — hidden behind expandable link */
.woocommerce-cart .coupon {
    display: inline-block;
    margin-right: 12px;
}
.woocommerce-cart .coupon label { display: none; }
.woocommerce-cart .coupon input#coupon_code {
    height: 40px;
    padding: 0 12px;
    border: 1px solid var(--color-gray-300);
    border-radius: 6px;
    font-size: 14px;
    margin-right: 8px;
    min-width: 180px;
}
.woocommerce-cart .coupon button[name="apply_coupon"] {
    height: 40px;
    padding: 0 16px;
    background: #ffffff;
    border: 1px solid var(--color-navy);
    color: var(--color-navy) !important;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}
.woocommerce-cart .coupon button[name="apply_coupon"]:hover {
    background: var(--color-navy);
    color: #ffffff !important;
}

/* Update cart button */
.woocommerce-cart button[name="update_cart"] {
    height: 40px;
    padding: 0 16px;
    background: transparent;
    border: 1px solid var(--color-gray-300);
    color: var(--color-gray-600) !important;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s;
}
.woocommerce-cart button[name="update_cart"]:hover {
    border-color: var(--color-navy);
    color: var(--color-navy) !important;
}
.woocommerce-cart button[name="update_cart"][disabled] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Cart totals (right column sticky sidebar) */
.woocommerce-cart .cart-collaterals {
    width: 100%;
}
.woocommerce-cart .cart-collaterals .cart_totals {
    background: #ffffff;
    border: 1px solid var(--color-gray-200);
    border-radius: 12px;
    padding: 24px;
    position: sticky;
    top: 96px;
}
.woocommerce-cart .cart-collaterals .cart_totals h2 {
    color: var(--color-navy);
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 16px 0;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--color-gray-100);
}
.woocommerce-cart .cart-collaterals table.shop_table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 0 16px 0;
}
.woocommerce-cart .cart-collaterals table.shop_table th,
.woocommerce-cart .cart-collaterals table.shop_table td {
    padding: 12px 0;
    border-bottom: 1px solid var(--color-gray-100);
    font-size: 14px;
    text-align: left;
}
.woocommerce-cart .cart-collaterals table.shop_table th {
    color: var(--color-gray-600);
    font-weight: 500;
}
.woocommerce-cart .cart-collaterals table.shop_table td { text-align: right; color: var(--color-navy); font-weight: 600; }
.woocommerce-cart .cart-collaterals .order-total td,
.woocommerce-cart .cart-collaterals .order-total th {
    border-bottom: none;
    padding-top: 16px;
    font-size: 16px;
}
.woocommerce-cart .cart-collaterals .order-total td { color: var(--color-blue); font-size: 22px; font-weight: 800; }

/* Proceed to checkout button */
.woocommerce-cart .wc-proceed-to-checkout {
    padding: 0;
    margin: 16px 0 0 0;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 52px;
    background: var(--color-navy);
    color: #ffffff !important;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
    padding: 0 24px;
    text-decoration: none;
    transition: background 0.2s;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
    background: var(--color-blue);
}

/* Shipping calculator in cart totals */
.woocommerce-cart .shipping-calculator-form {
    margin: 12px 0 0 0;
    padding: 12px;
    background: var(--color-gray-50);
    border-radius: 8px;
    border: 1px solid var(--color-gray-100);
}
.woocommerce-cart .shipping-calculator-form p { margin: 0 0 8px 0; }
.woocommerce-cart .shipping-calculator-form select,
.woocommerce-cart .shipping-calculator-form input[type="text"] {
    width: 100%;
    height: 40px;
    padding: 0 10px;
    border: 1px solid var(--color-gray-300);
    border-radius: 6px;
    font-size: 14px;
    background: #ffffff;
}
.woocommerce-cart .shipping-calculator-form button {
    height: 40px;
    background: var(--color-navy);
    color: #ffffff !important;
    border: none;
    border-radius: 6px;
    padding: 0 16px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

/* EMPTY CART */
.woocommerce-cart .cart-empty {
    text-align: center;
    padding: 64px 32px;
    background: var(--color-gray-50);
    border-radius: 12px;
    border: 2px dashed var(--color-gray-300);
}
.woocommerce-cart .cart-empty::before {
    content: "🛒";
    display: block;
    font-size: 48px;
    margin-bottom: 16px;
}
.woocommerce-cart .cart-empty + .return-to-shop {
    text-align: center;
    margin-top: 20px;
}
.woocommerce-cart .return-to-shop .button,
.woocommerce-cart .return-to-shop .wc-backward {
    display: inline-block;
    background: var(--color-navy);
    color: #ffffff !important;
    padding: 12px 32px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    transition: background 0.2s;
}
.woocommerce-cart .return-to-shop .button:hover { background: var(--color-blue); }

/* ==========================================================================
   WOOCOMMERCE — CHECKOUT PAGE (2-column: form left, order summary right)
   ========================================================================== */
.woocommerce-checkout .woo-page { padding: 48px 0 80px; }

.woocommerce-checkout h1.entry-title {
    color: var(--color-navy);
    font-size: 32px;
    font-weight: 800;
    margin: 0 0 24px 0;
}

/* 2-column grid: form left, review-order right */
.woocommerce-checkout form.checkout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}
@media (min-width: 1024px) {
    .woocommerce-checkout form.checkout {
        grid-template-columns: minmax(0, 1.5fr) minmax(320px, 1fr);
        gap: 48px;
        align-items: start;
    }
}

/* Left column wrapper (billing/shipping) */
.woocommerce-checkout .col2-set,
.woocommerce-checkout #customer_details {
    width: 100%;
    margin: 0;
    grid-column: 1;
}
.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 {
    width: 100%;
    float: none;
    margin-bottom: 24px;
}

/* Form section cards */
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-shipping-fields,
.woocommerce-checkout .woocommerce-additional-fields {
    background: #ffffff;
    border: 1px solid var(--color-gray-200);
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 20px;
}
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.woocommerce-checkout .woocommerce-additional-fields h3 {
    color: var(--color-navy);
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 16px 0;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--color-gray-100);
}

/* Form fields */
.woocommerce-checkout .form-row {
    margin: 0 0 14px 0;
    padding: 0;
}
.woocommerce-checkout .form-row label {
    display: block;
    margin: 0 0 6px 0;
    color: var(--color-gray-600);
    font-size: 13px;
    font-weight: 600;
}
.woocommerce-checkout .form-row label .required,
.woocommerce-checkout .form-row label .optional {
    color: var(--color-gold);
    font-weight: 700;
}
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row .select2-selection,
.woocommerce-checkout select {
    width: 100%;
    height: 44px;
    padding: 0 12px;
    border: 1px solid var(--color-gray-300);
    border-radius: 8px;
    font-size: 14px;
    background: #ffffff;
    color: var(--color-navy);
    transition: border-color 0.2s, box-shadow 0.2s;
}
.woocommerce-checkout .form-row textarea {
    height: 80px;
    padding: 10px 12px;
    resize: vertical;
}
.woocommerce-checkout .form-row input:focus,
.woocommerce-checkout .form-row textarea:focus,
.woocommerce-checkout .form-row select:focus {
    outline: none;
    border-color: var(--color-blue);
    box-shadow: 0 0 0 3px rgba(32,80,154,0.1);
}
.woocommerce-checkout .form-row-first,
.woocommerce-checkout .form-row-last {
    width: 48%;
    float: left;
}
.woocommerce-checkout .form-row-first { margin-right: 4%; }
.woocommerce-checkout .form-row.form-row-wide { clear: both; width: 100%; }

/* Select2 dropdown styling */
.woocommerce-checkout .select2-container--default .select2-selection--single {
    height: 44px;
    border: 1px solid var(--color-gray-300);
    border-radius: 8px;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 44px;
    padding-left: 12px;
    color: var(--color-navy);
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 44px;
}

/* Right column — order review sticky sidebar */
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #order_review {
    grid-column: 2;
}
@media (max-width: 1023px) {
    .woocommerce-checkout #order_review_heading,
    .woocommerce-checkout #order_review { grid-column: 1; }
}

.woocommerce-checkout #order_review_heading {
    color: var(--color-navy);
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 12px 0;
}
.woocommerce-checkout #order_review {
    background: #ffffff;
    border: 1px solid var(--color-gray-200);
    border-radius: 12px;
    padding: 24px;
    position: sticky;
    top: 96px;
}
.woocommerce-checkout #order_review table.shop_table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 0 16px 0;
}
.woocommerce-checkout #order_review table.shop_table th {
    padding: 10px 0;
    font-size: 13px;
    font-weight: 700;
    text-align: left;
    color: var(--color-gray-600);
    border-bottom: 1px solid var(--color-gray-200);
}
.woocommerce-checkout #order_review table.shop_table td {
    padding: 12px 0;
    font-size: 14px;
    border-bottom: 1px solid var(--color-gray-100);
    color: var(--color-navy);
    vertical-align: top;
}
.woocommerce-checkout #order_review table.shop_table tfoot th,
.woocommerce-checkout #order_review table.shop_table tfoot td {
    border-bottom: 1px solid var(--color-gray-100);
    padding: 12px 0;
}
.woocommerce-checkout #order_review table.shop_table tfoot .order-total th,
.woocommerce-checkout #order_review table.shop_table tfoot .order-total td {
    border-bottom: none;
    padding-top: 14px;
    font-size: 16px;
}
.woocommerce-checkout #order_review tfoot .order-total td { color: var(--color-blue); font-size: 20px; font-weight: 800; text-align: right; }
.woocommerce-checkout #order_review table.shop_table td.product-total { text-align: right; font-weight: 600; }

/* Payment methods */
.woocommerce-checkout #payment {
    background: transparent;
    border: none;
    padding: 0;
    margin-top: 16px;
    border-radius: 0;
}
.woocommerce-checkout #payment ul.payment_methods {
    padding: 0;
    margin: 0;
    list-style: none;
    border-top: 1px solid var(--color-gray-100);
    padding-top: 16px;
}
.woocommerce-checkout #payment ul.payment_methods li {
    padding: 12px 14px;
    border: 1px solid var(--color-gray-200);
    border-radius: 8px;
    margin-bottom: 8px;
    background: #ffffff;
    transition: border-color 0.2s;
}
.woocommerce-checkout #payment ul.payment_methods li:has(input:checked) {
    border-color: var(--color-blue);
    background: rgba(32,80,154,0.04);
}
.woocommerce-checkout #payment ul.payment_methods label {
    color: var(--color-navy);
    font-weight: 600;
    cursor: pointer;
    font-size: 14px;
}
.woocommerce-checkout #payment ul.payment_methods .payment_box {
    background: var(--color-gray-50);
    padding: 12px;
    border-radius: 6px;
    margin-top: 10px;
    font-size: 13px;
    color: var(--color-gray-600);
}

/* Place order button */
.woocommerce-checkout #payment .place-order,
.woocommerce-checkout #place_order {
    margin-top: 16px;
    display: block;
    width: 100%;
    height: 52px;
    background: var(--color-navy);
    color: #ffffff !important;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s;
}
.woocommerce-checkout #place_order:hover { background: var(--color-blue); }

/* Terms and conditions checkbox */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
    padding: 12px 0;
    font-size: 13px;
    color: var(--color-gray-600);
}
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a {
    color: var(--color-blue);
    font-weight: 600;
}
.woocommerce-checkout .form-row.validate-required label.checkbox { font-size: 13px; }

/* Login + coupon reveal links at top */
.woocommerce-checkout .woocommerce-form-login-toggle,
.woocommerce-checkout .woocommerce-form-coupon-toggle {
    margin-bottom: 16px;
}
.woocommerce-checkout .woocommerce-info {
    font-size: 13px;
}
.woocommerce-checkout .showcoupon,
.woocommerce-checkout .showlogin {
    color: var(--color-blue);
    font-weight: 600;
}

/* Clear floats */
.woocommerce-checkout .col2-set::after,
.woocommerce-checkout .form-row::after { content: ""; display: table; clear: both; }

/* ==========================================================================
   FIX: Cart & Checkout page width
   page.php wraps content in .content-wrap (max 768px) which breaks our
   2-column layout. Force full width for Woo shortcode pages.
   ========================================================================== */
body.peptofit-woo-shortcode-page .content-wrap {
    max-width: var(--container-max) !important;
    padding: 48px 16px 80px !important;
}
@media (min-width: 640px) {
    body.peptofit-woo-shortcode-page .content-wrap {
        padding: 48px 24px 80px !important;
    }
}
@media (min-width: 1024px) {
    body.peptofit-woo-shortcode-page .content-wrap {
        padding: 48px 32px 80px !important;
    }
}

/* The page <h1> title "Cart" is hidden since the cart has its own layout */
body.peptofit-woo-shortcode-page .content-wrap > h1 {
    color: var(--color-navy);
    font-size: 32px;
    font-weight: 800;
    margin: 0 0 24px 0;
}

/* Ensure the inner woo-container doesn't double-wrap */
body.peptofit-woo-shortcode-page .content-wrap .woo-container {
    max-width: 100%;
    margin: 0;
    padding: 0;
}

/* ==========================================================================
   FOOTER — Social Icons
   ========================================================================== */
.footer-socials {
    display: flex;
    gap: 10px;
    margin-top: 16px;
}
.footer-socials a {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--color-gray-800);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
    text-decoration: none;
}
.footer-socials a:hover {
    background: var(--color-blue);
}

/* ==========================================================================
   CONTACT PAGE (/kontakt/)
   ========================================================================== */
.peptofit-contact-page {
    padding: 48px 0 64px;
    background: #ffffff;
}
.peptofit-contact-head {
    text-align: center;
    margin-bottom: 40px;
}
.peptofit-contact-head h1 {
    color: var(--color-navy);
    font-size: 36px;
    font-weight: 800;
    margin: 0 0 8px 0;
}
.peptofit-contact-head p {
    color: var(--color-gray-500);
    max-width: 560px;
    margin: 0 auto;
    font-size: 15px;
}
.peptofit-contact-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    max-width: 1100px;
    margin: 0 auto;
}
@media (min-width: 900px) {
    .peptofit-contact-grid {
        grid-template-columns: 2fr 1fr;
        gap: 32px;
        align-items: start;
    }
}
.peptofit-contact-form-wrap {
    background: #ffffff;
    border: 1px solid var(--color-gray-200);
    border-radius: 12px;
    padding: 32px;
}
.peptofit-contact-form-wrap h3 {
    color: var(--color-navy);
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 4px 0;
}
.peptofit-contact-form-wrap .smsub {
    color: var(--color-gray-500);
    font-size: 13px;
    margin: 0 0 20px 0;
}

/* Contact Form 7 styling inside the contact form wrap */
.peptofit-contact-form-wrap .wpcf7 p { margin: 0 0 14px 0; }
.peptofit-contact-form-wrap label {
    display: block;
    color: var(--color-gray-600);
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 6px;
}
.peptofit-contact-form-wrap input[type="text"],
.peptofit-contact-form-wrap input[type="email"],
.peptofit-contact-form-wrap input[type="tel"],
.peptofit-contact-form-wrap textarea,
.peptofit-contact-form-wrap select {
    width: 100%;
    height: 44px;
    padding: 0 12px;
    border: 1px solid var(--color-gray-300);
    border-radius: 8px;
    font-size: 14px;
    background: #ffffff;
    color: var(--color-navy);
    font-family: inherit;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.peptofit-contact-form-wrap textarea {
    height: 120px;
    padding: 10px 12px;
    resize: vertical;
}
.peptofit-contact-form-wrap input:focus,
.peptofit-contact-form-wrap textarea:focus,
.peptofit-contact-form-wrap select:focus {
    outline: none;
    border-color: var(--color-blue);
    box-shadow: 0 0 0 3px rgba(32,80,154,0.1);
}
.peptofit-contact-form-wrap input[type="submit"],
.peptofit-contact-form-wrap button[type="submit"] {
    width: 100%;
    height: 48px;
    background: var(--color-navy);
    color: #ffffff;
    border: none;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    margin-top: 8px;
    transition: background 0.2s;
}
.peptofit-contact-form-wrap input[type="submit"]:hover,
.peptofit-contact-form-wrap button[type="submit"]:hover {
    background: var(--color-blue);
}

/* Contact page — side card */
.peptofit-contact-side {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.peptofit-side-card {
    background: var(--color-gray-50);
    border: 1px solid var(--color-gray-200);
    border-radius: 12px;
    padding: 24px;
}
.peptofit-side-card h4 {
    color: var(--color-navy);
    font-size: 14px;
    font-weight: 700;
    margin: 0 0 14px 0;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.peptofit-side-social {
    display: flex;
    gap: 10px;
}
.peptofit-side-social a {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #ffffff;
    border: 1px solid var(--color-gray-200);
    color: var(--color-navy);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
    text-decoration: none;
}
.peptofit-side-social a:hover {
    background: var(--color-navy);
    color: #ffffff;
    border-color: var(--color-navy);
}

/* ==========================================================================
   SHOP PAGE (/sklep/) — uses woocommerce.php template
   ========================================================================== */
.peptofit-shop-wrap {
    padding: 48px 0 80px;
    background: #ffffff;
}
.shop-head {
    text-align: center;
    margin-bottom: 32px;
}
.shop-head h1 {
    color: var(--color-navy);
    font-size: 36px;
    font-weight: 800;
    margin: 0 0 16px 0;
}
.shop-divider {
    width: 80px;
    height: 3px;
    background: var(--color-blue);
    margin: 0 auto 20px;
    border-radius: 9999px;
}
.shop-description {
    color: var(--color-gray-600);
    max-width: 720px;
    margin: 0 auto 20px;
    font-size: 15px;
    line-height: 1.6;
}

/* Toolbar — result count + sort dropdown */
.shop-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0;
    margin-bottom: 24px;
    border-bottom: 1px solid var(--color-gray-100);
    flex-wrap: wrap;
    gap: 12px;
}
.woocommerce-result-count {
    color: var(--color-gray-500);
    font-size: 13px;
    margin: 0;
}
.woocommerce-ordering select,
.shop-toolbar select {
    height: 40px;
    padding: 0 32px 0 12px;
    border: 1px solid var(--color-gray-300);
    border-radius: 8px;
    font-size: 14px;
    color: var(--color-navy);
    background: #ffffff;
    cursor: pointer;
}

/* Shop product grid */
.shop-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    margin-bottom: 48px;
}
@media (min-width: 640px) {
    .shop-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
    .shop-grid { grid-template-columns: repeat(3, 1fr); }
}
.shop-grid .product {
    background: #ffffff;
    border: 1px solid var(--color-gray-200);
    border-radius: 12px;
    overflow: hidden;
    transition: box-shadow 0.3s, transform 0.3s;
    display: flex;
    flex-direction: column;
    position: relative;
    list-style: none;
}
.shop-grid .product:hover {
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1);
    transform: translateY(-2px);
}
.shop-grid .product a.woocommerce-LoopProduct-link {
    display: block;
    text-decoration: none;
}
.shop-grid .product img {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
    background: var(--color-gray-100);
    margin: 0;
}
.shop-grid .product .woocommerce-loop-product__title {
    color: var(--color-navy);
    font-size: 17px;
    font-weight: 700;
    padding: 16px 20px 4px;
    margin: 0;
}
.shop-grid .product .price {
    color: var(--color-blue);
    font-size: 17px;
    font-weight: 700;
    padding: 0 20px 16px;
    margin: 0;
    display: block;
}
.shop-grid .product .price del {
    color: var(--color-gray-400);
    font-weight: 500;
    margin-right: 6px;
    opacity: 0.6;
}
.shop-grid .product .button,
.shop-grid .product .add_to_cart_button {
    margin: 0 20px 20px;
    padding: 8px 14px;
    background: var(--color-navy);
    color: #ffffff !important;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: background 0.2s;
    align-self: flex-start;
    text-decoration: none;
}
.shop-grid .product .button:hover,
.shop-grid .product .add_to_cart_button:hover {
    background: var(--color-blue);
}
.shop-grid .product .button.added { display: none; }
.shop-grid .product .added_to_cart { display: none; }

/* Pagination */
.shop-pagination {
    text-align: center;
    padding-top: 32px;
    border-top: 1px solid var(--color-gray-100);
}
.woocommerce-pagination ul.page-numbers,
.shop-pagination ul.page-numbers {
    display: inline-flex;
    gap: 6px;
    list-style: none;
    padding: 0;
    margin: 0;
}
.woocommerce-pagination ul.page-numbers li,
.shop-pagination ul.page-numbers li { list-style: none; }
.woocommerce-pagination a,
.woocommerce-pagination span,
.shop-pagination a,
.shop-pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid var(--color-gray-200);
    border-radius: 8px;
    color: var(--color-gray-600);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s;
}
.woocommerce-pagination a:hover,
.shop-pagination a:hover {
    border-color: var(--color-navy);
    color: var(--color-navy);
}
.woocommerce-pagination span.current,
.shop-pagination span.current {
    background: var(--color-navy);
    color: #ffffff;
    border-color: var(--color-navy);
}
.shop-no-products {
    text-align: center;
    padding: 48px;
    background: var(--color-gray-50);
    border-radius: 12px;
    color: var(--color-gray-600);
}

/* ==========================================================================
   MINI PREVIEW — Cart totals sidebar and Checkout order review
   (Rendered via hooks in functions.php)
   ========================================================================== */
.peptofit-totals-preview {
    padding: 8px 0 14px;
    border-bottom: 1px solid var(--color-gray-100);
    margin-bottom: 12px;
}
.peptofit-totals-preview .preview-item {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 6px 0;
}
.peptofit-totals-preview .thumb {
    width: 40px;
    height: 40px;
    border-radius: 6px;
    background: var(--color-gray-100);
    flex-shrink: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.peptofit-totals-preview .thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.peptofit-totals-preview .nm {
    flex: 1;
    min-width: 0;
}
.peptofit-totals-preview .nm b {
    color: var(--color-navy);
    font-size: 13px;
    font-weight: 600;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.peptofit-totals-preview .nm span {
    color: var(--color-gray-500);
    font-size: 12px;
}
.peptofit-totals-preview .pr {
    color: var(--color-blue);
    font-weight: 700;
    font-size: 13px;
    flex-shrink: 0;
}

/* Checkout preview (rendered as a table row) */
.peptofit-checkout-preview {
    padding: 0 0 10px 0;
    border-bottom: 1px solid var(--color-gray-100);
    margin-bottom: 8px;
}
.peptofit-checkout-preview .preview-item {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--color-gray-100);
}
.peptofit-checkout-preview .preview-item:last-child { border-bottom: none; }
.peptofit-checkout-preview .thumb {
    width: 44px;
    height: 44px;
    border-radius: 6px;
    background: var(--color-gray-100);
    flex-shrink: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.peptofit-checkout-preview .thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.peptofit-checkout-preview .nm {
    flex: 1;
    min-width: 0;
}
.peptofit-checkout-preview .nm b {
    color: var(--color-navy);
    font-size: 13px;
    font-weight: 600;
    display: block;
}
.peptofit-checkout-preview .nm .qty {
    color: var(--color-gray-500);
    font-size: 12px;
}
.peptofit-checkout-preview .pr {
    color: var(--color-navy);
    font-weight: 700;
    font-size: 13px;
    flex-shrink: 0;
}

/* Hide cart_item rows on checkout (we render preview instead) */
.woocommerce-checkout .woocommerce-checkout-review-order-table .cart_item {
    display: none;
}

/* ==========================================================================
   SINGLE BLOG POST (single.php)
   ========================================================================== */
.peptofit-single-post {
    max-width: 800px;
    margin: 0 auto;
    padding: 48px 16px 64px;
}
@media (min-width: 640px) {
    .peptofit-single-post { padding: 48px 24px 64px; }
}
.peptofit-single-post .post-breadcrumb {
    font-size: 13px;
    color: var(--color-gray-500);
    margin-bottom: 20px;
}
.peptofit-single-post .post-breadcrumb a {
    color: var(--color-blue);
}
.peptofit-single-post .post-breadcrumb a:hover { color: var(--color-navy); }
.peptofit-single-post .post-breadcrumb .sep {
    margin: 0 6px;
    color: var(--color-gray-400);
}
.peptofit-single-post .post-breadcrumb .current {
    color: var(--color-gray-600);
}
.peptofit-single-post .post-meta {
    color: var(--color-gold);
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 10px;
}
.peptofit-single-post .post-title {
    color: var(--color-navy);
    font-size: 36px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0 0 24px 0;
}
.peptofit-single-post .post-featured-image {
    margin-bottom: 32px;
    border-radius: 12px;
    overflow: hidden;
    background: var(--color-gray-100);
}
.peptofit-single-post .post-featured-image img {
    width: 100%;
    height: auto;
    display: block;
}
.peptofit-single-post .post-content {
    font-size: 16px;
    line-height: 1.8;
    color: var(--color-gray-700);
}
.peptofit-single-post .post-content p { margin: 0 0 16px 0; }
.peptofit-single-post .post-content h2 {
    color: var(--color-navy);
    font-size: 24px;
    font-weight: 700;
    margin: 28px 0 12px;
}
.peptofit-single-post .post-content h3 {
    color: var(--color-navy);
    font-size: 18px;
    font-weight: 700;
    margin: 22px 0 10px;
}
.peptofit-single-post .post-content ul,
.peptofit-single-post .post-content ol {
    padding-left: 24px;
    margin: 0 0 16px 0;
}
.peptofit-single-post .post-content li {
    margin-bottom: 6px;
    line-height: 1.7;
}
.peptofit-single-post .post-content blockquote {
    border-left: 3px solid var(--color-blue);
    background: var(--color-gray-50);
    margin: 20px 0;
    padding: 14px 20px;
    color: var(--color-navy);
    font-style: italic;
}
.peptofit-single-post .post-content a {
    color: var(--color-blue);
}
.peptofit-single-post .post-content a:hover {
    color: var(--color-navy);
    text-decoration: underline;
}
.peptofit-single-post .post-content img {
    border-radius: 8px;
    margin: 16px 0;
}

/* Related posts */
.peptofit-single-post .related-posts {
    margin-top: 64px;
    padding-top: 48px;
    border-top: 1px solid var(--color-gray-200);
}
.peptofit-single-post .related-posts-head {
    text-align: center;
    margin-bottom: 32px;
}
.peptofit-single-post .related-posts-head h2 {
    color: var(--color-navy);
    font-size: 26px;
    font-weight: 700;
    margin: 0 0 12px 0;
}
.peptofit-single-post .related-posts-head .shop-divider {
    width: 60px;
    margin: 0 auto;
}

/* ==========================================================================
   CHECKOUT — Legal Acceptance Checkbox (Regulamin + Privacy Policy)
   Required by Przelewy24. Renders above the "Złóż zamówienie" button.
   ========================================================================== */
.peptofit-legal-consent {
    margin: 14px 0 8px 0;
    padding: 14px;
    background: var(--color-gray-50);
    border: 1px solid var(--color-gray-200);
    border-radius: 8px;
}
.peptofit-legal-checkbox {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    cursor: pointer;
    font-size: 13px;
    line-height: 1.55;
    color: var(--color-gray-700);
    margin: 0;
}
.peptofit-legal-checkbox input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin: 2px 0 0 0;
    accent-color: var(--color-blue);
    cursor: pointer;
    flex-shrink: 0;
}
.peptofit-legal-text { flex: 1; }
.peptofit-legal-text a {
    color: var(--color-blue);
    font-weight: 600;
    text-decoration: underline;
}
.peptofit-legal-text a:hover { color: var(--color-navy); }
.peptofit-required { color: var(--color-gold); font-weight: 700; }

/* Highlight the checkbox box if validation fails (adds .error class via JS/server) */
.peptofit-legal-consent.has-error {
    border-color: #dc2626;
    background: #fef2f2;
}

/* ============================================================
   InPost Checkout Styling — Peptofit Brand Override (v1.1.5)
   Keeps InPost yellow logo badges (customer recognition)
   Replaces yellow CTA button + address box with navy brand.
   ============================================================ */

/* Main "Change Parcel Locker" / "Select Parcel Locker" button */
.inpost-paczkomat-button,
.inpost_paczkomat_button,
.easypack-widget button.easypack-widget-button,
button.inpost-geowidget-button,
.wc-inpost-widget-button,
a.inpost-paczkomat-button,
button[id*="easypack-widget"],
button[class*="paczkomat"],
.inpost-geowidget-trigger {
    background: #0F2A55 !important;
    background-color: #0F2A55 !important;
    background-image: none !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    font-family: inherit !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    text-transform: none !important;
    box-shadow: 0 2px 6px rgba(15, 42, 85, 0.15) !important;
    padding: 14px 28px !important;
    transition: background 0.2s ease, transform 0.1s ease !important;
    cursor: pointer !important;
    min-width: auto !important;
    width: auto !important;
    max-width: 360px !important;
    display: inline-block !important;
}

.inpost-paczkomat-button:hover,
.inpost_paczkomat_button:hover,
.easypack-widget button.easypack-widget-button:hover,
button.inpost-geowidget-button:hover,
.wc-inpost-widget-button:hover,
a.inpost-paczkomat-button:hover,
button[id*="easypack-widget"]:hover,
button[class*="paczkomat"]:hover,
.inpost-geowidget-trigger:hover {
    background: #20509A !important;
    background-color: #20509A !important;
    color: #fff !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(15, 42, 85, 0.25) !important;
}

/* Selected Paczkomat address box */
.inpost-paczkomat-selected,
.inpost_paczkomat_selected,
.inpost-selected-parcel-locker,
.inpost-geowidget-selected-point,
div[class*="selected-paczkomat"],
div[class*="paczkomat-selected"] {
    border: 2px solid #0F2A55 !important;
    border-radius: 8px !important;
    background: #fafbfd !important;
    padding: 14px 18px !important;
    color: #0F2A55 !important;
    font-weight: 500 !important;
    margin-top: 12px !important;
    line-height: 1.5 !important;
}

/* Shipping method radio labels — cleaner spacing */
.woocommerce-checkout #shipping_method li,
.woocommerce-cart #shipping_method li,
ul#shipping_method li {
    margin-bottom: 10px !important;
    padding: 6px 0 !important;
}

/* Keep the small InPost yellow badge icons — just ensure sizing is reasonable */
.inpost-logo,
img[src*="inpost"],
.shipping_method img {
    max-height: 32px !important;
    width: auto !important;
    vertical-align: middle !important;
    margin-left: 8px !important;
}

/* GeoWidget modal popup — cleaner header/footer when map opens */
.easypack-modal,
.easypack-widget-modal,
iframe[src*="easypack"],
iframe[src*="geowidget"] {
    border-radius: 10px !important;
}

/* "Change address" link in cart/checkout — brand colour */
a.inpost-change-address,
a[class*="change-parcel"],
a[class*="change-paczkomat"] {
    color: #20509A !important;
    font-weight: 500 !important;
    text-decoration: underline !important;
}
a.inpost-change-address:hover,
a[class*="change-parcel"]:hover,
a[class*="change-paczkomat"]:hover {
    color: #0F2A55 !important;
}

/* Responsive — button wraps cleanly on mobile */
@media (max-width: 600px) {
    .inpost-paczkomat-button,
    .inpost_paczkomat_button,
    .easypack-widget button.easypack-widget-button,
    button.inpost-geowidget-button,
    .wc-inpost-widget-button,
    a.inpost-paczkomat-button,
    button[id*="easypack-widget"],
    button[class*="paczkomat"] {
        width: 100% !important;
        max-width: 100% !important;
        padding: 14px 20px !important;
    }
}

/* ============================================================
   Cart Overflow Fix (v1.1.5)
   Forces cart table to stay within viewport + hides scroll.
   Ensures Quantity/Subtotal columns are visible on laptops.
   ============================================================ */

/* Force cart contents to respect grid container, never overflow horizontally */
.woocommerce-cart .woocommerce,
.woocommerce-cart .woocommerce-cart-form,
.woocommerce-cart .cart-collaterals {
    max-width: 100% !important;
    overflow-x: visible !important;
}

/* Cart table itself — fit to column, compact layout */
.woocommerce-cart table.cart,
.woocommerce-cart table.shop_table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
}

/* Column widths — ensure all columns fit in viewport */
.woocommerce-cart table.cart th.product-remove,
.woocommerce-cart table.cart td.product-remove {
    width: 40px !important;
    min-width: 40px !important;
}
.woocommerce-cart table.cart th.product-thumbnail,
.woocommerce-cart table.cart td.product-thumbnail {
    width: 80px !important;
    min-width: 80px !important;
}
.woocommerce-cart table.cart th.product-name,
.woocommerce-cart table.cart td.product-name {
    width: auto !important;
    min-width: 120px !important;
    word-break: break-word;
}
.woocommerce-cart table.cart th.product-price,
.woocommerce-cart table.cart td.product-price {
    width: 90px !important;
    min-width: 90px !important;
    text-align: right !important;
}
.woocommerce-cart table.cart th.product-quantity,
.woocommerce-cart table.cart td.product-quantity {
    width: 100px !important;
    min-width: 100px !important;
    text-align: center !important;
}
.woocommerce-cart table.cart th.product-subtotal,
.woocommerce-cart table.cart td.product-subtotal {
    width: 100px !important;
    min-width: 100px !important;
    text-align: right !important;
}

/* Quantity input box — shrink so it fits in narrow column */
.woocommerce-cart table.cart .quantity input.qty {
    width: 56px !important;
    min-width: 56px !important;
    max-width: 72px !important;
    padding: 6px 4px !important;
    text-align: center !important;
    font-size: 14px !important;
}

/* On narrower laptop screens, shrink cells slightly */
@media (max-width: 1280px) {
    .woocommerce-cart table.cart th,
    .woocommerce-cart table.cart td {
        padding: 12px 8px !important;
        font-size: 14px !important;
    }
    .woocommerce-cart table.cart td.product-thumbnail img {
        width: 48px !important;
        height: 48px !important;
    }
}

/* Mobile — stack cart rows vertically, hide table headers */
@media (max-width: 768px) {
    .woocommerce-cart table.cart thead { display: none; }
    .woocommerce-cart table.cart,
    .woocommerce-cart table.cart tbody,
    .woocommerce-cart table.cart tr,
    .woocommerce-cart table.cart td {
        display: block !important;
        width: 100% !important;
    }
    .woocommerce-cart table.cart tr {
        border-bottom: 1px solid #e5e7eb !important;
        padding: 16px 0 !important;
        position: relative;
    }
    .woocommerce-cart table.cart td {
        padding: 6px 0 !important;
        border: none !important;
        text-align: left !important;
    }
    .woocommerce-cart table.cart td.product-remove {
        position: absolute;
        top: 16px;
        right: 0;
    }
    .woocommerce-cart table.cart td.product-thumbnail img {
        width: 64px !important;
        height: 64px !important;
    }
}

/* ============================================================
   Cart Grid Layout Fix (v1.1.7) — FINAL
   Ensures both grid columns stay contained within their tracks.
   ============================================================ */

/* Force the grid container to not overflow */
.woocommerce-cart .woocommerce {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* Force each direct grid child to respect its column width */
.woocommerce-cart .woocommerce > * {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Form (left column, contains table) — stay in its grid track */
.woocommerce-cart form.woocommerce-cart-form {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden;
}

/* Cart collaterals (right column, totals) */
.woocommerce-cart .cart-collaterals {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Table must respect parent width */
.woocommerce-cart table.cart,
.woocommerce-cart table.shop_table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: auto !important;  /* Let browser size columns naturally */
    min-width: 0 !important;
}

/* ============================================================
   Cart Page Layout Fix (v1.1.8)
   Fixes h1 positioning + quantity column visibility.
   ============================================================ */

/* Move the "Koszyk" title inside the container alignment */
.woocommerce-cart .content-wrap > h1 {
    max-width: 1280px;
    margin: 0 auto;
    padding: 48px 24px 0;
    color: var(--color-navy);
    font-size: 32px;
    font-weight: 800;
}

.woocommerce-cart .content-wrap > .post-content {
    padding-top: 24px;
}

/* Compact table so Quantity + Subtotal always fit in left column */
.woocommerce-cart table.cart {
    font-size: 13px;
}

.woocommerce-cart table.cart thead th {
    padding: 12px 8px !important;
    font-size: 11px !important;
}

.woocommerce-cart table.cart tbody td {
    padding: 14px 8px !important;
    font-size: 13px !important;
}

/* Shrink remove button column */
.woocommerce-cart table.cart td.product-remove {
    width: 32px !important;
    min-width: 32px !important;
    padding: 8px 4px !important;
}

/* Shrink product thumbnail */
.woocommerce-cart table.cart td.product-thumbnail {
    width: 60px !important;
    min-width: 60px !important;
    padding: 8px !important;
}
.woocommerce-cart table.cart td.product-thumbnail img {
    width: 48px !important;
    height: 48px !important;
    object-fit: cover;
}

/* Quantity column - visible, compact, centered */
.woocommerce-cart table.cart td.product-quantity {
    width: 80px !important;
    min-width: 80px !important;
    text-align: center !important;
}
.woocommerce-cart table.cart .quantity {
    margin: 0 auto;
    display: inline-block;
}
.woocommerce-cart table.cart .quantity input.qty {
    width: 56px !important;
    height: 36px !important;
    padding: 4px 6px !important;
    font-size: 14px !important;
}

/* Price + Subtotal columns */
.woocommerce-cart table.cart td.product-price,
.woocommerce-cart table.cart td.product-subtotal {
    width: 80px !important;
    min-width: 80px !important;
    font-size: 13px !important;
    white-space: nowrap;
}

/* Product name column - take remaining space */
.woocommerce-cart table.cart td.product-name {
    min-width: 0 !important;
    word-break: break-word;
}
.woocommerce-cart table.cart td.product-name a {
    font-size: 13px !important;
}

/* Actions row (coupon + update button) */
.woocommerce-cart table.cart td.actions {
    padding: 16px 8px !important;
}
.woocommerce-cart table.cart td.actions .coupon input#coupon_code {
    width: 140px !important;
    padding: 8px !important;
}
.woocommerce-cart table.cart td.actions .button {
    padding: 8px 14px !important;
    font-size: 12px !important;
}

/* ============================================================
   InPost Map Button — Brand Override (v1.1.8) FINAL
   The plugin injects inline yellow with !important on .easypack_show_geowidget
   We match that exact class with higher specificity + !important.
   ============================================================ */

/* Target the exact class the plugin uses in its inline style */
button.easypack_show_geowidget,
a.easypack_show_geowidget,
.easypack_show_geowidget,
body .easypack_show_geowidget,
html body .easypack_show_geowidget {
    background: #0F2A55 !important;
    background-color: #0F2A55 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 12px 24px !important;
    font-weight: 600 !important;
    font-family: inherit !important;
    cursor: pointer !important;
    box-shadow: 0 2px 6px rgba(15, 42, 85, 0.15) !important;
    transition: background 0.2s ease !important;
}

button.easypack_show_geowidget:hover,
a.easypack_show_geowidget:hover,
.easypack_show_geowidget:hover,
body .easypack_show_geowidget:hover,
html body .easypack_show_geowidget:hover {
    background: #20509A !important;
    background-color: #20509A !important;
    color: #ffffff !important;
}

/* Selected paczkomat display card */
.inpost-osm-list,
.easypack-widget,
.easypack-selected-point,
.inpost-selected-parcel {
    border: 2px solid #0F2A55 !important;
    border-radius: 8px !important;
    background: #fafbfd !important;
    padding: 12px 16px !important;
    color: #0F2A55 !important;
}

/* InPost shipping method logo (small icon next to label) - keep but size consistently */
.easypack-shipping-method-logo img,
.inpost_pl_shipping_meta img {
    max-height: 28px !important;
    width: auto !important;
    vertical-align: middle !important;
}

/* Override the plugin's inline yellow style override */
style#inline-inpost-styles,
style[id*="easypack"],
style[id*="inpost"] {
    /* Our CSS loads after; plugin inline style can't override ours due to selector specificity */
}

/* ============================================================
   Cart Layout — REBUILD (v1.1.9)
   Single-column stacked layout. Simple, bulletproof, branded.
   Overrides the earlier grid that was breaking.
   ============================================================ */

/* 1. Nuke the grid - use simple block layout */
.woocommerce-cart .woocommerce {
    display: block !important;
    width: 100% !important;
    max-width: 900px !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* 2. Page title - inside the container, properly aligned */
.woocommerce-cart .content-wrap > h1 {
    max-width: 900px !important;
    margin: 0 auto !important;
    padding: 48px 24px 24px !important;
    color: #0F2A55 !important;
    font-size: 32px !important;
    font-weight: 800 !important;
    text-align: left !important;
}

/* 3. Container fix - tighter max width for cart */
.woocommerce-cart .woo-container,
.woocommerce-cart .container.woo-container {
    max-width: 900px !important;
    margin: 0 auto !important;
    padding: 0 24px 80px !important;
}

/* 4. Cart form - block, full width of its container */
.woocommerce-cart form.woocommerce-cart-form {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 32px 0 !important;
    padding: 0 !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

/* 5. Cart collaterals (totals) - block, full width below form */
.woocommerce-cart .cart-collaterals {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}
.woocommerce-cart .cart-collaterals .cart_totals {
    width: 100% !important;
    float: none !important;
    max-width: 100% !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    padding: 24px !important;
    box-sizing: border-box !important;
}

/* 6. Cart TABLE - use natural auto layout, fits its container */
.woocommerce-cart table.cart.shop_table {
    display: table !important;
    width: 100% !important;
    max-width: 100% !important;
    table-layout: auto !important;
    border-collapse: collapse !important;
    margin: 0 !important;
    font-size: 14px !important;
}

/* Thead styling */
.woocommerce-cart table.cart thead {
    background: #f8fafc !important;
    border-bottom: 2px solid #e5e7eb !important;
}
.woocommerce-cart table.cart thead th {
    padding: 14px 12px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    color: #0F2A55 !important;
    text-align: left !important;
}

/* Tbody cells */
.woocommerce-cart table.cart tbody td {
    padding: 16px 12px !important;
    border-bottom: 1px solid #f1f5f9 !important;
    vertical-align: middle !important;
    font-size: 14px !important;
    color: #334155 !important;
}

/* 7. Column widths - using percentages so they always fit */
.woocommerce-cart table.cart .product-remove     { width: 4% !important;  min-width: 32px !important; padding-left: 16px !important; }
.woocommerce-cart table.cart .product-thumbnail  { width: 10% !important; min-width: 70px !important; }
.woocommerce-cart table.cart .product-name       { width: 40% !important; }
.woocommerce-cart table.cart .product-price      { width: 14% !important; text-align: right !important; }
.woocommerce-cart table.cart .product-quantity   { width: 14% !important; text-align: center !important; }
.woocommerce-cart table.cart .product-subtotal   { width: 18% !important; text-align: right !important; padding-right: 20px !important; }

/* 8. Thumbnail image */
.woocommerce-cart table.cart td.product-thumbnail img {
    width: 56px !important;
    height: 56px !important;
    object-fit: cover !important;
    border-radius: 6px !important;
    display: block !important;
    margin: 0 !important;
}

/* 9. Product name link */
.woocommerce-cart table.cart td.product-name a {
    color: #0F2A55 !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    font-size: 14px !important;
}
.woocommerce-cart table.cart td.product-name a:hover { color: #20509A !important; }

/* 10. Price + Subtotal */
.woocommerce-cart table.cart td.product-price,
.woocommerce-cart table.cart td.product-subtotal {
    font-weight: 600 !important;
    color: #0F2A55 !important;
    white-space: nowrap !important;
    font-size: 14px !important;
}
.woocommerce-cart table.cart td.product-subtotal {
    color: #20509A !important;
    font-weight: 700 !important;
}

/* 11. Remove X button */
.woocommerce-cart table.cart td.product-remove a.remove {
    display: inline-flex !important;
    width: 24px !important;
    height: 24px !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: #f1f5f9 !important;
    color: #64748b !important;
    font-size: 16px !important;
    text-decoration: none !important;
    font-weight: 400 !important;
}
.woocommerce-cart table.cart td.product-remove a.remove:hover {
    background: #fee2e2 !important;
    color: #dc2626 !important;
}

/* 12. Quantity input — compact, centered */
.woocommerce-cart table.cart .quantity {
    display: inline-block !important;
}
.woocommerce-cart table.cart .quantity input.qty {
    width: 60px !important;
    height: 38px !important;
    padding: 0 8px !important;
    border: 1px solid #d1d5db !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-align: center !important;
    color: #0F2A55 !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
}

/* 13. Actions row (coupon + update button) */
.woocommerce-cart table.cart td.actions {
    padding: 20px !important;
    background: #f8fafc !important;
    border-top: 1px solid #e5e7eb !important;
    border-bottom: none !important;
}
.woocommerce-cart table.cart td.actions .coupon {
    display: inline-flex !important;
    gap: 8px !important;
    align-items: center !important;
    margin-right: 16px !important;
}
.woocommerce-cart table.cart td.actions input#coupon_code {
    width: 160px !important;
    height: 40px !important;
    padding: 0 12px !important;
    border: 1px solid #d1d5db !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
}
.woocommerce-cart table.cart td.actions .button {
    height: 40px !important;
    padding: 0 16px !important;
    background: #0F2A55 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
}
.woocommerce-cart table.cart td.actions .button:hover {
    background: #20509A !important;
}

/* 14. Hide the preview cards BELOW totals (they're duplicate) */
.woocommerce-cart .peptofit-totals-preview {
    display: none !important;
}

/* 15. Cart totals heading */
.woocommerce-cart .cart_totals h2 {
    color: #0F2A55 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    margin: 0 0 16px 0 !important;
}

/* 16. Totals table */
.woocommerce-cart .cart_totals table.shop_table {
    width: 100% !important;
    margin: 0 0 20px 0 !important;
    border: none !important;
}
.woocommerce-cart .cart_totals table.shop_table th,
.woocommerce-cart .cart_totals table.shop_table td {
    padding: 12px 0 !important;
    border-bottom: 1px solid #f1f5f9 !important;
    font-size: 14px !important;
}
.woocommerce-cart .cart_totals table.shop_table th {
    color: #64748b !important;
    font-weight: 500 !important;
    text-align: left !important;
}
.woocommerce-cart .cart_totals table.shop_table td {
    color: #0F2A55 !important;
    font-weight: 600 !important;
    text-align: right !important;
}
.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td {
    border-top: 2px solid #0F2A55 !important;
    border-bottom: none !important;
    padding-top: 16px !important;
    font-size: 16px !important;
    color: #0F2A55 !important;
    font-weight: 700 !important;
}

/* 17. Proceed to checkout button */
.woocommerce-cart .wc-proceed-to-checkout {
    margin: 24px 0 0 0 !important;
}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
    display: block !important;
    width: 100% !important;
    padding: 16px !important;
    background: #0F2A55 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: 0 2px 8px rgba(15, 42, 85, 0.15) !important;
    transition: background 0.2s !important;
    box-sizing: border-box !important;
}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover {
    background: #20509A !important;
}

/* 18. Mobile - responsive cart */
@media (max-width: 768px) {
    .woocommerce-cart table.cart thead { display: none !important; }
    .woocommerce-cart table.cart tbody tr {
        display: grid !important;
        grid-template-columns: 60px 1fr !important;
        grid-template-areas:
            "remove   name"
            "thumb    price"
            "thumb    qty"
            "thumb    subtotal" !important;
        gap: 8px !important;
        padding: 16px !important;
        border-bottom: 1px solid #e5e7eb !important;
    }
    .woocommerce-cart table.cart tbody td {
        display: block !important;
        width: auto !important;
        padding: 4px 0 !important;
        border: none !important;
    }
    .woocommerce-cart table.cart td.product-remove    { grid-area: remove; }
    .woocommerce-cart table.cart td.product-thumbnail { grid-area: thumb; }
    .woocommerce-cart table.cart td.product-name      { grid-area: name; }
    .woocommerce-cart table.cart td.product-price     { grid-area: price; text-align: left !important; }
    .woocommerce-cart table.cart td.product-quantity  { grid-area: qty; text-align: left !important; }
    .woocommerce-cart table.cart td.product-subtotal  { grid-area: subtotal; text-align: left !important; }
}

/* ============================================================
   Cart Summary Shipping Section - Clean Alignment (v1.2.0)
   Fixes messy InPost button + logo alignment in cart totals.
   ============================================================ */

/* Shipping row in totals table - override th/td flex */
.woocommerce-cart .cart_totals tr.woocommerce-shipping-totals th {
    vertical-align: top !important;
    padding-top: 16px !important;
    width: 30% !important;
}

.woocommerce-cart .cart_totals tr.woocommerce-shipping-totals td {
    text-align: left !important;
    padding: 12px 0 !important;
    vertical-align: top !important;
}

/* Shipping method list - clean vertical stack */
.woocommerce-cart .cart_totals ul#shipping_method,
.woocommerce-cart .cart_totals ul.woocommerce-shipping-methods {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
}
.woocommerce-cart .cart_totals ul#shipping_method li {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 0 !important;
    margin: 0 !important;
    flex-wrap: wrap !important;
}
.woocommerce-cart .cart_totals ul#shipping_method li label {
    color: #0F2A55 !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    margin: 0 !important;
    cursor: pointer !important;
    order: 2 !important;
}
.woocommerce-cart .cart_totals ul#shipping_method li input[type="radio"] {
    margin: 0 !important;
    order: 1 !important;
}

/* InPost logo badge - smaller, inline with label */
.woocommerce-cart .cart_totals .inpost_pl-shipping-method-meta-wrap {
    display: inline-flex !important;
    align-items: center !important;
    order: 3 !important;
    margin-left: 4px !important;
}
.woocommerce-cart .cart_totals .easypack-shipping-method-logo img,
.woocommerce-cart .cart_totals .inpost_pl_shipping_meta img {
    max-height: 24px !important;
    width: auto !important;
    display: inline-block !important;
    vertical-align: middle !important;
    margin: 0 !important;
}

/* "Select a pickup point" / "Wybierz Paczkomat" button - compact, inline */
.woocommerce-cart .cart_totals .easypack_show_geowidget,
.woocommerce-cart .cart_totals button.easypack_show_geowidget,
.woocommerce-cart .cart_totals a.easypack_show_geowidget {
    display: inline-block !important;
    margin: 12px 0 0 0 !important;
    padding: 10px 20px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    background: #0F2A55 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 4px rgba(15, 42, 85, 0.12) !important;
    cursor: pointer !important;
    text-align: center !important;
    line-height: 1.4 !important;
    white-space: normal !important;
    width: auto !important;
    max-width: 240px !important;
}

/* Shipping destination info - left-aligned text */
.woocommerce-cart .cart_totals .woocommerce-shipping-destination {
    margin: 12px 0 8px 0 !important;
    font-size: 13px !important;
    color: #64748b !important;
    text-align: left !important;
    line-height: 1.5 !important;
}
.woocommerce-cart .cart_totals .woocommerce-shipping-destination strong {
    color: #0F2A55 !important;
    font-weight: 600 !important;
}

/* "Change address" link */
.woocommerce-cart .cart_totals .shipping-calculator-button {
    display: inline-block !important;
    font-size: 13px !important;
    color: #20509A !important;
    text-decoration: underline !important;
    margin: 0 !important;
    font-weight: 500 !important;
}
.woocommerce-cart .cart_totals .shipping-calculator-button:hover {
    color: #0F2A55 !important;
}

/* Shipping calculator form when opened */
.woocommerce-cart .cart_totals .shipping-calculator-form {
    margin-top: 12px !important;
    padding: 12px !important;
    background: #f8fafc !important;
    border-radius: 6px !important;
}
.woocommerce-cart .cart_totals .shipping-calculator-form .form-row {
    margin-bottom: 10px !important;
}
.woocommerce-cart .cart_totals .shipping-calculator-form label {
    display: block !important;
    font-size: 12px !important;
    color: #64748b !important;
    margin-bottom: 4px !important;
    font-weight: 500 !important;
}
.woocommerce-cart .cart_totals .shipping-calculator-form input,
.woocommerce-cart .cart_totals .shipping-calculator-form select {
    width: 100% !important;
    padding: 8px 10px !important;
    border: 1px solid #d1d5db !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
}
.woocommerce-cart .cart_totals .shipping-calculator-form button {
    padding: 8px 16px !important;
    background: #0F2A55 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    cursor: pointer !important;
}

/* ============================================================
   Checkout Page Layout Rebuild (v1.2.1)
   Same stacked layout approach that fixed the cart.
   Billing/shipping form on top, order summary below, both full width.
   ============================================================ */

/* 1. Checkout page title alignment */
.woocommerce-checkout .content-wrap > h1 {
    max-width: 1100px !important;
    margin: 0 auto !important;
    padding: 48px 24px 24px !important;
    color: #0F2A55 !important;
    font-size: 32px !important;
    font-weight: 800 !important;
    text-align: left !important;
}

/* 2. Container + woocommerce wrapper */
.woocommerce-checkout .woo-container,
.woocommerce-checkout .container.woo-container {
    max-width: 1100px !important;
    margin: 0 auto !important;
    padding: 0 24px 80px !important;
}

.woocommerce-checkout .woocommerce {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 3. Coupon notice - stays clean */
.woocommerce-checkout .woocommerce-form-coupon-toggle {
    margin-bottom: 24px !important;
}
.woocommerce-checkout .woocommerce-info {
    background: #f0f7ff !important;
    border-left: 4px solid #20509A !important;
    padding: 14px 18px !important;
    color: #0F2A55 !important;
    font-size: 14px !important;
    border-radius: 4px !important;
}
.woocommerce-checkout .woocommerce-info .showcoupon {
    color: #20509A !important;
    font-weight: 600 !important;
    text-decoration: underline !important;
}

/* 4. Checkout form - block layout */
.woocommerce-checkout form.checkout.woocommerce-checkout {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

/* 5. Customer details (billing + shipping) - 2 column on desktop, 1 on mobile */
.woocommerce-checkout #customer_details.col2-set {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 24px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 32px 0 !important;
}
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 24px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    float: none !important;
}

@media (max-width: 900px) {
    .woocommerce-checkout #customer_details.col2-set {
        grid-template-columns: 1fr !important;
    }
}

/* 6. Form section titles */
.woocommerce-checkout h3,
.woocommerce-checkout #ship-to-different-address {
    color: #0F2A55 !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
    border: none !important;
}

/* 7. Form fields styling */
.woocommerce-checkout .form-row {
    margin-bottom: 14px !important;
    padding: 0 !important;
}
.woocommerce-checkout .form-row label {
    display: block !important;
    color: #0F2A55 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    margin-bottom: 6px !important;
}
.woocommerce-checkout .form-row .required {
    color: #E3A345 !important;
}
.woocommerce-checkout .form-row .optional {
    color: #94a3b8 !important;
    font-weight: 400 !important;
    font-size: 12px !important;
}
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row select {
    width: 100% !important;
    padding: 10px 12px !important;
    border: 1px solid #d1d5db !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    color: #0F2A55 !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
}
.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row textarea:focus,
.woocommerce-checkout .form-row select:focus {
    border-color: #20509A !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(32, 80, 154, 0.1) !important;
}

/* Two-column rows (first + last name) */
.woocommerce-checkout .form-row.form-row-first,
.woocommerce-checkout .form-row.form-row-last {
    width: calc(50% - 6px) !important;
    display: inline-block !important;
    margin-right: 0 !important;
}
.woocommerce-checkout .form-row.form-row-first {
    margin-right: 12px !important;
}

/* MailPoet checkbox - compact */
.woocommerce-checkout .woocommerce-form__label-for-checkbox {
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important;
    font-size: 13px !important;
    color: #64748b !important;
    margin: 12px 0 !important;
    cursor: pointer !important;
}
.woocommerce-checkout .woocommerce-form__label-for-checkbox input[type="checkbox"] {
    margin: 3px 0 0 0 !important;
    flex-shrink: 0 !important;
}

/* 8. "Your order" heading */
.woocommerce-checkout #order_review_heading {
    margin: 32px 0 16px 0 !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #0F2A55 !important;
}

/* 9. Order review - full width, boxed */
.woocommerce-checkout #order_review {
    width: 100% !important;
    max-width: 100% !important;
    padding: 24px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

/* 10. Order review table */
.woocommerce-checkout .woocommerce-checkout-review-order-table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 0 20px 0 !important;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table thead th {
    padding: 12px 0 !important;
    background: transparent !important;
    color: #0F2A55 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    border-bottom: 2px solid #e5e7eb !important;
    text-align: left !important;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table thead th.product-total {
    text-align: right !important;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tbody td,
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td,
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot th {
    padding: 12px 0 !important;
    border-bottom: 1px solid #f1f5f9 !important;
    color: #0F2A55 !important;
    font-size: 14px !important;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot th {
    color: #64748b !important;
    font-weight: 500 !important;
    text-align: left !important;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td {
    text-align: right !important;
    font-weight: 600 !important;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total td {
    border-top: 2px solid #0F2A55 !important;
    border-bottom: none !important;
    padding-top: 16px !important;
    font-size: 18px !important;
    color: #0F2A55 !important;
    font-weight: 800 !important;
}

/* Product preview cards in order review */
.woocommerce-checkout .peptofit-checkout-preview {
    padding: 0 !important;
}
.woocommerce-checkout .peptofit-checkout-preview .preview-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 12px 0 !important;
    border-bottom: 1px solid #f1f5f9 !important;
}
.woocommerce-checkout .peptofit-checkout-preview .preview-item:last-child {
    border-bottom: none !important;
}
.woocommerce-checkout .peptofit-checkout-preview .thumb img {
    width: 44px !important;
    height: 44px !important;
    object-fit: cover !important;
    border-radius: 6px !important;
}
.woocommerce-checkout .peptofit-checkout-preview .nm {
    flex: 1 !important;
}
.woocommerce-checkout .peptofit-checkout-preview .nm b {
    display: block !important;
    color: #0F2A55 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}
.woocommerce-checkout .peptofit-checkout-preview .nm .qty {
    color: #64748b !important;
    font-size: 12px !important;
}
.woocommerce-checkout .peptofit-checkout-preview .pr {
    font-weight: 700 !important;
    color: #20509A !important;
    font-size: 14px !important;
}

/* 11. Shipping row in checkout order review */
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    padding: 4px 0 !important;
    margin: 0 !important;
}
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li label {
    color: #0F2A55 !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    margin: 0 !important;
}
.woocommerce-checkout .woocommerce-shipping-totals .easypack-shipping-method-logo img,
.woocommerce-checkout .woocommerce-shipping-totals .inpost_pl_shipping_meta img {
    max-height: 22px !important;
    width: auto !important;
    vertical-align: middle !important;
    margin: 0 !important;
}

/* InPost "Select pickup point" button in checkout */
.woocommerce-checkout .easypack_show_geowidget,
.woocommerce-checkout button.easypack_show_geowidget,
.woocommerce-checkout a.easypack_show_geowidget {
    display: inline-block !important;
    margin: 12px 0 !important;
    padding: 10px 20px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    background: #0F2A55 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 4px rgba(15, 42, 85, 0.12) !important;
    cursor: pointer !important;
    line-height: 1.4 !important;
    white-space: normal !important;
    width: auto !important;
    max-width: 240px !important;
}

/* 12. Payment methods */
.woocommerce-checkout #payment {
    background: transparent !important;
    padding: 20px 0 0 0 !important;
    border: none !important;
    border-top: 1px solid #e5e7eb !important;
    margin-top: 20px !important;
}
.woocommerce-checkout #payment ul.payment_methods {
    list-style: none !important;
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
}
.woocommerce-checkout #payment ul.payment_methods li {
    margin: 0 0 10px 0 !important;
    padding: 14px 16px !important;
    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    list-style: none !important;
}
.woocommerce-checkout #payment ul.payment_methods li input[type="radio"]:checked + label {
    color: #0F2A55 !important;
    font-weight: 700 !important;
}
.woocommerce-checkout #payment ul.payment_methods li label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: #0F2A55 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    margin: 0 0 0 8px !important;
    cursor: pointer !important;
}
.woocommerce-checkout #payment ul.payment_methods li label img {
    max-height: 24px !important;
    width: auto !important;
    vertical-align: middle !important;
}
.woocommerce-checkout #payment .payment_box {
    margin-top: 12px !important;
    padding: 14px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    font-size: 13px !important;
}

/* Legal consent + Place order */
.woocommerce-checkout .peptofit-legal-consent {
    margin: 20px 0 !important;
}
.woocommerce-checkout #place_order {
    display: block !important;
    width: 100% !important;
    padding: 16px !important;
    background: #0F2A55 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    box-shadow: 0 2px 8px rgba(15, 42, 85, 0.15) !important;
    box-sizing: border-box !important;
    transition: background 0.2s !important;
}
.woocommerce-checkout #place_order:hover {
    background: #20509A !important;
}

/* Hide the raw cart_item rows (we show preview cards instead) */
.woocommerce-checkout .woocommerce-checkout-review-order-table tbody .cart_item {
    display: none !important;
}

/* ============================================================
   Checkout Page Layout — FINAL REBUILD (v1.2.2)
   Classic 2-column: billing/shipping LEFT, order summary RIGHT.
   Overrides all previous checkout CSS.
   ============================================================ */

/* Wider container for proper 2-col layout */
.woocommerce-checkout .content-wrap > h1 {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 48px 24px 24px !important;
}
.woocommerce-checkout .woo-container,
.woocommerce-checkout .container.woo-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 24px 80px !important;
}

/* Coupon notice stays full width above form */
.woocommerce-checkout .woocommerce-form-coupon-toggle {
    max-width: 100% !important;
    margin-bottom: 24px !important;
}

/* ============ MAIN CHECKOUT GRID ============ */
.woocommerce-checkout form.checkout.woocommerce-checkout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 400px) !important;
    grid-template-rows: auto 1fr !important;
    gap: 20px 32px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* LEFT COLUMN: customer details (billing + shipping stacked) */
.woocommerce-checkout form.checkout #customer_details.col2-set {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
}

/* Billing + shipping blocks stacked vertically inside left column */
.woocommerce-checkout form.checkout #customer_details .col-1,
.woocommerce-checkout form.checkout #customer_details .col-2 {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 24px !important;
    margin: 0 0 20px 0 !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
}

/* RIGHT COLUMN: order review heading */
.woocommerce-checkout form.checkout #order_review_heading {
    grid-column: 2 !important;
    grid-row: 1 !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #0F2A55 !important;
}

/* RIGHT COLUMN: order review box */
.woocommerce-checkout form.checkout #order_review {
    grid-column: 2 !important;
    grid-row: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 20px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    position: sticky !important;
    top: 80px !important;
}

/* ============ MOBILE: single column stack ============ */
@media (max-width: 900px) {
    .woocommerce-checkout form.checkout.woocommerce-checkout {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto auto !important;
    }
    .woocommerce-checkout form.checkout #customer_details.col2-set {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }
    .woocommerce-checkout form.checkout #order_review_heading {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }
    .woocommerce-checkout form.checkout #order_review {
        grid-column: 1 !important;
        grid-row: 3 !important;
        position: static !important;
    }
}

/* ============ ORDER REVIEW BOX SCALING ============ */
/* Right column is narrower, compact everything */

/* Hide raw cart_item rows (we use preview cards) */
.woocommerce-checkout .woocommerce-checkout-review-order-table tbody .cart_item {
    display: none !important;
}

/* Order review table - compact */
.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table {
    width: 100% !important;
    margin: 0 0 16px 0 !important;
    font-size: 13px !important;
}
.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table thead {
    display: none !important;
}
.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot td {
    padding: 10px 0 !important;
    border-bottom: 1px solid #f1f5f9 !important;
    font-size: 13px !important;
}
.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot th {
    color: #64748b !important;
    font-weight: 500 !important;
    text-align: left !important;
    width: 50% !important;
}
.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot td {
    color: #0F2A55 !important;
    font-weight: 600 !important;
    text-align: right !important;
}
.woocommerce-checkout #order_review .order-total th,
.woocommerce-checkout #order_review .order-total td {
    border-top: 2px solid #0F2A55 !important;
    border-bottom: none !important;
    padding-top: 14px !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #0F2A55 !important;
}

/* Preview cards - compact for narrow right column */
.woocommerce-checkout .peptofit-checkout-preview {
    padding: 0 0 8px 0 !important;
    border-bottom: 2px solid #e5e7eb !important;
    margin-bottom: 4px !important;
}
.woocommerce-checkout .peptofit-checkout-preview .preview-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 0 !important;
    border-bottom: 1px solid #f1f5f9 !important;
}
.woocommerce-checkout .peptofit-checkout-preview .preview-item:last-child {
    border-bottom: none !important;
}
.woocommerce-checkout .peptofit-checkout-preview .thumb img {
    width: 40px !important;
    height: 40px !important;
    object-fit: cover !important;
    border-radius: 4px !important;
}
.woocommerce-checkout .peptofit-checkout-preview .nm {
    flex: 1 !important;
    min-width: 0 !important;
}
.woocommerce-checkout .peptofit-checkout-preview .nm b {
    display: block !important;
    color: #0F2A55 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
}
.woocommerce-checkout .peptofit-checkout-preview .nm .qty {
    color: #64748b !important;
    font-size: 11px !important;
}
.woocommerce-checkout .peptofit-checkout-preview .pr {
    font-weight: 700 !important;
    color: #20509A !important;
    font-size: 13px !important;
    white-space: nowrap !important;
}

/* ============ FORM CARDS CONTENT - COMPACT ============ */
.woocommerce-checkout #customer_details h3,
.woocommerce-checkout #customer_details #ship-to-different-address {
    color: #0F2A55 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    margin: 0 0 18px 0 !important;
    padding: 0 !important;
    border: none !important;
}

/* Two-column name rows keep side-by-side inside form */
.woocommerce-checkout #customer_details .form-row.form-row-first,
.woocommerce-checkout #customer_details .form-row.form-row-last {
    width: calc(50% - 6px) !important;
    display: inline-block !important;
    vertical-align: top !important;
    margin-right: 0 !important;
}
.woocommerce-checkout #customer_details .form-row.form-row-first {
    margin-right: 12px !important;
}

/* Shipping fields block - no extra background since col-2 already has card style */
.woocommerce-checkout #customer_details .col-2 .woocommerce-shipping-fields {
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
}

/* ============ PAYMENT SECTION INSIDE ORDER REVIEW ============ */
.woocommerce-checkout #order_review #payment {
    padding: 16px 0 0 0 !important;
    margin-top: 16px !important;
    border-top: 1px solid #e5e7eb !important;
    background: transparent !important;
}
.woocommerce-checkout #order_review #payment ul.payment_methods {
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    list-style: none !important;
    background: transparent !important;
    border: none !important;
}
.woocommerce-checkout #order_review #payment ul.payment_methods li {
    margin: 0 0 8px 0 !important;
    padding: 12px 14px !important;
    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    list-style: none !important;
    font-size: 13px !important;
}
.woocommerce-checkout #order_review #payment ul.payment_methods li label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    color: #0F2A55 !important;
    font-weight: 600 !important;
    margin: 0 0 0 6px !important;
    cursor: pointer !important;
    font-size: 13px !important;
}
.woocommerce-checkout #order_review #payment ul.payment_methods li label img {
    max-height: 22px !important;
    width: auto !important;
}
.woocommerce-checkout #order_review #payment .payment_box {
    margin-top: 8px !important;
    padding: 12px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    font-size: 12px !important;
}

/* Legal consent */
.woocommerce-checkout #order_review .peptofit-legal-consent {
    margin: 16px 0 !important;
    padding: 12px !important;
    background: #f8fafc !important;
    border-radius: 6px !important;
}
.woocommerce-checkout #order_review .peptofit-legal-consent label {
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important;
    font-size: 12px !important;
    color: #334155 !important;
    line-height: 1.5 !important;
    cursor: pointer !important;
}

/* Place order button - full width, bottom of right column */
.woocommerce-checkout #order_review #place_order {
    display: block !important;
    width: 100% !important;
    padding: 14px !important;
    background: #0F2A55 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    box-shadow: 0 2px 8px rgba(15, 42, 85, 0.15) !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    transition: background 0.2s !important;
}
.woocommerce-checkout #order_review #place_order:hover {
    background: #20509A !important;
}

/* Shipping method inside order review - compact */
.woocommerce-checkout #order_review ul#shipping_method {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.woocommerce-checkout #order_review ul#shipping_method li {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 4px 0 !important;
    margin: 0 !important;
}
.woocommerce-checkout #order_review ul#shipping_method li label {
    color: #0F2A55 !important;
    font-weight: 600 !important;
    font-size: 12px !important;
    margin: 0 !important;
}
.woocommerce-checkout #order_review .easypack-shipping-method-logo img {
    max-height: 20px !important;
    width: auto !important;
}

/* InPost button in order review */
.woocommerce-checkout #order_review .easypack_show_geowidget {
    display: inline-block !important;
    margin: 8px 0 !important;
    padding: 8px 14px !important;
    font-size: 12px !important;
    max-width: 100% !important;
    width: auto !important;
    line-height: 1.3 !important;
}