/**
 * BoxCart Admin Styles
 *
 * @package BoxCart
 */

/* ==========================================================================
   CSS Custom Properties
   ========================================================================== */

:root {
	/* Primary */
	--boxcart-primary: #2D7D5F;
	--boxcart-primary-hover: #246850;
	--boxcart-primary-light: #E8F5F0;
	--boxcart-primary-dark: #1B4D3A;

	/* Secondary */
	--boxcart-secondary: #8B7355;
	--boxcart-secondary-hover: #745F47;
	--boxcart-secondary-light: #F5F1ED;

	/* Status */
	--boxcart-success: #3D8B6E;
	--boxcart-success-light: #E8F5F0;
	--boxcart-warning: #C4922E;
	--boxcart-warning-light: #FEF8E8;
	--boxcart-error: #C44B4B;
	--boxcart-error-hover: #a83e3e;
	--boxcart-error-light: #FDEDED;
	--boxcart-info: #4B7CC4;
	--boxcart-info-light: #EDF3FD;

	/* Greys */
	--boxcart-grey-900: #1E1E1E;
	--boxcart-grey-800: #2C3338;
	--boxcart-grey-700: #3C434A;
	--boxcart-grey-600: #50575E;
	--boxcart-grey-500: #787C82;
	--boxcart-grey-400: #8C8F94;
	--boxcart-grey-300: #C3C4C7;
	--boxcart-grey-200: #DCDCDE;
	--boxcart-grey-100: #F0F0F1;
	--boxcart-grey-50: #F6F7F7;
	--boxcart-white: #FFFFFF;

	/* Spacing */
	--boxcart-space-1: 4px;
	--boxcart-space-2: 8px;
	--boxcart-space-3: 12px;
	--boxcart-space-4: 16px;
	--boxcart-space-5: 20px;
	--boxcart-space-6: 24px;
	--boxcart-space-8: 32px;
	--boxcart-space-10: 40px;

	/* Typography - Sizes */
	--boxcart-text-xs: 11px;
	--boxcart-text-sm: 12px;
	--boxcart-text-base: 13px;
	--boxcart-text-md: 14px;
	--boxcart-text-lg: 16px;
	--boxcart-text-xl: 18px;
	--boxcart-text-2xl: 20px;
	--boxcart-text-3xl: 24px;
	--boxcart-text-4xl: 32px;

	/* Typography - Weights */
	--boxcart-font-normal: 400;
	--boxcart-font-medium: 500;
	--boxcart-font-semibold: 600;
	--boxcart-font-bold: 700;

	/* Border Radius */
	--boxcart-radius-sm: 3px;
	--boxcart-radius-md: 4px;
	--boxcart-radius-lg: 6px;
	--boxcart-radius-xl: 8px;
	--boxcart-radius-full: 9999px;

	/* Shadows */
	--boxcart-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
	--boxcart-shadow-md: 0 2px 4px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.1);
	--boxcart-shadow-lg: 0 4px 8px rgba(0, 0, 0, 0.05), 0 2px 4px rgba(0, 0, 0, 0.1);
	--boxcart-shadow-xl: 0 8px 16px rgba(0, 0, 0, 0.08), 0 4px 8px rgba(0, 0, 0, 0.1);

	/* Transitions */
	--boxcart-transition-fast: 0.15s ease;
	--boxcart-transition-normal: 0.25s ease;

	/* Z-Index */
	--boxcart-z-dropdown: 1000;
	--boxcart-z-modal-backdrop: 1040;
	--boxcart-z-modal: 1050;
}

/* ==========================================================================
   Admin Page Container
   ========================================================================== */

.boxcart-admin-page,
.boxcart-admin {
	padding: var(--boxcart-space-5);
	padding-left: 0;
	margin: 0;
}

/* Override WordPress default .wrap margins/padding */
.wrap.boxcart-admin-page {
	margin: 0;
	padding: var(--boxcart-space-5);
	padding-left: 0;
}

/* ==========================================================================
   Global Input Focus Styles (Override WordPress Blue)
   ========================================================================== */

/* Override WordPress default blue focus for all BoxCart admin inputs */
.boxcart-admin-page input[type="text"]:focus,
.boxcart-admin-page input[type="search"]:focus,
.boxcart-admin-page input[type="email"]:focus,
.boxcart-admin-page input[type="number"]:focus,
.boxcart-admin-page input[type="password"]:focus,
.boxcart-admin-page input[type="date"]:focus,
.boxcart-admin-page input[type="time"]:focus,
.boxcart-admin-page input[type="url"]:focus,
.boxcart-admin-page input[type="tel"]:focus,
.boxcart-admin-page textarea:focus,
.boxcart-admin-page select:focus,
.boxcart-admin input[type="text"]:focus,
.boxcart-admin input[type="search"]:focus,
.boxcart-admin input[type="email"]:focus,
.boxcart-admin input[type="number"]:focus,
.boxcart-admin input[type="password"]:focus,
.boxcart-admin input[type="date"]:focus,
.boxcart-admin input[type="time"]:focus,
.boxcart-admin input[type="url"]:focus,
.boxcart-admin input[type="tel"]:focus,
.boxcart-admin textarea:focus,
.boxcart-admin select:focus {
	border-color: var(--boxcart-primary);
	box-shadow: 0 0 0 1px var(--boxcart-primary);
	outline: none;
}

/* ==========================================================================
   Page Header
   ========================================================================== */

.boxcart-page-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: var(--boxcart-space-6);
}

.boxcart-page-header--stacked {
	flex-direction: column;
	align-items: flex-start;
	gap: var(--boxcart-space-2);
}

/* All h1 page titles - ensure consistent line-height across all admin pages */
.boxcart-admin h1,
.boxcart-page-title,
.boxcart-page-header__title {
	font-size: var(--boxcart-text-3xl);
	font-weight: var(--boxcart-font-semibold);
	color: var(--boxcart-grey-900);
	margin: 0;
	padding: 0;
	line-height: 1.3;
}

/* Base line-height for admin pages */
.boxcart-admin {
	line-height: 1.5;
}

.boxcart-back-link {
	display: inline-flex;
	align-items: center;
	color: var(--boxcart-grey-600);
	text-decoration: none;
	font-size: var(--boxcart-text-base);
	transition: color var(--boxcart-transition-fast);
}

.boxcart-back-link:hover {
	color: var(--boxcart-primary);
}

/* ==========================================================================
   Buttons
   ========================================================================== */

.boxcart-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--boxcart-space-2);
	padding: var(--boxcart-space-2) var(--boxcart-space-4);
	border-radius: var(--boxcart-radius-md);
	font-size: var(--boxcart-text-base);
	font-weight: 500;
	line-height: 1.5;
	cursor: pointer;
	text-decoration: none;
	border: none;
	transition: background-color var(--boxcart-transition-fast), border-color var(--boxcart-transition-fast), color var(--boxcart-transition-fast);
}

.boxcart-btn:focus {
	outline: 2px solid var(--boxcart-primary);
	outline-offset: 2px;
}

.boxcart-btn--primary {
	background-color: var(--boxcart-primary);
	color: var(--boxcart-white);
}

.boxcart-btn--primary:hover,
.boxcart-btn--primary:focus {
	background-color: var(--boxcart-primary-hover);
	color: var(--boxcart-white);
}

.boxcart-btn--secondary {
	background-color: var(--boxcart-white);
	color: var(--boxcart-grey-700);
	border: 1px solid var(--boxcart-grey-300);
}

.boxcart-btn--secondary:hover,
.boxcart-btn--secondary:focus {
	background-color: var(--boxcart-grey-50);
	border-color: var(--boxcart-grey-400);
	color: var(--boxcart-grey-700);
}

.boxcart-btn--text {
	background: transparent;
	color: var(--boxcart-primary);
	padding: var(--boxcart-space-1) var(--boxcart-space-2);
}

.boxcart-btn--text:hover {
	color: var(--boxcart-primary-hover);
	background: var(--boxcart-primary-light);
}

.boxcart-btn--danger {
	background-color: var(--boxcart-error);
	color: var(--boxcart-white);
}

.boxcart-btn--danger:hover {
	background-color: var(--boxcart-error-hover);
	color: var(--boxcart-white);
}

.boxcart-btn--danger-text {
	background: transparent;
	color: var(--boxcart-error);
	padding: var(--boxcart-space-1) var(--boxcart-space-2);
}

.boxcart-btn--danger-text:hover {
	color: var(--boxcart-error-hover);
	background: var(--boxcart-error-light);
}

.boxcart-btn--small {
	padding: 6px 12px;
	font-size: var(--boxcart-text-sm);
}

.boxcart-btn--large {
	padding: 12px 24px;
	font-size: var(--boxcart-text-md);
}

.boxcart-btn:disabled {
	opacity: 0.5;
	pointer-events: none;
}

.boxcart-btn--disabled {
	opacity: 0.5;
	cursor: not-allowed;
	position: relative;
}

.boxcart-btn--disabled[title]:hover::after {
	content: attr(title);
	position: absolute;
	bottom: 100%;
	left: 50%;
	transform: translateX(-50%);
	padding: var(--boxcart-space-1) var(--boxcart-space-2);
	background: var(--boxcart-grey-900);
	color: var(--boxcart-white);
	font-size: var(--boxcart-text-xs);
	font-weight: normal;
	white-space: nowrap;
	border-radius: var(--boxcart-radius-sm);
	margin-bottom: 4px;
	z-index: 10;
	pointer-events: none;
}

.boxcart-btn .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

/* ==========================================================================
   Notices / Alerts
   ========================================================================== */

.boxcart-notice {
	padding: var(--boxcart-space-4);
	border-radius: var(--boxcart-radius-md);
	border-left: 4px solid;
	display: flex;
	align-items: flex-start;
	gap: var(--boxcart-space-3);
	margin-bottom: var(--boxcart-space-4);
}

.boxcart-notice .dashicons {
	flex-shrink: 0;
	margin-top: 2px;
}

.boxcart-notice--success {
	background: var(--boxcart-success-light);
	border-left-color: var(--boxcart-success);
	color: var(--boxcart-success);
}

.boxcart-notice--warning {
	background: var(--boxcart-warning-light);
	border-left-color: var(--boxcart-warning);
	color: var(--boxcart-warning);
}

.boxcart-notice--error {
	background: var(--boxcart-error-light);
	border-left-color: var(--boxcart-error);
	color: var(--boxcart-error);
}

.boxcart-notice--info {
	background: var(--boxcart-info-light);
	border-left-color: var(--boxcart-info);
	color: var(--boxcart-info);
}

/* ==========================================================================
   Badges
   ========================================================================== */

.boxcart-badge {
	display: inline-flex;
	align-items: center;
	padding: 2px 10px;
	font-size: var(--boxcart-text-xs);
	font-weight: 500;
	border-radius: var(--boxcart-radius-full);
	text-transform: uppercase;
	letter-spacing: 0.025em;
	white-space: nowrap;
}

.boxcart-badge--success {
	background: var(--boxcart-success-light);
	color: var(--boxcart-success);
}

.boxcart-badge--warning {
	background: var(--boxcart-warning-light);
	color: var(--boxcart-warning);
}

.boxcart-badge--error {
	background: var(--boxcart-error-light);
	color: var(--boxcart-error);
}

.boxcart-badge--info {
	background: var(--boxcart-info-light);
	color: var(--boxcart-info);
}

.boxcart-badge--neutral {
	background: var(--boxcart-grey-100);
	color: var(--boxcart-grey-600);
}

.boxcart-badge--coming-soon {
	background: var(--boxcart-grey-100);
	color: var(--boxcart-grey-500);
	margin-left: 8px;
	font-size: 10px;
}

/* ==========================================================================
   Cards
   ========================================================================== */

.boxcart-card {
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	box-shadow: var(--boxcart-shadow-sm);
	padding: var(--boxcart-space-5);
	margin-bottom: var(--boxcart-space-5);
}

.boxcart-card:last-child {
	margin-bottom: 0;
}

.boxcart-card__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: var(--boxcart-space-4);
	padding-bottom: var(--boxcart-space-4);
	border-bottom: 1px solid var(--boxcart-grey-100);
}

.boxcart-card__title {
	font-size: var(--boxcart-text-lg);
	font-weight: 500;
	color: var(--boxcart-grey-800);
	margin: 0;
}

.boxcart-card__header--no-border {
	border-bottom: none;
	padding-bottom: 0;
	margin-bottom: var(--boxcart-space-3);
}

/* ==========================================================================
   Tables
   ========================================================================== */

.boxcart-table-wrapper {
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	box-shadow: var(--boxcart-shadow-sm);
	overflow: hidden;
}

.boxcart-card--table {
	overflow: visible;
}

.boxcart-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
}

.boxcart-table th {
	text-align: left;
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	font-size: var(--boxcart-text-sm);
	font-weight: 600;
	color: var(--boxcart-grey-600);
	background: var(--boxcart-grey-50);
	border-bottom: 1px solid var(--boxcart-grey-200);
	text-transform: uppercase;
	letter-spacing: 0.025em;
	white-space: nowrap;
}

/* Round top corners of first header row */
.boxcart-table thead tr:first-child th:first-child {
	border-top-left-radius: var(--boxcart-radius-lg);
}

.boxcart-table thead tr:first-child th:last-child {
	border-top-right-radius: var(--boxcart-radius-lg);
}

.boxcart-table td {
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-800);
	border-bottom: 1px solid var(--boxcart-grey-100);
	vertical-align: middle;
}

.boxcart-table tr:hover td {
	background: var(--boxcart-grey-50);
}

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

/* Round bottom corners of last row */
.boxcart-table tbody tr:last-child td:first-child {
	border-bottom-left-radius: var(--boxcart-radius-lg);
}

.boxcart-table tbody tr:last-child td:last-child {
	border-bottom-right-radius: var(--boxcart-radius-lg);
}

.boxcart-table th.boxcart-col-checkbox,
.boxcart-table td.boxcart-col-checkbox {
	width: 40px;
	padding-left: var(--boxcart-space-4);
	padding-right: var(--boxcart-space-2);
}

.boxcart-table th.boxcart-col-image,
.boxcart-table td.boxcart-col-image {
	width: 60px;
	padding-right: var(--boxcart-space-2);
}

.boxcart-table th.boxcart-col-actions,
.boxcart-table td.boxcart-col-actions {
	width: 80px;
	text-align: right;
	padding-right: var(--boxcart-space-4);
}

/* Product table specific */
.boxcart-product-image {
	width: 48px;
	height: 48px;
	border-radius: var(--boxcart-radius-md);
	object-fit: cover;
	background: var(--boxcart-grey-100);
}

.boxcart-product-image-placeholder {
	width: 48px;
	height: 48px;
	border-radius: var(--boxcart-radius-md);
	background: var(--boxcart-grey-100);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--boxcart-grey-400);
}

.boxcart-product-image-placeholder .dashicons {
	font-size: 24px;
	width: 24px;
	height: 24px;
}

.boxcart-product-name {
	display: block;
	font-weight: 500;
	color: var(--boxcart-grey-900);
	text-decoration: none;
	margin-bottom: var(--boxcart-space-1);
}

.boxcart-product-name a {
	color: inherit;
	text-decoration: none;
}

.boxcart-product-name:hover,
.boxcart-product-name a:hover {
	color: var(--boxcart-primary);
}

.boxcart-product-sku {
	display: block;
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-500);
	margin-bottom: var(--boxcart-space-1);
}

/* ==========================================================================
   Filters Bar
   ========================================================================== */

.boxcart-filters {
	display: flex;
	flex-wrap: wrap;
	gap: var(--boxcart-space-3);
	margin-bottom: var(--boxcart-space-4);
	padding: var(--boxcart-space-4);
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	box-shadow: var(--boxcart-shadow-sm);
}

.boxcart-filters__left {
	display: flex;
	flex-wrap: wrap;
	gap: var(--boxcart-space-3);
	flex: 1;
}

.boxcart-filters__right {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
}

.boxcart-filter-select {
	appearance: none;
	padding: var(--boxcart-space-2) var(--boxcart-space-8) var(--boxcart-space-2) var(--boxcart-space-3);
	border: 1px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-800);
	background-color: var(--boxcart-white);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2350575E' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	cursor: pointer;
	min-width: 150px;
	transition: border-color var(--boxcart-transition-fast);
}

.boxcart-filter-select:hover,
.boxcart-filter-select:focus {
	border-color: var(--boxcart-grey-400);
	outline: none;
}

.boxcart-filter-select:focus {
	border-color: var(--boxcart-primary);
	box-shadow: 0 0 0 2px var(--boxcart-primary-light);
}

.boxcart-search-input {
	padding: var(--boxcart-space-2) var(--boxcart-space-3);
	border: 1px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-800);
	background-color: var(--boxcart-white);
	min-width: 200px;
	transition: border-color var(--boxcart-transition-fast);
}

.boxcart-search-input:hover,
.boxcart-search-input:focus {
	border-color: var(--boxcart-grey-400);
	outline: none;
}

.boxcart-search-input:focus {
	border-color: var(--boxcart-primary);
	box-shadow: 0 0 0 2px var(--boxcart-primary-light);
}

.boxcart-search-input::placeholder {
	color: var(--boxcart-grey-400);
}

/* ==========================================================================
   Empty State
   ========================================================================== */

.boxcart-empty-state {
	text-align: center;
	padding: var(--boxcart-space-10) var(--boxcart-space-6);
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	box-shadow: var(--boxcart-shadow-sm);
}

.boxcart-empty-state__icon {
	color: var(--boxcart-grey-300);
	margin-bottom: var(--boxcart-space-4);
}

.boxcart-empty-state__icon .dashicons {
	font-size: 48px;
	width: 48px;
	height: 48px;
}

.boxcart-empty-state__title {
	font-size: var(--boxcart-text-xl);
	font-weight: 600;
	color: var(--boxcart-grey-800);
	margin: 0 0 var(--boxcart-space-2) 0;
}

.boxcart-empty-state__description {
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-500);
	margin: 0 0 var(--boxcart-space-6) 0;
}

/* Compact empty state for inline use */
.boxcart-empty-state--compact,
#boxcart-quantity-types-empty {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	padding: var(--boxcart-space-4);
	background: var(--boxcart-info-light);
	border: 1px solid var(--boxcart-info);
	border-radius: var(--boxcart-radius-md);
	margin-bottom: var(--boxcart-space-4);
}

#boxcart-quantity-types-empty .dashicons {
	color: var(--boxcart-info);
	flex-shrink: 0;
}

#boxcart-quantity-types-empty p {
	margin: 0;
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-info);
}

/* Required indicator */
.boxcart-required-indicator {
	color: var(--boxcart-error);
	font-weight: var(--boxcart-font-normal);
}

/* ==========================================================================
   Pagination
   ========================================================================== */

.boxcart-pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(--boxcart-space-1);
	margin-top: var(--boxcart-space-5);
}

.boxcart-pagination__link,
.boxcart-pagination__current,
.boxcart-pagination__ellipsis {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 36px;
	height: 36px;
	padding: 0 var(--boxcart-space-3);
	font-size: var(--boxcart-text-base);
	text-decoration: none;
	border-radius: var(--boxcart-radius-md);
	transition: background-color var(--boxcart-transition-fast), color var(--boxcart-transition-fast);
}

.boxcart-pagination__link {
	color: var(--boxcart-grey-700);
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
}

.boxcart-pagination__link:hover {
	background: var(--boxcart-grey-50);
	border-color: var(--boxcart-grey-300);
	color: var(--boxcart-grey-800);
}

.boxcart-pagination__current {
	background: var(--boxcart-primary);
	color: var(--boxcart-white);
	font-weight: 500;
}

.boxcart-pagination__ellipsis {
	color: var(--boxcart-grey-400);
}

/* ==========================================================================
   Actions Dropdown
   ========================================================================== */

.boxcart-actions-dropdown {
	position: relative;
	display: inline-block;
}

.boxcart-actions-dropdown__toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background: transparent;
	border: 1px solid transparent;
	border-radius: var(--boxcart-radius-md);
	color: var(--boxcart-grey-500);
	cursor: pointer;
	transition: background-color var(--boxcart-transition-fast), border-color var(--boxcart-transition-fast), color var(--boxcart-transition-fast);
}

.boxcart-actions-dropdown__toggle:hover {
	background: var(--boxcart-grey-100);
	color: var(--boxcart-grey-700);
}

.boxcart-actions-dropdown__toggle[aria-expanded="true"] {
	background: var(--boxcart-grey-100);
	border-color: var(--boxcart-grey-300);
	color: var(--boxcart-grey-700);
}

.boxcart-actions-dropdown__menu {
	display: none;
	position: absolute;
	right: 0;
	top: 100%;
	margin-top: var(--boxcart-space-1);
	min-width: 160px;
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	box-shadow: var(--boxcart-shadow-lg);
	z-index: var(--boxcart-z-dropdown);
	padding: var(--boxcart-space-1) 0;
}

.boxcart-actions-dropdown__menu.is-open {
	display: block;
}

.boxcart-actions-dropdown__item {
	display: block;
	width: 100%;
	padding: var(--boxcart-space-2) var(--boxcart-space-4);
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-700);
	text-align: left;
	text-decoration: none;
	background: transparent;
	border: none;
	cursor: pointer;
	transition: background-color var(--boxcart-transition-fast);
}

.boxcart-actions-dropdown__item:hover {
	background: var(--boxcart-grey-50);
	color: var(--boxcart-grey-800);
}

.boxcart-actions-dropdown__item--danger {
	color: var(--boxcart-error);
}

.boxcart-actions-dropdown__item--danger:hover {
	background: var(--boxcart-error-light);
	color: var(--boxcart-error);
}

.boxcart-actions-dropdown__divider {
	height: 1px;
	background: var(--boxcart-grey-100);
	margin: var(--boxcart-space-1) 0;
}

/* ==========================================================================
   Two Column Layout
   ========================================================================== */

.boxcart-two-column {
	display: grid;
	grid-template-columns: 1fr 300px;
	gap: var(--boxcart-space-6);
}

.boxcart-column--main {
	min-width: 0;
}

.boxcart-column--sidebar {
	min-width: 0;
}

/* ==========================================================================
   Forms
   ========================================================================== */

.boxcart-form {
	width: 100%;
}

.boxcart-form-group {
	margin-bottom: var(--boxcart-space-4);
}

.boxcart-form-group:last-child {
	margin-bottom: 0;
}

