/**
 * Simply Stripe Shop WP – Frontend Styles
 *
 * Table of Contents:
 * 1. CSS Custom Properties
 * 2. Base & Reset
 * 3. Product Grid & Cards
 * 4. Single Product
 * 5. Cart
 * 6. Mini Cart
 * 7. Order Pages
 * 8. Buttons & Badges
 * 9. Forms & Inputs
 * 10. Pagination
 * 11. Responsive
 * 12. Dark Mode
 * 13. Reduced Motion
 */

/* ==========================================================================
   1. CSS Custom Properties
   ========================================================================== */

:root {
	/* Basisfarben */
	--sssw-primary:          #3d2315;
	--sssw-primary-dark:     #2a1810;
	--sssw-accent:           #a0735a;
	--sssw-accent-hover:     #7a5240;
	--sssw-success:          #5a9065;
	--sssw-warning:          #c8852a;
	--sssw-danger:           #b05a50;
	--sssw-bg:               #fdf7f2;
	--sssw-surface:          #ffffff;
	--sssw-border:           #e7d4c3;
	--sssw-text:             #3d2315;
	--sssw-text-muted:       #8c7060;
	/* Buttons */
	--sssw-btn-cart:              #a0735a;
	--sssw-btn-cart-text:         #ffffff;
	--sssw-btn-cart-border:       transparent;
	--sssw-btn-cart-hover:        #7a5240;
	--sssw-btn-detail:            #e7d4c3;
	--sssw-btn-detail-text:       #3d2315;
	--sssw-btn-detail-border:     #e7d4c3;
	--sssw-btn-detail-hover:      #d9c2ab;
	--sssw-btn-border-width:      0px;
	--sssw-btn-hover-shadow:      0 4px 14px rgba(0,0,0,0.18);
	/* Details-Link Hover */
	--sssw-link-hover:            #3d2315;
	--sssw-link-hover-decoration: none;
	/* Elemente */
	--sssw-price:                 #a0735a;
	--sssw-badge-hl:              #a0735a;
	--sssw-badge-hl-text:         #ffffff;
	--sssw-badge-border-width:    0px;
	--sssw-badge-border:          transparent;
	--sssw-heading:               #3d2315;
	/* Mini-Warenkorb Toggle-Button */
	--sssw-minicart-btn-bg:       #3d2315;
	--sssw-minicart-btn-text:     #ffffff;
	--sssw-minicart-btn-radius:   50%;
	--sssw-minicart-count-bg:     #a0735a;
	--sssw-minicart-count-text:   #ffffff;
	/* Mini-Warenkorb Panel */
	--sssw-minicart-panel-bg:     #ffffff;
	--sssw-minicart-panel-text:   #3d2315;
	/* Mini-Warenkorb Icon */
	--sssw-minicart-icon-size:    30px;
	--sssw-minicart-icon-fill:    currentColor;
	/* Mini-Warenkorb Position */
	--sssw-minicart-top:          auto;
	--sssw-minicart-bottom:       30px;
	--sssw-minicart-left:         auto;
	--sssw-minicart-right:        30px;
	/* Layout */
	--sssw-text-align:            left;
	--sssw-detail-align:          left;
	/* Sonstiges */
	--sssw-radius:           10px;
	--sssw-radius-sm:        6px;
	--sssw-shadow:           0 2px 12px rgba(0, 0, 0, 0.08);
	--sssw-shadow-hover:     0 8px 24px rgba(0, 0, 0, 0.15);
	--sssw-transition:       0.2s ease;
	--sssw-font:             -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ==========================================================================
   2. Base & Reset
   ========================================================================== */

.sssw-shop-container *,
.sssw-single-product *,
.sssw-cart-page *,
.sssw-mini-cart-panel * {
	box-sizing: border-box;
}

.sssw-shop-container,
.sssw-single-product,
.sssw-cart-page {
	font-family: var(--sssw-font);
	color: var(--sssw-text);
	line-height: 1.6;
}

/* ==========================================================================
   3. Product Grid & Cards
   ========================================================================== */

.sssw-category-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 28px;
}

