/* ================================================================
   TRAKTOR RS THEME - WOOCOMMERCE OVERRIDES
   ================================================================ */

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes trk-cs-highlight {
    0%, 20% { box-shadow: 0 0 0 3px var(--accent-primary, #FF6A3D); }
    100%    { box-shadow: none; }
}

/* Messages and Alerts */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
    padding: var(--space-4);
    margin-bottom: var(--space-4);
    border-radius: var(--radius-lg);
    font-size: 0.9375rem;
}

.woocommerce-message {
    background: var(--success-muted);
    color: var(--success-text);
    border: 1px solid var(--success-border);
}

.woocommerce-error {
    background: var(--error-muted);
    color: var(--error-text);
    border: 1px solid var(--error-border);
}

.woocommerce-info {
    background: var(--info-muted);
    color: var(--info-text);
    border: 1px solid var(--info-border);
}

/* Form Styles */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea {
    background: var(--surface-overlay);
    border: 1px solid var(--border-interactive);
    border-radius: var(--radius-md);
    padding: var(--space-3) var(--space-4);
    color: var(--text-primary);
    font-family: var(--font-body);
    font-size: 0.9375rem;
    transition: border-color var(--transition-fast);
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--interactive-focus);
}

.woocommerce form .form-row select {
    background: var(--surface-overlay);
    border: 1px solid var(--border-interactive);
    border-radius: var(--radius-md);
    padding: var(--space-3) var(--space-4);
    color: var(--text-primary);
    font-family: var(--font-body);
    font-size: 0.9375rem;
}

.woocommerce form .form-row select:focus {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--interactive-focus);
}

.woocommerce form .form-row .required {
    color: var(--error-text);
}

/* Star Rating */
.woocommerce .star-rating {
    color: var(--text-tertiary);
}

.woocommerce .star-rating span {
    color: var(--accent-primary);
}

.woocommerce .star-rating span::before {
    color: var(--accent-primary);
}

/* Product Title */
.woocommerce-loop-product__title,
.woocommerce .product .product_title {
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: var(--space-2);
    font-size: 1.0625rem;
}

/* Product Price */
.woocommerce .product .price,
.woocommerce .product-price,
.woocommerce .products .product .price {
    color: var(--accent-primary);
    font-weight: 700;
}

.woocommerce .product .price del {
    opacity: 0.5;
    color: var(--text-tertiary);
}

.woocommerce .product .price ins {
    text-decoration: none;
}

/* Pagination — scope to links/spans only; ul.page-numbers also has class "page-numbers" in WP/WC */
.woocommerce-pagination {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: var(--space-8) 0;
}

.woocommerce-pagination ul.page-numbers {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    list-style: none;
    margin: 0;
    padding: 0;
    width: auto;
    max-width: 100%;
}

.woocommerce-pagination ul.page-numbers li {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.woocommerce-pagination ul.page-numbers a.page-numbers,
.woocommerce-pagination ul.page-numbers span.page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 var(--space-2);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    color: var(--text-secondary);
    font-size: 0.9375rem;
    font-weight: 500;
    transition: all var(--transition-fast);
    text-decoration: none;
    box-sizing: border-box;
}

.woocommerce-pagination ul.page-numbers a.page-numbers:hover {
    border-color: var(--accent-primary);
    color: var(--text-primary);
}

.woocommerce-pagination ul.page-numbers span.page-numbers.current,
.woocommerce-pagination ul.page-numbers a.page-numbers.current {
    background: var(--accent-primary);
    color: white;
    border-color: var(--accent-primary);
}

.woocommerce-pagination ul.page-numbers a.prev,
.woocommerce-pagination ul.page-numbers a.next {
    min-width: auto;
    padding: 0 var(--space-4);
}

/* Product Sorting */
.woocommerce-ordering {
    margin-bottom: var(--space-6);
}

.woocommerce-ordering select {
    background: var(--surface-overlay);
    border: 1px solid var(--border-interactive);
    border-radius: var(--radius-md);
    padding: var(--space-3) var(--space-4);
    color: var(--text-primary);
    font-family: var(--font-body);
    font-size: 0.9375rem;
    cursor: pointer;
}

.woocommerce-ordering select:focus {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--interactive-focus);
}

/* Product Page */
.woocommerce .product {
    background: transparent;
}

.woocommerce .product .product-images {
    margin-bottom: var(--space-8);
}

.woocommerce .product .images {
    margin-bottom: var(--space-4);
}

.woocommerce .product .images img {
    border-radius: var(--radius-lg);
}

.woocommerce .product .thumbnails {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-3);
    margin-top: var(--space-4);
}

.woocommerce .product .thumbnails a {
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: border-color var(--transition-fast);
}

.woocommerce .product .thumbnails a:hover {
    border-color: var(--accent-primary);
}

.woocommerce .product .summary {
    padding: 0;
    background: transparent;
}

