/**
 * RAWASYSTEM Express Checkout - Checkout Responsive
 *
 * Responsive breakpoints, mobile-first adjustments, RTL-specific
 * responsive overrides, dark mode support, and print styles.
 *
 * Breakpoints:
 *   Desktop        > 1024px  (base / full layout)
 *   Tablet         768–1024px  (slight adjustments)
 *   Mobile         < 768px   (stack, full-width, larger touch targets)
 *   Small mobile   < 480px   (even more compact)
 *
 * @package RAWASYSTEM_Express_Checkout
 * @version 1.0.0
 */

/* ==========================================================================
   1. Desktop (>1024px) — Full layout, max-width 520px
   ========================================================================== */

@media (min-width: 1025px) {
	.rawasystem-checkout-wrapper {
		max-width: 520px;
	}

	.rawasystem-checkout-wrapper .rawasystem-form-card {
		box-shadow: var(--rawasystem-shadow-lg);
	}

	.rawasystem-checkout-wrapper .rawasystem-slider-step {
		padding: var(--rawasystem-space-6) var(--rawasystem-space-8);
	}

	.rawasystem-checkout-wrapper .rawasystem-input,
	.rawasystem-checkout-wrapper .rawasystem-floating-input,
	.rawasystem-checkout-wrapper .rawasystem-floating-textarea {
		padding-left: 16px;
		padding-right: 16px;
	}

	.rawasystem-checkout-wrapper .rawasystem-trust-badges {
		flex-wrap: nowrap;
	}

	.rawasystem-checkout-wrapper .rawasystem-step-label {
		display: block;
	}

	.rawasystem-checkout-wrapper .rawasystem-form-header {
		padding: var(--rawasystem-space-8) var(--rawasystem-space-8) 0;
	}

	.rawasystem-checkout-wrapper .rawasystem-step-info {
		padding: var(--rawasystem-space-3) var(--rawasystem-space-8);
	}

	.rawasystem-checkout-wrapper .rawasystem-form-footer {
		padding: var(--rawasystem-space-4) var(--rawasystem-space-8);
	}
}

/* ==========================================================================
   2. Tablet (768px–1024px) — Slight adjustments, full-width form
   ========================================================================== */

@media (max-width: 1024px) and (min-width: 769px) {
	.rawasystem-checkout-wrapper {
		max-width: 100%;
		padding: 0 var(--rawasystem-space-4);
	}

	.rawasystem-checkout-wrapper .rawasystem-slider-step {
		padding: var(--rawasystem-space-5) var(--rawasystem-space-6);
	}

	.rawasystem-checkout-wrapper .rawasystem-form-header {
		padding: var(--rawasystem-space-6);
	}

	.rawasystem-checkout-wrapper .rawasystem-progress-bar {
		padding: var(--rawasystem-space-4) var(--rawasystem-space-6) var(--rawasystem-space-3);
	}

	.rawasystem-checkout-wrapper .rawasystem-trust-badges {
		flex-wrap: wrap;
	}

	.rawasystem-checkout-wrapper .rawasystem-step-label {
		display: block;
	}
}

/* ==========================================================================
   3. Mobile (<768px) — Stack everything, larger touch targets
   ========================================================================== */