.boxcart-label {
	display: block;
	font-size: var(--boxcart-text-sm);
	font-weight: 500;
	color: var(--boxcart-grey-700);
	margin-bottom: var(--boxcart-space-1);
}

.boxcart-label--required::after {
	content: " *";
	color: var(--boxcart-error);
}

.boxcart-label--section {
	font-size: var(--boxcart-text-md);
	font-weight: 600;
	color: var(--boxcart-grey-800);
	margin-top: var(--boxcart-space-6);
	margin-bottom: var(--boxcart-space-2);
	padding-top: var(--boxcart-space-5);
	border-top: 1px solid var(--boxcart-grey-200);
}

.boxcart-label--section:first-child,
.boxcart-card__header + .boxcart-label--section {
	margin-top: 0;
	padding-top: 0;
	border-top: none;
}

.boxcart-card__header + .boxcart-help-text + .boxcart-label--section {
	margin-top: var(--boxcart-space-4);
	padding-top: 0;
	border-top: none;
}

.boxcart-input,
.boxcart-textarea,
.boxcart-select {
	width: 100%;
	padding: var(--boxcart-space-2) var(--boxcart-space-3);
	border: 1px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	font-size: var(--boxcart-text-base);
	line-height: 1.5;
	color: var(--boxcart-grey-800);
	background-color: var(--boxcart-white);
	transition: border-color var(--boxcart-transition-fast), box-shadow var(--boxcart-transition-fast);
}

.boxcart-input:hover,
.boxcart-textarea:hover,
.boxcart-select:hover {
	border-color: var(--boxcart-grey-400);
}

.boxcart-input:focus,
.boxcart-textarea:focus,
.boxcart-select:focus {
	outline: none;
	border-color: var(--boxcart-primary);
	box-shadow: 0 0 0 2px var(--boxcart-primary-light);
}

.boxcart-input::placeholder,
.boxcart-textarea::placeholder {
	color: var(--boxcart-grey-400);
}

.boxcart-input:disabled,
.boxcart-textarea:disabled,
.boxcart-select:disabled {
	background-color: var(--boxcart-grey-100);
	color: var(--boxcart-grey-500);
	cursor: not-allowed;
}

.boxcart-input--short {
	max-width: 200px;
}

/* Consistent max-width for inputs and selects in settings panels */
.boxcart-settings-panel .boxcart-input,
.boxcart-settings-panel .boxcart-select {
	max-width: 400px;
}

.boxcart-settings-panel .boxcart-input--short {
	max-width: 200px;
}

.boxcart-settings-panel .boxcart-colour-hex {
	max-width: 100px;
}

/* Input with suffix (e.g. "12 px") */
.boxcart-input-with-suffix {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
	max-width: 200px;
}

.boxcart-input-with-suffix .boxcart-input {
	max-width: none;
}

.boxcart-input-suffix {
	color: var(--boxcart-grey-500);
	font-size: var(--boxcart-text-sm);
	white-space: nowrap;
}

/* Colour picker with hex input */
.boxcart-colour-picker {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
}

.boxcart-colour-input {
	width: 48px;
	height: 38px;
	padding: 2px;
	border: 1px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	cursor: pointer;
	flex-shrink: 0;
}

.boxcart-colour-input::-webkit-color-swatch-wrapper {
	padding: 0;
}

.boxcart-colour-input::-webkit-color-swatch {
	border: none;
	border-radius: calc(var(--boxcart-radius-md) - 2px);
}

.boxcart-colour-input::-moz-color-swatch {
	border: none;
	border-radius: calc(var(--boxcart-radius-md) - 2px);
}

.boxcart-colour-picker .boxcart-colour-hex {
	width: 100px;
	font-family: var(--boxcart-font-mono, monospace);
	text-transform: uppercase;
}

.boxcart-textarea {
	resize: vertical;
	min-height: 100px;
}

.boxcart-select {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2350575E' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	padding-right: var(--boxcart-space-8);
	cursor: pointer;
}

.boxcart-help-text {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-500);
	margin-top: var(--boxcart-space-1);
	margin-bottom: 0;
}

.boxcart-error-message {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-error);
	margin-top: var(--boxcart-space-1);
}

/* Input group (prefix/suffix) */
.boxcart-input-group {
	display: flex;
	align-items: stretch;
}

.boxcart-input-group__prefix,
.boxcart-input-group__suffix {
	display: flex;
	align-items: center;
	padding: 0 var(--boxcart-space-3);
	background: var(--boxcart-grey-100);
	border: 1px solid var(--boxcart-grey-300);
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-600);
}

.boxcart-input-group__prefix {
	border-right: none;
	border-radius: var(--boxcart-radius-md) 0 0 var(--boxcart-radius-md);
}

.boxcart-input-group__suffix {
	border-left: none;
	border-radius: 0 var(--boxcart-radius-md) var(--boxcart-radius-md) 0;
}

.boxcart-input-group .boxcart-input {
	flex: 1;
}

.boxcart-input-group .boxcart-input:first-child {
	border-radius: var(--boxcart-radius-md) 0 0 var(--boxcart-radius-md);
}

.boxcart-input-group .boxcart-input:last-child {
	border-radius: 0 var(--boxcart-radius-md) var(--boxcart-radius-md) 0;
}

.boxcart-input-group__prefix + .boxcart-input {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

/* Radio buttons - Custom branded styling */
.boxcart-radio-group {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-3);
}

.boxcart-radio {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	cursor: pointer;
	position: relative;
}

.boxcart-radio input[type="radio"] {
	/* Hide native radio */
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.boxcart-radio input[type="radio"] + .boxcart-radio__label::before {
	content: '';
	display: inline-flex;
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	margin-right: var(--boxcart-space-2);
	border: 2px solid var(--boxcart-grey-300);
	border-radius: 50%;
	background: var(--boxcart-white);
	transition: border-color var(--boxcart-transition-fast), background-color var(--boxcart-transition-fast), box-shadow var(--boxcart-transition-fast);
	vertical-align: middle;
}

.boxcart-radio input[type="radio"]:hover + .boxcart-radio__label::before {
	border-color: var(--boxcart-primary);
}

.boxcart-radio input[type="radio"]:focus + .boxcart-radio__label::before {
	border-color: var(--boxcart-primary);
	box-shadow: 0 0 0 3px var(--boxcart-primary-light);
}

.boxcart-radio input[type="radio"]:checked + .boxcart-radio__label::before {
	border-color: var(--boxcart-primary);
	background: var(--boxcart-primary);
	box-shadow: inset 0 0 0 3px var(--boxcart-white);
}

.boxcart-radio__label {
	display: flex;
	align-items: center;
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-800);
	line-height: 1.4;
	cursor: pointer;
}

.boxcart-radio--disabled {
	opacity: 0.55;
	pointer-events: none;
}

.boxcart-radio--disabled .boxcart-radio__label {
	cursor: default;
}

/* Checkboxes - Custom branded styling */
.boxcart-checkbox-list {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-3);
	max-height: 200px;
	overflow-y: auto;
	padding: var(--boxcart-space-1) var(--boxcart-space-2) var(--boxcart-space-1) var(--boxcart-space-1);
}

.boxcart-checkbox-item {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	cursor: pointer;
	position: relative;
}

.boxcart-checkbox-item input[type="checkbox"] {
	/* Hide native checkbox */
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.boxcart-checkbox-item input[type="checkbox"] + span::before {
	content: '';
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	margin-right: var(--boxcart-space-2);
	border: 2px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	background: var(--boxcart-white);
	transition: border-color var(--boxcart-transition-fast), background-color var(--boxcart-transition-fast), box-shadow var(--boxcart-transition-fast);
	vertical-align: middle;
}

.boxcart-checkbox-item:hover input[type="checkbox"] + span::before {
	border-color: var(--boxcart-primary);
}

.boxcart-checkbox-item input[type="checkbox"]:focus + span::before {
	border-color: var(--boxcart-primary);
	box-shadow: 0 0 0 3px var(--boxcart-primary-light);
}

.boxcart-checkbox-item input[type="checkbox"]:checked + span::before {
	border-color: var(--boxcart-primary);
	background: var(--boxcart-primary);
}

.boxcart-checkbox-item input[type="checkbox"]:checked + span::after {
	content: '';
	position: absolute;
	left: 7px;
	top: 50%;
	width: 4px;
	height: 8px;
	border: solid var(--boxcart-white);
	border-width: 0 2px 2px 0;
	transform: translateY(-60%) rotate(45deg);
}

.boxcart-checkbox-item span {
	display: flex;
	align-items: center;
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-800);
	line-height: 1.4;
	cursor: pointer;
}

/* Disabled/Locked Checkbox State */
.boxcart-checkbox-item input[type="checkbox"]:disabled + span::before {
	background: var(--boxcart-grey-100);
	border-color: var(--boxcart-grey-300);
	cursor: not-allowed;
}

.boxcart-checkbox-item input[type="checkbox"]:disabled:checked + span::before {
	background: var(--boxcart-grey-400);
	border-color: var(--boxcart-grey-400);
}

.boxcart-checkbox-item input[type="checkbox"]:disabled + span {
	color: var(--boxcart-grey-500);
	cursor: not-allowed;
}

.boxcart-checkbox-item--locked {
	opacity: 0.8;
}

/* Divider */
.boxcart-divider {
	border: none;
	border-top: 1px solid var(--boxcart-grey-200);
	margin: var(--boxcart-space-5) 0;
}

/* Status List */
.boxcart-status-list {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-3);
}

.boxcart-status-item {
	padding: var(--boxcart-space-2) 0;
}

.boxcart-status-item .boxcart-help-text {
	margin-left: 32px;
	margin-top: var(--boxcart-space-1);
}

/* Standalone Checkbox (for tables and other contexts without labels) */
/* Must match the Settings checkbox-item ::before dimensions exactly:
   16px content + 2px border each side = 20px total rendered size */
.boxcart-checkbox,
input[type="checkbox"].boxcart-checkbox {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	box-sizing: content-box;
	width: 16px;
	height: 16px;
	border: 2px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	background: var(--boxcart-white);
	cursor: pointer;
	transition: border-color var(--boxcart-transition-fast), background-color var(--boxcart-transition-fast), box-shadow var(--boxcart-transition-fast);
	position: relative;
	vertical-align: middle;
	margin: 0;
	padding: 0;
}

.boxcart-checkbox:hover,
input[type="checkbox"].boxcart-checkbox:hover {
	border-color: var(--boxcart-primary);
}

.boxcart-checkbox:focus,
input[type="checkbox"].boxcart-checkbox:focus {
	outline: none;
	border-color: var(--boxcart-primary);
	box-shadow: 0 0 0 3px var(--boxcart-primary-light);
}

.boxcart-checkbox:checked,
input[type="checkbox"].boxcart-checkbox:checked {
	border-color: var(--boxcart-primary);
	background: var(--boxcart-primary);
}

/* Hide WordPress core blue SVG checkmark */
.boxcart-checkbox:checked::before,
input[type="checkbox"].boxcart-checkbox:checked::before {
	content: none;
	display: none;
}

.boxcart-checkbox:checked::after,
input[type="checkbox"].boxcart-checkbox:checked::after {
	content: '';
	position: absolute;
	left: 5px;
	top: 50%;
	width: 4px;
	height: 8px;
	border: solid var(--boxcart-white);
	border-width: 0 2px 2px 0;
	transform: translateY(-60%) rotate(45deg);
}

/* ==========================================================================
   Image Upload
   ========================================================================== */

.boxcart-image-upload {
	text-align: center;
}

.boxcart-image-upload__preview {
	width: 100%;
	aspect-ratio: 1;
	border: 2px dashed var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-lg);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	margin-bottom: var(--boxcart-space-3);
	overflow: hidden;
	background: var(--boxcart-grey-50);
	transition: border-color var(--boxcart-transition-fast), background-color var(--boxcart-transition-fast);
}

.boxcart-image-upload__preview:hover {
	border-color: var(--boxcart-primary);
	background: var(--boxcart-primary-light);
}

.boxcart-image-upload__preview--has-image {
	border-style: solid;
	background: var(--boxcart-white);
}

.boxcart-image-upload__preview--has-image:hover {
	background: var(--boxcart-white);
}

.boxcart-image-upload__preview img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.boxcart-image-upload__placeholder {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--boxcart-space-2);
	color: var(--boxcart-grey-400);
}

.boxcart-image-upload__placeholder .dashicons {
	font-size: 32px;
	width: 32px;
	height: 32px;
}

.boxcart-image-upload__placeholder span {
	font-size: var(--boxcart-text-sm);
}

.boxcart-image-upload__actions {
	display: flex;
	justify-content: center;
	gap: var(--boxcart-space-2);
}

/* ==========================================================================
   Add Category
   ========================================================================== */

.boxcart-add-category {
	margin-top: var(--boxcart-space-3);
	padding-top: var(--boxcart-space-3);
	border-top: 1px solid var(--boxcart-grey-100);
}

.boxcart-add-category__form {
	display: flex;
	gap: var(--boxcart-space-2);
	margin-top: var(--boxcart-space-2);
}

.boxcart-add-category__form .boxcart-input {
	flex: 1;
}

/* ==========================================================================
   Stock Quantity Field
   ========================================================================== */

.boxcart-stock-quantity-field {
	margin-top: var(--boxcart-space-4);
	padding-top: var(--boxcart-space-4);
	border-top: 1px solid var(--boxcart-grey-100);
}

/* ==========================================================================
   Action Bar
   ========================================================================== */

.boxcart-action-bar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: var(--boxcart-space-4) var(--boxcart-space-5);
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	box-shadow: var(--boxcart-shadow-sm);
	margin-top: var(--boxcart-space-5);
}

.boxcart-action-bar--top {
	margin-top: 0;
	margin-bottom: var(--boxcart-space-5);
}

.boxcart-action-bar__left,
.boxcart-action-bar__right {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
}

/* ==========================================================================
   Utility Classes
   ========================================================================== */

.boxcart-text-muted {
	color: var(--boxcart-grey-500);
	font-size: var(--boxcart-text-sm);
}

/* Typography Preview */
.boxcart-type-preview {
	background: #ffffff;
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius);
	padding: 24px;
	margin-bottom: var(--boxcart-space-4);
}

.boxcart-type-preview__heading {
	margin: 0 0 8px;
	font-size: 22px;
	font-weight: 700;
	color: var(--boxcart-grey-900);
	line-height: 1.3;
}

.boxcart-type-preview__body {
	margin: 0 0 16px;
	font-size: 16px;
	color: var(--boxcart-grey-600);
	line-height: 1.6;
}

.boxcart-type-preview__meta {
	display: flex;
	align-items: baseline;
	gap: 8px;
	padding-top: 12px;
	border-top: 1px solid var(--boxcart-grey-100);
}

.boxcart-type-preview__label {
	font-size: 14px;
	font-weight: 600;
	color: var(--boxcart-grey-800);
}

.boxcart-type-preview__price {
	font-size: 14px;
	font-weight: 700;
	color: var(--boxcart-green);
}

/* Order Number Preview */
.boxcart-order-number-preview {
	background: var(--boxcart-grey-50);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius);
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	display: inline-block;
}

.boxcart-order-number-preview code {
	background: transparent;
	padding: 0;
	font-size: var(--boxcart-text-lg);
	font-weight: 600;
	color: var(--boxcart-grey-800);
	font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Fira Mono', 'Droid Sans Mono', monospace;
}

/* Quantity Selector Previews */
.boxcart-qty-preview {
	background: var(--boxcart-grey-50);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius);
	padding: var(--boxcart-space-4);
	display: flex;
	justify-content: center;
	margin-bottom: var(--boxcart-space-4);
}

/* Tab Bar Preview */
.boxcart-qty-preview__tabs {
	display: flex;
	gap: 4px;
	padding: 4px;
	border-radius: 8px;
}

.boxcart-qty-preview__tab {
	display: inline-block;
	padding: 4px 14px;
	border-radius: 6px;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	cursor: pointer;
	background: #f3f4f6;
	color: #6b7280;
	border: 1px solid var(--boxcart-grey-200);
	transition: background-color 0.15s ease;
}

.boxcart-qty-preview__tab--active {
	background: var(--boxcart-primary, #2D7D5F);
	color: #ffffff;
	border-color: var(--boxcart-primary, #2D7D5F);
}

/* Quantity Controls Preview */
.boxcart-qty-preview__stepper {
	display: flex;
	align-items: center;
	gap: 4px;
}

.boxcart-qty-preview__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: #f3f4f6;
	color: #374151;
	font-size: 18px;
	font-weight: 500;
	border: 1px solid var(--boxcart-grey-200);
	border-radius: 6px;
	cursor: pointer;
	user-select: none;
	transition: background-color 0.15s ease;
}

.boxcart-qty-preview__center {
	flex: 1;
	min-width: 60px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	padding: 0 8px;
	border: 1px solid var(--boxcart-grey-200);
	border-radius: 6px;
	background: #ffffff;
}

.boxcart-qty-preview__value {
	font-size: 14px;
	font-weight: 600;
	color: var(--boxcart-grey-800);
	text-align: center;
}

.boxcart-qty-preview__unit {
	font-size: 12px;
	font-weight: 500;
	color: var(--boxcart-grey-500);
}

/* In Basket Preview */
.boxcart-qty-preview__basket {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	max-width: 220px;
	padding: var(--boxcart-space-2) var(--boxcart-space-3);
	border-radius: 6px;
	background: #f0fdf4;
	border: 1px solid #d1fae5;
}

.boxcart-qty-preview__basket-qty {
	font-size: 13px;
	font-weight: 500;
	color: var(--boxcart-grey-700);
}

.boxcart-qty-preview__basket-price {
	font-size: 13px;
	font-weight: 700;
	color: var(--boxcart-primary, #2D7D5F);
}

/* Button Preview */
.boxcart-btn-preview {
	background: var(--boxcart-grey-50);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius);
	padding: var(--boxcart-space-4);
	display: flex;
	gap: 12px;
	justify-content: center;
	align-items: center;
	margin-bottom: var(--boxcart-space-4);
}

.boxcart-btn-preview__btn {
	display: inline-block;
	padding: 10px 20px;
	font-size: 13px;
	font-weight: 600;
	border: 2px solid transparent;
	cursor: pointer;
	text-align: center;
	border-radius: 4px;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
	line-height: 1.2;
}

.boxcart-btn-preview__btn--primary {
	background: var(--boxcart-primary, #2D7D5F);
	color: #ffffff;
	border-color: var(--boxcart-primary, #2D7D5F);
}

.boxcart-btn-preview__btn--secondary {
	background: #ffffff;
	color: #2C3338;
	border-color: var(--boxcart-grey-200);
}

.boxcart-btn-preview__btn--disabled {
	background: #e5e5e5;
	color: #999999;
	border-color: #e5e5e5;
	cursor: not-allowed;
	opacity: 0.8;
}

/* Range Slider Control */
.boxcart-range-control {
	display: flex;
	align-items: center;
	gap: 12px;
}

.boxcart-range-input {
	flex: 1;
	max-width: 200px;
	height: 4px;
	-webkit-appearance: none;
	appearance: none;
	background: var(--boxcart-grey-200);
	border-radius: 2px;
	outline: none;
	cursor: pointer;
}

.boxcart-range-input::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--boxcart-primary, #2D7D5F);
	border: 2px solid #ffffff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
	cursor: pointer;
}

.boxcart-range-input::-moz-range-thumb {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--boxcart-primary, #2D7D5F);
	border: 2px solid #ffffff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
	cursor: pointer;
}

.boxcart-range-value {
	font-size: 13px;
	font-weight: 600;
	color: var(--boxcart-grey-700);
	min-width: 36px;
}

/* Card Overlay Preview */
.boxcart-card-overlay-preview {
	position: relative;
	border-radius: var(--boxcart-radius);
	overflow: hidden;
	margin-bottom: var(--boxcart-space-4);
	background: #f1f5f9;
	max-width: 300px;
	height: 180px;
}

.boxcart-card-overlay-preview__image {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
}

.boxcart-card-overlay-preview__overlay {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(0, 0, 0, 0.8);
	padding: 8px 12px;
}

.boxcart-card-overlay-preview__label {
	display: block;
	font-size: 10px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #ffffff;
	opacity: 0.8;
	margin-bottom: 4px;
}

.boxcart-card-overlay-preview__row {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.boxcart-card-overlay-preview__item {
	font-size: 13px;
	font-weight: 600;
	color: #ffffff;
}

.boxcart-card-overlay-preview__price {
	font-size: 13px;
	font-weight: 500;
	color: #ffffff;
	opacity: 0.9;
}

/* Table View Preview */
.boxcart-table-preview {
	border-radius: 12px;
	margin-bottom: var(--boxcart-space-4);
	overflow: hidden;
}

.boxcart-table-preview__table {
	width: 100%;
	border-collapse: collapse;
	border-radius: 8px;
	overflow: hidden;
	font-size: 13px;
}

.boxcart-table-preview__table thead th {
	padding: 8px 12px;
	text-align: left;
	font-weight: 600;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--boxcart-grey-600);
	background: #F6F7F7;
}

.boxcart-table-preview__table tbody td {
	padding: 10px 12px;
	color: var(--boxcart-grey-700);
}

.boxcart-table-preview__row {
	background: #ffffff;
}

.boxcart-table-preview__row--alt {
	background: #F6F7F7;
}

.boxcart-table-preview__row:hover {
	background: var(--table-preview-hover, #f0f0f0) !important;
}

/* Badge Preview */
.boxcart-badge-preview {
	background: var(--boxcart-grey-50);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius);
	padding: var(--boxcart-space-4);
	display: flex;
	justify-content: center;
	margin-bottom: var(--boxcart-space-4);
}

.boxcart-badge-preview__pill {
	display: inline-block;
	padding: 4px 10px;
	border-radius: 4px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #ffffff;
	background: #C44B4B;
}

/* Toast Preview */
.boxcart-toast-preview {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: var(--boxcart-space-4);
	max-width: 320px;
}

.boxcart-toast-preview__item {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 16px;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 500;
	color: #ffffff;
}

.boxcart-toast-preview__icon {
	font-size: 14px;
	font-weight: 700;
}

#toast-preview-success {
	background: #28a745;
}

#toast-preview-error {
	background: #dc3545;
}

#toast-preview-info {
	background: #17a2b8;
}

#toast-preview-warning {
	background: #ffc107;
}

/* Heart Preview */
.boxcart-heart-preview {
	background: var(--boxcart-grey-50);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius);
	padding: var(--boxcart-space-4);
	display: flex;
	gap: 16px;
	justify-content: center;
	align-items: center;
	margin-bottom: var(--boxcart-space-4);
	color: #E25555;
}