.woocommerce .product .summary .price {
    font-size: 1.5rem;
    margin-bottom: var(--space-4);
}

.woocommerce .product .summary .product-title {
    margin-bottom: var(--space-4);
}

.woocommerce .product .summary .rating {
    margin-bottom: var(--space-4);
}

.woocommerce .product .summary .description {
    margin-bottom: var(--space-6);
    color: var(--text-secondary);
}

.woocommerce .product .summary form.cart {
    margin-bottom: var(--space-6);
}

/* Add to Cart Button */
.woocommerce .product button.single_add_to_cart_button,
#add_payment_method .cart .button,
.woocommerce-cart .cart .button {
    background: var(--gradient-cta);
    color: white;
    border: none;
    padding: var(--space-4) var(--space-8);
    border-radius: var(--radius-md);
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    transition: all var(--transition-fast);
    width: 100%;
}

.woocommerce .product button.single_add_to_cart_button:hover,
#add_payment_method .cart .button:hover,
.woocommerce-cart .cart .button:hover {
    background: var(--gradient-cta-hover);
    transform: translateY(-2px);
}

/* Cart Page */
.woocommerce .cart-collaterals {
    margin-top: var(--space-8);
}

.woocommerce .cart_totals,
.woocommerce-shipping-methods {
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-xl);
    padding: var(--space-6);
}

.woocommerce .cart_totals h2 {
    font-family: var(--font-display);
    margin-bottom: var(--space-4);
}

.woocommerce .cart_totals table tr {
    border-bottom: 1px solid var(--border-subtle);
}

.woocommerce .cart_totals table tr:last-child {
    border-bottom: none;
}

.woocommerce .cart_totals table th,
.woocommerce .cart_totals table td {
    padding: var(--space-3) 0;
    text-align: right;
}

.woocommerce .cart_totals table th {
    font-weight: 600;
    color: var(--text-primary);
}

.woocommerce .cart_totals table td {
    color: var(--text-secondary);
}

.woocommerce .cart_totals table .total {
    font-weight: 700;
    color: var(--text-primary);
    font-size: 1.125rem;
}

.woocommerce .cart_totals table .total td {
    color: var(--accent-primary);
}

/* Checkout Page */
.woocommerce-checkout .shop_table {
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-xl);
    padding: var(--space-6);
}

.woocommerce-checkout .shop_table th {
    background: var(--surface-overlay);
    padding: var(--space-4);
    font-weight: 600;
}

.woocommerce-checkout .shop_table td {
    padding: var(--space-4);
    border-bottom: 1px solid var(--border-subtle);
}

.woocommerce-checkout .shop_table tr:last-child td {
    border-bottom: none;
}

/* Related Products */
.woocommerce .related.products {
    margin-top: var(--space-16);
    border-top: 1px solid var(--border-default);
    padding-top: var(--space-8);
}

.woocommerce .related.products h2 {
    font-family: var(--font-display);
    margin-bottom: var(--space-6);
}

/* Reviews */
.woocommerce #reviews {
    margin-top: var(--space-8);
}

.woocommerce #reviews h2 {
    font-family: var(--font-display);
    margin-bottom: var(--space-6);
}

.woocommerce .comment-text {
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: var(--space-4);
    margin-bottom: var(--space-4);
}

.woocommerce .comment-text .meta {
    font-size: 0.875rem;
    color: var(--text-tertiary);
    margin-bottom: var(--space-2);
}

.woocommerce .comment-text p {
    color: var(--text-secondary);
    margin: 0;
}

/* Review Form */
.woocommerce #review_form {
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-xl);
    padding: var(--space-6);
    margin-top: var(--space-6);
}

.woocommerce #review_form label {
    display: block;
    margin-bottom: var(--space-2);
    font-weight: 600;
    color: var(--text-primary);
}

.woocommerce #review_form input[type="text"],
.woocommerce #review_form input[type="email"],
.woocommerce #review_form textarea {
    width: 100%;
    background: var(--surface-overlay);
    border: 1px solid var(--border-interactive);
    border-radius: var(--radius-md);
    padding: var(--space-3) var(--space-4);
    color: var(--text-primary);
    font-family: var(--font-body);
    margin-bottom: var(--space-4);
}

.woocommerce #review_form input:focus,
.woocommerce #review_form textarea:focus {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--interactive-focus);
}

/* Tabs */
.woocommerce .woocommerce-tabs {
    margin-top: var(--space-8);
}

.woocommerce .woocommerce-tabs ul.tabs {
    border-bottom: 1px solid var(--border-default);
    display: flex;
    gap: var(--space-4);
    flex-wrap: wrap;
}

.woocommerce .woocommerce-tabs ul.tabs li {
    margin: 0;
}

.woocommerce .woocommerce-tabs ul.tabs li a {
    display: block;
    padding: var(--space-4);
    background: transparent;
    color: var(--text-secondary);
    font-weight: 600;
    border-bottom: 3px solid transparent;
    transition: all var(--transition-fast);
}