@media (max-width: 768px) {
	.rawasystem-checkout-wrapper {
		max-width: 100%;
		margin-left: var(--rawasystem-space-4);
		margin-right: var(--rawasystem-space-4);
	}

	.rawasystem-checkout-wrapper .rawasystem-form-card {
		border-radius: var(--rawasystem-radius-md);
		box-shadow: var(--rawasystem-shadow-md);
	}

	.rawasystem-checkout-wrapper .rawasystem-form-header {
		padding: var(--rawasystem-space-5) var(--rawasystem-space-5) 0;
	}

	.rawasystem-checkout-wrapper .rawasystem-form-title {
		font-size: var(--rawasystem-font-lg);
	}

	.rawasystem-checkout-wrapper .rawasystem-form-subtitle {
		font-size: var(--rawasystem-font-xs);
	}

	.rawasystem-checkout-wrapper .rawasystem-slider-step {
		padding: var(--rawasystem-space-5);
	}

	.rawasystem-checkout-wrapper .rawasystem-progress-bar {
		padding: var(--rawasystem-space-3) var(--rawasystem-space-5) var(--rawasystem-space-2);
	}

	/* Larger touch targets for inputs */
	.rawasystem-checkout-wrapper .rawasystem-input,
	.rawasystem-checkout-wrapper .rawasystem-floating-input,
	.rawasystem-checkout-wrapper .rawasystem-floating-textarea {
		height: 48px;
		min-height: 48px;
		font-size: var(--rawasystem-font-md);
		padding-left: 14px;
		padding-right: 14px;
	}

	.rawasystem-checkout-wrapper .rawasystem-select {
		height: 48px;
		font-size: var(--rawasystem-font-md);
	}

	/* Full-width buttons */
	.rawasystem-checkout-wrapper .rawasystem-step-actions {
		flex-direction: column-reverse;
		gap: var(--rawasystem-space-3);
	}

	.rawasystem-checkout-wrapper .rawasystem-btn-prev,
	.rawasystem-checkout-wrapper .rawasystem-btn-next {
		width: 100%;
		justify-content: center;
	}

	.rawasystem-checkout-wrapper .rawasystem-btn-primary {
		height: 52px;
		font-size: var(--rawasystem-font-md);
	}

	/* Adjusted step indicators */
	.rawasystem-checkout-wrapper .rawasystem-step-indicator-dot {
		width: 32px;
		height: 32px;
		font-size: var(--rawasystem-font-sm);
	}

	/* Stack input rows on mobile */
	.rawasystem-checkout-wrapper .rawasystem-input-row {
		grid-template-columns: 1fr;
		gap: 0;
	}

	/* Quantity controls larger */
	.rawasystem-checkout-wrapper .rawasystem-qty-btn {
		width: 44px;
		height: 44px;
	}

	.rawasystem-checkout-wrapper .rawasystem-qty-input {
		width: 52px;
		height: 44px;
	}

	/* Option buttons larger touch targets */
	.rawasystem-checkout-wrapper .rawasystem-option-btn {
		min-height: 44px;
		padding: 10px 18px;
		font-size: var(--rawasystem-font-sm);
	}

	/* Color swatches larger */
	.rawasystem-checkout-wrapper .rawasystem-color-swatch {
		width: 40px;
		height: 40px;
	}

	/* Upsell cards */
	.rawasystem-checkout-wrapper .rawasystem-upsell-card {
		padding: var(--rawasystem-space-3) var(--rawasystem-space-4);
	}

	/* Order summary */
	.rawasystem-checkout-wrapper .rawasystem-order-summary {
		padding: var(--rawasystem-space-4);
	}

	/* Trust badges */
	.rawasystem-checkout-wrapper .rawasystem-trust-badges {
		flex-wrap: wrap;
		gap: var(--rawasystem-space-3);
	}

	/* Step info bar */
	.rawasystem-checkout-wrapper .rawasystem-step-info {
		padding: var(--rawasystem-space-3) var(--rawasystem-space-5);
	}

	/* Form footer */
	.rawasystem-checkout-wrapper .rawasystem-form-footer {
		padding: var(--rawasystem-space-4) var(--rawasystem-space-5);
	}

	/* Step actions spacing */
	.rawasystem-checkout-wrapper .rawasystem-step-actions {
		margin-top: var(--rawasystem-space-5);
		padding-top: var(--rawasystem-space-4);
	}

	/* Dropdowns */
	.rawasystem-checkout-wrapper .rawasystem-select-arrow {
		width: 18px;
		height: 18px;
	}

	/* Floating label adjustments */
	.rawasystem-checkout-wrapper .rawasystem-floating-input,
	.rawasystem-checkout-wrapper .rawasystem-floating-textarea {
		padding-top: 24px;
		padding-bottom: 8px;
	}

	.rawasystem-checkout-wrapper .rawasystem-floating-label {
		font-size: var(--rawasystem-font-sm);
	}
}

/* ==========================================================================
   4. Small Mobile (<480px) — Even more compact, smaller indicators
   ========================================================================== */