.boxcart-heart-preview__btn {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.9);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	color: #999;
}

.boxcart-heart-preview__btn:last-child {
	color: inherit;
}

/* Sidecart Appearance Layout */
.boxcart-sidecart-appearance {
	display: flex;
	gap: var(--boxcart-space-6);
	align-items: flex-start;
}

.boxcart-sidecart-appearance__settings {
	flex: 1;
	min-width: 0;
}

.boxcart-sidecart-appearance__preview {
	flex-shrink: 0;
	width: 280px;
	position: sticky;
	top: 52px;
}

@media (max-width: 960px) {
	.boxcart-sidecart-appearance {
		flex-direction: column-reverse;
	}
	.boxcart-sidecart-appearance__preview {
		width: 100%;
		max-width: 320px;
		position: static;
	}
}

/* Sidecart Preview */
.boxcart-sidecart-preview {
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius);
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.boxcart-sidecart-preview__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 14px;
	background: #ffffff;
	border-bottom: 1px solid #DCDCDE;
}

.boxcart-sidecart-preview__title {
	font-size: 14px;
	font-weight: 600;
	color: #2C3338;
	line-height: 1.3;
}

.boxcart-sidecart-preview__close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	color: #2D7D5F;
	cursor: default;
	border-radius: 4px;
}

.boxcart-sidecart-preview__body {
	padding: 0 14px;
	background: #ffffff;
}

.boxcart-sidecart-preview__item {
	display: flex;
	gap: 10px;
	padding: 10px 0;
	border-bottom: 1px solid #DCDCDE;
}

.boxcart-sidecart-preview__item:last-child {
	border-bottom: none;
}

.boxcart-sidecart-preview__item-image {
	width: 48px;
	height: 48px;
	flex-shrink: 0;
	border-radius: 4px;
	background: #f0f0f1;
}

.boxcart-sidecart-preview__item-details {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.boxcart-sidecart-preview__item-details .sc-preview-item-text {
	font-size: 12px;
	font-weight: 500;
	color: #2C3338;
	line-height: 1.3;
}

.boxcart-sidecart-preview__item-price {
	font-size: 12px;
	font-weight: 600;
	color: #2D7D5F;
}

.boxcart-sidecart-preview__item-actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 2px;
}

.boxcart-sidecart-preview__quantity {
	display: flex;
	align-items: center;
	gap: 6px;
}

.boxcart-sidecart-preview__quantity-btn {
	width: 22px;
	height: 22px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid #DCDCDE;
	background: #ffffff;
	border-radius: 3px;
	font-size: 11px;
	color: #2C3338;
	cursor: default;
}

.boxcart-sidecart-preview__quantity-value {
	font-size: 12px;
	font-weight: 500;
	min-width: 16px;
	text-align: center;
	color: #2C3338;
}

.boxcart-sidecart-preview__remove {
	font-size: 10px;
	font-weight: 500;
	color: #2D7D5F;
	cursor: default;
}

.boxcart-sidecart-preview__footer {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 12px 14px;
	background: #ffffff;
	border-top: 1px solid #DCDCDE;
}

.boxcart-sidecart-preview__subtotal {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.boxcart-sidecart-preview__subtotal .sc-preview-item-text {
	font-size: 13px;
	font-weight: 500;
	color: #2C3338;
}

.boxcart-sidecart-preview__subtotal-value {
	font-size: 15px;
	font-weight: 700;
	color: #2D7D5F;
}

.boxcart-sidecart-preview__btn {
	display: block;
	text-align: center;
	padding: 9px 14px;
	border-radius: 6px;
	font-size: 13px;
	font-weight: 600;
	background: #2D7D5F;
	color: #ffffff;
	cursor: default;
}

.boxcart-sidecart-preview__btn--secondary {
	background: transparent;
	border: 1px solid #DCDCDE;
	color: #2C3338;
}

.boxcart-sidecart-preview__continue {
	display: block;
	text-align: center;
	font-size: 11px;
	font-weight: 500;
	color: #2D7D5F;
	cursor: default;
}

/* Mobile Bar Preview */
.boxcart-mobile-bar-preview {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius);
	background: #ffffff;
	margin-bottom: var(--boxcart-space-4);
	max-width: 400px;
	box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.boxcart-mobile-bar-preview__icon {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: rgba(0, 0, 0, 0.05);
	border-radius: 50%;
	color: #2D7D5F;
	flex-shrink: 0;
}

.boxcart-mobile-bar-preview__badge {
	position: absolute;
	top: -3px;
	right: -3px;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	background: #2D7D5F;
	color: #fff;
	font-size: 9px;
	font-weight: 600;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.boxcart-mobile-bar-preview__summary {
	display: flex;
	flex-direction: column;
	gap: 1px;
	flex: 1;
}

.boxcart-mobile-bar-preview__count {
	font-size: 13px;
	font-weight: 600;
	color: #2C3338;
}

.boxcart-mobile-bar-preview__total {
	font-size: 12px;
	font-weight: 600;
	color: #2D7D5F;
}

.boxcart-mobile-bar-preview__action {
	padding: 8px 14px;
	background: #2D7D5F;
	color: #ffffff;
	font-size: 12px;
	font-weight: 600;
	border-radius: 6px;
	white-space: nowrap;
	cursor: default;
}

.boxcart-mobile-bar-preview__slot {
	font-size: 11px;
	color: #787C82;
	flex: 1;
	text-align: right;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 0;
}

/* Help Text Inline Variant */
.boxcart-help-text--inline {
	display: inline;
	margin: 0;
}

.boxcart-hidden {
	display: none !important;
}

/* ==========================================================================
   Mobile Bar Side-by-Side Layout
   ========================================================================== */

.boxcart-mobile-bar-appearance {
	display: flex;
	gap: var(--boxcart-space-6);
	align-items: flex-start;
}

.boxcart-mobile-bar-appearance__settings {
	flex: 1;
	min-width: 0;
}

.boxcart-mobile-bar-appearance__preview {
	flex-shrink: 0;
	width: 340px;
	position: sticky;
	top: 52px;
}

@media (max-width: 960px) {
	.boxcart-mobile-bar-appearance {
		flex-direction: column-reverse;
	}
	.boxcart-mobile-bar-appearance__preview {
		width: 100%;
		max-width: 380px;
		position: static;
	}
}

/* ==========================================================================
   Mobile Bar Expanded Preview
   ========================================================================== */

.boxcart-mobile-bar-preview-expanded {
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius);
	overflow: hidden;
	box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.08);
	background: #ffffff;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.boxcart-mobile-bar-preview-expanded__handle {
	display: flex;
	justify-content: center;
	padding: 12px 0 8px;
}

.boxcart-mobile-bar-preview-expanded__handle::after {
	content: "";
	display: block;
	width: 40px;
	height: 4px;
	background: #DCDCDE;
	border-radius: 2px;
}

.boxcart-mobile-bar-preview-expanded__header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	padding: 0 14px 10px;
	border-bottom: 1px solid var(--boxcart-grey-200);
}

.boxcart-mobile-bar-preview-expanded__header-content {
	display: flex;
	flex-direction: column;
	gap: 4px;
	flex: 1;
	min-width: 0;
}

.boxcart-mobile-bar-preview-expanded__title {
	font-size: 14px;
	font-weight: 600;
	color: #2C3338;
	line-height: 1.3;
}

.boxcart-mobile-bar-preview-expanded__title .mb-exp-count {
	font-weight: 400;
	opacity: 0.7;
}

.boxcart-mobile-bar-preview-expanded__slot {
	font-size: 11px;
	color: #787C82;
	display: flex;
	align-items: center;
	gap: 4px;
	line-height: 1.3;
}

.boxcart-mobile-bar-preview-expanded__collapse {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	color: #2D7D5F;
	cursor: default;
	border-radius: 4px;
	flex-shrink: 0;
}

.boxcart-mobile-bar-preview-expanded__items {
	padding: 0 14px;
}

.boxcart-mobile-bar-preview-expanded__item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 0;
	border-bottom: 1px solid #DCDCDE;
}

.boxcart-mobile-bar-preview-expanded__item:last-child {
	border-bottom: none;
}

.boxcart-mobile-bar-preview-expanded__item-image {
	width: 44px;
	height: 44px;
	border-radius: 4px;
	background: #f0f0f1;
	flex-shrink: 0;
}

.boxcart-mobile-bar-preview-expanded__item-info {
	display: flex;
	flex-direction: column;
	gap: 1px;
	flex: 1;
	min-width: 0;
}

.boxcart-mobile-bar-preview-expanded__item-name {
	font-size: 12px;
	font-weight: 500;
	color: #2C3338;
	line-height: 1.3;
}

.boxcart-mobile-bar-preview-expanded__item-qty {
	font-size: 11px;
	color: #787C82;
}

.boxcart-mobile-bar-preview-expanded__item-price {
	font-size: 12px;
	font-weight: 600;
	color: #2D7D5F;
	flex-shrink: 0;
}

.boxcart-mobile-bar-preview-expanded__footer {
	padding: 10px 14px;
	border-top: 1px solid var(--boxcart-grey-200);
}

.boxcart-mobile-bar-preview-expanded__subtotal {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
}

.boxcart-mobile-bar-preview-expanded__subtotal-label {
	font-size: 13px;
	font-weight: 500;
}

.boxcart-mobile-bar-preview-expanded__subtotal-value {
	font-size: 14px;
	font-weight: 700;
}

.boxcart-mobile-bar-preview-expanded__buttons {
	display: flex;
	gap: 8px;
}

.boxcart-mobile-bar-preview-expanded__btn {
	flex: 1;
	text-align: center;
	padding: 10px 14px;
	border-radius: 6px;
	font-size: 13px;
	font-weight: 600;
	cursor: default;
}

.boxcart-mobile-bar-preview-expanded__btn--primary {
	background: #2D7D5F;
	color: #fff;
}

.boxcart-mobile-bar-preview-expanded__btn--secondary {
	background: transparent;
	border: 1px solid #DCDCDE;
	color: #2C3338;
}

/* ==========================================================================
   Mini Basket Preview
   ========================================================================== */

.boxcart-mini-basket-preview {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	background: #2D7D5F;
	color: #ffffff;
	border-radius: 50px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	font-size: 14px;
	font-weight: 500;
	cursor: default;
	transition: background-color 0.2s;
}

.boxcart-mini-basket-preview__icon {
	display: flex;
	align-items: center;
}

.boxcart-mini-basket-preview__text {
	white-space: nowrap;
}

.boxcart-mini-basket-preview__count {
	white-space: nowrap;
	display: none;
}

/* ==========================================================================
   Icon Selector
   ========================================================================== */

.boxcart-icon-selector {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.boxcart-icon-option {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	padding: 12px 14px;
	border: 2px solid #DCDCDE;
	border-radius: 8px;
	cursor: pointer;
	transition: border-color 0.2s;
	background: #fff;
	min-width: 72px;
}

.boxcart-icon-option:hover {
	border-color: #787C82;
}

.boxcart-icon-option--active {
	border-color: #2D7D5F;
	background: #E8F5F0;
}

.boxcart-icon-option__preview {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	color: #2C3338;
}

.boxcart-icon-option--active .boxcart-icon-option__preview {
	color: #2D7D5F;
}

.boxcart-icon-option__label {
	font-size: 11px;
	font-weight: 500;
	color: #787C82;
}

.boxcart-icon-option--active .boxcart-icon-option__label {
	color: #2D7D5F;
	font-weight: 600;
}

.boxcart-preview-label {
	margin: 0 0 8px;
	font-size: 12px;
	font-weight: 600;
	color: #787C82;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

/* Range Input */
.boxcart-range {
	-webkit-appearance: none;
	appearance: none;
	height: 6px;
	background: #DCDCDE;
	border-radius: 3px;
	outline: none;
}

.boxcart-range::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: #2D7D5F;
	cursor: pointer;
	border: 2px solid #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.boxcart-range::-moz-range-thumb {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: #2D7D5F;
	cursor: pointer;
	border: 2px solid #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

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

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 1024px) {
	.boxcart-two-column {
		grid-template-columns: 1fr;
	}

	.boxcart-column--sidebar {
		order: -1;
	}
}

@media (max-width: 782px) {
	.boxcart-admin-page {
		margin: 10px;
	}

	/* Keep page header side-by-side on mobile */
	.boxcart-page-header {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		gap: var(--boxcart-space-3);
		flex-wrap: nowrap;
	}

	.boxcart-page-header__title,
	.boxcart-page-header h1 {
		font-size: var(--boxcart-text-xl);
		white-space: nowrap;
	}

	.boxcart-page-header__actions {
		display: flex;
		gap: var(--boxcart-space-2);
		flex-shrink: 0;
	}

	.boxcart-filters {
		flex-direction: column;
	}

	.boxcart-filters__left,
	.boxcart-filters__right {
		width: 100%;
	}

	.boxcart-filters__right {
		flex-direction: column;
	}

	.boxcart-filter-select,
	.boxcart-search-input {
		width: 100%;
		min-width: auto;
	}

	.boxcart-table-wrapper {
		overflow-x: auto;
	}

	.boxcart-action-bar {
		flex-direction: column;
		gap: var(--boxcart-space-3);
	}

	.boxcart-action-bar__left,
	.boxcart-action-bar__right {
		width: 100%;
		justify-content: center;
	}
}

/* ==========================================================================
   Categories Table
   ========================================================================== */

.boxcart-categories-table .boxcart-col-drag {
	width: 50px;
	text-align: center;
}

.boxcart-categories-table .boxcart-col-name {
	width: auto;
}

.boxcart-categories-table .boxcart-col-count {
	width: 100px;
	text-align: center;
}

.boxcart-categories-table .boxcart-col-actions {
	width: 150px;
	text-align: right;
}

.boxcart-drag-handle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	color: var(--boxcart-grey-400);
	cursor: grab;
	border-radius: var(--boxcart-radius-md);
	transition: color var(--boxcart-transition-fast), background-color var(--boxcart-transition-fast);
}

.boxcart-drag-handle:hover {
	color: var(--boxcart-grey-600);
	background: var(--boxcart-grey-100);
}

.boxcart-drag-handle:active {
	cursor: grabbing;
}

.boxcart-drag-handle .dashicons {
	font-size: 18px;
	width: 18px;
	height: 18px;
}

.boxcart-category-row.is-dragging {
	opacity: 0.5;
	background: var(--boxcart-grey-100);
}

.boxcart-category-row.drag-over {
	border-top: 2px solid var(--boxcart-primary);
}

.boxcart-category-name {
	font-weight: 500;
	color: var(--boxcart-grey-900);
}

.boxcart-action-buttons {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: var(--boxcart-space-2);
}

.boxcart-reorder-hint {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
	margin-top: var(--boxcart-space-4);
	color: var(--boxcart-grey-500);
}

.boxcart-reorder-hint .dashicons {
	color: var(--boxcart-grey-400);
}

/* ==========================================================================
   Modal
   ========================================================================== */

.boxcart-modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: var(--boxcart-z-modal-backdrop);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--boxcart-space-4);
}

.boxcart-modal {
	background: var(--boxcart-white);
	border-radius: var(--boxcart-radius-xl);
	box-shadow: var(--boxcart-shadow-xl);
	width: 100%;
	max-width: 480px;
	max-height: 90vh;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	z-index: var(--boxcart-z-modal);
}

.boxcart-modal--small {
	max-width: 400px;
}

.boxcart-modal--large {
	max-width: 800px;
}

.boxcart-modal__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: var(--boxcart-space-4) var(--boxcart-space-5);
	border-bottom: 1px solid var(--boxcart-grey-200);
}

.boxcart-modal__title {
	font-size: var(--boxcart-text-lg);
	font-weight: 600;
	color: var(--boxcart-grey-900);
	margin: 0;
}

.boxcart-modal__close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background: transparent;
	border: none;
	border-radius: var(--boxcart-radius-md);
	color: var(--boxcart-grey-500);
	cursor: pointer;
	transition: background-color var(--boxcart-transition-fast), color var(--boxcart-transition-fast);
}

.boxcart-modal__close:hover {
	background: var(--boxcart-grey-100);
	color: var(--boxcart-grey-700);
}

.boxcart-modal__close .dashicons {
	font-size: 20px;
	width: 20px;
	height: 20px;
}

.boxcart-modal__body {
	padding: var(--boxcart-space-5);
	overflow-y: auto;
	flex: 1;
}

.boxcart-modal__body .boxcart-select,
.boxcart-modal__body .boxcart-input {
	max-width: 100%;
}

.boxcart-modal__footer {
	display: flex;
	justify-content: flex-end;
	gap: var(--boxcart-space-3);
	padding: var(--boxcart-space-4) var(--boxcart-space-5);
	border-top: 1px solid var(--boxcart-grey-200);
	background: var(--boxcart-grey-50);
}

/* ==========================================================================
   Warning Text
   ========================================================================== */

.boxcart-text-warning {
	color: var(--boxcart-warning);
	font-size: var(--boxcart-text-sm);
	display: flex;
	align-items: flex-start;
	gap: var(--boxcart-space-2);
	padding: var(--boxcart-space-3);
	background: var(--boxcart-warning-light);
	border-radius: var(--boxcart-radius-md);
	margin-top: var(--boxcart-space-3);
}

/* ==========================================================================
   Form Rows
   ========================================================================== */

.boxcart-form-group--half {
	flex: 1;
}

/* ==========================================================================
   Location Cards Grid
   ========================================================================== */

.boxcart-locations-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: var(--boxcart-space-5);
}

.boxcart-location-card {
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	box-shadow: var(--boxcart-shadow-sm);
	padding: var(--boxcart-space-5);
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-3);
	transition: box-shadow var(--boxcart-transition-fast), border-color var(--boxcart-transition-fast);
}

.boxcart-location-card:hover {
	box-shadow: var(--boxcart-shadow-md);
	border-color: var(--boxcart-grey-300);
}

.boxcart-location-card--inactive {
	opacity: 0.7;
	background: var(--boxcart-grey-50);
}

.boxcart-location-card__header {
	display: flex;
	align-items: flex-start;
	gap: var(--boxcart-space-3);
}

.boxcart-location-card__icon {
	width: 40px;
	height: 40px;
	background: var(--boxcart-primary-light);
	border-radius: var(--boxcart-radius-md);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--boxcart-primary);
	flex-shrink: 0;
}

.boxcart-location-card__icon .dashicons {
	font-size: 20px;
	width: 20px;
	height: 20px;
}

.boxcart-location-card__name {
	font-size: var(--boxcart-text-lg);
	font-weight: 600;
	color: var(--boxcart-grey-900);
	margin: 0;
	line-height: 1.3;
}

.boxcart-location-card__name a {
	color: inherit;
	text-decoration: none;
}

.boxcart-location-card__name a:hover {
	color: var(--boxcart-primary);
}

.boxcart-location-card__address {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-600);
	margin: 0;
	line-height: 1.5;
}

.boxcart-location-card__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: var(--boxcart-space-3);
	border-top: 1px solid var(--boxcart-grey-100);
	font-size: var(--boxcart-text-sm);
}

.boxcart-location-card__status {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
	color: var(--boxcart-grey-700);
}

.boxcart-location-card__slots {
	color: var(--boxcart-grey-600);
}

.boxcart-status-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
}

.boxcart-status-dot--active {
	background: var(--boxcart-success);
}

.boxcart-status-dot--inactive {
	background: var(--boxcart-grey-400);
}

.boxcart-location-card__actions {
	display: flex;
	gap: var(--boxcart-space-2);
	margin-top: auto;
	padding-top: var(--boxcart-space-3);
}

/* ==========================================================================
   Tabs
   ========================================================================== */

.boxcart-tabs {
	margin-top: var(--boxcart-space-4);
}

.boxcart-tabs__nav {
	display: flex;
	gap: var(--boxcart-space-1);
	border-bottom: 1px solid var(--boxcart-grey-200);
	margin-bottom: var(--boxcart-space-5);
}

.boxcart-tabs__tab {
	padding: var(--boxcart-space-3) var(--boxcart-space-5);
	font-size: var(--boxcart-text-md);
	font-weight: 500;
	color: var(--boxcart-grey-600);
	text-decoration: none;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	transition: color var(--boxcart-transition-fast), border-color var(--boxcart-transition-fast);
}

.boxcart-tabs__tab:hover {
	color: var(--boxcart-grey-800);
}

.boxcart-tabs__tab--active {
	color: var(--boxcart-primary);
	border-bottom-color: var(--boxcart-primary);
}

.boxcart-tabs__content {
	/* Content container */
}

.boxcart-tabs__panel {
	/* Panel container */
}

/* ==========================================================================
   Open Days / Day Toggles
   ========================================================================== */

.boxcart-schedule-description {
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-600);
	margin: 0 0 var(--boxcart-space-5) 0;
}

.boxcart-days-grid {
	display: flex;
	flex-wrap: wrap;
	gap: var(--boxcart-space-2);
}

.boxcart-day-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	position: relative;
}

.boxcart-day-toggle:hover .boxcart-day-toggle__label {
	border-color: var(--boxcart-primary);
	color: var(--boxcart-primary);
}

.boxcart-day-toggle--active .boxcart-day-toggle__label {
	border-color: var(--boxcart-primary);
	background: var(--boxcart-primary);
	color: var(--boxcart-white);
}

.boxcart-day-toggle--active:hover .boxcart-day-toggle__label {
	background: var(--boxcart-primary-dark);
	border-color: var(--boxcart-primary-dark);
	color: var(--boxcart-white);
}

.boxcart-day-toggle input[type="checkbox"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	pointer-events: none;
}

.boxcart-day-toggle input[type="checkbox"]:focus + .boxcart-day-toggle__label {
	box-shadow: 0 0 0 2px var(--boxcart-primary-light);
}

.boxcart-day-toggle__label {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: var(--boxcart-space-2) var(--boxcart-space-4);
	border: 2px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-full);
	background: var(--boxcart-white);
	font-size: var(--boxcart-text-sm);
	font-weight: var(--boxcart-font-medium);
	color: var(--boxcart-grey-600);
	transition: all var(--boxcart-transition-fast);
	user-select: none;
}

/* ==========================================================================
   Time Slots
   ========================================================================== */

.boxcart-slots-accordion {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-4);
}

.boxcart-slots-day {
	background: var(--boxcart-grey-50);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	padding: var(--boxcart-space-4);
}