.woocommerce .woocommerce-tabs ul.tabs li.active a {
    color: var(--accent-primary);
    border-bottom-color: var(--accent-primary);
}

.woocommerce .woocommerce-tabs ul.tabs li a:hover {
    color: var(--text-primary);
}

.woocommerce .woocommerce-tabs .panel {
    padding: var(--space-6) 0;
}

/* Product Categories Widget */
.woocommerce.widget_product_categories ul {
    list-style: none;
    padding: 0;
}

.woocommerce.widget_product_categories li {
    border-bottom: 1px solid var(--border-subtle);
    padding: var(--space-2) 0;
}

.woocommerce.widget_product_categories a {
    color: var(--text-secondary);
    transition: color var(--transition-fast);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.woocommerce.widget_product_categories a:hover {
    color: var(--text-primary);
}

.woocommerce.widget_product_categories .count {
    background: var(--surface-overlay);
    color: var(--text-tertiary);
    padding: 2px 6px;
    border-radius: var(--radius-full);
    font-size: 0.75rem;
}

/* Notices */
.woocommerce-notices-wrapper {
    margin-bottom: var(--space-6);
}

.woocommerce-notice {
    padding: var(--space-4);
    border-radius: var(--radius-lg);
    font-size: 0.9375rem;
}

.woocommerce-notice--success {
    background: var(--success-muted);
    color: var(--success-text);
    border: 1px solid var(--success-border);
}

.woocommerce-notice--error {
    background: var(--error-muted);
    color: var(--error-text);
    border: 1px solid var(--error-border);
}

/* Upsells */
.woocommerce .upsells.products {
    margin-top: var(--space-12);
}

.woocommerce .upsells.products h2 {
    font-family: var(--font-display);
    margin-bottom: var(--space-6);
}

/* Filter Bar */
.woocommerce-widget-layered-nav {
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-xl);
    padding: var(--space-4);
    margin-bottom: var(--space-6);
}

.woocommerce-widget-layered-nav h3 {
    font-family: var(--font-display);
    font-size: 1rem;
    margin-bottom: var(--space-3);
}

.woocommerce-widget-layered-nav ul {
    list-style: none;
    padding: 0;
}

.woocommerce-widget-layered-nav li {
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--border-subtle);
}

.woocommerce-widget-layered-nav li:last-child {
    border-bottom: none;
}

.woocommerce-widget-layered-nav a {
    color: var(--text-secondary);
    transition: color var(--transition-fast);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.woocommerce-widget-layered-nav a:hover {
    color: var(--text-primary);
}

.woocommerce-widget-layered-nav .count {
    background: var(--surface-overlay);
    color: var(--text-tertiary);
    padding: 2px 6px;
    border-radius: var(--radius-full);
    font-size: 0.75rem;
}

/* ================================================================
   CART / CHECKOUT / THANK YOU — Redesigned Flow
   ================================================================ */

/* Shared: steps indicator */
.trk-checkout-steps {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-4);
    list-style: none;
    padding: 0;
    margin: 0 0 var(--space-8);
    flex-wrap: wrap;
}

.trk-checkout-steps li {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    color: var(--text-tertiary);
    font-size: 0.875rem;
    font-weight: 500;
    position: relative;
    padding-right: var(--space-4);
}

.trk-checkout-steps li:not(:last-child)::after {
    content: "";
    display: block;
    width: 32px;
    height: 1px;
    background: var(--border-default);
    margin-left: var(--space-2);
}

.trk-checkout-steps .trk-step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: var(--radius-full);
    background: var(--surface-overlay);
    color: var(--text-tertiary);
    border: 1px solid var(--border-default);
    font-weight: 700;
    font-size: 0.8125rem;
}

.trk-checkout-steps li.is-current {
    color: var(--text-primary);
}

.trk-checkout-steps li.is-current .trk-step-num {
    background: var(--accent-primary);
    color: #fff;
    border-color: var(--accent-primary);
}

.trk-checkout-steps li.is-done {
    color: var(--text-secondary);
}

.trk-checkout-steps li.is-done .trk-step-num {
    background: var(--moss-green, #3E5C47);
    color: #fff;
    border-color: transparent;
}

/* ---------------- CART ---------------- */

.trk-cart {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-4) 0 var(--space-12);
}

.trk-cart-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: var(--space-8);
    align-items: start;
}

.trk-cart-main { min-width: 0; }

.trk-cart-items {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.trk-cart-row {
    display: grid;
    grid-template-columns: 84px 1fr 128px 120px 36px;
    gap: var(--space-4);
    align-items: center;
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-xl);
    padding: var(--space-4);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.trk-cart-row:hover {
    border-color: var(--border-interactive);
}

.trk-cart-row:has(+ .trk-cart-crosssell-inline) {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-color: var(--border-subtle);
}

.trk-cart-crosssell-inline {
    margin-top: calc(-1 * var(--space-3));
}

.trk-cart-row__media {
    width: 84px;
    height: 84px;
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--surface-overlay);
    display: flex;
    align-items: center;
    justify-content: center;
}