@media (max-width: 480px) {
	.rawasystem-checkout-wrapper {
		margin-left: var(--rawasystem-space-3);
		margin-right: var(--rawasystem-space-3);
	}

	.rawasystem-checkout-wrapper .rawasystem-form-card {
		border-radius: var(--rawasystem-radius-sm);
		box-shadow: var(--rawasystem-shadow-sm);
	}

	.rawasystem-checkout-wrapper .rawasystem-form-header {
		padding: var(--rawasystem-space-4) var(--rawasystem-space-4) 0;
	}

	.rawasystem-checkout-wrapper .rawasystem-form-title {
		font-size: var(--rawasystem-font-md);
	}

	.rawasystem-checkout-wrapper .rawasystem-form-subtitle {
		font-size: var(--rawasystem-font-xs);
		margin-bottom: var(--rawasystem-space-3);
	}

	.rawasystem-checkout-wrapper .rawasystem-slider-step {
		padding: var(--rawasystem-space-4);
	}

	.rawasystem-checkout-wrapper .rawasystem-progress-bar {
		padding: var(--rawasystem-space-2) var(--rawasystem-space-4) var(--rawasystem-space-1);
	}

	/* Smaller step indicators */
	.rawasystem-checkout-wrapper .rawasystem-step-indicator-dot {
		width: 24px;
		height: 24px;
		font-size: 10px;
	}

	.rawasystem-checkout-wrapper .rawasystem-step-indicators {
		margin-top: -18px;
	}

	/* Hide step labels on small screens */
	.rawasystem-checkout-wrapper .rawasystem-step-label {
		display: none;
	}

	/* Compact inputs */
	.rawasystem-checkout-wrapper .rawasystem-input,
	.rawasystem-checkout-wrapper .rawasystem-floating-input,
	.rawasystem-checkout-wrapper .rawasystem-floating-textarea {
		height: 44px;
		min-height: 44px;
		font-size: var(--rawasystem-font-sm);
		padding: 0 12px;
	}

	.rawasystem-checkout-wrapper .rawasystem-floating-input,
	.rawasystem-checkout-wrapper .rawasystem-floating-textarea {
		padding-top: 20px;
		padding-bottom: 4px;
	}

	.rawasystem-checkout-wrapper .rawasystem-select {
		height: 44px;
		font-size: var(--rawasystem-font-sm);
		padding: 0 36px 0 12px;
	}

	/* Compact buttons */
	.rawasystem-checkout-wrapper .rawasystem-btn-primary {
		height: 46px;
		font-size: var(--rawasystem-font-sm);
	}

	.rawasystem-checkout-wrapper .rawasystem-btn-next {
		height: 44px;
		font-size: var(--rawasystem-font-sm);
	}

	.rawasystem-checkout-wrapper .rawasystem-btn-prev {
		height: 40px;
		font-size: var(--rawasystem-font-xs);
	}

	/* Stacked trust badges */
	.rawasystem-checkout-wrapper .rawasystem-trust-badges {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--rawasystem-space-2);
	}

	.rawasystem-checkout-wrapper .rawasystem-trust-badges-row {
		grid-template-columns: repeat(2, 1fr);
	}

	/* Coupon compact */
	.rawasystem-checkout-wrapper .rawasystem-coupon-input-wrapper {
		flex-direction: column;
	}

	.rawasystem-checkout-wrapper .rawasystem-coupon-input-wrapper .rawasystem-btn-apply {
		width: 100%;
	}

	/* Quantity controls compact */
	.rawasystem-checkout-wrapper .rawasystem-qty-btn {
		width: 36px;
		height: 36px;
	}

	.rawasystem-checkout-wrapper .rawasystem-qty-input {
		width: 44px;
		height: 36px;
	}

	/* Option buttons compact */
	.rawasystem-checkout-wrapper .rawasystem-option-btn {
		min-height: 38px;
		padding: 6px 14px;
		font-size: var(--rawasystem-font-xs);
	}

	/* Color swatches compact */
	.rawasystem-checkout-wrapper .rawasystem-color-swatch {
		width: 34px;
		height: 34px;
	}

	/* Review items compact */
	.rawasystem-checkout-wrapper .rawasystem-review-item {
		font-size: var(--rawasystem-font-xs);
	}

	/* Upsell cards compact */
	.rawasystem-checkout-wrapper .rawasystem-upsell-card {
		padding: var(--rawasystem-space-3);
	}

	/* Summary compact */
	.rawasystem-checkout-wrapper .rawasystem-order-summary {
		padding: var(--rawasystem-space-3);
	}

	.rawasystem-checkout-wrapper .rawasystem-summary-row {
		font-size: var(--rawasystem-font-xs);
	}

	.rawasystem-checkout-wrapper .rawasystem-summary-total {
		font-size: var(--rawasystem-font-sm);
	}

	.rawasystem-checkout-wrapper .rawasystem-summary-total-value {
		font-size: var(--rawasystem-font-md);
	}

	/* Urgency bar compact */
	.rawasystem-checkout-wrapper .rawasystem-urgency-bar {
		font-size: 10px;
		padding: var(--rawasystem-space-1) var(--rawasystem-space-3);
	}

	/* Section titles compact */
	.rawasystem-checkout-wrapper .rawasystem-section-title {
		font-size: var(--rawasystem-font-sm);
	}

	/* Step actions compact */
	.rawasystem-checkout-wrapper .rawasystem-step-actions {
		gap: var(--rawasystem-space-2);
		margin-top: var(--rawasystem-space-4);
	}

	/* Form footer compact */
	.rawasystem-checkout-wrapper .rawasystem-form-footer {
		padding: var(--rawasystem-space-3) var(--rawasystem-space-4);
	}

	/* Success message compact */
	.rawasystem-checkout-wrapper .rawasystem-success-icon {
		width: 56px;
		height: 56px;
	}

	.rawasystem-checkout-wrapper .rawasystem-success-icon svg {
		width: 28px;
		height: 28px;
	}

	.rawasystem-checkout-wrapper .rawasystem-success-title {
		font-size: var(--rawasystem-font-md);
	}

	.rawasystem-checkout-wrapper .rawasystem-success-message {
		padding: var(--rawasystem-space-5) var(--rawasystem-space-4);
	}
}