.boxcart-slots-day__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: var(--boxcart-space-3);
}

.boxcart-slots-day__title {
	font-size: var(--boxcart-text-md);
	font-weight: 600;
	color: var(--boxcart-grey-800);
	margin: 0;
}

.boxcart-slots-day__count {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-500);
}

.boxcart-slots-day__meta {
	display: inline-flex;
	align-items: center;
	gap: var(--boxcart-space-3);
}

.boxcart-copy-slots-btn .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

/* Copy Time Slots window */
.boxcart-copy-slots__days {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
	gap: var(--boxcart-space-2) var(--boxcart-space-4);
	margin: var(--boxcart-space-2) 0;
}

.boxcart-copy-slots__days .boxcart-checkbox-item--disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.boxcart-radio-item {
	display: flex;
	align-items: flex-start;
	gap: var(--boxcart-space-2);
	margin-top: var(--boxcart-space-2);
	cursor: pointer;
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-700);
}

.boxcart-radio-item input[type="radio"] {
	margin: 2px 0 0;
}

.boxcart-slots-day__list {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-2);
}

.boxcart-slots-day__empty {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-500);
	font-style: italic;
	margin: 0;
}

.boxcart-slot-item {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-4);
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-md);
}

.boxcart-slot-item--inactive {
	opacity: 0.6;
}

.boxcart-slot-item__time {
	font-size: var(--boxcart-text-md);
	font-weight: 600;
	color: var(--boxcart-grey-800);
	min-width: 120px;
}

.boxcart-slot-item__capacity {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-600);
	min-width: 100px;
}

.boxcart-slot-item__status {
	flex: 1;
}

.boxcart-slot-item__actions {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
}

/* ==========================================================================
   Closures List
   ========================================================================== */

.boxcart-closures-list {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-3);
}

.boxcart-closure-item {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-4);
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	background: var(--boxcart-grey-50);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-md);
}

.boxcart-closure-item__date {
	font-size: var(--boxcart-text-md);
	font-weight: 600;
	color: var(--boxcart-grey-800);
	min-width: 180px;
}

.boxcart-closure-item__day {
	font-weight: 400;
	color: var(--boxcart-grey-500);
	margin-left: var(--boxcart-space-2);
}

.boxcart-closure-item__reason {
	flex: 1;
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-600);
}

.boxcart-closure-item__actions {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
}

/* ==========================================================================
   Capacity Overrides List
   ========================================================================== */

.boxcart-overrides-list {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-3);
}

.boxcart-override-item {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-4);
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	background: var(--boxcart-grey-50);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-md);
}

.boxcart-override-item__date {
	font-size: var(--boxcart-text-md);
	font-weight: 600;
	color: var(--boxcart-grey-800);
	min-width: 150px;
}

.boxcart-override-item__slot {
	font-size: var(--boxcart-text-md);
	color: var(--boxcart-grey-700);
	min-width: 120px;
}

.boxcart-override-item__capacity {
	flex: 1;
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	font-size: var(--boxcart-text-sm);
}

.boxcart-override-item__default {
	color: var(--boxcart-grey-500);
}

.boxcart-override-item__arrow {
	color: var(--boxcart-grey-400);
}

.boxcart-override-item__override {
	color: var(--boxcart-primary);
	font-weight: 500;
}

.boxcart-override-item__actions {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
}

/* ==========================================================================
   Empty Inline State
   ========================================================================== */

.boxcart-empty-inline {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
	padding: var(--boxcart-space-4);
	background: var(--boxcart-grey-50);
	border-radius: var(--boxcart-radius-md);
	color: var(--boxcart-grey-600);
	font-size: var(--boxcart-text-base);
}

.boxcart-empty-inline .dashicons {
	color: var(--boxcart-grey-400);
}

/* ==========================================================================
   Products Page Filters
   ========================================================================== */

.boxcart-filters-bar {
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	padding: var(--boxcart-space-4);
	margin-bottom: var(--boxcart-space-5);
	box-shadow: var(--boxcart-shadow-sm);
}

.boxcart-filters-form {
	display: flex;
	flex-wrap: wrap;
	gap: var(--boxcart-space-3);
}

.boxcart-filters-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--boxcart-space-3);
	width: 100%;
}

.boxcart-filter-group {
	display: flex;
	align-items: center;
}

.boxcart-filter-group--dates {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
}

.boxcart-filter-group--dates .boxcart-input,
.boxcart-filter-group--dates .boxcart-input--date {
	width: 140px;
	height: 38px;
	padding: 0 var(--boxcart-space-3);
	box-sizing: border-box;
	min-width: auto;
}

.boxcart-date-separator {
	color: var(--boxcart-grey-500);
	font-size: var(--boxcart-text-base);
	line-height: 1;
	flex-shrink: 0;
}

/* All inputs in filter bar - consistent height */
.boxcart-filters-bar .boxcart-input,
.boxcart-filters-bar input[type="text"],
.boxcart-filters-bar input[type="search"],
.boxcart-filters-bar input[type="date"] {
	height: 38px;
	padding: 0 var(--boxcart-space-3);
	border: 1px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	background-color: var(--boxcart-white);
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-800);
	min-width: 150px;
	box-sizing: border-box;
}

.boxcart-filters-bar .boxcart-input:focus,
.boxcart-filters-bar input[type="text"]:focus,
.boxcart-filters-bar input[type="search"]:focus,
.boxcart-filters-bar input[type="date"]:focus {
	border-color: var(--boxcart-primary);
	box-shadow: 0 0 0 1px var(--boxcart-primary);
	outline: none;
}

/* Selects in filter bar - consistent height */
.boxcart-filters-bar .boxcart-select,
.boxcart-filters-bar select {
	height: 38px;
	padding: 0 var(--boxcart-space-8) 0 var(--boxcart-space-3);
	border: 1px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	background-color: var(--boxcart-white);
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-800);
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2350575E' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	cursor: pointer;
	min-width: 140px;
	box-sizing: border-box;
}

.boxcart-filters-bar .boxcart-select:focus,
.boxcart-filters-bar select:focus {
	border-color: var(--boxcart-primary);
	box-shadow: 0 0 0 1px var(--boxcart-primary);
	outline: none;
}

/* Filter bar buttons - consistent height */
.boxcart-filters-bar .boxcart-btn {
	height: 38px;
	box-sizing: border-box;
}

/* Search group - contains input + button */
.boxcart-filter-group--search {
	flex: 1;
	min-width: 200px;
	max-width: 350px;
}

/* Reset the wrapper - it's just a container now */
.boxcart-filter-group--search .boxcart-search-input {
	display: flex;
	width: 100%;
	border: none;
	padding: 0;
	min-width: 0;
	background: transparent;
	gap: 0; /* No gap between input and button */
}

/* Search input inside the wrapper */
.boxcart-filter-group--search .boxcart-input,
.boxcart-filters-bar .boxcart-filter-group--search .boxcart-input {
	height: 38px;
	padding: 0 var(--boxcart-space-3);
	border: 1px solid var(--boxcart-grey-300);
	border-right: none;
	border-radius: var(--boxcart-radius-md) 0 0 var(--boxcart-radius-md);
	font-size: var(--boxcart-text-base);
	flex: 1;
	min-width: 0;
	margin: 0; /* Remove any margin */
	width: auto;
}

.boxcart-filter-group--search .boxcart-input:focus {
	border-color: var(--boxcart-primary);
	box-shadow: 0 0 0 1px var(--boxcart-primary);
	outline: none;
	z-index: 1;
	position: relative; /* Ensure focus ring appears above button */
}

/* Search button */
.boxcart-search-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	padding: 0;
	margin: 0; /* Remove any margin */
	margin-left: -1px; /* Overlap border for seamless connection */
	background: var(--boxcart-primary);
	color: var(--boxcart-white);
	border: 1px solid var(--boxcart-primary);
	border-radius: 0 var(--boxcart-radius-md) var(--boxcart-radius-md) 0;
	cursor: pointer;
	transition: background-color var(--boxcart-transition-fast);
	flex-shrink: 0;
}

.boxcart-search-btn:hover {
	background: var(--boxcart-primary-hover);
	border-color: var(--boxcart-primary-hover);
}

.boxcart-search-btn .dashicons {
	font-size: 18px;
	width: 18px;
	height: 18px;
	line-height: 1;
}

/* Legacy class - reset if used elsewhere */
.boxcart-select--filter {
	min-width: 140px;
}

/* ==========================================================================
   Products Table
   ========================================================================== */

.boxcart-products-table .boxcart-table__col--checkbox {
	width: 40px;
}

.boxcart-products-table .boxcart-table__col--image {
	width: 80px;
}

.boxcart-products-table .boxcart-table__col--product {
	min-width: 200px;
}

.boxcart-products-table .boxcart-table__col--category {
	width: 150px;
}

.boxcart-products-table .boxcart-table__col--price {
	width: 100px;
}

.boxcart-products-table .boxcart-table__col--stock {
	width: 100px;
}

.boxcart-products-table .boxcart-table__col--actions {
	width: 100px;
	text-align: right;
}

.boxcart-product-thumbnail {
	width: 60px;
	height: 60px;
	object-fit: cover;
	border-radius: var(--boxcart-radius-md);
	background: var(--boxcart-grey-100);
}

.boxcart-product-thumbnail--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--boxcart-grey-400);
}

.boxcart-product-thumbnail--placeholder .dashicons {
	font-size: 24px;
	width: 24px;
	height: 24px;
}

/* Note: .boxcart-product-name and .boxcart-product-sku are defined in Common Elements section */

/* ==========================================================================
   Products Actions Dropdown (alternate trigger/menu naming)
   ========================================================================== */

.boxcart-actions-trigger {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-md);
	color: var(--boxcart-grey-600);
	cursor: pointer;
	transition: border-color var(--boxcart-transition-fast), background-color var(--boxcart-transition-fast);
}

.boxcart-actions-trigger:hover {
	border-color: var(--boxcart-grey-300);
	background: var(--boxcart-grey-50);
}

.boxcart-actions-trigger .dashicons {
	font-size: 20px;
	width: 20px;
	height: 20px;
}

.boxcart-actions-menu {
	position: absolute;
	right: 0;
	top: 100%;
	margin-top: var(--boxcart-space-1);
	min-width: 150px;
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	box-shadow: var(--boxcart-shadow-lg);
	z-index: var(--boxcart-z-dropdown);
	display: none;
	overflow: hidden;
}

.boxcart-actions-dropdown.is-open .boxcart-actions-menu {
	display: block;
}

.boxcart-actions-item {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
	width: 100%;
	padding: var(--boxcart-space-2) var(--boxcart-space-3);
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-700);
	text-decoration: none;
	background: transparent;
	border: none;
	cursor: pointer;
	text-align: left;
	transition: background-color var(--boxcart-transition-fast);
}

.boxcart-actions-item:hover {
	background: var(--boxcart-grey-50);
}

.boxcart-actions-item .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	color: var(--boxcart-grey-500);
}

.boxcart-actions-item--danger {
	color: var(--boxcart-error);
}

.boxcart-actions-item--danger:hover {
	background: var(--boxcart-error-light);
}

.boxcart-actions-item--danger .dashicons {
	color: var(--boxcart-error);
}

/* ==========================================================================
   Orders Page Styles (Override inline styles)
   ========================================================================== */

.boxcart-orders-table {
	width: 100%;
}

.boxcart-status-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	list-style: none;
	margin: 0 0 var(--boxcart-space-4) 0;
	padding: 0;
	border-bottom: 1px solid var(--boxcart-grey-200);
}

.boxcart-status-tabs li {
	margin: 0;
}

.boxcart-status-tabs a {
	display: block;
	padding: var(--boxcart-space-2) var(--boxcart-space-4);
	text-decoration: none;
	color: var(--boxcart-grey-600);
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	font-size: var(--boxcart-text-md);
	transition: color var(--boxcart-transition-fast), border-color var(--boxcart-transition-fast);
}

.boxcart-status-tabs a:hover {
	color: var(--boxcart-primary);
}

.boxcart-status-tabs a.current {
	color: var(--boxcart-primary);
	border-bottom-color: var(--boxcart-primary);
	font-weight: 500;
}

.boxcart-status-tabs .count {
	color: var(--boxcart-grey-500);
	font-weight: normal;
}

.boxcart-orders-filters {
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	padding: var(--boxcart-space-4);
	margin-bottom: var(--boxcart-space-4);
	box-shadow: var(--boxcart-shadow-sm);
}

.boxcart-orders-filters .boxcart-filter-row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--boxcart-space-3);
	align-items: center;
}

.boxcart-orders-filters .button {
	background: var(--boxcart-primary);
	color: var(--boxcart-white);
	border: 1px solid var(--boxcart-primary);
	padding: var(--boxcart-space-2) var(--boxcart-space-4);
	border-radius: var(--boxcart-radius-md);
	font-size: var(--boxcart-text-base);
	cursor: pointer;
	transition: background-color var(--boxcart-transition-fast);
}

.boxcart-orders-filters .button:hover {
	background: var(--boxcart-primary-hover);
	border-color: var(--boxcart-primary-hover);
}

/* Legacy date-input class - kept for backwards compatibility */
.boxcart-date-input {
	padding: var(--boxcart-space-2) var(--boxcart-space-3);
	border: 1px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-800);
}

/* Orders table branded status badges */
.boxcart-status-badge {
	display: inline-block;
	padding: 3px 8px;
	font-size: 10px;
	font-weight: 600;
	color: var(--boxcart-white);
	border-radius: var(--boxcart-radius-sm);
	text-transform: uppercase;
	letter-spacing: 0.3px;
	white-space: nowrap;
}

.boxcart-order-link {
	text-decoration: none;
	color: var(--boxcart-primary);
}

.boxcart-order-link:hover {
	color: var(--boxcart-primary-hover);
	text-decoration: underline;
}

/* ==========================================================================
   Settings Form Custom Radio/Checkbox (for settings page)
   ========================================================================== */

.boxcart-settings-form .boxcart-radio,
.boxcart-settings-form .boxcart-checkbox-item {
	padding: var(--boxcart-space-2) 0;
}

/* ==========================================================================
   Pagination Branded
   ========================================================================== */

.boxcart-pagination__btn,
.boxcart-pagination__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 32px;
	height: 32px;
	padding: 0 var(--boxcart-space-2);
	text-decoration: none;
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-md);
	color: var(--boxcart-grey-700);
	font-size: var(--boxcart-text-base);
	transition: background-color var(--boxcart-transition-fast), border-color var(--boxcart-transition-fast);
}

.boxcart-pagination__btn:hover,
.boxcart-pagination__link:hover {
	background: var(--boxcart-grey-50);
	border-color: var(--boxcart-grey-300);
	color: var(--boxcart-grey-800);
}

.boxcart-pagination__btn--active,
.boxcart-pagination__link.current {
	background: var(--boxcart-primary);
	border-color: var(--boxcart-primary);
	color: var(--boxcart-white);
}

.boxcart-pagination__btn--disabled {
	opacity: 0.5;
	cursor: not-allowed;
	pointer-events: none;
}

/* ==========================================================================
   Animations
   ========================================================================== */

@keyframes boxcart-spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

@keyframes boxcart-shake {
	0%, 100% { transform: translateX(0); }
	20% { transform: translateX(-4px); }
	40% { transform: translateX(4px); }
	60% { transform: translateX(-3px); }
	80% { transform: translateX(3px); }
}

.spin,
.boxcart-spin {
	animation: boxcart-spin 1s linear infinite;
}

/* ==========================================================================
   Reduced Motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* ==========================================================================
   Help Panel
   ========================================================================== */

.boxcart-help {
	position: relative;
}

.boxcart-help__trigger {
	display: inline-flex;
	align-items: center;
	gap: var(--boxcart-space-1);
	padding: var(--boxcart-space-2) var(--boxcart-space-3) var(--boxcart-space-2) var(--boxcart-space-2);
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	color: var(--boxcart-grey-700);
	font-size: var(--boxcart-text-sm);
	font-weight: var(--boxcart-font-medium);
	cursor: pointer;
	transition: all var(--boxcart-transition-fast);
}

.boxcart-help__trigger:hover {
	background: var(--boxcart-grey-50);
	border-color: var(--boxcart-grey-400);
	color: var(--boxcart-grey-800);
}

.boxcart-help__trigger:focus {
	outline: none;
	border-color: var(--boxcart-primary);
	box-shadow: 0 0 0 2px var(--boxcart-primary-light);
}

.boxcart-help__trigger[aria-expanded="true"] {
	background: var(--boxcart-primary-light);
	border-color: var(--boxcart-primary);
	color: var(--boxcart-primary);
}

.boxcart-help__trigger .dashicons {
	font-size: 18px;
	width: 18px;
	height: 18px;
}

.boxcart-help__panel {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	width: 380px;
	max-height: calc(100vh - 150px);
	overflow-y: auto;
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	box-shadow: var(--boxcart-shadow-xl);
	z-index: var(--boxcart-z-dropdown);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-10px);
	transition: all var(--boxcart-transition-normal);
}

.boxcart-help__panel[aria-hidden="false"] {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.boxcart-help__panel-inner {
	padding: var(--boxcart-space-5);
}

.boxcart-help__section {
	padding-bottom: var(--boxcart-space-4);
	margin-bottom: var(--boxcart-space-4);
	border-bottom: 1px solid var(--boxcart-grey-100);
}

.boxcart-help__section:last-child {
	padding-bottom: 0;
	margin-bottom: 0;
	border-bottom: none;
}

.boxcart-help__section--highlight {
	background: var(--boxcart-grey-50);
	margin: var(--boxcart-space-4) calc(-1 * var(--boxcart-space-5)) calc(-1 * var(--boxcart-space-5));
	padding: var(--boxcart-space-5) var(--boxcart-space-5) var(--boxcart-space-6);
	border-bottom: none;
	border-radius: 0 0 var(--boxcart-radius-lg) var(--boxcart-radius-lg);
}

/* Ensure highlight section keeps its negative margin even when last child */
.boxcart-help__section--highlight:last-child {
	margin-bottom: calc(-1 * var(--boxcart-space-5));
}

.boxcart-help__section-title {
	margin: 0 0 var(--boxcart-space-2) 0;
	font-size: var(--boxcart-text-lg);
	font-weight: var(--boxcart-font-semibold);
	color: var(--boxcart-grey-900);
}

.boxcart-help__section-subtitle {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
	margin: 0 0 var(--boxcart-space-3) 0;
	font-size: var(--boxcart-text-sm);
	font-weight: var(--boxcart-font-semibold);
	color: var(--boxcart-grey-700);
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.boxcart-help__section-subtitle .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	color: var(--boxcart-primary);
}

.boxcart-help__description {
	margin: 0;
	font-size: var(--boxcart-text-base);
	line-height: 1.6;
	color: var(--boxcart-grey-600);
}

.boxcart-help__tips {
	margin: 0;
	padding: 0 0 0 var(--boxcart-space-4);
	list-style: none;
}

.boxcart-help__tips li {
	position: relative;
	padding-left: var(--boxcart-space-4);
	margin-bottom: var(--boxcart-space-2);
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-600);
	line-height: 1.5;
}

.boxcart-help__tips li:last-child {
	margin-bottom: 0;
}

.boxcart-help__tips li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 7px;
	width: 6px;
	height: 6px;
	background: var(--boxcart-primary);
	border-radius: 50%;
}

.boxcart-help__links {
	margin: 0;
	padding: 0;
	list-style: none;
}

.boxcart-help__links li {
	margin-bottom: var(--boxcart-space-2);
}

.boxcart-help__links li:last-child {
	margin-bottom: 0;
}

.boxcart-help__links a {
	display: inline-flex;
	align-items: center;
	gap: var(--boxcart-space-1);
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-primary);
	text-decoration: none;
	transition: color var(--boxcart-transition-fast);
}

.boxcart-help__links a:hover {
	color: var(--boxcart-primary-hover);
	text-decoration: underline;
}

.boxcart-help__links a .dashicons {
	font-size: 14px;
	width: 14px;
	height: 14px;
	opacity: 0.7;
}

.boxcart-help__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--boxcart-space-2);
	margin-top: var(--boxcart-space-3);
	padding-bottom: var(--boxcart-space-5);
}

.boxcart-help__actions .boxcart-btn {
	display: inline-flex;
	align-items: center;
	gap: var(--boxcart-space-1);
}

.boxcart-help__actions .boxcart-btn .dashicons {
	font-size: 14px;
	width: 14px;
	height: 14px;
}

/* Outline button variant */
.boxcart-btn--outline {
	background: transparent;
	border: 1px solid var(--boxcart-grey-300);
	color: var(--boxcart-grey-700);
}

.boxcart-btn--outline:hover {
	background: var(--boxcart-grey-50);
	border-color: var(--boxcart-grey-400);
	color: var(--boxcart-grey-800);
}

/* Page header with help button */
.boxcart-page-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: var(--boxcart-space-6);
}

.boxcart-page-header__content {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
}

/* Consistent spacing between back-link and page title */
.boxcart-page-header__content > div {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-2);
}

.boxcart-page-header__actions {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
}

/* Page Footer - for bottom save button */
.boxcart-page-footer {
	display: flex;
	justify-content: flex-end;
	padding: var(--boxcart-space-5) 0;
	margin-top: var(--boxcart-space-6);
	border-top: 1px solid var(--boxcart-grey-200);
}

/* ==========================================================================
   Settings Sub-navigation (Inner Tabs)
   ========================================================================== */

.boxcart-settings-layout {
	display: grid;
	grid-template-columns: 200px 1fr;
	gap: var(--boxcart-space-6);
	align-items: start;
}

.boxcart-settings-subnav {
	position: sticky;
	top: 32px;
	display: flex;
	flex-direction: column;
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	overflow: hidden;
}

.boxcart-settings-subnav__item {
	display: block;
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	color: var(--boxcart-grey-600);
	text-decoration: none;
	font-size: var(--boxcart-text-md);
	font-weight: 500;
	border-bottom: 1px solid var(--boxcart-grey-100);
	transition: background 0.15s ease, color 0.15s ease;
	outline: none !important;
	box-shadow: none !important;
}

.boxcart-settings-subnav__item:last-child {
	border-bottom: none;
}

.boxcart-settings-subnav__item:hover,
.boxcart-settings-subnav__item:focus {
	background: var(--boxcart-grey-50);
	color: var(--boxcart-grey-800);
	text-decoration: none;
	outline: none !important;
	box-shadow: none !important;
}