.sssw-filter-btn {
	padding: 7px 18px;
	border: 2px solid var(--sssw-border);
	border-radius: 50px;
	background: var(--sssw-surface);
	color: var(--sssw-text-muted);
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
	transition: all var(--sssw-transition);
}

.sssw-filter-btn:hover,
.sssw-filter-btn.active {
	background: var(--sssw-primary);
	border-color: var(--sssw-primary);
	color: #fff;
}

.sssw-products-grid {
	display: grid;
	gap: 24px;
}

.sssw-columns-2 { grid-template-columns: repeat(2, 1fr); }
.sssw-columns-3 { grid-template-columns: repeat(3, 1fr); }
.sssw-columns-4 { grid-template-columns: repeat(4, 1fr); }

/* Listenansicht */
[data-layout="list"] .sssw-products-grid {
	grid-template-columns: 1fr;
}

[data-layout="list"] .sssw-product-card {
	display: flex;
	flex-direction: row;
	align-items: stretch;
}

[data-layout="list"] .sssw-product-image {
	width: 200px;
	flex-shrink: 0;
}

.sssw-product-card {
	background: var(--sssw-surface);
	border-radius: var(--sssw-radius);
	overflow: hidden;
	box-shadow: var(--sssw-shadow);
	transition: transform var(--sssw-transition), box-shadow var(--sssw-transition);
	display: flex;
	flex-direction: column;
	position: relative;
}

.sssw-product-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--sssw-shadow-hover);
}

.sssw-product-card--out {
	opacity: 0.8;
}

.sssw-product-card--featured {
	border: 2px solid var(--sssw-accent);
}

.sssw-product-image {
	position: relative;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: var(--sssw-bg);
}

.sssw-product-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
	display: block;
}

.sssw-product-card:hover .sssw-product-image img {
	transform: scale(1.05);
}

.sssw-product-image-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--sssw-bg);
	color: var(--sssw-text-muted);
	font-size: 14px;
	min-height: 200px;
}

.sssw-product-image-placeholder--lg {
	min-height: 350px;
	font-size: 18px;
}

.sssw-product-info {
	padding: 18px;
	display: flex;
	flex-direction: column;
	flex: 1;
	text-align: var(--sssw-text-align, left);
}

.sssw-product-title {
	font-size: 16px;
	font-weight: 600;
	margin: 0 0 8px;
	line-height: 1.4;
}

.sssw-product-title a {
	color: var(--sssw-heading);
	text-decoration: none !important;
	transition: color var(--sssw-transition);
}

.sssw-product-title a:hover {
	color: var(--sssw-accent);
}