/* ==========================================================================
   5. Very Small Mobile (<360px) — Maximum compactness
   ========================================================================== */

@media (max-width: 360px) {
	.rawasystem-checkout-wrapper {
		margin-left: var(--rawasystem-space-1);
		margin-right: var(--rawasystem-space-1);
	}

	.rawasystem-checkout-wrapper .rawasystem-form-card {
		border-radius: 8px;
	}

	.rawasystem-checkout-wrapper .rawasystem-form-header {
		padding: var(--rawasystem-space-3) var(--rawasystem-space-3) 0;
	}

	.rawasystem-checkout-wrapper .rawasystem-slider-step {
		padding: var(--rawasystem-space-3);
	}

	.rawasystem-checkout-wrapper .rawasystem-input,
	.rawasystem-checkout-wrapper .rawasystem-floating-input,
	.rawasystem-checkout-wrapper .rawasystem-floating-textarea {
		height: 40px;
		min-height: 40px;
		font-size: var(--rawasystem-font-xs);
		padding: 0 10px;
	}

	.rawasystem-checkout-wrapper .rawasystem-floating-input,
	.rawasystem-checkout-wrapper .rawasystem-floating-textarea {
		padding-top: 18px;
		padding-bottom: 4px;
	}

	.rawasystem-checkout-wrapper .rawasystem-floating-label {
		font-size: var(--rawasystem-font-xs);
	}

	.rawasystem-checkout-wrapper .rawasystem-btn-primary {
		height: 42px;
		font-size: var(--rawasystem-font-xs);
	}

	.rawasystem-checkout-wrapper .rawasystem-btn-next {
		height: 38px;
		padding: 0 var(--rawasystem-space-4);
		font-size: var(--rawasystem-font-xs);
	}

	.rawasystem-checkout-wrapper .rawasystem-btn-prev {
		height: 36px;
		padding: 0 var(--rawasystem-space-2);
		font-size: 10px;
	}

	.rawasystem-checkout-wrapper .rawasystem-input-label {
		font-size: var(--rawasystem-font-xs);
	}

	.rawasystem-checkout-wrapper .rawasystem-qty-btn {
		width: 32px;
		height: 32px;
		font-size: var(--rawasystem-font-sm);
	}

	.rawasystem-checkout-wrapper .rawasystem-qty-input {
		width: 38px;
		height: 32px;
		font-size: var(--rawasystem-font-xs);
	}

	.rawasystem-checkout-wrapper .rawasystem-urgency-bar {
		font-size: 9px;
		padding: 2px var(--rawasystem-space-2);
	}

	.rawasystem-checkout-wrapper .rawasystem-option-btn {
		min-height: 34px;
		padding: 4px 10px;
		font-size: 10px;
	}

	.rawasystem-checkout-wrapper .rawasystem-color-swatch {
		width: 30px;
		height: 30px;
	}

	.rawasystem-checkout-wrapper .rawasystem-progress-bar {
		padding: var(--rawasystem-space-1) var(--rawasystem-space-3);
	}

	.rawasystem-checkout-wrapper .rawasystem-step-indicator-dot {
		width: 20px;
		height: 20px;
		font-size: 9px;
	}

	.rawasystem-checkout-wrapper .rawasystem-step-indicators {
		margin-top: -14px;
	}

	.rawasystem-checkout-wrapper .rawasystem-trust-badges-row {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--rawasystem-space-1);
		padding: var(--rawasystem-space-2);
	}

	.rawasystem-checkout-wrapper .rawasystem-summary-row {
		font-size: 10px;
	}

	.rawasystem-checkout-wrapper .rawasystem-summary-total {
		font-size: var(--rawasystem-font-xs);
	}

	.rawasystem-checkout-wrapper .rawasystem-review-item {
		font-size: 10px;
	}

	.rawasystem-checkout-wrapper .rawasystem-review-group-title {
		font-size: var(--rawasystem-font-xs);
	}

	.rawasystem-checkout-wrapper .rawasystem-form-title {
		font-size: var(--rawasystem-font-sm);
	}

	.rawasystem-checkout-wrapper .rawasystem-form-footer {
		padding: var(--rawasystem-space-2) var(--rawasystem-space-3);
	}
}