.boxcart-settings-subnav__item--active,
.boxcart-settings-subnav__item--active:hover,
.boxcart-settings-subnav__item--active:focus {
	background: var(--boxcart-primary);
	color: var(--boxcart-white);
	text-decoration: none;
	outline: none !important;
	box-shadow: none !important;
}

.boxcart-settings-subnav__item--hidden {
	display: none;
}

.boxcart-settings-panels {
	min-width: 0;
}

.boxcart-settings-panel {
	display: none;
}

.boxcart-settings-panel--active {
	display: block;
}

/* Responsive - stack on smaller screens */
@media (max-width: 900px) {
	.boxcart-settings-layout {
		grid-template-columns: 1fr;
	}

	.boxcart-settings-subnav {
		position: static;
		flex-direction: row;
		flex-wrap: wrap;
		width: 100%;
	}

	.boxcart-settings-subnav__item {
		flex: 1 1 auto;
		border-bottom: none;
		border-right: 1px solid var(--boxcart-grey-100);
		text-align: center;
		padding: var(--boxcart-space-3) var(--boxcart-space-2);
		min-width: 0;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.boxcart-settings-subnav__item:last-child {
		border-right: none;
	}
}

/* Even smaller screens - allow wrapping and full width items */
@media (max-width: 600px) {
	.boxcart-settings-subnav__item {
		flex: 1 1 calc(50% - 1px);
		border-bottom: 1px solid var(--boxcart-grey-100);
	}

	/* Remove right border on every other item */
	.boxcart-settings-subnav__item:nth-child(2n) {
		border-right: none;
	}
}

/* Danger zone - for destructive actions at bottom of forms */
.boxcart-danger-zone {
	margin-top: var(--boxcart-space-8);
	padding-top: var(--boxcart-space-6);
	border-top: 1px solid var(--boxcart-grey-200);
	text-align: left;
}

/* ==========================================================================
   Quantity Types Manager
   ========================================================================== */

.boxcart-quantity-types-manager {
	margin-top: var(--boxcart-space-4);
	padding-top: var(--boxcart-space-4);
	border-top: 1px solid var(--boxcart-grey-200);
}

/* --- Add Quantity Type button + popover menu --- */
.boxcart-quantity-types-actions {
	margin-bottom: var(--boxcart-space-4);
}

.boxcart-add-quantity-wrapper {
	position: relative;
	display: inline-block;
}

.boxcart-add-quantity-menu {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	min-width: 220px;
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	box-shadow: 0 6px 24px -8px rgba(17, 24, 39, 0.25);
	padding: 8px 0;
	z-index: 50;
}

.boxcart-add-quantity-menu[hidden] {
	display: none;
}

.boxcart-add-quantity-menu__title {
	margin: 4px 14px 6px;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--boxcart-grey-500);
}

.boxcart-add-quantity-menu__list {
	display: flex;
	flex-direction: column;
}

.boxcart-add-quantity-menu__item {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 8px 14px;
	background: transparent;
	border: 0;
	text-align: left;
	font-size: 13px;
	color: var(--boxcart-grey-800);
	cursor: pointer;
	transition: background 0.12s ease, color 0.12s ease;
}

.boxcart-add-quantity-menu__item:hover,
.boxcart-add-quantity-menu__item:focus {
	background: var(--boxcart-grey-50);
	color: var(--boxcart-primary);
	outline: none;
}

.boxcart-add-quantity-menu__item .dashicons {
	width: 14px;
	height: 14px;
	font-size: 14px;
	color: var(--boxcart-grey-500);
}

.boxcart-add-quantity-menu__item--custom {
	margin-top: 4px;
	padding-top: 10px;
	border-top: 1px solid var(--boxcart-grey-100);
}

/* Inline info notice used above the Add Quantity Type button on Free. */
.boxcart-help-text.boxcart-help-text--notice {
	display: flex;
	align-items: flex-start;
	gap: 6px;
	margin: 0 0 var(--boxcart-space-3);
	padding: 8px 12px;
	background: #fffbea;
	border: 1px solid #f5e4a4;
	border-radius: 6px;
	color: #5b4a17;
	font-size: 12px;
	line-height: 1.5;
}

.boxcart-help-text.boxcart-help-text--notice .dashicons {
	margin-top: 1px;
	color: #d4a017;
	width: 14px;
	height: 14px;
	font-size: 14px;
	flex-shrink: 0;
}

.boxcart-quantity-types-list {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-3);
	margin-bottom: var(--boxcart-space-4);
}

.boxcart-quantity-type-row {
	background: var(--boxcart-grey-50);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	overflow: hidden;
}

.boxcart-quantity-type-row__header {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	background: var(--boxcart-white);
	border-bottom: 1px solid var(--boxcart-grey-200);
	cursor: pointer;
	transition: background-color var(--boxcart-transition-fast);
}

.boxcart-quantity-type-row__header:hover {
	background: var(--boxcart-grey-50);
}

.boxcart-quantity-type-row__drag {
	color: var(--boxcart-grey-400);
	cursor: grab;
}

.boxcart-quantity-type-row__drag:active {
	cursor: grabbing;
}

/* Drag and drop visual feedback */
.boxcart-quantity-type-row.is-dragging {
	opacity: 0.5;
	border: 2px dashed var(--boxcart-primary);
	background: var(--boxcart-primary-light);
	transform: scale(1.02);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.boxcart-quantity-type-row.drag-over-top {
	border-top: 3px solid var(--boxcart-primary);
	margin-top: -3px;
	position: relative;
}

.boxcart-quantity-type-row.drag-over-top::before {
	content: '';
	position: absolute;
	top: -3px;
	left: 0;
	right: 0;
	height: 3px;
	background: var(--boxcart-primary);
	animation: pulse-glow 1s ease-in-out infinite;
}

.boxcart-quantity-type-row.drag-over-bottom {
	border-bottom: 3px solid var(--boxcart-primary);
	margin-bottom: -3px;
	position: relative;
}

.boxcart-quantity-type-row.drag-over-bottom::after {
	content: '';
	position: absolute;
	bottom: -3px;
	left: 0;
	right: 0;
	height: 3px;
	background: var(--boxcart-primary);
	animation: pulse-glow 1s ease-in-out infinite;
}

@keyframes pulse-glow {
	0%, 100% {
		box-shadow: 0 0 5px var(--boxcart-primary);
	}
	50% {
		box-shadow: 0 0 15px var(--boxcart-primary);
	}
}

/* Success flash when drop completes */
.boxcart-quantity-type-row.drop-success {
	animation: drop-success-flash 0.8s ease-out;
}

@keyframes drop-success-flash {
	0% {
		background: var(--boxcart-success-light, #d4edda);
		border-color: var(--boxcart-success, #28a745);
		transform: scale(1.02);
	}
	100% {
		background: var(--boxcart-grey-50);
		border-color: var(--boxcart-grey-200);
		transform: scale(1);
	}
}

.boxcart-quantity-type-row__title {
	flex: 1;
	font-weight: var(--boxcart-font-medium);
	color: var(--boxcart-grey-800);
}

.boxcart-quantity-type-row__price {
	color: var(--boxcart-grey-500);
	font-weight: var(--boxcart-font-normal);
}

.boxcart-quantity-type-row__toggle,
.boxcart-quantity-type-row__remove {
	border: none;
	background: none;
	padding: 0;
	width: 28px;
	height: 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: var(--boxcart-grey-500);
	transition: color var(--boxcart-transition-fast);
	flex-shrink: 0;
}

.boxcart-quantity-type-row__toggle:hover {
	color: var(--boxcart-grey-700);
}

.boxcart-quantity-type-row__remove:hover {
	color: var(--boxcart-error);
}

.boxcart-quantity-type-row__content {
	padding: var(--boxcart-space-4);
	background: var(--boxcart-white);
}

/* Form row layouts */
.boxcart-form-row {
	display: flex;
	gap: var(--boxcart-space-4);
	margin-bottom: var(--boxcart-space-4);
}

.boxcart-form-row:last-child {
	margin-bottom: 0;
}

.boxcart-form-row > .boxcart-form-group {
	margin-bottom: 0;
}

.boxcart-form-group--half {
	flex: 1;
}

.boxcart-form-group--third {
	flex: 1;
}

.boxcart-form-group--quarter {
	flex: 1;
}

/* Wider gap for multi-column layouts */
.boxcart-form-row--spaced {
	gap: var(--boxcart-space-6);
}

@media (min-width: 1200px) {
	.boxcart-form-row--spaced {
		gap: var(--boxcart-space-8);
	}
}

@media (max-width: 900px) {
	.boxcart-form-row--spaced {
		flex-direction: column;
		gap: var(--boxcart-space-4);
	}
}

/* Media Upload Component */
.boxcart-media-upload {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-2);
}

.boxcart-media-upload__preview {
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-md);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--boxcart-grey-50);
	overflow: hidden;
	padding: var(--boxcart-space-3);
}

.boxcart-media-upload__preview img {
	max-width: 200px;
	max-height: 80px;
	object-fit: contain;
}

.boxcart-media-upload__actions {
	display: flex;
	gap: var(--boxcart-space-2);
	align-items: center;
}

/* Equal width row for side-by-side cards */
.boxcart-form-row--equal {
	display: flex;
	gap: var(--boxcart-space-4);
	align-items: flex-start;
}

.boxcart-form-row--equal > .boxcart-card {
	flex: 1;
	min-width: 0;
}

@media (max-width: 1200px) {
	.boxcart-form-row--equal {
		flex-direction: column;
	}

	.boxcart-form-row--equal > .boxcart-card {
		width: 100%;
	}
}

/* Toggle switch */
.boxcart-toggle {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	cursor: pointer;
}

.boxcart-toggle input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.boxcart-toggle__slider {
	position: relative;
	display: inline-block;
	width: 40px;
	height: 22px;
	background-color: var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-full);
	transition: background-color var(--boxcart-transition-fast);
}

.boxcart-toggle__slider::before {
	content: "";
	position: absolute;
	top: 2px;
	left: 2px;
	width: 18px;
	height: 18px;
	background-color: var(--boxcart-white);
	border-radius: 50%;
	transition: transform var(--boxcart-transition-fast);
	box-shadow: var(--boxcart-shadow-sm);
}

.boxcart-toggle input:checked + .boxcart-toggle__slider {
	background-color: var(--boxcart-primary);
}

.boxcart-toggle input:checked + .boxcart-toggle__slider::before {
	transform: translateX(18px);
}

.boxcart-toggle input:focus + .boxcart-toggle__slider {
	box-shadow: 0 0 0 2px var(--boxcart-primary-light);
}

.boxcart-toggle__label {
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-700);
}

/* ==========================================================================
   Email Template Accordion
   ========================================================================== */

.boxcart-email-templates {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-3);
}

.boxcart-email-template {
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-md);
	overflow: hidden;
}

.boxcart-email-template__header {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	background: var(--boxcart-grey-50);
	cursor: pointer;
}

.boxcart-email-template__header .boxcart-toggle {
	flex-shrink: 0;
}

.boxcart-email-template__info {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.boxcart-email-template__info strong {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-800);
}

.boxcart-email-template__desc {
	font-size: var(--boxcart-text-xs);
	color: var(--boxcart-grey-500);
	line-height: 1.4;
}

.boxcart-email-template__expand {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	padding: 0;
	background: none;
	border: none;
	border-radius: var(--boxcart-radius-sm);
	color: var(--boxcart-grey-400);
	cursor: pointer;
	transition: color var(--boxcart-transition-fast), background-color var(--boxcart-transition-fast);
}

.boxcart-email-template__expand:hover {
	color: var(--boxcart-grey-600);
	background-color: var(--boxcart-grey-200);
}

.boxcart-email-template__expand[aria-expanded="true"] .dashicons {
	transform: rotate(180deg);
}

.boxcart-email-template__body {
	padding: var(--boxcart-space-4);
	border-top: 1px solid var(--boxcart-grey-200);
}

.boxcart-email-template__actions {
	margin-top: var(--boxcart-space-3);
	padding-top: var(--boxcart-space-3);
	border-top: 1px solid var(--boxcart-grey-100);
}

/* Responsive adjustments for quantity type forms */
@media screen and (max-width: 600px) {
	.boxcart-form-row {
		flex-direction: column;
		gap: var(--boxcart-space-3);
	}
}

/* ==========================================================================
   ID Display (Products & Categories)
   ========================================================================== */

/* ID column in list tables */
.boxcart-table__col--id,
.boxcart-col-id {
	width: 70px;
	text-align: left;
}

.boxcart-product-id,
.boxcart-category-id {
	font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, monospace;
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-500);
}

/* ID in page title on edit pages */
.boxcart-page-title__id {
	font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, monospace;
	font-size: var(--boxcart-text-lg);
	font-weight: var(--boxcart-font-normal);
	color: var(--boxcart-grey-400);
	margin-left: var(--boxcart-space-2);
}

/* ==========================================================================
   Payment Settings
   ========================================================================== */

.boxcart-stripe-keys {
	margin-bottom: var(--boxcart-space-4);
	padding-bottom: var(--boxcart-space-4);
	border-bottom: 1px solid var(--boxcart-grey-100);
}

/* ==========================================================================
   Dashboard
   ========================================================================== */

.boxcart-admin--dashboard .boxcart-page-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: var(--boxcart-space-6);
}

.boxcart-page-header__content {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
}

.boxcart-page-header__title {
	/* Inherits from main CSS: font-size, font-weight, color, margin, padding, line-height: 1.3 */
}

/* Stat Cards */
.boxcart-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--boxcart-space-5);
	margin-bottom: var(--boxcart-space-6);
}

.boxcart-stat-card {
	background: var(--boxcart-white);
	border-radius: var(--boxcart-radius-lg);
	padding: var(--boxcart-space-5);
	box-shadow: var(--boxcart-shadow-sm);
	border: 1px solid var(--boxcart-grey-200);
}

.boxcart-stat-card__label {
	margin: 0 0 var(--boxcart-space-2) 0;
	font-size: var(--boxcart-text-xs);
	font-weight: var(--boxcart-font-medium);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--boxcart-grey-500);
}

.boxcart-stat-card__value {
	margin: 0 0 var(--boxcart-space-3) 0;
	font-size: var(--boxcart-text-4xl);
	font-weight: var(--boxcart-font-bold);
	color: var(--boxcart-grey-900);
	line-height: 1;
}

.boxcart-stat-card__link {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-primary);
	text-decoration: none;
}

.boxcart-stat-card__link:hover {
	text-decoration: underline;
}

/* Dashboard Grid */
.boxcart-dashboard-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--boxcart-space-5);
	margin-top: var(--boxcart-space-5);
}

/* Availability List */
.boxcart-availability-list {
	padding: var(--boxcart-space-4);
}

.boxcart-availability-item {
	margin-bottom: var(--boxcart-space-4);
}

.boxcart-availability-item:last-child {
	margin-bottom: 0;
}

.boxcart-availability-item__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: var(--boxcart-space-2);
}

.boxcart-availability-item__name {
	font-weight: var(--boxcart-font-medium);
	color: var(--boxcart-grey-800);
}

.boxcart-availability-item__count {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-500);
}

/* Progress Bar */
.boxcart-progress {
	height: 8px;
	background: var(--boxcart-grey-200);
	border-radius: 4px;
	overflow: hidden;
}

.boxcart-progress__bar {
	height: 100%;
	border-radius: 4px;
	transition: width 0.3s ease;
}

.boxcart-progress--success .boxcart-progress__bar {
	background: var(--boxcart-success);
}

.boxcart-progress--warning .boxcart-progress__bar {
	background: var(--boxcart-warning);
}

.boxcart-progress--danger .boxcart-progress__bar {
	background: var(--boxcart-danger);
}

/* Quick Actions */
.boxcart-quick-actions {
	padding: var(--boxcart-space-2);
}

.boxcart-quick-action {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	color: var(--boxcart-grey-700);
	text-decoration: none;
	border-radius: var(--boxcart-radius-md);
	transition: background-color 0.2s, color 0.2s;
}

.boxcart-quick-action:hover {
	background: var(--boxcart-grey-50);
	color: var(--boxcart-primary);
}

.boxcart-quick-action .dashicons {
	font-size: 20px;
	width: 20px;
	height: 20px;
	color: var(--boxcart-grey-400);
	transition: color 0.2s;
}

.boxcart-quick-action:hover .dashicons {
	color: var(--boxcart-primary);
}

/* Welcome / Empty State */
.boxcart-welcome {
	text-align: center;
	padding: var(--boxcart-space-10) var(--boxcart-space-6);
	background: var(--boxcart-white);
	border-radius: var(--boxcart-radius-lg);
	box-shadow: var(--boxcart-shadow-sm);
	border: 1px solid var(--boxcart-grey-200);
	margin-bottom: var(--boxcart-space-6);
}

.boxcart-welcome__icon {
	margin-bottom: var(--boxcart-space-4);
}

.boxcart-welcome__icon .dashicons {
	font-size: 64px;
	width: 64px;
	height: 64px;
	color: var(--boxcart-primary);
	opacity: 0.8;
}

.boxcart-welcome__title {
	margin: 0 0 var(--boxcart-space-3) 0;
	font-size: var(--boxcart-text-2xl);
	font-weight: var(--boxcart-font-semibold);
	color: var(--boxcart-grey-900);
}

.boxcart-welcome__text {
	margin: 0 0 var(--boxcart-space-6) 0;
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-600);
	max-width: 400px;
	margin-left: auto;
	margin-right: auto;
}

.boxcart-welcome__actions {
	display: flex;
	gap: var(--boxcart-space-3);
	justify-content: center;
}

.boxcart-welcome__actions .boxcart-btn .dashicons {
	margin-right: var(--boxcart-space-2);
}

/* Quick Start Guide */
.boxcart-quickstart__steps {
	padding: var(--boxcart-space-4);
}

.boxcart-quickstart__step {
	display: flex;
	gap: var(--boxcart-space-4);
	padding: var(--boxcart-space-4) 0;
	border-bottom: 1px solid var(--boxcart-grey-100);
}

.boxcart-quickstart__step:last-child {
	border-bottom: none;
}

.boxcart-quickstart__step-number {
	width: 32px;
	height: 32px;
	background: var(--boxcart-grey-100);
	color: var(--boxcart-grey-600);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: var(--boxcart-font-semibold);
	font-size: var(--boxcart-text-sm);
	flex-shrink: 0;
}

.boxcart-quickstart__step--done .boxcart-quickstart__step-number {
	background: var(--boxcart-success);
	color: var(--boxcart-white);
}

.boxcart-quickstart__step--done .boxcart-quickstart__step-number::before {
	content: '\2713';
}

.boxcart-quickstart__step--done .boxcart-quickstart__step-number {
	font-size: 0;
}

.boxcart-quickstart__step--done .boxcart-quickstart__step-number::before {
	font-size: var(--boxcart-text-sm);
}

.boxcart-quickstart__step-content h4 {
	margin: 0 0 var(--boxcart-space-1) 0;
	font-size: var(--boxcart-text-base);
	font-weight: var(--boxcart-font-medium);
	color: var(--boxcart-grey-800);
}

.boxcart-quickstart__step-content p {
	margin: 0;
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-500);
}

/* Compact Empty State */
.boxcart-empty-state--compact {
	padding: var(--boxcart-space-6);
	text-align: center;
}

.boxcart-empty-state--compact .dashicons {
	font-size: 40px;
	width: 40px;
	height: 40px;
	color: var(--boxcart-grey-300);
	margin-bottom: var(--boxcart-space-3);
}

.boxcart-empty-state--compact p {
	margin: 0;
	color: var(--boxcart-grey-500);
	font-size: var(--boxcart-text-sm);
}

/* Muted text helper */
.boxcart-text--muted {
	color: var(--boxcart-grey-500);
	font-size: var(--boxcart-text-sm);
	margin-left: var(--boxcart-space-1);
}

/* Link styles */
.boxcart-link--primary {
	color: var(--boxcart-primary);
	text-decoration: none;
	font-weight: var(--boxcart-font-medium);
}

.boxcart-link--primary:hover {
	text-decoration: underline;
}

/* Card action link */
.boxcart-card__action {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-primary);
	text-decoration: none;
}

.boxcart-card__action:hover {
	text-decoration: underline;
}

/* Card body */
.boxcart-card__body {
	color: var(--boxcart-grey-600);
	font-size: var(--boxcart-text-sm);
	line-height: 1.6;
}

.boxcart-card__body p:first-child {
	margin-top: 0;
}

.boxcart-card__body p:last-child {
	margin-bottom: 0;
}

/* Card footer */
.boxcart-card__footer {
	margin-top: var(--boxcart-space-4);
	padding-top: var(--boxcart-space-4);
	border-top: 1px solid var(--boxcart-grey-100);
	text-align: center;
}

.boxcart-card__footer a:not(.boxcart-btn) {
	color: var(--boxcart-grey-500);
	font-size: var(--boxcart-text-sm);
	text-decoration: none;
}

.boxcart-card__footer a:not(.boxcart-btn):hover {
	color: var(--boxcart-primary);
	text-decoration: underline;
}

/* Alert Card */
.boxcart-card--alert {
	border-left: 4px solid var(--boxcart-warning-500);
	margin-bottom: var(--boxcart-space-5);
}

.boxcart-card--alert .boxcart-card__title {
	display: flex;
	align-items: center;
}

/* Compact Table */
.boxcart-table--compact th,
.boxcart-table--compact td {
	padding: var(--boxcart-space-2) var(--boxcart-space-3);
}

.boxcart-table--compact .column-stock {
	width: 120px;
	text-align: center;
}

.boxcart-table--compact .column-actions {
	width: 140px;
	text-align: right;
}

/* ==========================================================================
   Import Wizard
   ========================================================================== */

/* Wizard Container */
.boxcart-wizard {
	max-width: 900px;
}

/* Step Indicator Bar */
.boxcart-wizard__steps {
	display: flex;
	align-items: center;
	margin-bottom: var(--boxcart-space-8);
	padding: 0 var(--boxcart-space-4);
}

.boxcart-wizard__step-indicator {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	flex-shrink: 0;
}

.boxcart-wizard__step-number {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: var(--boxcart-radius-full);
	font-size: var(--boxcart-text-base);
	font-weight: var(--boxcart-font-semibold);
	background: var(--boxcart-grey-100);
	color: var(--boxcart-grey-500);
	border: 2px solid var(--boxcart-grey-200);
	transition: all var(--boxcart-transition-normal);
}