.trk-cart-row__media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.trk-cart-row__title {
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.3;
    color: var(--text-primary);
    margin-bottom: var(--space-1, 4px);
}

.trk-cart-row__title a {
    color: inherit;
    text-decoration: none;
}

.trk-cart-row__title a:hover { color: var(--accent-primary); }

.trk-cart-row__sku {
    font-family: var(--font-mono, 'JetBrains Mono', monospace);
    font-size: 0.75rem;
    color: var(--text-tertiary);
    letter-spacing: 0.02em;
    margin-bottom: 2px;
}

.trk-cart-row__unit {
    font-size: 0.875rem;
    color: var(--text-secondary);
    font-weight: 500;
}

.trk-cart-row__unit .trk-muted { color: var(--text-tertiary); font-weight: 400; }

.trk-cart-row__qty .quantity {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--border-interactive);
    border-radius: var(--radius-md);
    overflow: hidden;
    background: var(--surface-overlay);
}

.trk-cart-row__qty input.qty {
    width: 56px;
    text-align: center;
    padding: 10px 4px;
    border: none;
    background: transparent;
    color: var(--text-primary);
    font-weight: 600;
    font-size: 0.9375rem;
    -moz-appearance: textfield;
}

.trk-cart-row__qty input.qty::-webkit-outer-spin-button,
.trk-cart-row__qty input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.trk-cart-row__subtotal {
    text-align: right;
    font-weight: 700;
    color: var(--accent-primary);
    font-size: 1.0625rem;
}

.trk-cart-row__sublabel {
    display: none;
    font-size: 0.75rem;
    color: var(--text-tertiary);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-right: var(--space-2);
}

.trk-cart-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    color: var(--text-tertiary);
    background: transparent;
    transition: background var(--transition-fast), color var(--transition-fast);
    text-decoration: none;
}

.trk-cart-remove:hover {
    background: var(--error-muted, rgba(220,38,38,0.1));
    color: var(--error-text, #DC2626);
}

.trk-cart-remove span { display: none; }

/* Cart actions below list */
.trk-cart-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    align-items: center;
    margin-top: var(--space-6);
    padding-top: var(--space-4);
    border-top: 1px solid var(--border-subtle);
}

.trk-coupon {
    display: inline-flex;
    align-items: stretch;
    gap: var(--space-2);
    flex: 1;
    min-width: 220px;
}

.trk-coupon input[type="text"] {
    flex: 1;
    background: var(--surface-overlay);
    border: 1px solid var(--border-interactive);
    border-radius: var(--radius-md);
    padding: 0 var(--space-4);
    color: var(--text-primary);
    font-size: 0.9375rem;
    height: 44px;
}

.trk-coupon input[type="text"]:focus {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--interactive-focus);
}

.trk-cart-update {
    margin-left: auto;
}

/* Cart aside / totals */
.trk-cart-aside { position: sticky; top: 96px; }

.trk-cart-aside__inner {
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-xl);
    padding: var(--space-6);
    box-shadow: var(--shadow-md, 0 4px 12px rgba(0,0,0,0.08));
}

.trk-cart-totals__title {
    font-family: var(--font-display);
    font-size: 1.125rem;
    margin: 0 0 var(--space-4);
    color: var(--text-primary);
}

.trk-cart-totals .shop_table {
    width: 100%;
    background: transparent;
    border: none;
    padding: 0;
    margin-bottom: var(--space-5);
}

.trk-cart-totals .shop_table th,
.trk-cart-totals .shop_table td {
    padding: var(--space-3) 0;
    border: none;
    border-bottom: 1px solid var(--border-subtle);
    font-size: 0.9375rem;
}

.trk-cart-totals .shop_table tr:last-child th,
.trk-cart-totals .shop_table tr:last-child td { border-bottom: none; }

.trk-cart-totals .shop_table th {
    text-align: left;
    color: var(--text-secondary);
    font-weight: 500;
}

.trk-cart-totals .shop_table td {
    text-align: right;
    color: var(--text-primary);
    font-weight: 600;
}

.trk-cart-totals .order-total th,
.trk-cart-totals .order-total td {
    padding-top: var(--space-4);
    font-size: 1.125rem;
}

.trk-cart-totals .order-total td {
    color: var(--accent-primary);
    font-weight: 800;
    font-size: 1.25rem;
}

.trk-checkout-btn,
.wc-proceed-to-checkout .checkout-button {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    margin-top: var(--space-2);
}