/* ==========================================================================
   6. RTL-Specific Responsive Adjustments
   ========================================================================== */

@media (max-width: 768px) {
	.rawasystem-checkout-wrapper[dir="rtl"] .rawasystem-select {
		padding: 0 12px 0 36px;
	}

	.rawasystem-checkout-wrapper[dir="rtl"] .rawasystem-floating-label {
		left: auto;
		right: 14px;
	}

	.rawasystem-checkout-wrapper[dir="rtl"] .rawasystem-step-actions {
		flex-direction: column-reverse;
	}

	.rawasystem-checkout-wrapper[dir="rtl"] .rawasystem-btn-prev,
	.rawasystem-checkout-wrapper[dir="rtl"] .rawasystem-btn-next {
		width: 100%;
	}

	.rawasystem-checkout-wrapper[dir="rtl"] .rawasystem-coupon-input-wrapper {
		flex-direction: column;
	}

	.rawasystem-checkout-wrapper[dir="rtl"] .rawasystem-coupon-input-wrapper .rawasystem-btn-apply {
		width: 100%;
	}
}

@media (max-width: 480px) {
	.rawasystem-checkout-wrapper[dir="rtl"] .rawasystem-select {
		padding: 0 12px 0 32px;
	}

	.rawasystem-checkout-wrapper[dir="rtl"] .rawasystem-floating-label {
		right: 12px;
	}
}

/* ==========================================================================
   7. Print Styles — Hide form, show order summary only
   ========================================================================== */

@media print {
	.rawasystem-checkout-wrapper {
		max-width: 100%;
		margin: 0;
		box-shadow: none;
	}

	.rawasystem-checkout-wrapper .rawasystem-form-card {
		box-shadow: none;
		border: 1px solid #ccc;
		border-radius: 0;
	}

	/* Hide interactive elements */
	.rawasystem-checkout-wrapper .rawasystem-progress-bar,
	.rawasystem-checkout-wrapper .rawasystem-step-actions,
	.rawasystem-checkout-wrapper .rawasystem-urgency-bar,
	.rawasystem-checkout-wrapper .rawasystem-trust-badges,
	.rawasystem-checkout-wrapper .rawasystem-trust-badges-row,
	.rawasystem-checkout-wrapper .rawasystem-coupon-toggle,
	.rawasystem-checkout-wrapper .rawasystem-coupon-input-wrapper,
	.rawasystem-checkout-wrapper .rawasystem-coupon-applied,
	.rawasystem-checkout-wrapper .rawasystem-btn-prev,
	.rawasystem-checkout-wrapper .rawasystem-btn-next,
	.rawasystem-checkout-wrapper .rawasystem-btn-primary,
	.rawasystem-checkout-wrapper .rawasystem-btn-secondary,
	.rawasystem-checkout-wrapper .rawasystem-btn-apply,
	.rawasystem-checkout-wrapper .rawasystem-spinner,
	.rawasystem-checkout-wrapper .rawasystem-loading-overlay,
	.rawasystem-checkout-wrapper .rawasystem-step-info,
	.rawasystem-checkout-wrapper .rawasystem-form-footer,
	.rawasystem-checkout-wrapper .rawasystem-scarcity-indicator,
	.rawasystem-checkout-wrapper .rawasystem-quantity-control,
	.rawasystem-checkout-wrapper .rawasystem-option-buttons,
	.rawasystem-checkout-wrapper .rawasystem-color-swatches,
	.rawasystem-checkout-wrapper .rawasystem-upsell-section,
	.rawasystem-checkout-wrapper .rawasystem-review-edit {
		display: none !important;
	}

	/* Hide all steps except the confirmation / review step */
	.rawasystem-checkout-wrapper .rawasystem-slider-step {
		display: none !important;
	}

	.rawasystem-checkout-wrapper .rawasystem-slider-step--confirmation,
	.rawasystem-checkout-wrapper .rawasystem-slider-step--review {
		display: block !important;
	}

	/* Show success message */
	.rawasystem-checkout-wrapper .rawasystem-success-message {
		display: block !important;
	}

	/* Show order summary */
	.rawasystem-checkout-wrapper .rawasystem-order-summary {
		display: block !important;
		background: transparent;
		border: none;
		padding: 0;
	}

	/* Show review groups */
	.rawasystem-checkout-wrapper .rawasystem-review-group {
		display: block !important;
	}

	/* Simplify visual styling for print */
	.rawasystem-checkout-wrapper .rawasystem-form-card {
		overflow: visible;
	}

	.rawasystem-checkout-wrapper .rawasystem-slider-container {
		overflow: visible;
		height: auto !important;
	}

	.rawasystem-checkout-wrapper .rawasystem-slider-track {
		transform: none !important;
		flex-direction: column;
	}

	/* Disable all animations */
	.rawasystem-checkout-wrapper *,
	.rawasystem-checkout-wrapper *::before,
	.rawasystem-checkout-wrapper *::after {
		animation: none !important;
		transition: none !important;
		box-shadow: none !important;
	}

	/* Ensure text is print-friendly */
	.rawasystem-checkout-wrapper {
		color: #000;
		font-size: 12pt;
	}

	.rawasystem-checkout-wrapper .rawasystem-form-title,
	.rawasystem-checkout-wrapper .rawasystem-section-title,
	.rawasystem-checkout-wrapper .rawasystem-success-title {
		color: #000;
	}

	.rawasystem-checkout-wrapper .rawasystem-summary-row,
	.rawasystem-checkout-wrapper .rawasystem-summary-total,
	.rawasystem-checkout-wrapper .rawasystem-review-item {
		color: #333;
	}

	/* Add print header */
	.rawasystem-checkout-wrapper .rawasystem-print-header {
		display: block !important;
		text-align: center;
		margin-bottom: 20px;
		padding-bottom: 10px;
		border-bottom: 2px solid #000;
	}

	.rawasystem-checkout-wrapper .rawasystem-print-header h1 {
		font-size: 18pt;
		margin-bottom: 4px;
		color: #000;
	}

	.rawasystem-checkout-wrapper .rawasystem-print-header p {
		font-size: 10pt;
		color: #666;
	}
}