.boxcart-wizard__step-label {
	font-size: var(--boxcart-text-base);
	font-weight: var(--boxcart-font-medium);
	color: var(--boxcart-grey-400);
	transition: color var(--boxcart-transition-normal);
}

/* Active step */
.boxcart-wizard__step-indicator--active .boxcart-wizard__step-number {
	background: var(--boxcart-primary);
	color: var(--boxcart-white);
	border-color: var(--boxcart-primary);
}

.boxcart-wizard__step-indicator--active .boxcart-wizard__step-label {
	color: var(--boxcart-grey-800);
}

/* Completed step */
.boxcart-wizard__step-indicator--completed .boxcart-wizard__step-number {
	background: var(--boxcart-primary-light);
	color: var(--boxcart-primary);
	border-color: var(--boxcart-primary);
}

.boxcart-wizard__step-indicator--completed .boxcart-wizard__step-label {
	color: var(--boxcart-grey-600);
}

/* Connector line between steps */
.boxcart-wizard__step-connector {
	flex: 1;
	height: 2px;
	background: var(--boxcart-grey-200);
	margin: 0 var(--boxcart-space-4);
	transition: background var(--boxcart-transition-normal);
}

.boxcart-wizard__step-connector--completed {
	background: var(--boxcart-primary);
}

/* Step Panels */
.boxcart-wizard__panel {
	display: none;
}

.boxcart-wizard__panel--active {
	display: block;
}

/* Step 1: Upload */
.boxcart-wizard__upload-area {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--boxcart-space-3);
	padding: var(--boxcart-space-10) var(--boxcart-space-8);
	border: 2px dashed var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-xl);
	background: var(--boxcart-grey-50);
	cursor: pointer;
	transition: border-color var(--boxcart-transition-fast), background var(--boxcart-transition-fast);
}

.boxcart-wizard__upload-area:hover {
	border-color: var(--boxcart-primary);
	background: var(--boxcart-primary-light);
}

.boxcart-wizard__upload-area--dragover {
	border-color: var(--boxcart-primary);
	background: var(--boxcart-primary-light);
}

.boxcart-wizard__upload-area--has-file {
	border-style: solid;
	border-color: var(--boxcart-primary);
	background: var(--boxcart-primary-light);
}

.boxcart-wizard__upload-icon {
	color: var(--boxcart-grey-400);
}

.boxcart-wizard__upload-area--has-file .boxcart-wizard__upload-icon {
	color: var(--boxcart-primary);
}

.boxcart-wizard__upload-text {
	font-size: var(--boxcart-text-md);
	font-weight: var(--boxcart-font-medium);
	color: var(--boxcart-grey-700);
}

.boxcart-wizard__upload-hint {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-500);
}

.boxcart-wizard__upload-file {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
	font-size: var(--boxcart-text-base);
	font-weight: var(--boxcart-font-medium);
	color: var(--boxcart-primary);
}

.boxcart-wizard__upload-input {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	cursor: pointer;
}

.boxcart-wizard__upload-options {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-6);
	margin-top: var(--boxcart-space-5);
}

.boxcart-wizard__upload-options .boxcart-radio {
	font-size: var(--boxcart-text-base);
}

/* Step 2: Column Mapping */
.boxcart-wizard__mapping-layout {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-6);
}

.boxcart-wizard__mapping-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.boxcart-wizard__mapping-header h3 {
	margin: 0;
	font-size: var(--boxcart-text-lg);
	font-weight: var(--boxcart-font-semibold);
	color: var(--boxcart-grey-800);
}

.boxcart-wizard__mapping-info {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
	padding: var(--boxcart-space-2) var(--boxcart-space-3);
	background: var(--boxcart-info-light);
	border-radius: var(--boxcart-radius-md);
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-info);
}

.boxcart-wizard__mapping-grid {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	overflow: hidden;
}

.boxcart-wizard__mapping-row {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: var(--boxcart-space-4);
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	border-bottom: 1px solid var(--boxcart-grey-100);
	background: var(--boxcart-white);
}

.boxcart-wizard__mapping-row:last-child {
	border-bottom: none;
}

.boxcart-wizard__mapping-row--header {
	background: var(--boxcart-grey-50);
	font-weight: var(--boxcart-font-semibold);
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-600);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	padding: var(--boxcart-space-2) var(--boxcart-space-4);
}

.boxcart-wizard__mapping-source {
	font-size: var(--boxcart-text-base);
	font-weight: var(--boxcart-font-medium);
	color: var(--boxcart-grey-800);
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
}

.boxcart-wizard__mapping-source code {
	background: var(--boxcart-grey-100);
	padding: 2px 8px;
	border-radius: var(--boxcart-radius-sm);
	font-size: var(--boxcart-text-sm);
}

.boxcart-wizard__mapping-arrow {
	color: var(--boxcart-grey-400);
	flex-shrink: 0;
}

.boxcart-wizard__mapping-target {
	display: flex;
	align-items: center;
}

.boxcart-wizard__mapping-target .boxcart-select {
	width: 100%;
}

.boxcart-wizard__mapping-warning {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	background: var(--boxcart-warning-light);
	border: 1px solid var(--boxcart-warning);
	border-radius: var(--boxcart-radius-md);
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-warning);
}

.boxcart-wizard__mapping-warning svg {
	flex-shrink: 0;
}

/* Duplicate mapping warning */
.boxcart-wizard__mapping-row--duplicate .boxcart-select {
	border-color: var(--boxcart-warning);
}

/* Preview Table */
.boxcart-wizard__preview {
	margin-top: var(--boxcart-space-5);
}

.boxcart-wizard__preview h4 {
	margin: 0 0 var(--boxcart-space-3);
	font-size: var(--boxcart-text-md);
	font-weight: var(--boxcart-font-semibold);
	color: var(--boxcart-grey-700);
}

.boxcart-wizard__preview-table-wrap {
	overflow-x: auto;
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
}

.boxcart-wizard__preview-table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--boxcart-text-sm);
}

.boxcart-wizard__preview-table th {
	background: var(--boxcart-grey-50);
	padding: var(--boxcart-space-2) var(--boxcart-space-3);
	text-align: left;
	font-weight: var(--boxcart-font-semibold);
	color: var(--boxcart-grey-700);
	white-space: nowrap;
	border-bottom: 1px solid var(--boxcart-grey-200);
}

.boxcart-wizard__preview-table td {
	padding: var(--boxcart-space-2) var(--boxcart-space-3);
	color: var(--boxcart-grey-600);
	border-bottom: 1px solid var(--boxcart-grey-100);
	max-width: 200px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.boxcart-wizard__preview-table tr:last-child td {
	border-bottom: none;
}

/* Step 3: Options */
.boxcart-wizard__options {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-6);
}

.boxcart-wizard__option-group {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-3);
}

.boxcart-wizard__option-group label.boxcart-label {
	font-weight: var(--boxcart-font-semibold);
	color: var(--boxcart-grey-800);
}

.boxcart-wizard__option-group .boxcart-radio-group {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-2);
}

.boxcart-wizard__toggle {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	cursor: pointer;
}

.boxcart-wizard__toggle input[type="checkbox"] {
	margin: 0;
}

.boxcart-wizard__summary {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	padding: var(--boxcart-space-4);
	background: var(--boxcart-primary-light);
	border-radius: var(--boxcart-radius-lg);
	color: var(--boxcart-primary-dark);
	font-size: var(--boxcart-text-base);
	font-weight: var(--boxcart-font-medium);
}

.boxcart-wizard__summary svg {
	flex-shrink: 0;
	color: var(--boxcart-primary);
}

/* Step 4: Progress */
.boxcart-wizard__progress {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-6);
}

.boxcart-wizard__progress-bar-wrap {
	background: var(--boxcart-grey-100);
	border-radius: var(--boxcart-radius-full);
	height: 12px;
	overflow: hidden;
}

.boxcart-wizard__progress-bar {
	height: 100%;
	background: var(--boxcart-primary);
	border-radius: var(--boxcart-radius-full);
	width: 0%;
	transition: width 0.3s ease;
}

.boxcart-wizard__progress-text {
	text-align: center;
	font-size: var(--boxcart-text-md);
	font-weight: var(--boxcart-font-medium);
	color: var(--boxcart-grey-700);
}

.boxcart-wizard__stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--boxcart-space-4);
}

.boxcart-wizard__stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: var(--boxcart-space-4);
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
}

.boxcart-wizard__stat-value {
	font-size: var(--boxcart-text-3xl);
	font-weight: var(--boxcart-font-bold);
	line-height: 1;
	margin-bottom: var(--boxcart-space-1);
}

.boxcart-wizard__stat-label {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-500);
	font-weight: var(--boxcart-font-medium);
}

.boxcart-wizard__stat--created .boxcart-wizard__stat-value {
	color: var(--boxcart-success);
}

.boxcart-wizard__stat--updated .boxcart-wizard__stat-value {
	color: var(--boxcart-info);
}

.boxcart-wizard__stat--skipped .boxcart-wizard__stat-value {
	color: var(--boxcart-warning);
}

.boxcart-wizard__stat--errors .boxcart-wizard__stat-value {
	color: var(--boxcart-error);
}

/* Error List */
.boxcart-wizard__errors {
	margin-top: var(--boxcart-space-4);
}

.boxcart-wizard__errors-toggle {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
	background: none;
	border: none;
	cursor: pointer;
	font-size: var(--boxcart-text-base);
	font-weight: var(--boxcart-font-medium);
	color: var(--boxcart-error);
	padding: var(--boxcart-space-2) 0;
}

.boxcart-wizard__errors-toggle svg {
	transition: transform var(--boxcart-transition-fast);
}

.boxcart-wizard__errors-toggle--open svg {
	transform: rotate(90deg);
}

.boxcart-wizard__errors-list {
	display: none;
	margin-top: var(--boxcart-space-2);
}

.boxcart-wizard__errors-list--open {
	display: block;
}

.boxcart-wizard__errors-table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--boxcart-text-sm);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
	overflow: hidden;
}

.boxcart-wizard__errors-table th {
	background: var(--boxcart-error-light);
	padding: var(--boxcart-space-2) var(--boxcart-space-3);
	text-align: left;
	font-weight: var(--boxcart-font-semibold);
	color: var(--boxcart-error);
	border-bottom: 1px solid var(--boxcart-grey-200);
}

.boxcart-wizard__errors-table td {
	padding: var(--boxcart-space-2) var(--boxcart-space-3);
	border-bottom: 1px solid var(--boxcart-grey-100);
	color: var(--boxcart-grey-700);
}

.boxcart-wizard__errors-table .column-row {
	width: 80px;
	font-weight: var(--boxcart-font-medium);
}

/* Done state */
.boxcart-wizard__done {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--boxcart-space-4);
	padding: var(--boxcart-space-6) 0;
}

.boxcart-wizard__done-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border-radius: var(--boxcart-radius-full);
	background: var(--boxcart-success-light);
	color: var(--boxcart-success);
}

.boxcart-wizard__done-text {
	font-size: var(--boxcart-text-xl);
	font-weight: var(--boxcart-font-semibold);
	color: var(--boxcart-grey-800);
}

/* Action Bar */
.boxcart-wizard__actions {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: var(--boxcart-space-8);
	padding-top: var(--boxcart-space-5);
	border-top: 1px solid var(--boxcart-grey-200);
}

.boxcart-wizard__actions-left {
	display: flex;
	gap: var(--boxcart-space-3);
}

.boxcart-wizard__actions-right {
	display: flex;
	gap: var(--boxcart-space-3);
}

/* Responsive */
@media (max-width: 768px) {
	.boxcart-wizard__steps {
		padding: 0;
	}

	.boxcart-wizard__step-label {
		display: none;
	}

	.boxcart-wizard__step-connector {
		margin: 0 var(--boxcart-space-2);
	}

	.boxcart-wizard__mapping-row {
		grid-template-columns: 1fr;
		gap: var(--boxcart-space-2);
	}

	.boxcart-wizard__mapping-row--header {
		display: none;
	}

	.boxcart-wizard__mapping-arrow {
		display: none;
	}

	.boxcart-wizard__stats {
		grid-template-columns: repeat(2, 1fr);
	}

	.boxcart-wizard__upload-options {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* Responsive */
@media (max-width: 1024px) {
	.boxcart-stats {
		grid-template-columns: 1fr;
	}

	.boxcart-dashboard-grid {
		grid-template-columns: 1fr;
	}
}


/* ============================================
   Order Messages
   ============================================ */

.boxcart-messages__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	margin-left: 8px;
	background-color: #d9534f;
	color: #fff;
	font-size: 11px;
	font-weight: 600;
	border-radius: 10px;
	line-height: 1;
}

.boxcart-messages__thread {
	max-height: 350px;
	overflow-y: auto;
	padding: 12px 0;
	margin-bottom: 16px;
	border-bottom: 1px solid #e9ecef;
}

.boxcart-messages__empty {
	color: #999;
	font-size: 13px;
	font-style: italic;
	text-align: center;
	padding: 20px 0;
	margin: 0;
}

.boxcart-message {
	margin-bottom: 12px;
	max-width: 85%;
}

.boxcart-message:last-child {
	margin-bottom: 0;
}

.boxcart-message--admin {
	margin-right: auto;
}

.boxcart-message--customer {
	margin-left: auto;
}

.boxcart-message__header {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 4px;
	font-size: 11px;
	color: #999;
}

.boxcart-message__sender {
	font-weight: 600;
	color: #666;
}

.boxcart-message__body {
	padding: 10px 14px;
	border-radius: 12px;
	font-size: 13px;
	line-height: 1.5;
	white-space: pre-wrap;
	word-wrap: break-word;
}

.boxcart-message--admin .boxcart-message__body {
	background-color: #f0f0f0;
	color: #333;
	border-top-left-radius: 4px;
}

.boxcart-message--customer .boxcart-message__body {
	background-color: #e8f5e9;
	color: #1a1a1a;
	border-top-right-radius: 4px;
}

.boxcart-messages__compose {
	padding-top: 4px;
}

.boxcart-messages__compose .boxcart-textarea {
	width: 100%;
	margin-bottom: 8px;
	resize: vertical;
	min-height: 70px;
}

.boxcart-messages__hint {
	margin: 6px 0 0;
	font-size: 12px;
	color: #999;
	font-style: italic;
}

/* ==========================================================================
   Orders Page - Bulk Actions
   ========================================================================== */

.boxcart-bulk-actions {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	background: var(--boxcart-info-light);
	border: 1px solid #c5d9ed;
	border-radius: var(--boxcart-radius-md);
	padding: var(--boxcart-space-2) var(--boxcart-space-4);
	margin-top: var(--boxcart-space-3);
}

.boxcart-bulk-actions__count {
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-900);
}

.boxcart-bulk-actions .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	margin-right: 2px;
}

/* ==========================================================================
   Page Header Actions
   ========================================================================== */

.boxcart-page-header__actions {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
}

.boxcart-page-header__actions > .boxcart-btn .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	margin-right: var(--boxcart-space-1);
}

/* ==========================================================================
   Export Modal
   ========================================================================== */

.boxcart-export-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: var(--boxcart-z-modal);
	display: flex;
	align-items: center;
	justify-content: center;
}

.boxcart-export-modal__backdrop {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
}

.boxcart-export-modal__content {
	position: relative;
	background: var(--boxcart-white);
	border-radius: var(--boxcart-radius-xl);
	box-shadow: var(--boxcart-shadow-xl);
	width: 100%;
	max-width: 480px;
	max-height: 90vh;
	overflow-y: auto;
}

.boxcart-export-modal__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: var(--boxcart-space-4) var(--boxcart-space-5);
	border-bottom: 1px solid var(--boxcart-grey-200);
}

.boxcart-export-modal__header h2 {
	margin: 0;
	font-size: var(--boxcart-text-lg);
	font-weight: var(--boxcart-font-semibold);
}

.boxcart-export-modal__close {
	background: none;
	border: none;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	color: var(--boxcart-grey-500);
	padding: var(--boxcart-space-1);
	transition: color var(--boxcart-transition-fast);
}

.boxcart-export-modal__close:hover {
	color: var(--boxcart-grey-900);
}

/* ==========================================================================
   Export Form
   ========================================================================== */

.boxcart-export-form {
	padding: var(--boxcart-space-5);
}

.boxcart-export-form__row {
	margin-bottom: var(--boxcart-space-4);
}

.boxcart-export-form__row label {
	display: block;
	font-weight: var(--boxcart-font-semibold);
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-700);
	margin-bottom: var(--boxcart-space-2);
}

.boxcart-export-form__row select.boxcart-select {
	display: block;
	width: 100%;
	height: 40px;
	padding: var(--boxcart-space-2) var(--boxcart-space-8) var(--boxcart-space-2) var(--boxcart-space-3);
	border: 1px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	background-color: var(--boxcart-white);
	font-size: var(--boxcart-text-md);
	color: var(--boxcart-grey-700);
	box-sizing: border-box;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2350575E' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	cursor: pointer;
	text-align: center;
	text-align-last: center;
}

.boxcart-export-form__row .boxcart-input,
.boxcart-export-form__row input[type="date"] {
	display: block;
	width: 100%;
	height: 40px;
	padding: var(--boxcart-space-2) var(--boxcart-space-3);
	border: 1px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	background-color: var(--boxcart-white);
	font-size: var(--boxcart-text-md);
	color: var(--boxcart-grey-700);
	box-sizing: border-box;
}

.boxcart-export-form__row select:focus,
.boxcart-export-form__row .boxcart-select:focus,
.boxcart-export-form__row .boxcart-input:focus {
	border-color: var(--boxcart-primary);
	outline: none;
	box-shadow: 0 0 0 1px var(--boxcart-primary);
}

.boxcart-export-form__row input[type="date"] {
	cursor: pointer;
}

.boxcart-export-form__row input[type="date"]:focus {
	border-color: var(--boxcart-primary);
	outline: none;
	box-shadow: 0 0 0 1px var(--boxcart-primary);
}

.boxcart-export-form__dates {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
}

.boxcart-export-form__dates .boxcart-input,
.boxcart-export-form__dates input[type="date"] {
	flex: 1 1 0;
	min-width: 0;
	width: auto;
}

.boxcart-export-form__dates span {
	color: var(--boxcart-grey-500);
	font-size: var(--boxcart-text-md);
	flex-shrink: 0;
	padding: 0 var(--boxcart-space-1);
}

.boxcart-export-form__actions {
	display: flex;
	justify-content: flex-end;
	gap: var(--boxcart-space-3);
	margin-top: var(--boxcart-space-6);
	padding-top: var(--boxcart-space-5);
	border-top: 1px solid var(--boxcart-grey-200);
}

.boxcart-export-form__actions .boxcart-btn {
	display: inline-flex;
	align-items: center;
	gap: var(--boxcart-space-2);
}

.boxcart-export-form__actions .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

/* ==========================================================================
   Status Tabs
   ========================================================================== */

.boxcart-status-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	list-style: none;
	margin: 0 0 var(--boxcart-space-4) 0;
	padding: 0;
	border-bottom: 1px solid var(--boxcart-grey-200);
}

.boxcart-status-tabs li {
	margin: 0;
}

.boxcart-status-tabs a {
	display: block;
	padding: var(--boxcart-space-2) var(--boxcart-space-4);
	text-decoration: none;
	color: var(--boxcart-grey-600);
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	transition: color var(--boxcart-transition-fast), border-color var(--boxcart-transition-fast);
}

.boxcart-status-tabs a:hover {
	color: var(--boxcart-primary);
}

.boxcart-status-tabs a.current {
	color: var(--boxcart-primary);
	border-bottom-color: var(--boxcart-primary);
	font-weight: var(--boxcart-font-semibold);
}

.boxcart-status-tabs .count {
	color: var(--boxcart-grey-500);
	font-weight: var(--boxcart-font-normal);
}

/* ==========================================================================
   Orders Table Columns
   ========================================================================== */

.boxcart-orders-table .column-checkbox {
	width: 40px;
	text-align: center;
}

.boxcart-orders-table .column-order {
	width: 140px;
}

.boxcart-orders-table .column-items {
	width: 60px;
	text-align: center;
}

.boxcart-orders-table .column-total {
	width: 100px;
}

.boxcart-orders-table .column-status {
	width: 110px;
}

.boxcart-orders-table .column-date {
	width: 100px;
}

/* ==========================================================================
   Products Page - Bulk Bar
   ========================================================================== */

.boxcart-bulk-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	background: var(--boxcart-primary-light);
	border: 1px solid var(--boxcart-primary);
	border-radius: var(--boxcart-radius-lg);
	margin-bottom: var(--boxcart-space-4);
}

.boxcart-bulk-bar__info {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-700);
}

.boxcart-bulk-bar__actions {
	display: flex;
	gap: var(--boxcart-space-2);
}

/* ==========================================================================
   Order & Customer Info
   ========================================================================== */

.boxcart-customer-info,
.boxcart-collection-info {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.boxcart-customer-email,
.boxcart-location-name {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-500);
}

.boxcart-slot-date {
	font-weight: var(--boxcart-font-medium);
}

.boxcart-slot-time {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-500);
}

.boxcart-date {
	color: var(--boxcart-grey-500);
	font-size: var(--boxcart-text-base);
}

/* Pagination styles are in the Pagination Branded section above */

/* ==========================================================================
   Settings Page — Autosave Toast
   ========================================================================== */

.boxcart-autosave-toast {
	position: fixed;
	bottom: 24px;
	right: 24px;
	z-index: 99999;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 24px;
	background: #2D7D5F;
	color: #ffffff;
	border-radius: 8px;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
	font-size: 14px;
	font-weight: 600;
	opacity: 0;
	transform: translateY(10px);
	transition: opacity 0.3s ease, transform 0.3s ease;
	pointer-events: none;
}