/* Beat .entry-content.prose a (accent + underline) and any link defaults */
.woocommerce .wc-proceed-to-checkout a.checkout-button.btn-cta,
.woocommerce .wc-proceed-to-checkout a.trk-checkout-btn {
    color: var(--text-on-accent);
    text-decoration: none;
}

.woocommerce .wc-proceed-to-checkout a.checkout-button.btn-cta:hover,
.woocommerce .wc-proceed-to-checkout a.checkout-button.btn-cta:focus-visible,
.woocommerce .wc-proceed-to-checkout a.checkout-button.btn-cta:visited,
.woocommerce .wc-proceed-to-checkout a.trk-checkout-btn:hover,
.woocommerce .wc-proceed-to-checkout a.trk-checkout-btn:focus-visible,
.woocommerce .wc-proceed-to-checkout a.trk-checkout-btn:visited {
    color: var(--text-on-accent);
    text-decoration: none;
}

.trk-cart-trust {
    list-style: none;
    padding: var(--space-4) 0 0;
    margin: var(--space-4) 0 0;
    border-top: 1px solid var(--border-subtle);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.trk-cart-trust li {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    color: var(--text-secondary);
    font-size: 0.8125rem;
}

.trk-cart-trust li i { color: var(--accent-primary); flex-shrink: 0; }

.trk-cart-crosssell { margin-top: var(--space-12); }

/* Inline cross-sell below each cart item */
.trk-cart-crosssell-inline {
    padding: var(--space-3) var(--space-4);
    background: var(--surface-overlay, rgba(255,255,255,0.03));
    border: 1px solid var(--border-subtle);
    border-top: none;
    border-radius: 0 0 var(--radius-xl) var(--radius-xl);
}

.trk-cart-crosssell-inline__label {
    display: flex;
    align-items: center;
    gap: var(--space-1, 4px);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-tertiary);
    margin-bottom: var(--space-2);
}

.trk-cart-crosssell-inline__items {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.trk-cart-cs-card {
    flex: 0 1 auto;
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2);
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    min-width: 0;
    transition: border-color var(--transition-fast);
}

.trk-cart-cs-card:hover { border-color: var(--border-interactive); }

.trk-cart-cs-card__link {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    text-decoration: none;
    color: inherit;
    min-width: 0;
}

.trk-cart-cs-card__img {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: var(--radius-md);
    overflow: hidden;
    background: var(--surface-overlay);
    display: flex;
    align-items: center;
    justify-content: center;
}

.trk-cart-cs-card__img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.trk-cart-cs-card__info {
    display: flex;
    flex-direction: column;
    min-width: 0;
    max-width: 140px;
}

.trk-cart-cs-card__name {
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.3;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.trk-cart-cs-card__link:hover .trk-cart-cs-card__name { color: var(--accent-primary); }

.trk-cart-cs-card__sku {
    font-family: var(--font-mono, 'JetBrains Mono', monospace);
    font-size: 0.6875rem;
    color: var(--text-tertiary);
}

.trk-cart-cs-card__price {
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--accent-primary);
    white-space: nowrap;
    margin-left: var(--space-1, 4px);
}

.trk-cart-cs-card__price small {
    font-weight: 400;
    font-size: 0.6875rem;
    color: var(--text-tertiary);
}

.trk-cart-cs-add {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    font-size: 0.75rem;
    padding: 6px 10px;
}

.trk-cart-cs-add.is-added {
    pointer-events: none;
    background: var(--success-base, #3E5C47);
    border-color: var(--success-base, #3E5C47);
    color: #fff;
}

@media (max-width: 768px) {
    .trk-cart-crosssell-inline {
        padding: var(--space-2) var(--space-3);
    }

    .trk-cart-cs-card__info { max-width: none; }

    .trk-cart-cs-card {
        flex: 1 1 100%;
    }
}

/* ---------------- CHECKOUT ---------------- */

.trk-checkout {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-4) 0 var(--space-12);
}

.trk-checkout-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 400px;
    gap: var(--space-8);
    align-items: start;
}

.trk-checkout-main {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
    min-width: 0;
}

.trk-card {
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-xl);
    overflow: hidden;
}

.trk-card-head {
    padding: var(--space-5) var(--space-6);
    border-bottom: 1px solid var(--border-subtle);
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    column-gap: var(--space-3);
    align-items: center;
}

.trk-card-step {
    grid-row: 1 / span 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: var(--radius-full);
    background: var(--accent-primary-muted);
    color: var(--accent-primary);
    font-weight: 700;
    font-size: 0.9375rem;
}

.trk-card-title {
    grid-column: 2;
    grid-row: 1;
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
}

.trk-card-sub {
    grid-column: 2;
    grid-row: 2;
    margin: 2px 0 0;
    color: var(--text-tertiary);
    font-size: 0.8125rem;
}

.trk-card-body { padding: var(--space-6); }

/* Form grid within address card */
.trk-checkout .form-row {
    margin-bottom: var(--space-4);
}