/* ==========================================================================
   8. Dark Mode Support
   ========================================================================== */

@media (prefers-color-scheme: dark) {
	:root {
		--rawasystem-bg:            #1e1e2e;
		--rawasystem-surface:       #252538;
		--rawasystem-surface-hover: #2a2a3e;
		--rawasystem-form-bg:       #1e1e2e;
		--rawasystem-form-border:   #3a3a52;
		--rawasystem-border:        #3a3a52;
		--rawasystem-border-hover:  #4a4a62;
		--rawasystem-text:          #e2e8f0;
		--rawasystem-text-secondary: #94a3b8;
		--rawasystem-text-muted:    #64748b;
	}

	.rawasystem-checkout-wrapper {
		color: #e2e8f0;
	}

	.rawasystem-checkout-wrapper .rawasystem-form-card {
		background: #1e1e2e;
		box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
	}

	.rawasystem-checkout-wrapper .rawasystem-form-card:hover {
		box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
	}

	/* Typography */
	.rawasystem-checkout-wrapper .rawasystem-form-title,
	.rawasystem-checkout-wrapper .rawasystem-section-title {
		color: #f1f5f9;
	}

	/* Inputs */
	.rawasystem-checkout-wrapper .rawasystem-input,
	.rawasystem-checkout-wrapper .rawasystem-floating-input,
	.rawasystem-checkout-wrapper .rawasystem-floating-textarea,
	.rawasystem-checkout-wrapper .rawasystem-textarea,
	.rawasystem-checkout-wrapper .rawasystem-select {
		background: #2a2a3e;
		border-color: #3a3a52;
		color: #e2e8f0;
	}

	.rawasystem-checkout-wrapper .rawasystem-input::placeholder,
	.rawasystem-checkout-wrapper .rawasystem-floating-input::placeholder,
	.rawasystem-checkout-wrapper .rawasystem-floating-textarea::placeholder {
		color: #64748b;
	}

	.rawasystem-checkout-wrapper .rawasystem-input:focus,
	.rawasystem-checkout-wrapper .rawasystem-floating-input:focus,
	.rawasystem-checkout-wrapper .rawasystem-floating-textarea:focus {
		border-color: var(--rawasystem-primary);
		box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
	}

	.rawasystem-checkout-wrapper .rawasystem-input:hover:not(:focus),
	.rawasystem-checkout-wrapper .rawasystem-floating-input:hover:not(:focus),
	.rawasystem-checkout-wrapper .rawasystem-floating-textarea:hover:not(:focus) {
		border-color: #4a4a62;
	}

	/* Labels */
	.rawasystem-checkout-wrapper .rawasystem-input-label {
		color: #94a3b8;
	}

	.rawasystem-checkout-wrapper .rawasystem-floating-label {
		color: #64748b;
	}

	.rawasystem-checkout-wrapper .rawasystem-floating-input:focus ~ .rawasystem-floating-label,
	.rawasystem-checkout-wrapper .rawasystem-floating-input:not(:placeholder-shown) ~ .rawasystem-floating-label {
		color: var(--rawasystem-primary-light);
	}

	/* Select arrow */
	.rawasystem-checkout-wrapper .rawasystem-select-arrow {
		color: #94a3b8;
	}

	/* Option buttons */
	.rawasystem-checkout-wrapper .rawasystem-option-btn {
		background: #2a2a3e;
		border-color: #3a3a52;
		color: #94a3b8;
	}

	.rawasystem-checkout-wrapper .rawasystem-option-btn:hover {
		border-color: var(--rawasystem-primary-light);
		color: var(--rawasystem-primary-light);
		background: rgba(99, 102, 241, 0.1);
	}

	.rawasystem-checkout-wrapper .rawasystem-option-btn--active {
		background: rgba(99, 102, 241, 0.2);
		border-color: var(--rawasystem-primary);
		color: var(--rawasystem-primary-light);
		box-shadow: 0 2px 8px rgba(99, 102, 241, 0.25);
	}

	/* Color swatches */
	.rawasystem-checkout-wrapper .rawasystem-color-swatch {
		border-color: #4a4a62;
	}

	.rawasystem-checkout-wrapper .rawasystem-color-swatch--active {
		border-color: var(--rawasystem-primary);
		box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.3);
	}

	/* Quantity control */
	.rawasystem-checkout-wrapper .rawasystem-quantity-control {
		border-color: #3a3a52;
	}

	.rawasystem-checkout-wrapper .rawasystem-qty-btn {
		background: #2a2a3e;
		color: #94a3b8;
	}

	.rawasystem-checkout-wrapper .rawasystem-qty-btn:hover {
		background: rgba(99, 102, 241, 0.1);
		color: var(--rawasystem-primary-light);
	}

	.rawasystem-checkout-wrapper .rawasystem-qty-input {
		background: #2a2a3e;
		color: #e2e8f0;
		border-color: #3a3a52;
	}

	/* Upsell cards */
	.rawasystem-checkout-wrapper .rawasystem-upsell-card {
		background: #2a2a3e;
		border-color: #3a3a52;
	}

	.rawasystem-checkout-wrapper .rawasystem-upsell-card:hover {
		border-color: var(--rawasystem-primary-light);
	}

	.rawasystem-checkout-wrapper .rawasystem-upsell-card--active {
		background: rgba(99, 102, 241, 0.1);
		border-color: var(--rawasystem-primary);
	}

	.rawasystem-checkout-wrapper .rawasystem-upsell-name {
		color: #f1f5f9;
	}

	.rawasystem-checkout-wrapper .rawasystem-upsell-desc {
		color: #94a3b8;
	}

	/* Order summary */
	.rawasystem-checkout-wrapper .rawasystem-order-summary {
		background: #252538;
		border-color: #3a3a52;
	}

	.rawasystem-checkout-wrapper .rawasystem-summary-row {
		color: #94a3b8;
	}

	.rawasystem-checkout-wrapper .rawasystem-summary-total {
		color: #f1f5f9;
	}

	.rawasystem-checkout-wrapper .rawasystem-summary-divider {
		background: #3a3a52;
	}

	/* Secondary button */
	.rawasystem-checkout-wrapper .rawasystem-btn-secondary {
		color: #94a3b8;
		border-color: #3a3a52;
	}

	.rawasystem-checkout-wrapper .rawasystem-btn-secondary:hover {
		background: #2a2a3e;
		border-color: #4a4a62;
		color: #e2e8f0;
	}

	/* Prev button */
	.rawasystem-checkout-wrapper .rawasystem-btn-prev {
		color: #94a3b8;
		border-color: #3a3a52;
	}

	.rawasystem-checkout-wrapper .rawasystem-btn-prev:hover {
		background: #2a2a3e;
		border-color: #4a4a62;
		color: #e2e8f0;
	}

	/* Progress bar */
	.rawasystem-checkout-wrapper .rawasystem-progress-track {
		background: #3a3a52;
	}

	.rawasystem-checkout-wrapper .rawasystem-step-indicator-dot {
		background: #2a2a3e;
		border-color: #4a4a62;
		color: #64748b;
	}

	/* Review */
	.rawasystem-checkout-wrapper .rawasystem-review-group-title {
		color: #e2e8f0;
		border-color: #3a3a52;
	}

	.rawasystem-checkout-wrapper .rawasystem-review-item-label {
		color: #94a3b8;
	}

	.rawasystem-checkout-wrapper .rawasystem-review-item-value {
		color: #e2e8f0;
	}

	.rawasystem-checkout-wrapper .rawasystem-review-edit:hover {
		background: rgba(99, 102, 241, 0.1);
	}

	/* Success */
	.rawasystem-checkout-wrapper .rawasystem-success-icon {
		background: rgba(16, 185, 129, 0.15);
	}

	.rawasystem-checkout-wrapper .rawasystem-success-icon::before {
		border-color: rgba(16, 185, 129, 0.3);
	}

	.rawasystem-checkout-wrapper .rawasystem-success-title {
		color: #f1f5f9;
	}

	.rawasystem-checkout-wrapper .rawasystem-success-text {
		color: #94a3b8;
	}

	.rawasystem-checkout-wrapper .rawasystem-success-order-number {
		background: #252538;
		color: #e2e8f0;
	}

	/* Error */
	.rawasystem-checkout-wrapper .rawasystem-field-error {
		color: #f87171;
	}

	/* Trust badges */
	.rawasystem-checkout-wrapper .rawasystem-trust-badge {
		color: #94a3b8;
	}

	.rawasystem-checkout-wrapper .rawasystem-trust-badges-row {
		background: #252538;
	}

	.rawasystem-checkout-wrapper .rawasystem-trust-badges-row .rawasystem-trust-badge:hover {
		background: #2a2a3e;
	}

	/* Scarcity */
	.rawasystem-checkout-wrapper .rawasystem-scarcity-indicator {
		color: #f87171;
	}

	/* Coupon */
	.rawasystem-checkout-wrapper .rawasystem-coupon-input-wrapper .rawasystem-input {
		background: #2a2a3e;
		border-color: #3a3a52;
		color: #e2e8f0;
	}

	.rawasystem-checkout-wrapper .rawasystem-coupon-applied {
		background: rgba(16, 185, 129, 0.1);
		border-color: rgba(16, 185, 129, 0.3);
	}

	/* Loading overlay */
	.rawasystem-checkout-wrapper .rawasystem-is-loading::after {
		background: rgba(30, 30, 46, 0.6);
	}

	.rawasystem-checkout-wrapper .rawasystem-loading-overlay {
		background: rgba(30, 30, 46, 0.7);
	}

	/* Spinner dark variant */
	.rawasystem-checkout-wrapper .rawasystem-spinner--dark {
		border-color: rgba(255, 255, 255, 0.1);
		border-top-color: var(--rawasystem-primary-light);
	}

	/* Skeleton */
	.rawasystem-checkout-wrapper .rawasystem-skeleton {
		background: linear-gradient(
			90deg,
			#2a2a3e 25%,
			#32324a 37%,
			#2a2a3e 63%
		);
		background-size: 400% 100%;
	}

	/* Divider */
	.rawasystem-checkout-wrapper .rawasystem-divider {
		background: #3a3a52;
	}

	/* Step info */
	.rawasystem-checkout-wrapper .rawasystem-step-info {
		background: #252538;
		border-color: #3a3a52;
	}

	/* Form footer */
	.rawasystem-checkout-wrapper .rawasystem-form-footer {
		background: #1e1e2e;
		border-color: #3a3a52;
	}

	.rawasystem-checkout-wrapper .rawasystem-form-footer--sticky {
		box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.2);
	}

	/* Badge */
	.rawasystem-checkout-wrapper .rawasystem-badge--primary {
		background: rgba(99, 102, 241, 0.15);
		color: var(--rawasystem-primary-light);
	}

	.rawasystem-checkout-wrapper .rawasystem-badge--success {
		background: rgba(16, 185, 129, 0.15);
		color: var(--rawasystem-success-light);
	}

	.rawasystem-checkout-wrapper .rawasystem-badge--warning {
		background: rgba(245, 158, 11, 0.15);
		color: var(--rawasystem-warning-light);
	}

	.rawasystem-checkout-wrapper .rawasystem-badge--error {
		background: rgba(239, 68, 68, 0.15);
		color: var(--rawasystem-error-light);
	}

	/* Icon button */
	.rawasystem-checkout-wrapper .rawasystem-btn-icon {
		background: #2a2a3e;
		border-color: #3a3a52;
		color: #94a3b8;
	}

	.rawasystem-checkout-wrapper .rawasystem-btn-icon:hover {
		background: #32324a;
		border-color: #4a4a62;
		color: #e2e8f0;
	}

	/* Tooltip */
	.rawasystem-checkout-wrapper .rawasystem-tooltip::after {
		background: #475569;
	}
}