.boxcart-autosave-toast.is-visible {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

.boxcart-autosave-toast .dashicons {
	color: #ffffff;
}

.boxcart-autosave-toast .dashicons.spin {
	animation: boxcart-spin 1s linear infinite;
}

/* ==========================================================================
   Settings Page — Settings-Specific Styles
   ========================================================================== */

.boxcart-settings-form .boxcart-card {
	margin-bottom: var(--boxcart-space-5);
}

.boxcart-settings-form .boxcart-colour-picker {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
}

.boxcart-settings-form .boxcart-colour-input {
	width: 48px;
	height: 38px;
	padding: 2px;
	border: 1px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	cursor: pointer;
	background: transparent;
}

.boxcart-settings-form .boxcart-colour-hex {
	width: 100px !important;
	text-transform: uppercase;
}

.boxcart-radio-group--inline {
	flex-direction: row;
	gap: var(--boxcart-space-6);
}

/* Emails tab layout */
.boxcart-emails-layout {
	display: grid;
	grid-template-columns: 1fr 280px;
	gap: var(--boxcart-space-5);
	align-items: start;
}

.boxcart-emails-layout__main {
	min-width: 0;
}

.boxcart-emails-layout__sidebar {
	position: sticky;
	top: 32px; /* Account for WP admin bar */
}

.boxcart-card--sticky {
	position: sticky;
	top: 32px;
}

@media (max-width: 1200px) {
	.boxcart-emails-layout {
		grid-template-columns: 1fr;
	}

	.boxcart-emails-layout__sidebar {
		position: static;
	}

	.boxcart-card--sticky {
		position: static;
	}
}

/* Email Templates Accordion (Settings overrides) */
.boxcart-settings-form .boxcart-email-templates {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-2);
}

.boxcart-settings-form .boxcart-email-template {
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-md);
	background: var(--boxcart-white);
	overflow: hidden;
}

.boxcart-settings-form .boxcart-email-template__header {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	padding: var(--boxcart-space-3);
	background: var(--boxcart-grey-50);
	border-bottom: 1px solid transparent;
}

.boxcart-settings-form .boxcart-email-template.is-expanded .boxcart-email-template__header {
	border-bottom-color: var(--boxcart-grey-200);
}

.boxcart-email-template__toggle {
	flex-shrink: 0;
}

.boxcart-settings-form .boxcart-email-template__info {
	flex: 1;
	min-width: 0;
}

.boxcart-settings-form .boxcart-email-template__info strong {
	display: block;
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-900);
}

.boxcart-settings-form .boxcart-email-template__desc {
	display: block;
	font-size: 12px;
	color: var(--boxcart-grey-500);
	margin-top: 2px;
}

.boxcart-settings-form .boxcart-email-template__expand {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	padding: 0;
	background: transparent;
	border: none;
	border-radius: var(--boxcart-radius-sm);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--boxcart-grey-500);
	transition: background-color 0.2s, color 0.2s, transform 0.2s;
}

.boxcart-settings-form .boxcart-email-template__expand:hover {
	background: var(--boxcart-grey-200);
	color: var(--boxcart-grey-700);
}

.boxcart-settings-form .boxcart-email-template__expand[aria-expanded="true"] .dashicons {
	transform: rotate(180deg);
}

.boxcart-settings-form .boxcart-email-template__body {
	padding: var(--boxcart-space-4);
	background: var(--boxcart-white);
}

.boxcart-settings-form .boxcart-email-template__actions {
	margin-top: var(--boxcart-space-3);
	padding-top: var(--boxcart-space-3);
	border-top: 1px solid var(--boxcart-grey-200);
}

/* Small toggle variant */
.boxcart-toggle--small {
	width: 36px;
	height: 20px;
}

.boxcart-toggle--small .boxcart-toggle__slider:before {
	width: 14px;
	height: 14px;
	left: 3px;
	bottom: 3px;
}

.boxcart-toggle--small input:checked + .boxcart-toggle__slider:before {
	transform: translateX(16px);
}

/* Placeholder tags - clickable to copy */
.boxcart-placeholder-tag {
	cursor: pointer;
	background: var(--boxcart-white);
	padding: 2px 8px;
	border-radius: var(--boxcart-radius-sm);
	font-size: 12px;
	transition: background-color 0.2s, transform 0.1s;
	user-select: none;
}

.boxcart-placeholder-tag:hover {
	background: var(--boxcart-grey-100);
	transform: translateY(-1px);
}

.boxcart-placeholder-tag:active {
	transform: translateY(0);
}

.boxcart-placeholder-tag.copied {
	background: #d1fae5;
	color: #065f46;
}

/* Shortcodes tab styles */
.boxcart-shortcodes-intro {
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-600);
	margin: 0 0 var(--boxcart-space-5) 0;
}

.boxcart-shortcodes-list {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-4);
}

.boxcart-shortcode-item {
	padding: var(--boxcart-space-4);
	background: var(--boxcart-grey-50);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-lg);
}

.boxcart-shortcode-item__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: var(--boxcart-space-3);
}

.boxcart-shortcode-item__name {
	font-size: var(--boxcart-text-md);
	font-weight: 600;
	color: var(--boxcart-grey-800);
	margin: 0;
}

.boxcart-shortcode-item__code {
	display: block;
	padding: var(--boxcart-space-3);
	background: var(--boxcart-white);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-md);
	font-family: monospace;
	font-size: var(--boxcart-text-md);
	color: var(--boxcart-primary-dark);
	margin-bottom: var(--boxcart-space-3);
}

.boxcart-shortcode-item__description {
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-600);
	margin: 0 0 var(--boxcart-space-3) 0;
}

.boxcart-shortcode-item__attributes {
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-700);
}

.boxcart-shortcode-item__attributes strong {
	display: block;
	margin-bottom: var(--boxcart-space-2);
}

.boxcart-shortcode-item__attributes ul {
	margin: 0;
	padding-left: var(--boxcart-space-5);
}

.boxcart-shortcode-item__attributes li {
	margin-bottom: var(--boxcart-space-1);
}

.boxcart-shortcode-item__attributes code {
	background: var(--boxcart-grey-100);
	padding: 2px 6px;
	border-radius: var(--boxcart-radius-sm);
	font-size: var(--boxcart-text-xs);
}

.boxcart-btn--success {
	background: var(--boxcart-success) !important;
	border-color: var(--boxcart-success) !important;
	color: var(--boxcart-white) !important;
}

/* Quick Start Guide (Settings) */
.boxcart-quickstart {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-4);
}

.boxcart-settings-form .boxcart-quickstart__step {
	display: flex;
	gap: var(--boxcart-space-4);
	padding: var(--boxcart-space-4);
	background: var(--boxcart-grey-50);
	border-radius: var(--boxcart-radius-lg);
}

.boxcart-quickstart__number {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background: var(--boxcart-primary);
	color: var(--boxcart-white);
	border-radius: 50%;
	font-weight: 600;
	flex-shrink: 0;
}

.boxcart-quickstart__content strong {
	display: block;
	margin-bottom: var(--boxcart-space-1);
	color: var(--boxcart-grey-800);
}

.boxcart-quickstart__content p {
	margin: 0;
	color: var(--boxcart-grey-600);
	font-size: var(--boxcart-text-base);
}

/* Spin animation for loading (generic) */
@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

.spin {
	animation: spin 1s linear infinite;
}

/* ==========================================================================
   Order View
   ========================================================================== */

/* Branded Notice (Order View override) */
.boxcart-admin--order-view .boxcart-notice {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 16px;
	border-radius: 6px;
	margin-bottom: 20px;
}

.boxcart-admin--order-view .boxcart-notice p {
	margin: 0;
	font-size: 14px;
}

.boxcart-admin--order-view .boxcart-notice .dashicons {
	font-size: 20px;
	width: 20px;
	height: 20px;
}

.boxcart-admin--order-view .boxcart-notice--success {
	background-color: #e8f5e9;
	border: 1px solid #a5d6a7;
	color: #2e7d32;
}

.boxcart-admin--order-view .boxcart-notice--success .dashicons {
	color: #4caf50;
}

/* Order Header */
.boxcart-order-header {
	margin-bottom: 24px;
}

.boxcart-order-header__top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 8px;
}

.boxcart-order-header__title {
	display: flex;
	align-items: center;
	gap: 12px;
}

.boxcart-back-link {
	color: var(--boxcart-primary, #4caf50);
	text-decoration: none;
	font-size: 13px;
}

.boxcart-back-link:hover {
	color: var(--boxcart-primary-hover, #2e7d32);
	text-decoration: underline;
}

.boxcart-page-title {
	margin: 0;
}

/* Status badge colors by status (Order View) */
.boxcart-admin--order-view .boxcart-status-badge {
	display: inline-block;
	padding: 6px 14px;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	border-radius: 4px;
	color: #fff;
}

.boxcart-status-badge--pending {
	background-color: #f0ad4e;
}

.boxcart-status-badge--processing {
	background-color: #5bc0de;
}

.boxcart-status-badge--ready {
	background-color: #2e7d32;
}

.boxcart-status-badge--completed {
	background-color: #4caf50;
}

.boxcart-status-badge--cancelled {
	background-color: #d9534f;
}

.boxcart-order-view {
	display: grid;
	grid-template-columns: 1fr 350px;
	gap: var(--boxcart-space-6, 24px);
	align-items: start;
}

.boxcart-order-view__main {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-6, 24px);
}

.boxcart-order-view__sidebar {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-6, 24px);
}

/* Card overrides for Order View */
.boxcart-admin--order-view .boxcart-card {
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 4px;
	padding: 16px 20px;
	margin-bottom: 0; /* Override main CSS - use gap for spacing instead */
}

.boxcart-admin--order-view .boxcart-card__title {
	font-size: 14px;
	font-weight: 600;
	margin: 0 0 16px 0;
	padding-bottom: 12px;
	border-bottom: 1px solid #eee;
}

.boxcart-card__title--with-icon {
	display: flex;
	align-items: center;
	gap: 8px;
}

.boxcart-card__title--with-icon .dashicons {
	color: var(--boxcart-primary, #4caf50);
	font-size: 18px;
	width: 18px;
	height: 18px;
}

/* Full width button modifier */
.boxcart-btn--full-width {
	width: 100%;
	justify-content: center;
}

.boxcart-items-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid #dcdcde;
	border-radius: 8px;
	overflow: hidden;
}

.boxcart-items-table th,
.boxcart-items-table td {
	padding: 10px 12px;
	text-align: left;
	border-bottom: 1px solid #eee;
}

.boxcart-items-table th {
	font-weight: 600;
	font-size: 12px;
	text-transform: uppercase;
	color: #666;
	background: #f9f9f9;
}

.boxcart-items-table thead tr:first-child th:first-child {
	border-top-left-radius: 8px;
}

.boxcart-items-table thead tr:first-child th:last-child {
	border-top-right-radius: 8px;
}

.boxcart-items-table tbody tr:last-child td:first-child {
	border-bottom-left-radius: 8px;
}

.boxcart-items-table tbody tr:last-child td:last-child {
	border-bottom-right-radius: 8px;
}

.boxcart-items-table .column-qty,
.boxcart-items-table .column-price,
.boxcart-items-table .column-total {
	text-align: right;
	width: 80px;
}

.boxcart-items-table .column-sku {
	width: 100px;
}

.boxcart-items-table tfoot tr {
	border-top: 2px solid #ddd;
}

.boxcart-items-table tfoot .text-right {
	text-align: right;
}

.boxcart-items-table .total-row td {
	font-size: 16px;
}

.boxcart-items-table .discount-row td {
	color: #5cb85c;
}

.boxcart-items-table .discount-row .discount-amount {
	font-weight: 500;
}

.boxcart-customer-notes {
	margin: 0;
	padding: 12px;
	background: #fff8dc;
	border-radius: 4px;
	font-style: italic;
}

.boxcart-status-log {
	list-style: none;
	margin: 0;
	padding: 0;
}

.boxcart-status-log__item {
	display: flex;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px solid #eee;
}

.boxcart-status-log__item:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.boxcart-status-log__indicator {
	flex-shrink: 0;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	margin-top: 4px;
}

.boxcart-status-log__content {
	flex: 1;
}

.boxcart-status-log__header {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
}

.boxcart-status-log__date {
	font-size: 12px;
	color: #666;
}

.boxcart-status-log__note {
	margin: 6px 0 0 0;
	font-size: 13px;
	color: #444;
}

.boxcart-status-log__by {
	font-size: 11px;
	color: #999;
}

.boxcart-no-log {
	color: #666;
	font-style: italic;
	margin: 0;
}

.boxcart-form-field {
	margin-bottom: 16px;
}

.boxcart-form-field label {
	display: block;
	font-weight: 500;
	margin-bottom: 6px;
}

.boxcart-admin--order-view .boxcart-select,
.boxcart-admin--order-view .boxcart-textarea {
	width: 100%;
}

.boxcart-admin--order-view .boxcart-textarea {
	resize: vertical;
}

.boxcart-detail-row {
	margin-bottom: 8px;
	font-size: 14px;
}

.boxcart-detail-row:last-child {
	margin-bottom: 0;
}

/* Links in sidebar cards use brand green */
.boxcart-detail-row a {
	color: var(--boxcart-primary, #4caf50);
	text-decoration: none;
}

.boxcart-detail-row a:hover {
	color: var(--boxcart-primary-hover, #2e7d32);
	text-decoration: underline;
}

.boxcart-detail-label {
	color: #666;
}

.boxcart-detail-address {
	color: #666;
	font-size: 13px;
}

.boxcart-collection-datetime {
	display: flex;
	align-items: center;
	gap: 8px;
}

.boxcart-collection-datetime .dashicons {
	color: var(--boxcart-primary, #4caf50);
	font-size: 16px;
	width: 16px;
	height: 16px;
}

.boxcart-detail-instructions {
	margin-top: 12px;
	padding: 8px;
	background: #f6f7f7;
	border-radius: 4px;
	font-size: 13px;
	color: #666;
}

/* Payment status badge */
.boxcart-payment-status-badge {
	display: inline-block;
	padding: 3px 8px;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.3px;
	border-radius: 3px;
	color: #fff;
	line-height: 1.3;
}

.boxcart-transaction-id {
	font-family: monospace;
	font-size: 12px;
	color: #666;
	word-break: break-all;
}

.boxcart-stripe-test-badge {
	display: inline-block;
	padding: 2px 6px;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	background-color: #fef3cd;
	color: #856404;
	border: 1px solid #ffc107;
	border-radius: 3px;
}

@media (max-width: 1200px) {
	.boxcart-order-view {
		grid-template-columns: 1fr;
	}

	.boxcart-order-view__sidebar {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}
}

@media (max-width: 768px) {
	.boxcart-order-view__sidebar {
		grid-template-columns: 1fr;
	}
}

/* Print Modal */
.boxcart-print-modal {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 100000;
}

.boxcart-print-modal.is-open {
	display: flex;
	align-items: center;
	justify-content: center;
}

.boxcart-print-modal__overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
}

.boxcart-print-modal__content {
	position: relative;
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
	width: 100%;
	max-width: 500px;
	margin: 20px;
}

.boxcart-print-modal__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 20px;
	border-bottom: 1px solid #eee;
}

.boxcart-print-modal__title {
	font-size: 16px;
	font-weight: 600;
	margin: 0;
}

.boxcart-print-modal__close {
	background: none;
	border: none;
	cursor: pointer;
	padding: 4px;
	color: #666;
	line-height: 1;
}

.boxcart-print-modal__close:hover {
	color: #333;
}

.boxcart-print-modal__body {
	padding: 20px;
}

.boxcart-print-modal__description {
	margin: 0 0 20px 0;
	color: #666;
}

.boxcart-print-modal__options {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.boxcart-print-modal__option {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 16px;
	border: 1px solid #dcdcde;
	border-radius: 6px;
	cursor: pointer;
	transition: border-color 0.15s ease, background-color 0.15s ease;
	text-decoration: none;
	color: inherit;
}

.boxcart-print-modal__option:hover,
.boxcart-print-modal__option:focus {
	border-color: var(--boxcart-primary, #4caf50);
	background: #f8fdf8;
	text-decoration: none;
	color: inherit;
}

.boxcart-print-modal__option:active {
	text-decoration: none;
}

.boxcart-print-modal__option-icon {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #e8f5e9;
	border-radius: 6px;
	color: var(--boxcart-primary, #4caf50);
}

.boxcart-print-modal__option-icon .dashicons {
	font-size: 20px;
	width: 20px;
	height: 20px;
}

.boxcart-print-modal__option-content {
	flex: 1;
	text-align: left;
}

.boxcart-print-modal__option-title {
	font-weight: 600;
	margin-bottom: 4px;
	color: #1d2327;
	text-align: left;
}

.boxcart-print-modal__option-desc {
	font-size: 13px;
	color: #666;
	margin: 0;
	text-align: left;
}

/* ==========================================================================
   Import / Export Page
   ========================================================================== */

.boxcart-import-export-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--boxcart-space-5);
}

.boxcart-import-export-grid .boxcart-card {
	margin-bottom: 0;
}

@media (max-width: 768px) {
	.boxcart-import-export-grid {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   Reports Page
   ========================================================================== */

/* Reports Page Styles */
.boxcart-admin--reports .boxcart-page-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: var(--boxcart-space-6);
	flex-wrap: wrap;
	gap: var(--boxcart-space-4);
}

.boxcart-page-header__content {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
}

/* Period Selector */
.boxcart-period-selector {
	display: flex;
	gap: var(--boxcart-space-1);
	background: var(--boxcart-white);
	padding: var(--boxcart-space-1);
	border-radius: var(--boxcart-radius-md);
	box-shadow: var(--boxcart-shadow-sm);
	border: 1px solid var(--boxcart-grey-200);
}

.boxcart-period-btn {
	padding: var(--boxcart-space-2) var(--boxcart-space-3);
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-600);
	text-decoration: none;
	border-radius: var(--boxcart-radius-sm);
	transition: all 0.2s;
}

.boxcart-period-btn:hover {
	background: var(--boxcart-grey-50);
	color: var(--boxcart-grey-900);
}

.boxcart-period-btn--active {
	background: var(--boxcart-primary);
	color: var(--boxcart-white);
}

.boxcart-period-btn--active:hover {
	background: var(--boxcart-primary);
	color: var(--boxcart-white);
}

/* Report Stats */
.boxcart-report-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--boxcart-space-5);
	margin-bottom: var(--boxcart-space-6);
}

.boxcart-stat-card {
	background: var(--boxcart-white);
	border-radius: var(--boxcart-radius-lg);
	padding: var(--boxcart-space-5);
	box-shadow: var(--boxcart-shadow-sm);
	border: 1px solid var(--boxcart-grey-200);
}

.boxcart-stat-card__label {
	margin: 0 0 var(--boxcart-space-2) 0;
	font-size: var(--boxcart-text-xs);
	font-weight: var(--boxcart-font-medium);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--boxcart-grey-500);
}

.boxcart-stat-card__value {
	margin: 0;
	font-size: var(--boxcart-text-3xl);
	font-weight: var(--boxcart-font-bold);
	color: var(--boxcart-grey-900);
	line-height: 1;
}

.boxcart-stat-card__change {
	margin: var(--boxcart-space-2) 0 0 0;
	font-size: var(--boxcart-text-sm);
	font-weight: var(--boxcart-font-medium);
}

.boxcart-stat-card__change span {
	font-weight: var(--boxcart-font-normal);
	color: var(--boxcart-grey-500);
	margin-left: var(--boxcart-space-1);
}

.boxcart-stat-card__change--positive {
	color: var(--boxcart-success);
}

.boxcart-stat-card__change--negative {
	color: var(--boxcart-danger);
}

/* Report Charts Row */
.boxcart-report-charts {
	display: grid;
	grid-template-columns: 2fr 1fr;
	gap: var(--boxcart-space-5);
	margin-bottom: var(--boxcart-space-6);
}

.boxcart-chart-card {
	min-height: 300px;
}

.boxcart-chart-container {
	padding: var(--boxcart-space-4);
	height: 250px;
}

/* Status List */
.boxcart-status-list {
	padding: var(--boxcart-space-4);
}

.boxcart-status-item {
	display: flex;
	align-items: center;
	padding: var(--boxcart-space-2) 0;
	border-bottom: 1px solid var(--boxcart-grey-100);
}

.boxcart-status-item:last-child {
	border-bottom: none;
}

.boxcart-status-item__dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	margin-right: var(--boxcart-space-3);
}

.boxcart-status-item__label {
	flex: 1;
	color: var(--boxcart-grey-700);
}

.boxcart-status-item__count {
	font-weight: var(--boxcart-font-semibold);
	color: var(--boxcart-grey-900);
}

/* Report Tables Row */
.boxcart-report-tables {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--boxcart-space-5);
}

.boxcart-table--compact .column-number {
	text-align: right;
	white-space: nowrap;
}

.boxcart-empty-text {
	padding: var(--boxcart-space-4);
	color: var(--boxcart-grey-500);
	text-align: center;
	margin: 0;
}

/* Responsive */
@media (max-width: 1200px) {
	.boxcart-report-stats {
		grid-template-columns: repeat(2, 1fr);
	}

	.boxcart-report-charts {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 768px) {
	.boxcart-report-stats {
		grid-template-columns: 1fr;
	}

	.boxcart-report-tables {
		grid-template-columns: 1fr;
	}

	.boxcart-period-selector {
		flex-wrap: wrap;
	}
}

/* ==========================================================================
   Setup / onboarding page + dashboard setup banner
   ========================================================================== */

/* Persistent dashboard banner */
.boxcart-setup-banner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--boxcart-space-6);
	flex-wrap: wrap;
	border-left: 4px solid var(--boxcart-primary);
}

.boxcart-setup-banner__title {
	margin: 0 0 var(--boxcart-space-1) 0;
	font-size: var(--boxcart-text-lg);
	font-weight: var(--boxcart-font-semibold);
	color: var(--boxcart-grey-900);
}

.boxcart-setup-banner__text {
	margin: 0 0 var(--boxcart-space-3) 0;
	color: var(--boxcart-grey-600);
	font-size: var(--boxcart-text-md);
}

.boxcart-setup-banner__steps {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--boxcart-space-2) var(--boxcart-space-5);
}

.boxcart-setup-banner__steps li {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
	font-size: var(--boxcart-text-md);
	color: var(--boxcart-grey-600);
	margin: 0;
}

.boxcart-setup-banner__steps li.is-done {
	color: var(--boxcart-success);
}

.boxcart-setup-banner__tick {
	color: var(--boxcart-grey-400);
	font-weight: var(--boxcart-font-bold);
}

.boxcart-setup-banner__steps li.is-done .boxcart-setup-banner__tick {
	color: var(--boxcart-success);
}

.boxcart-setup-banner__action {
	flex-shrink: 0;
}

/* Checklist on the Setup page */
.boxcart-setup-checklist {
	list-style: none;
	margin: 0;
	padding: 0;
}

.boxcart-setup-checklist__item {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-4);
	padding: var(--boxcart-space-4) 0;
	border-bottom: 1px solid var(--boxcart-grey-100);
}

.boxcart-setup-checklist__item:last-child {
	border-bottom: none;
}