.trk-checkout .form-row label {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 6px;
    letter-spacing: 0.01em;
}

.trk-checkout .form-row input.input-text,
.trk-checkout .form-row textarea,
.trk-checkout .form-row select,
.trk-checkout .select2-container .select2-selection {
    width: 100%;
    background: var(--surface-overlay);
    border: 1px solid var(--border-interactive);
    border-radius: var(--radius-md);
    padding: 12px var(--space-4);
    color: var(--text-primary);
    font-family: var(--font-body);
    font-size: 0.9375rem;
    height: 46px;
    box-sizing: border-box;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.trk-checkout .form-row textarea {
    height: auto;
    min-height: 96px;
    resize: vertical;
}

.trk-checkout .form-row input.input-text:focus,
.trk-checkout .form-row textarea:focus,
.trk-checkout .form-row select:focus {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--interactive-focus);
}

/* Contact row layout: email + phone side-by-side */
.trk-contact-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
}

.trk-contact-fields .form-row { margin-bottom: 0; }

/* Address field grid layout */
.trk-address-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 var(--space-4);
}

.trk-address-fields .form-row-wide,
.trk-address-fields #billing_address_1_field,
.trk-address-fields #billing_address_2_field,
.trk-address-fields #billing_company_field,
.trk-address-fields #billing_country_field {
    grid-column: 1 / -1;
}

.trk-address-fields .form-row-first,
.trk-address-fields #billing_first_name_field,
.trk-address-fields #billing_postcode_field,
.trk-address-fields #billing_city_field {
    grid-column: 1;
}

.trk-address-fields .form-row-last,
.trk-address-fields #billing_last_name_field,
.trk-address-fields #billing_state_field {
    grid-column: 2;
}

.trk-address-fields .form-row input[type="checkbox"] { width: auto; height: auto; }

/* Required marker */
.trk-checkout .form-row .required,
.trk-checkout .form-row abbr[title="obavezno"],
.trk-checkout .form-row abbr[title="required"] {
    color: var(--accent-primary);
    text-decoration: none;
    margin-left: 2px;
}

.trk-checkout .woocommerce-input-wrapper { display: block; }

/* Select2 overrides to match design tokens */
.trk-checkout .select2-container--default .select2-selection--single {
    border: 1px solid var(--border-interactive) !important;
    background: var(--surface-overlay) !important;
    height: 46px !important;
    border-radius: var(--radius-md) !important;
}

.trk-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 44px !important;
    padding-left: var(--space-4) !important;
    color: var(--text-primary) !important;
}

.trk-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 44px !important;
}

/* Checkbox rows */
.trk-checkout .create-account label {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    color: var(--text-primary);
    font-weight: 500;
}

.trk-checkout .create-account input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: var(--accent-primary);
}

/* Aside — sticky summary */
.trk-checkout-aside { position: sticky; top: 96px; }

.trk-checkout-aside__inner {
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-xl);
    padding: var(--space-6);
    box-shadow: var(--shadow-md, 0 4px 12px rgba(0,0,0,0.08));
}

.trk-aside-title {
    font-family: var(--font-display);
    font-size: 1.125rem;
    margin: 0 0 var(--space-4);
    color: var(--text-primary);
}

/* Review items */
.trk-review-items {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    max-height: 320px;
    overflow-y: auto;
    padding-right: var(--space-1, 4px);
}

.trk-review-items::-webkit-scrollbar { width: 6px; }
.trk-review-items::-webkit-scrollbar-thumb { background: var(--border-default); border-radius: 3px; }

.trk-review-row {
    display: grid;
    grid-template-columns: 56px 1fr auto;
    gap: var(--space-3);
    align-items: center;
}

.trk-review-row__thumb {
    position: relative;
    width: 56px;
    height: 56px;
    border-radius: var(--radius-md);
    background: var(--surface-overlay);
    border: 1px solid var(--border-subtle);
}

.trk-review-row__thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: inherit;
}

.trk-review-row__qty {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    background: var(--accent-primary);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    border-radius: var(--radius-full);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 0 2px var(--surface-raised);
}

.trk-review-row__name {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.3;
}

.trk-review-row__sku {
    font-family: var(--font-mono, 'JetBrains Mono', monospace);
    font-size: 0.6875rem;
    color: var(--text-tertiary);
    margin-top: 2px;
}

.trk-review-row__price {
    font-weight: 700;
    color: var(--text-primary);
    font-size: 0.9375rem;
}

/* Review totals table */
.trk-review-totals {
    width: 100%;
    background: transparent;
    border: none;
    margin-bottom: var(--space-5);
    padding-top: var(--space-4);
    border-top: 1px solid var(--border-subtle);
}

.trk-review-totals th,
.trk-review-totals td {
    padding: var(--space-2) 0;
    border: none;
    font-size: 0.9375rem;
}