.sssw-product-excerpt {
	font-size: 14px;
	color: var(--sssw-text-muted);
	margin: 0 0 12px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.sssw-product-price {
	margin-bottom: 16px;
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 6px;
}

.sssw-price-current {
	font-size: 20px;
	font-weight: 700;
	color: var(--sssw-price);
}

.sssw-price-sale {
	color: var(--sssw-price);
}

.sssw-price-old {
	font-size: 15px;
	color: var(--sssw-text-muted);
	text-decoration: line-through;
}

.sssw-tax-notice {
	font-size: 12px;
	color: var(--sssw-text-muted);
}

.sssw-product-actions {
	display: flex;
	gap: 8px;
	margin-top: auto;
	flex-wrap: wrap;
}

.sssw-no-products {
	text-align: center;
	color: var(--sssw-text-muted);
	padding: 40px;
	grid-column: 1 / -1;
}

/* ==========================================================================
   4. Single Product
   ========================================================================== */

.sssw-single-product {
	max-width: 1100px;
	margin: 0 auto;
}

.sssw-single-product-layout {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	margin-bottom: 48px;
}

.sssw-product-gallery {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.sssw-gallery-main {
	border-radius: var(--sssw-radius);
	overflow: hidden;
	background: var(--sssw-bg);
	aspect-ratio: 1;
}

.sssw-gallery-main img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: opacity 0.2s;
}

.sssw-gallery-thumbs {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.sssw-gallery-thumb {
	width: 70px;
	height: 70px;
	border: 2px solid var(--sssw-border);
	border-radius: var(--sssw-radius-sm);
	overflow: hidden;
	cursor: pointer;
	padding: 0;
	background: none;
	transition: border-color var(--sssw-transition);
}

.sssw-gallery-thumb.active,
.sssw-gallery-thumb:hover {
	border-color: var(--sssw-accent);
}

.sssw-gallery-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sssw-product-details {
	display: flex;
	flex-direction: column;
	gap: 16px;
	text-align: var(--sssw-detail-align, left);
}

/* Detail-Seite: Link-Hover Farbe & Dekoration (nur Inhalts-Links, nicht Buttons) */
.sssw-product-details a:not(.sssw-btn):hover,
.sssw-single-product a:not(.sssw-btn):hover {
	color: var(--sssw-link-hover);
	text-decoration: var(--sssw-link-hover-decoration, none);
}

.sssw-product-details .sssw-product-title {
	font-size: 28px;
	margin: 0;
	color: var(--sssw-heading);
}

.sssw-product-sku {
	font-size: 13px;
	color: var(--sssw-text-muted);
	margin: 0;
}

.sssw-product-price-block {
	display: flex;
	align-items: baseline;
	gap: 10px;
	flex-wrap: wrap;
}

.sssw-product-price-block .sssw-price-current {
	font-size: 28px;
}

.sssw-product-short-desc p {
	color: var(--sssw-text-muted);
	margin: 0;
}

.sssw-add-to-cart-form {
	display: flex;
	gap: 12px;
	align-items: center;
}

.sssw-qty-control {
	display: flex;
	align-items: center;
	border: 2px solid var(--sssw-border);
	border-radius: var(--sssw-radius-sm);
	overflow: hidden;
}

.sssw-qty-btn {
	width: 36px;
	height: 40px;
	background: var(--sssw-bg);
	border: none;
	font-size: 18px;
	cursor: pointer;
	color: var(--sssw-text);
	transition: background var(--sssw-transition);
}

.sssw-qty-btn:hover {
	background: var(--sssw-border);
}

.sssw-qty-input {
	width: 50px;
	height: 40px;
	border: none;
	text-align: center;
	font-size: 16px;
	font-weight: 600;
	color: var(--sssw-text);
	-moz-appearance: textfield;
}

.sssw-qty-input::-webkit-inner-spin-button,
.sssw-qty-input::-webkit-outer-spin-button {
	-webkit-appearance: none;
}

.sssw-product-meta-details {
	border-top: 1px solid var(--sssw-border);
	padding-top: 16px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.sssw-meta-row {
	display: flex;
	gap: 8px;
	font-size: 14px;
}

.sssw-meta-label {
	color: var(--sssw-text-muted);
	min-width: 100px;
}

.sssw-out-of-stock {
	font-size: 16px;
	font-weight: 600;
	color: var(--sssw-danger);
}

/* Product Tabs */
.sssw-product-tabs {
	margin-top: 40px;
}

.sssw-tabs-nav {
	list-style: none;
	margin: 0 0 -1px;
	padding: 0;
	display: flex;
	gap: 4px;
	border-bottom: 2px solid var(--sssw-border);
}

.sssw-tabs-nav li a {
	display: block;
	padding: 12px 20px;
	color: var(--sssw-text-muted);
	text-decoration: none;
	font-weight: 500;
	border-bottom: 2px solid transparent;
	margin-bottom: -2px;
	transition: color var(--sssw-transition), border-color var(--sssw-transition);
}

.sssw-tabs-nav li.active a,
.sssw-tabs-nav li a:hover {
	color: var(--sssw-primary);
	border-bottom-color: var(--sssw-accent);
}

.sssw-tab-content {
	display: none;
	padding: 24px 0;
}

.sssw-tab-content.active {
	display: block;
}

/* ==========================================================================
   5. Cart
   ========================================================================== */

.sssw-cart-page {
	max-width: 1100px;
	margin: 0 auto;
}

.sssw-cart-loading {
	text-align: center;
	padding: 40px;
	color: var(--sssw-text-muted);
}

.sssw-cart-content {
	display: grid;
	grid-template-columns: 1fr 340px;
	gap: 32px;
	align-items: start;
}

.sssw-cart-table-wrap {
	overflow-x: auto;
}

.sssw-cart-table {
	width: 100%;
	border-collapse: collapse;
	background: var(--sssw-surface);
	border-radius: var(--sssw-radius);
	overflow: hidden;
	box-shadow: var(--sssw-shadow);
}

.sssw-cart-table th {
	background: var(--sssw-bg);
	padding: 14px 16px;
	text-align: left;
	font-size: 13px;
	font-weight: 600;
	color: var(--sssw-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.5px;
	border-bottom: 1px solid var(--sssw-border);
}

.sssw-cart-table td {
	padding: 16px;
	border-bottom: 1px solid var(--sssw-border);
	vertical-align: middle;
}

.sssw-cart-table tr:last-child td {
	border-bottom: none;
}

.sssw-cart-item-image {
	width: 100%;
	max-width: 17em;
	height: 100%;
	object-fit: cover;
	border-radius: var(--sssw-radius-sm);
}

.sssw-cart-item-name {
	font-weight: 500;
}

.sssw-cart-item-price,
.sssw-cart-item-subtotal {
	font-weight: 600;
	white-space: nowrap;
}

.sssw-cart-qty-control {
	display: flex;
	align-items: center;
	gap: 6px;
}

.sssw-cart-qty-btn {
	width: 28px;
	height: 28px;
	border: 1px solid var(--sssw-border);
	border-radius: 50%;
	background: var(--sssw-surface);
	cursor: pointer;
	font-size: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background var(--sssw-transition);
}

.sssw-cart-qty-btn:hover {
	background: var(--sssw-bg);
}

.sssw-cart-qty-input {
	width: 44px;
	text-align: center;
	border: 1px solid var(--sssw-border);
	border-radius: var(--sssw-radius-sm);
	padding: 4px;
	font-size: 14px;
	font-weight: 600;
}

.sssw-remove-item {
	background: rgba(244, 67, 54, 0.08);
	border: 1px solid rgba(244, 67, 54, 0.2);
	color: var(--sssw-danger);
	cursor: pointer;
	width: 36px;
	height: 36px;
	padding: 0;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: color var(--sssw-transition), background var(--sssw-transition), border-color var(--sssw-transition);
	flex-shrink: 0;
}

.sssw-remove-item:hover {
	color: #fff;
	background: var(--sssw-danger);
	border-color: var(--sssw-danger);
}

/* Cart Totals */
.sssw-cart-totals {
	background: var(--sssw-surface);
	border-radius: var(--sssw-radius);
	box-shadow: var(--sssw-shadow);
	padding: 24px;
	position: sticky;
	top: 20px;
}

.sssw-cart-totals h3 {
	font-size: 18px;
	font-weight: 600;
	margin: 0 0 20px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--sssw-border);
}

.sssw-totals-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 10px 0;
	font-size: 15px;
	border-bottom: 1px solid var(--sssw-border);
}

.sssw-totals-row:last-of-type {
	border-bottom: none;
}

.sssw-totals-total {
	font-weight: 700;
	font-size: 18px;
	padding: 14px 0;
	border-top: 2px solid var(--sssw-border);
	color: var(--sssw-price);
}

.sssw-continue-shopping {
	display: block;
	text-align: center;
	margin-top: 12px;
	color: var(--sssw-text-muted);
	text-decoration: none !important;
	font-size: 14px;
	transition: color var(--sssw-transition);
	border: 1px solid #cfcfcf;
  padding: 10px 0px;
}

.sssw-continue-shopping:hover {
	color: var(--sssw-accent);
	background-color: rgb(232, 232, 232) !important;
	color: #000 !important;
}

.sssw-cart-empty {
	text-align: center;
	padding: 60px 20px;
	background: var(--sssw-surface);
	border-radius: var(--sssw-radius);
	box-shadow: var(--sssw-shadow);
}

.sssw-cart-empty p {
	font-size: 18px;
	color: var(--sssw-text-muted);
	margin-bottom: 24px;
}

/* ==========================================================================
   6. Mini Cart
   ========================================================================== */

.sssw-mini-cart-toggle {
	position: fixed;
	top: var(--sssw-minicart-top, auto);
	bottom: var(--sssw-minicart-bottom, 30px);
	left: var(--sssw-minicart-left, auto);
	right: var(--sssw-minicart-right, 30px);
	width: 56px;
	height: 56px;
	background: var(--sssw-minicart-btn-bg, var(--sssw-primary));
	color: var(--sssw-minicart-btn-text, #fff);
	border-radius: var(--sssw-minicart-btn-radius, 50%);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 9998;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
	transition: transform var(--sssw-transition), box-shadow var(--sssw-transition);
}

.sssw-mini-cart-toggle:hover {
	transform: scale(1.08);
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.3);
}

.sssw-cart-icon {
	width: var(--sssw-minicart-icon-size, 30px);
	height: var(--sssw-minicart-icon-size, 30px);
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	flex-shrink: 0;
}

.sssw-cart-icon svg {
	width: 100%;
	height: 100%;
	fill: var(--sssw-minicart-icon-fill, currentColor);
	display: block;
}

.sssw-cart-badge {
	position: absolute;
	top: -4px;
	right: -4px;
	background: var(--sssw-minicart-count-bg, var(--sssw-accent));
	color: var(--sssw-minicart-count-text, #fff);
	font-size: 11px;
	font-weight: 700;
	min-width: 20px;
	height: 20px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 5px;
}

.sssw-mini-cart-panel {
	position: fixed;
	top: 0;
	right: -380px;
	left: auto;
	width: 380px;
	height: 100vh;
	background: var(--sssw-minicart-panel-bg, var(--sssw-surface));
	color: var(--sssw-minicart-panel-text, var(--sssw-text));
	z-index: 9999;
	display: flex;
	flex-direction: column;
	box-shadow: -4px 0 24px rgba(0, 0, 0, 0.15);
	transition: right 0.3s ease;
}

.sssw-mini-cart-panel.open {
	right: 0;
}

/* Mini-Cart von links (bei left-Positionen) */
.sssw-minicart-pos-bottom-left .sssw-mini-cart-panel,
.sssw-minicart-pos-top-left .sssw-mini-cart-panel {
	right: auto;
	left: -380px;
	box-shadow: 4px 0 24px rgba(0, 0, 0, 0.15);
	transition: left 0.3s ease;
}

.sssw-minicart-pos-bottom-left .sssw-mini-cart-panel.open,
.sssw-minicart-pos-top-left .sssw-mini-cart-panel.open {
	left: 0;
	right: auto;
}

.sssw-mini-cart-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: 9997;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s ease;
}

.sssw-mini-cart-overlay.visible {
	opacity: 1;
	pointer-events: auto;
}

.sssw-mini-cart-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px 20px;
	border-bottom: 1px solid var(--sssw-border);
}

.sssw-mini-cart-header h3 {
	margin: 0;
	font-size: 18px;
	font-weight: 600;
}

.sssw-mini-cart-close {
	background: none;
	border: none;
	font-size: 24px;
	cursor: pointer;
	color: var(--sssw-text-muted);
	line-height: 1;
	padding: 4px 8px;
	border-radius: 50%;
	transition: color var(--sssw-transition), background var(--sssw-transition);
}

.sssw-mini-cart-close:hover {
	color: var(--sssw-danger);
	background: rgba(244, 67, 54, 0.1);
}

.sssw-mini-cart-body {
	flex: 1;
	overflow-y: auto;
	padding: 16px;
}

.sssw-mini-cart-empty {
	text-align: center;
	color: var(--sssw-text-muted);
	padding: 40px 0;
}

.sssw-mini-cart-item {
	display: flex;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px solid var(--sssw-border);
	align-items: center;
}

.sssw-mini-cart-item:last-child {
	border-bottom: none;
}

.sssw-mini-cart-item-image {
	width: 50px;
	height: 50px;
	object-fit: cover;
	border-radius: var(--sssw-radius-sm);
	flex-shrink: 0;
}

.sssw-mini-cart-item-info {
	flex: 1;
	min-width: 0;
}

.sssw-mini-cart-item-name {
	font-size: 14px;
	font-weight: 500;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.sssw-mini-cart-item-price {
	font-size: 13px;
	color: var(--sssw-text-muted);
}

.sssw-mini-cart-item-remove {
	background: none;
	border: none;
	color: var(--sssw-text-muted);
	cursor: pointer;
	font-size: 16px;
	padding: 4px;
	transition: color var(--sssw-transition);
}

.sssw-mini-cart-item-remove:hover {
	color: var(--sssw-danger);
}

.sssw-mini-cart-footer {
	padding: 16px 20px;
	border-top: 1px solid var(--sssw-border);
}

.sssw-mini-cart-total {
	display: flex;
	justify-content: space-between;
	font-weight: 700;
	font-size: 16px;
	margin-bottom: 16px;
}

/* ==========================================================================
   7. Order Pages
   ========================================================================== */

.sssw-order-success,
.sssw-order-cancelled {
	text-align: center;
	padding: 60px 20px;
	max-width: 600px;
	margin: 0 auto;
}

.sssw-success-icon,
.sssw-cancelled-icon {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 36px;
	margin: 0 auto 24px;
}

.sssw-success-icon {
	background: #e8f5e9;
	color: var(--sssw-success);
}

.sssw-cancelled-icon {
	background: #fce4ec;
	color: var(--sssw-danger);
}

.sssw-order-success h2,
.sssw-order-cancelled h2 {
	font-size: 28px;
	margin: 0 0 16px;
}

.sssw-order-details {
	text-align: left;
	margin-top: 40px;
	background: var(--sssw-surface);
	border-radius: var(--sssw-radius);
	box-shadow: var(--sssw-shadow);
	overflow: hidden;
}

.sssw-order-details h3 {
	padding: 20px;
	margin: 0;
	border-bottom: 1px solid var(--sssw-border);
	font-size: 16px;
}

.sssw-order-items-table {
	width: 100%;
	border-collapse: collapse;
}

.sssw-order-items-table th,
.sssw-order-items-table td {
	padding: 14px 20px;
	text-align: left;
	border-bottom: 1px solid var(--sssw-border);
}

.sssw-order-items-table tfoot tr:last-child td,
.sssw-order-items-table tfoot tr:last-child th {
	border-bottom: none;
	font-weight: 700;
}

.sssw-cancelled-actions {
	display: flex;
	gap: 12px;
	justify-content: center;
	margin-top: 24px;
	flex-wrap: wrap;
}

.sssw-order-message {
	padding: 20px;
	border-radius: var(--sssw-radius-sm);
	margin: 20px 0;
}

.sssw-order-message--error {
	background: #fce4ec;
	color: var(--sssw-danger);
}

.sssw-order-message--info {
	background: #e3f2fd;
	color: #1565c0;
}

/* ==========================================================================
   8. Buttons & Badges
   ========================================================================== */

.sssw-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 11px 22px;
	border-radius: var(--sssw-radius-sm);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	border: var(--sssw-btn-border-width, 0px) solid transparent;
	transition: background var(--sssw-transition), color var(--sssw-transition),
		border-color var(--sssw-transition), transform var(--sssw-transition),
		box-shadow var(--sssw-transition);
	line-height: 1.2;
	white-space: nowrap;
}

.sssw-btn:focus-visible {
	outline: 3px solid var(--sssw-accent);
	outline-offset: 2px;
}

.sssw-btn--primary {
	background: var(--sssw-btn-cart);
	color: var(--sssw-btn-cart-text);
	border-color: var(--sssw-btn-cart-border, transparent);
}

.sssw-btn:hover {
	text-decoration: none;
}

.sssw-btn--primary:hover {
	background: var(--sssw-btn-cart-hover);
	border-color: var(--sssw-btn-cart-hover);
	transform: translateY(-1px);
	box-shadow: var(--sssw-btn-hover-shadow, none);
}

.sssw-btn--secondary {
	background: var(--sssw-btn-detail);
	color: var(--sssw-btn-detail-text);
	border-color: var(--sssw-btn-detail-border, var(--sssw-btn-detail));
	text-decoration: none !important;
}

.sssw-btn--secondary:hover {
	background: var(--sssw-btn-detail-hover);
	border-color: var(--sssw-btn-detail-hover);
	color: var(--sssw-link-hover);
	text-decoration: none !important;
}

.sssw-btn--full {
	width: 100%;
}

.sssw-btn--disabled {
	background: var(--sssw-bg);
	color: var(--sssw-text-muted);
	border-color: var(--sssw-border);
	cursor: not-allowed;
}

.sssw-btn.loading {
	position: relative;
	pointer-events: none;
	opacity: 0.75;
}

.sssw-btn.loading::after {
	content: '';
	position: absolute;
	width: 16px;
	height: 16px;
	border: 2px solid rgba(255, 255, 255, 0.4);
	border-top-color: #fff;
	border-radius: 50%;
	animation: sssw-spin 0.7s linear infinite;
}

@keyframes sssw-spin {
	to { transform: rotate(360deg); }
}

/* Badges */
.sssw-badge {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 50px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.sssw-badge--out { background: rgba(176, 90, 80, 0.12); color: var(--sssw-danger); }
.sssw-badge--in { background: rgba(90, 144, 101, 0.12); color: var(--sssw-success); }
.sssw-badge--sale {
	background: var(--sssw-badge-hl);
	color: var(--sssw-badge-hl-text);
	border: var(--sssw-badge-border-width, 0px) solid var(--sssw-badge-border, transparent);
}
.sssw-badge--featured {
	background: var(--sssw-badge-hl);
	color: var(--sssw-badge-hl-text);
	border: var(--sssw-badge-border-width, 0px) solid var(--sssw-badge-border, transparent);
}
.sssw-badge--digital { background: #e3f2fd; color: #1565c0; }
.sssw-badge--physical { background: #f3e5f5; color: #6a1b9a; }
.sssw-badge--unlimited { background: #e8f5e9; color: var(--sssw-success); }
.sssw-badge--success { background: #e8f5e9; color: var(--sssw-success); }
.sssw-badge--warning { background: #fff8e1; color: #f57f17; }
.sssw-badge--danger { background: #fce4ec; color: var(--sssw-danger); }
.sssw-badge--info { background: #e3f2fd; color: #1565c0; }
.sssw-badge--primary { background: #e8eaf6; color: #3949ab; }

/* Product image badges */
.sssw-product-image .sssw-badge {
	position: absolute;
	top: 12px;
	left: 12px;
	font-size: 10px;
}

.sssw-product-image .sssw-badge + .sssw-badge {
	top: 40px;
}

/* ==========================================================================
   9. Forms & Inputs
   ========================================================================== */

.sssw-qty-input:focus,
.sssw-cart-qty-input:focus {
	outline: 2px solid var(--sssw-accent);
	outline-offset: 1px;
}

/* ==========================================================================
   10. Pagination
   ========================================================================== */

.sssw-pagination {
	margin-top: 40px;
	display: flex;
	justify-content: center;
}

.sssw-pagination ul {
	list-style: none;
	display: flex;
	gap: 6px;
	margin: 0;
	padding: 0;
}

.sssw-pagination ul li a,
.sssw-pagination ul li span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: var(--sssw-radius-sm);
	border: 1px solid var(--sssw-border);
	text-decoration: none;
	color: var(--sssw-text);
	font-size: 14px;
	transition: all var(--sssw-transition);
}

.sssw-pagination ul li a:hover {
	background: var(--sssw-primary);
	color: #fff;
	border-color: var(--sssw-primary);
}

.sssw-pagination ul li span.current {
	background: var(--sssw-accent);
	color: #fff;
	border-color: var(--sssw-accent);
	font-weight: 700;
}

/* ==========================================================================
   11. Responsive
   ========================================================================== */

@media ( max-width: 1199px ) {
	.sssw-columns-4 { grid-template-columns: repeat(3, 1fr); }
}

@media ( max-width: 1215px ) {
	.sssw-cart-content {
 	 grid-template-columns: 1fr;
  }
}

@media ( max-width: 1024px ) {
	.sssw-columns-3,
	.sssw-columns-4 { grid-template-columns: repeat(2, 1fr); }
}

@media ( max-width: 767px ) {

	.sssw-single-product-layout {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.sssw-cart-totals {
		position: static;
	}

	[data-layout="list"] .sssw-product-card {
		flex-direction: column;
	}

	[data-layout="list"] .sssw-product-image {
		width: 100%;
	}

	.sssw-mini-cart-panel {
		width: 100%;
		right: -100%;
	}

	.sssw-add-to-cart-form {
		flex-wrap: wrap;
	}
}

@media ( max-width: 580px ) {
	.sssw-columns-2,
	.sssw-columns-3,
	.sssw-columns-4 { grid-template-columns: 1fr; }
}

@media ( max-width: 479px ) {

	.sssw-product-actions {
		flex-direction: column;
	}

	.sssw-btn {
		width: 100%;
	}

	.sssw-cart-table th:nth-child(3),
	.sssw-cart-table td:nth-child(3) {
		display: none;
	}
}

/* ==========================================================================
   12. Dark Mode – deaktiviert (Shop immer im Light Mode)
   ========================================================================== */

/* Dark Mode absichtlich nicht implementiert für konsistentes Shop-Design */

/* ==========================================================================
   13. Reduced Motion
   ========================================================================== */

.sssw-shipping-info {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
}

.sssw-free-shipping-hint {
	font-size: 12px;
	color: var(--sssw-text-muted);
}

/* ==========================================================================
   Lightbox
   ========================================================================== */

#sssw-lightbox {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 99999;
}

#sssw-lightbox.active {
	display: flex;
	align-items: center;
	justify-content: center;
}

#sssw-lb-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .88);
	backdrop-filter: blur(4px);
}

#sssw-lb-wrap {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 12px;
	max-width: 92vw;
	max-height: 92vh;
}

#sssw-lb-img-wrap {
	max-width: 80vw;
	max-height: 86vh;
	display: flex;
	align-items: center;
	justify-content: center;
}

#sssw-lb-img {
	max-width: 100%;
	max-height: 86vh;
	object-fit: contain;
	border-radius: 6px;
	box-shadow: 0 8px 40px rgba(0, 0, 0, .5);
	transition: opacity .2s;
}

#sssw-lb-close {
	position: absolute;
	top: -48px;
	right: 0;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: none;
	background: rgba(255, 255, 255, .15);
	color: #fff;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .15s;
}

#sssw-lb-close:hover { background: rgba(255, 255, 255, .3); }

#sssw-lb-prev,
#sssw-lb-next {
	width: 46px;
	height: 46px;
	flex-shrink: 0;
	border-radius: 50%;
	border: none;
	background: rgba(255, 255, 255, .15);
	color: #fff;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .15s;
}

#sssw-lb-prev:hover,
#sssw-lb-next:hover { background: rgba(255, 255, 255, .3); }

#sssw-lb-counter {
	position: absolute;
	bottom: -36px;
	left: 50%;
	transform: translateX(-50%);
	color: rgba(255, 255, 255, .7);
	font-size: 13px;
	white-space: nowrap;
}

@media ( prefers-reduced-motion: reduce ) {
	.sssw-product-card,
	.sssw-product-image img,
	.sssw-btn,
	.sssw-filter-btn,
	.sssw-mini-cart-toggle,
	.sssw-mini-cart-panel,
	.sssw-mini-cart-overlay,
	.sssw-gallery-main img,
	#sssw-lb-img {
		transition: none;
		animation: none;
	}

	.sssw-btn.loading::after {
		animation: none;
	}
}

/* ==========================================================================
   PayPal Button
   ========================================================================== */

.sssw-paypal-separator {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 16px 0 12px;
	color: var( --sssw-text-muted, #888 );
	font-size: 13px;
}

.sssw-paypal-separator::before,
.sssw-paypal-separator::after {
	content: '';
	flex: 1;
	height: 1px;
	background: var( --sssw-border, #e5e5e5 );
}

.sssw-paypal-btn-wrap {
	margin-bottom: 8px;
}

.sssw-paypal-btn-wrap .paypal-buttons {
	border-radius: var( --sssw-radius, 8px );
	overflow: hidden;
}