.boxcart-setup-checklist__mark {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	border-radius: var(--boxcart-radius-full);
	background: var(--boxcart-grey-100);
	color: var(--boxcart-grey-600);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: var(--boxcart-font-bold);
	font-size: var(--boxcart-text-md);
}

.boxcart-setup-checklist__item.is-done .boxcart-setup-checklist__mark {
	background: var(--boxcart-success-light);
	color: var(--boxcart-success);
}

.boxcart-setup-checklist__body {
	flex: 1;
	min-width: 0;
}

.boxcart-setup-checklist__body h4 {
	margin: 0 0 2px 0;
	font-size: var(--boxcart-text-md);
	font-weight: var(--boxcart-font-semibold);
	color: var(--boxcart-grey-900);
}

.boxcart-setup-checklist__body p {
	margin: 0;
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-600);
}

.boxcart-setup-checklist__action {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
}

.boxcart-setup__intro {
	margin: 0 0 var(--boxcart-space-2) 0;
	color: var(--boxcart-grey-600);
	font-size: var(--boxcart-text-md);
	line-height: 1.5;
}

.boxcart-setup__assign-note {
	margin: var(--boxcart-space-4) 0 0 0;
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-600);
}

.boxcart-setup__create-form {
	margin: 0;
}

/* Copy-able shortcode chips */
.boxcart-setup__code {
	cursor: pointer;
	display: inline-block;
	padding: 2px 8px;
	background: var(--boxcart-grey-100);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: var(--boxcart-radius-sm);
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-800);
	transition: background 150ms ease;
}

.boxcart-setup__code:hover {
	background: var(--boxcart-grey-200);
}

.boxcart-setup__code.is-copied {
	background: var(--boxcart-success-light);
	border-color: var(--boxcart-success);
	color: var(--boxcart-success);
}

/* Small button modifier (used on the checklist actions) */
.boxcart-btn--small {
	padding: 4px 12px;
	font-size: var(--boxcart-text-base);
}

/* Quick Start guide: dismiss link + footer CTA */
.boxcart-quickstart__dismiss {
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	color: var(--boxcart-grey-500);
	font-size: var(--boxcart-text-base);
	text-decoration: underline;
}

.boxcart-quickstart__dismiss:hover {
	color: var(--boxcart-grey-700);
}

.boxcart-quickstart__footer {
	margin-top: var(--boxcart-space-5);
	padding-top: var(--boxcart-space-5);
	border-top: 1px solid var(--boxcart-grey-100);
}

@media ( max-width: 600px ) {
	.boxcart-setup-checklist__item {
		flex-wrap: wrap;
	}
	.boxcart-setup-checklist__action {
		width: 100%;
		padding-left: 48px;
	}
	.boxcart-setup-banner__action {
		width: 100%;
	}
}

/* ==========================================================================
   Dialogs (BoxCartDialog: in place of the browser's alert and confirm)
   ========================================================================== */

.boxcart-dialog {
	z-index: 160000;
}

.boxcart-dialog .boxcart-dialog__box {
	max-width: 440px;
	width: calc(100% - 32px);
}

.boxcart-dialog .boxcart-dialog__message {
	white-space: pre-line;
	font-size: var(--boxcart-text-sm);
	line-height: 1.6;
	color: var(--boxcart-grey-700);
}

.boxcart-dialog .boxcart-modal__footer {
	justify-content: flex-end;
}

/* ==========================================================================
   Guided Setup wizard
   ========================================================================== */

.boxcart-setup-wizard {
	max-width: 1040px;
	margin: var(--boxcart-space-6) auto var(--boxcart-space-10);
	background: #fff;
	border: 1px solid var(--boxcart-grey-200);
	border-radius: 12px;
	box-shadow: var(--boxcart-shadow-lg);
	overflow: hidden;
}

.boxcart-setup-wizard__header {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--boxcart-space-4);
	padding: var(--boxcart-space-6) var(--boxcart-space-8);
	background: linear-gradient(135deg, var(--boxcart-primary-dark) 0%, var(--boxcart-primary) 100%);
	color: #fff;
}

.boxcart-setup-wizard__brand {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-4);
}

.boxcart-setup-wizard__logo {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	font-size: 26px;
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.16);
	color: #fff;
}

.boxcart-setup-wizard .boxcart-setup-wizard__title {
	margin: 0;
	padding: 0;
	font-size: var(--boxcart-text-3xl);
	font-weight: 700;
	line-height: 1.2;
	color: #fff;
}

.boxcart-setup-wizard__subtitle {
	margin: 4px 0 0;
	font-size: var(--boxcart-text-md);
	color: rgba(255, 255, 255, 0.85);
}

.boxcart-setup-wizard__header-actions .boxcart-help-btn,
.boxcart-setup-wizard__header-actions button {
	color: #fff;
	border-color: rgba(255, 255, 255, 0.5);
	background: transparent;
}

.boxcart-setup-wizard__progress {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 4px;
	background: rgba(255, 255, 255, 0.2);
}

.boxcart-setup-wizard__progress-bar {
	display: block;
	height: 100%;
	width: 20%;
	background: #fff;
	transition: width 0.3s ease;
}

.boxcart-setup-wizard__layout {
	display: grid;
	grid-template-columns: 240px 1fr;
	min-height: 460px;
}

/* Step list */
.boxcart-setup-wizard .boxcart-setup-wizard__steps {
	margin: 0;
	padding: var(--boxcart-space-6) var(--boxcart-space-4);
	list-style: none;
	background: var(--boxcart-grey-50);
	border-right: 1px solid var(--boxcart-grey-200);
}

.boxcart-setup-wizard__steps li {
	margin: 0 0 var(--boxcart-space-1);
}

.boxcart-setup-wizard__step {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	width: 100%;
	padding: 10px 12px;
	border: 0;
	border-radius: var(--boxcart-radius-lg);
	background: transparent;
	color: var(--boxcart-grey-600);
	font-size: var(--boxcart-text-md);
	font-weight: 500;
	text-align: left;
	cursor: pointer;
}

.boxcart-setup-wizard__step:hover {
	background: var(--boxcart-grey-100);
	color: var(--boxcart-grey-800);
}

.boxcart-setup-wizard__step.is-current {
	background: #fff;
	color: var(--boxcart-grey-900);
	font-weight: 600;
	box-shadow: var(--boxcart-shadow-sm);
}

.boxcart-setup-wizard__step-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	border: 2px solid var(--boxcart-grey-300);
	background: #fff;
	font-size: var(--boxcart-text-sm);
	font-weight: 700;
	color: var(--boxcart-grey-500);
}

.boxcart-setup-wizard__step.is-current .boxcart-setup-wizard__step-mark {
	border-color: var(--boxcart-primary);
	color: var(--boxcart-primary);
}

.boxcart-setup-wizard__step-tick {
	display: none;
	font-size: 18px;
	width: 18px;
	height: 18px;
}

.boxcart-setup-wizard__step.is-done .boxcart-setup-wizard__step-mark {
	border-color: var(--boxcart-primary);
	background: var(--boxcart-primary);
	color: #fff;
}

.boxcart-setup-wizard__step.is-done .boxcart-setup-wizard__step-number {
	display: none;
}

.boxcart-setup-wizard__step.is-done .boxcart-setup-wizard__step-tick {
	display: inline-block;
}

/* Panels */
.boxcart-setup-wizard__panels {
	padding: var(--boxcart-space-8);
	min-width: 0;
}

.boxcart-setup-wizard__panel {
	display: flex;
	flex-direction: column;
	min-height: 100%;
}

.boxcart-setup-wizard__panel[hidden] {
	display: none;
}

.boxcart-setup-wizard .boxcart-setup-wizard__panel-title {
	margin: 0 0 var(--boxcart-space-2);
	padding: 0;
	font-size: var(--boxcart-text-2xl);
	font-weight: 700;
	color: var(--boxcart-grey-900);
	outline: none;
}

.boxcart-setup-wizard__intro {
	margin: 0 0 var(--boxcart-space-6);
	max-width: 640px;
	font-size: var(--boxcart-text-md);
	line-height: 1.6;
	color: var(--boxcart-grey-600);
}

.boxcart-setup-wizard__form {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-5);
}

.boxcart-setup-wizard__row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--boxcart-space-4);
}

.boxcart-setup-wizard__field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
}

/* Fields shown only for a choice: hidden must win over display: flex. */
.boxcart-setup-wizard [hidden] {
	display: none !important;
}

/* Widths only apply side by side in a row (in the column they'd be heights). */
.boxcart-setup-wizard__row > .boxcart-setup-wizard__field {
	flex: 1 1 180px;
}

.boxcart-setup-wizard__row > .boxcart-setup-wizard__field--wide {
	flex: 2 1 260px;
}

.boxcart-setup-wizard__row > .boxcart-setup-wizard__field--narrow {
	flex: 0 1 140px;
}

.boxcart-setup-wizard__field--narrow:not(.boxcart-setup-wizard__row > *) {
	max-width: 160px;
}

.boxcart-setup-wizard__field label,
.boxcart-setup-wizard__field legend,
.boxcart-setup-wizard__group legend {
	padding: 0;
	font-size: var(--boxcart-text-base);
	font-weight: 600;
	color: var(--boxcart-grey-800);
}

.boxcart-setup-wizard__optional {
	font-weight: 400;
	color: var(--boxcart-grey-500);
}

.boxcart-setup-wizard .boxcart-input,
.boxcart-setup-wizard .boxcart-select {
	width: 100%;
	max-width: none;
	min-height: 40px;
}

.boxcart-setup-wizard__hint {
	margin: 0;
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-600);
}

/* Collection days as toggle pills */
.boxcart-setup-wizard__days {
	display: flex;
	flex-wrap: wrap;
	gap: var(--boxcart-space-2);
}

.boxcart-setup-wizard__day {
	position: relative;
	cursor: pointer;
}

.boxcart-setup-wizard__day input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}

.boxcart-setup-wizard__day > span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 56px;
	padding: 9px 12px;
	border: 1px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-full);
	background: #fff;
	font-weight: 600;
	color: var(--boxcart-grey-600);
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.boxcart-setup-wizard__day input:checked + span {
	border-color: var(--boxcart-primary);
	background: var(--boxcart-primary);
	color: #fff;
}

.boxcart-setup-wizard__day input:focus-visible + span {
	outline: 2px solid var(--boxcart-primary);
	outline-offset: 2px;
}

/* A tick on the open days, so on and off read at a glance. */
.boxcart-setup-wizard__day .dashicons {
	display: none;
	width: 18px;
	height: 18px;
	margin: 0 2px 0 -4px;
	font-size: 18px;
}

.boxcart-setup-wizard__day input:checked + span .dashicons {
	display: inline-block;
}

.boxcart-setup-wizard__day:hover input:not(:checked) + span {
	border-color: var(--boxcart-primary);
	color: var(--boxcart-primary);
}

/* Collection times, set out like the Time Slots screen */
.boxcart-setup-wizard__slots {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-2);
	max-width: 560px;
	margin-top: var(--boxcart-space-3);
}

.boxcart-setup-wizard__slot {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 14px minmax(0, 1fr) minmax(0, 120px) 36px;
	gap: var(--boxcart-space-2);
	align-items: center;
}

.boxcart-setup-wizard__slot--head {
	font-size: var(--boxcart-text-sm);
	font-weight: 600;
	color: var(--boxcart-grey-600);
}

.boxcart-setup-wizard__slot .boxcart-input {
	width: 100%;
	min-width: 0;
}

.boxcart-setup-wizard__slot.is-wrong input[type="time"] {
	border-color: var(--boxcart-error, #d63638);
}

.boxcart-setup-wizard__slot-dash {
	text-align: center;
	color: var(--boxcart-grey-500);
}

.boxcart-setup-wizard .boxcart-setup-wizard__slot-remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: var(--boxcart-grey-500);
	cursor: pointer;
}

.boxcart-setup-wizard .boxcart-setup-wizard__slot-remove:hover:not(:disabled) {
	background: var(--boxcart-grey-100);
	color: var(--boxcart-error, #d63638);
}

.boxcart-setup-wizard .boxcart-setup-wizard__slot-remove:disabled {
	opacity: 0.35;
	cursor: default;
}

.boxcart-setup-wizard .boxcart-setup-wizard__slot-add {
	align-self: flex-start;
	margin-top: var(--boxcart-space-2);
}

.boxcart-setup-wizard__slot-summary {
	margin: var(--boxcart-space-2) 0 0;
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	border-radius: 8px;
	background: var(--boxcart-primary-light, #e8f3ee);
	font-size: var(--boxcart-text-md);
	font-weight: 600;
	color: var(--boxcart-primary-dark, #1f5c45);
}

.boxcart-setup-wizard__slot-summary.is-wrong {
	background: #fcf0f1;
	color: var(--boxcart-error, #d63638);
}

/* Product */
.boxcart-setup-wizard__product {
	display: flex;
	gap: var(--boxcart-space-6);
	align-items: flex-start;
}

.boxcart-setup-wizard__product-fields {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-4);
	min-width: 0;
}

.boxcart-setup-wizard__image-btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 140px;
	height: 140px;
	padding: 0;
	border: 2px dashed var(--boxcart-grey-300);
	border-radius: 12px;
	background: var(--boxcart-grey-50);
	color: var(--boxcart-grey-600);
	font-weight: 600;
	cursor: pointer;
	overflow: hidden;
}

.boxcart-setup-wizard__image-btn:hover {
	border-color: var(--boxcart-primary);
	color: var(--boxcart-primary);
}

.boxcart-setup-wizard__image-btn .dashicons {
	font-size: 32px;
	width: 32px;
	height: 32px;
}

.boxcart-setup-wizard__image-btn.has-image {
	border-style: solid;
}

.boxcart-setup-wizard__image-btn img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.boxcart-setup-wizard__money {
	display: flex;
	align-items: center;
	border: 1px solid var(--boxcart-grey-300);
	border-radius: var(--boxcart-radius-md);
	background: #fff;
}

.boxcart-setup-wizard__money span {
	padding: 0 4px 0 12px;
	color: var(--boxcart-grey-600);
	font-weight: 600;
}

.boxcart-setup-wizard .boxcart-setup-wizard__money .boxcart-input {
	border: 0;
	box-shadow: none;
	padding-left: 4px;
}

/* Finishing touches */
.boxcart-setup-wizard__group {
	display: flex;
	flex-direction: column;
	gap: var(--boxcart-space-3);
	margin: 0;
	padding: var(--boxcart-space-5);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: 10px;
}

.boxcart-setup-wizard__group legend {
	padding: 0 6px;
	font-size: var(--boxcart-text-md);
}

.boxcart-setup-wizard__choice {
	display: flex;
	align-items: flex-start;
	gap: var(--boxcart-space-3);
	font-size: var(--boxcart-text-md);
	color: var(--boxcart-grey-700);
	cursor: pointer;
}

.boxcart-setup-wizard__choice input {
	margin-top: 3px;
}

.boxcart-setup-wizard__choice strong {
	display: block;
	color: var(--boxcart-grey-900);
}

.boxcart-setup-wizard__indent {
	margin-left: 28px;
}

/* Pages step */
.boxcart-setup-wizard .boxcart-setup-wizard__page-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: var(--boxcart-space-3);
	margin: 0 0 var(--boxcart-space-5);
	padding: 0;
	list-style: none;
}

.boxcart-setup-wizard__page-list li {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-2);
	margin: 0;
	padding: var(--boxcart-space-4);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: 10px;
	font-weight: 600;
	color: var(--boxcart-grey-800);
}

.boxcart-setup-wizard__page-list li .dashicons {
	color: var(--boxcart-grey-400);
}

.boxcart-setup-wizard__page-list li.is-done {
	border-color: var(--boxcart-primary-light);
	background: var(--boxcart-primary-light);
}

.boxcart-setup-wizard__page-list li.is-done .dashicons {
	color: var(--boxcart-primary);
}

.boxcart-setup-wizard__page-name {
	flex: 1;
}

.boxcart-setup-wizard__details {
	margin-bottom: var(--boxcart-space-4);
	font-size: var(--boxcart-text-base);
	color: var(--boxcart-grey-600);
}

.boxcart-setup-wizard__details summary {
	cursor: pointer;
	font-weight: 600;
	color: var(--boxcart-primary);
}

.boxcart-setup-wizard .boxcart-setup-wizard__shortcodes {
	margin: var(--boxcart-space-2) 0 0;
	padding: 0;
	list-style: none;
}

.boxcart-setup-wizard__shortcodes li {
	display: flex;
	gap: var(--boxcart-space-3);
	align-items: center;
	margin: 0 0 6px;
}

.boxcart-setup-wizard__shortcodes li span {
	min-width: 100px;
}

/* Done, errors, summary */
.boxcart-setup-wizard__done {
	display: flex;
	align-items: flex-start;
	gap: var(--boxcart-space-3);
	margin-bottom: var(--boxcart-space-5);
	padding: var(--boxcart-space-4) var(--boxcart-space-5);
	border-radius: 10px;
	background: var(--boxcart-primary-light);
	font-size: var(--boxcart-text-md);
	line-height: 1.6;
	color: var(--boxcart-grey-800);
}

.boxcart-setup-wizard__done .dashicons {
	color: var(--boxcart-primary);
}

.boxcart-setup-wizard__error {
	margin-top: var(--boxcart-space-5);
	padding: var(--boxcart-space-3) var(--boxcart-space-4);
	border-left: 4px solid var(--boxcart-error);
	border-radius: var(--boxcart-radius-md);
	background: #FDF0F0;
	font-size: var(--boxcart-text-md);
	color: var(--boxcart-grey-800);
}

.boxcart-setup-wizard__error[hidden] {
	display: none;
}

.boxcart-setup-wizard .boxcart-setup-wizard__summary {
	margin: 0 0 var(--boxcart-space-5);
	padding: 0;
	list-style: none;
}

.boxcart-setup-wizard__summary li {
	display: flex;
	align-items: center;
	gap: var(--boxcart-space-3);
	margin: 0;
	padding: var(--boxcart-space-3) 0;
	border-bottom: 1px solid var(--boxcart-grey-100);
	font-size: var(--boxcart-text-md);
	color: var(--boxcart-grey-800);
}

.boxcart-setup-wizard__summary-mark::before {
	content: "\f159";
	color: var(--boxcart-grey-300);
}

.boxcart-setup-wizard__summary li.is-done .boxcart-setup-wizard__summary-mark::before {
	content: "\f12a";
	color: var(--boxcart-primary);
}

.boxcart-setup-wizard__summary-label {
	flex: 1;
}

.boxcart-setup-wizard__summary li.is-done [data-wizard-nav] {
	display: none;
}

.boxcart-setup-wizard__test-order {
	display: flex;
	gap: var(--boxcart-space-3);
	padding: var(--boxcart-space-4) var(--boxcart-space-5);
	border: 1px solid var(--boxcart-grey-200);
	border-radius: 10px;
	background: var(--boxcart-grey-50);
	font-size: var(--boxcart-text-md);
	color: var(--boxcart-grey-700);
}

.boxcart-setup-wizard__test-order p {
	margin: 4px 0 0;
}

.boxcart-setup-wizard__test-order .dashicons {
	color: var(--boxcart-primary);
}

/* Footer */
.boxcart-setup-wizard__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--boxcart-space-3);
	margin-top: auto;
	padding-top: var(--boxcart-space-8);
}

.boxcart-setup-wizard__footer-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--boxcart-space-3);
	margin-left: auto;
}

/* Where each step's settings live later */
.boxcart-setup-wizard__later {
	position: relative;
	margin: var(--boxcart-space-5) 0 0;
	padding: var(--boxcart-space-4) 0 0 26px;
	border-top: 1px solid var(--boxcart-grey-200);
	font-size: var(--boxcart-text-base);
	line-height: 1.5;
	color: var(--boxcart-grey-600);
}

.boxcart-setup-wizard__later .dashicons {
	position: absolute;
	top: var(--boxcart-space-4);
	left: 0;
	width: 18px;
	height: 18px;
	font-size: 18px;
	color: var(--boxcart-grey-500);
}

/* "Make it your own" on the last step */
.boxcart-setup-wizard__own {
	margin-top: var(--boxcart-space-5);
}

.boxcart-setup-wizard__own h3 {
	margin: 0 0 4px;
	font-size: var(--boxcart-text-lg);
}

.boxcart-setup-wizard__own p {
	margin: 0 0 var(--boxcart-space-3);
	color: var(--boxcart-grey-600);
}

.boxcart-setup-wizard__own ul {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: var(--boxcart-space-2) var(--boxcart-space-5);
	margin: 0;
	padding: 0;
	list-style: none;
}

.boxcart-setup-wizard__own li {
	margin: 0;
}

.boxcart-setup-wizard__own a {
	font-weight: 600;
	text-decoration: none;
}

.boxcart-setup-wizard__own a:hover {
	text-decoration: underline;
}

.boxcart-setup-wizard__own li span {
	display: block;
	font-size: var(--boxcart-text-sm);
	color: var(--boxcart-grey-600);
}

@media (max-width: 782px) {
	.boxcart-setup-wizard {
		margin: var(--boxcart-space-4) 0;
		border-radius: 8px;
	}

	.boxcart-setup-wizard__header {
		padding: var(--boxcart-space-5);
	}

	.boxcart-setup-wizard__layout {
		grid-template-columns: 1fr;
	}

	.boxcart-setup-wizard .boxcart-setup-wizard__steps {
		display: flex;
		gap: var(--boxcart-space-2);
		padding: var(--boxcart-space-3);
		overflow-x: auto;
		border-right: 0;
		border-bottom: 1px solid var(--boxcart-grey-200);
	}

	.boxcart-setup-wizard__steps li {
		margin: 0;
	}

	.boxcart-setup-wizard__step-label {
		white-space: nowrap;
	}

	.boxcart-setup-wizard__panels {
		padding: var(--boxcart-space-5);
	}

	.boxcart-setup-wizard__product {
		flex-direction: column;
	}

	.boxcart-setup-wizard__slot {
		grid-template-columns: minmax(0, 1fr) 6px minmax(0, 1fr) 52px 28px;
		gap: 4px;
	}

	.boxcart-setup-wizard__slot .boxcart-input {
		padding-left: 6px;
		padding-right: 4px;
	}

	.boxcart-setup-wizard__slot--head span {
		font-size: 12px;
		line-height: 1.2;
	}

	.boxcart-setup-wizard .boxcart-setup-wizard__slot-remove {
		width: 28px;
	}
}