.trk-review-totals th { text-align: left; color: var(--text-secondary); font-weight: 500; }
.trk-review-totals td { text-align: right; color: var(--text-primary); font-weight: 600; }

.trk-review-totals .order-total th,
.trk-review-totals .order-total td {
    padding-top: var(--space-3);
    border-top: 1px solid var(--border-subtle);
    font-size: 1.0625rem;
}

.trk-review-totals .order-total td {
    color: var(--accent-primary);
    font-weight: 800;
    font-size: 1.25rem;
}

/* Payment methods */
.trk-payment-title {
    font-family: var(--font-display);
    font-size: 1rem;
    margin: 0 0 var(--space-3);
    color: var(--text-primary);
}

.trk-payment .wc_payment_methods {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.trk-payment .wc_payment_method {
    border: 1px solid var(--border-interactive);
    border-radius: var(--radius-lg);
    padding: var(--space-3) var(--space-4);
    background: var(--surface-overlay);
    transition: border-color var(--transition-fast), background var(--transition-fast);
}

.trk-payment .wc_payment_method:has(input:checked) {
    border-color: var(--accent-primary);
    background: var(--accent-primary-ghost);
}

.trk-payment .wc_payment_method > label {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    margin: 0;
}

.trk-payment .wc_payment_method input[type="radio"] {
    width: 18px;
    height: 18px;
    accent-color: var(--accent-primary);
}

.trk-payment .payment_box {
    margin-top: var(--space-2);
    padding: var(--space-3);
    background: var(--surface-raised);
    border-radius: var(--radius-md);
    color: var(--text-secondary);
    font-size: 0.8125rem;
    line-height: 1.5;
}

/* Place order button */
.trk-place-order {
    width: 100%;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    font-size: 1rem;
    font-weight: 700;
    padding: var(--space-4) var(--space-6) !important;
}

.trk-checkout-trust {
    list-style: none;
    padding: var(--space-4) 0 0;
    margin: var(--space-5) 0 0;
    border-top: 1px solid var(--border-subtle);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.trk-checkout-trust li {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    color: var(--text-secondary);
    font-size: 0.8125rem;
}

.trk-checkout-trust li i { color: var(--accent-primary); flex-shrink: 0; }
.trk-checkout-trust a { color: var(--accent-primary); text-decoration: none; font-weight: 600; }

/* ---------------- THANK YOU ---------------- */

.trk-thankyou {
    max-width: 880px;
    margin: 0 auto;
    padding: var(--space-4) 0 var(--space-16);
}

.trk-thankyou-hero {
    text-align: center;
    padding: var(--space-10) var(--space-6);
    background: linear-gradient(180deg, var(--accent-primary-ghost) 0%, transparent 100%);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-xl);
    margin-bottom: var(--space-8);
}

.trk-thankyou-icon {
    width: 88px;
    height: 88px;
    margin: 0 auto var(--space-4);
    border-radius: var(--radius-full);
    background: var(--moss-green, #3E5C47);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 12px 32px rgba(62, 92, 71, 0.25);
}

.trk-thankyou-title {
    font-family: var(--font-display);
    font-size: clamp(1.75rem, 3vw, 2.25rem);
    font-weight: 700;
    margin: 0 0 var(--space-2);
    color: var(--text-primary);
}

.trk-thankyou-sub {
    color: var(--text-secondary);
    font-size: 1rem;
    max-width: 560px;
    margin: 0 auto var(--space-6);
    line-height: 1.5;
}

.trk-thankyou-meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: var(--space-4);
    max-width: 720px;
    margin: 0 auto;
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: var(--space-5);
    text-align: left;
}

.trk-thankyou-meta div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.trk-thankyou-meta dt {
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
    font-weight: 600;
}

.trk-thankyou-meta dd {
    margin: 0;
    color: var(--text-primary);
    font-weight: 600;
    font-size: 0.9375rem;
    word-break: break-word;
}

.trk-thankyou-meta .trk-accent { color: var(--accent-primary); font-weight: 800; font-size: 1.0625rem; }

.trk-section-title {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0 0 var(--space-5);
    color: var(--text-primary);
}

.trk-thankyou-next {
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-xl);
    padding: var(--space-6);
    margin-bottom: var(--space-6);
}

.trk-steps-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.trk-steps-list li {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: var(--space-4);
    align-items: start;
}

.trk-steps-num {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    background: var(--accent-primary-muted);
    color: var(--accent-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.trk-steps-list strong {
    display: block;
    color: var(--text-primary);
    font-size: 1rem;
    margin-bottom: 4px;
}

.trk-steps-list p {
    margin: 0;
    color: var(--text-secondary);
    font-size: 0.875rem;
    line-height: 1.5;
}

.trk-thankyou-contact { margin-bottom: var(--space-8); }

.trk-thankyou-contact-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--space-3);
}

.trk-contact-card {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-4);
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    color: var(--text-primary);
    text-decoration: none;
    transition: border-color var(--transition-fast), transform var(--transition-fast);
}

.trk-contact-card:hover {
    border-color: var(--accent-primary);
    transform: translateY(-2px);
}

.trk-contact-card i { color: var(--accent-primary); flex-shrink: 0; }
.trk-contact-card strong { display: block; font-size: 0.9375rem; }
.trk-contact-card span { color: var(--text-tertiary); font-size: 0.8125rem; }

.trk-thankyou-details { margin-bottom: var(--space-8); }

.trk-thankyou-details .woocommerce-order-details,
.trk-thankyou-details .woocommerce-customer-details {
    background: var(--surface-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-xl);
    padding: var(--space-6);
    margin-bottom: var(--space-4);
}

.trk-thankyou-details h2,
.trk-thankyou-details h3 {
    font-family: var(--font-display);
    margin: 0 0 var(--space-4);
}

.trk-thankyou-details .shop_table {
    width: 100%;
    border-collapse: collapse;
}

.trk-thankyou-details .shop_table th,
.trk-thankyou-details .shop_table td {
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--border-subtle);
    text-align: left;
}

.trk-thankyou-details .shop_table tfoot th,
.trk-thankyou-details .shop_table tfoot td {
    text-align: right;
}

.trk-thankyou-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-3);
}

.trk-thankyou-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
}

.trk-thankyou-failed {
    text-align: center;
    padding: var(--space-10) var(--space-6);
    background: var(--error-muted);
    border: 1px solid var(--error-border);
    border-radius: var(--radius-xl);
    color: var(--error-text);
}

.trk-thankyou-failed h1 { font-family: var(--font-display); margin: var(--space-3) 0; }
.trk-thankyou-failed-actions { margin-top: var(--space-5); display: flex; justify-content: center; gap: var(--space-3); }

/* ================================================================
   RESPONSIVE — Cart / Checkout / Thank You
   ================================================================ */

@media (max-width: 1024px) {
    .trk-cart-form { grid-template-columns: 1fr; }
    .trk-checkout-grid { grid-template-columns: 1fr; }
    .trk-cart-aside,
    .trk-checkout-aside { position: static; }
}

@media (max-width: 768px) {
    .trk-checkout-steps { gap: var(--space-2); font-size: 0.75rem; }
    .trk-checkout-steps li { padding-right: var(--space-2); }
    .trk-checkout-steps li:not(:last-child)::after { width: 16px; margin-left: var(--space-1, 4px); }

    .trk-cart-row {
        grid-template-columns: 72px 1fr auto;
        grid-template-areas:
            "media body remove"
            "media qty subtotal";
        gap: var(--space-3);
        padding: var(--space-3);
    }
    .trk-cart-row__media { grid-area: media; width: 72px; height: 72px; }
    .trk-cart-row__body { grid-area: body; }
    .trk-cart-row__qty { grid-area: qty; justify-self: start; margin-top: var(--space-2); }
    .trk-cart-row__subtotal { grid-area: subtotal; margin-top: var(--space-2); }
    .trk-cart-row__remove { grid-area: remove; justify-self: end; }
    .trk-cart-row__sublabel { display: inline; }

    .trk-cart-actions { flex-direction: column; align-items: stretch; }
    .trk-coupon { width: 100%; }
    .trk-cart-update { margin-left: 0; }

    .trk-contact-fields { grid-template-columns: 1fr; }
    .trk-address-fields { grid-template-columns: 1fr; }
    .trk-address-fields .form-row-first,
    .trk-address-fields .form-row-last,
    .trk-address-fields #billing_first_name_field,
    .trk-address-fields #billing_last_name_field,
    .trk-address-fields #billing_postcode_field,
    .trk-address-fields #billing_city_field,
    .trk-address-fields #billing_state_field { grid-column: 1 / -1; }

    .trk-card-body { padding: var(--space-4); }
    .trk-card-head { padding: var(--space-4); }

    .trk-thankyou-hero { padding: var(--space-6) var(--space-4); }
    .trk-thankyou-meta { grid-template-columns: 1fr 1fr; padding: var(--space-4); }

    .trk-thankyou-actions .btn { width: 100%; justify-content: center; }
}

/* Legacy responsive */
@media (max-width: 768px) {
    .woocommerce .product .images {
        margin-bottom: var(--space-6);
    }

    .woocommerce .product .thumbnails {
        grid-template-columns: repeat(3, 1fr);
    }

    .woocommerce .product .summary {
        padding: 0;
    }

    .woocommerce .cart_totals {
        margin-top: var(--space-6);
    }

    .woocommerce .woocommerce-tabs ul.tabs {
        gap: var(--space-2);
    }

    .woocommerce .woocommerce-tabs ul.tabs li a {
        padding: var(--space-3) var(--space-2);
        font-size: 0.875rem;
    }
}
