/**
 * B2B modals + cart FAB
 */

:root {
	--b2b-primary: #949498;
	--b2b-ink: #2f3033;
	--b2b-line: #e6e6e6;
	--b2b-fab-size: 56px;
	--b2b-fab-right: 20px;
	--b2b-fab-bottom: 96px; /* sit above typical chat widgets */
}

/* Cart FAB — bottom-right, above chatbot */
.bubble-circle.b2b-cart-fab,
.bubble-circle.add-to-cart-button-bubble.b2b-cart-fab {
	position: fixed !important;
	right: var(--b2b-fab-right) !important;
	left: auto !important;
	bottom: var(--b2b-fab-bottom) !important;
	width: var(--b2b-fab-size);
	height: var(--b2b-fab-size);
	border-radius: 50%;
	background: #111 !important;
	border: 1px solid #111 !important;
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22);
	display: flex !important;
	align-items: center;
	justify-content: center;
	z-index: 10050 !important;
	cursor: pointer;
	padding: 0;
	margin: 0;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.bubble-circle.b2b-cart-fab.d-none,
.bubble-circle.add-to-cart-button-bubble.b2b-cart-fab.d-none {
	display: none !important;
}

.bubble-circle.b2b-cart-fab:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 32px rgba(0, 0, 0, 0.28);
}

.bubble-circle.b2b-cart-fab img {
	width: 24px;
	height: 24px;
	pointer-events: none;
	filter: invert(1);
}

.count-item-b2b {
	position: absolute;
	top: -5px;
	right: -5px;
	min-width: 22px;
	height: 22px;
	padding: 0 5px;
	background: #fff;
	border: 1px solid #111;
	border-radius: 999px;
	font-size: 11px;
	line-height: 20px;
	text-align: center;
	color: #111;
	font-weight: 700;
	font-family: "Rubik", sans-serif;
	box-sizing: border-box;
}

/* Attention bounce when cart gains items */
@keyframes b2b-fab-bounce {
	0%, 100% { transform: translateY(0); }
	15% { transform: translateY(-10px); }
	30% { transform: translateY(0); }
	45% { transform: translateY(-6px); }
	60% { transform: translateY(0); }
	75% { transform: translateY(-3px); }
	90% { transform: translateY(0); }
}

.bubble-circle.b2b-cart-fab.is-bouncing {
	animation: b2b-fab-bounce 1.1s ease 2;
}

/* Shared modal shell */
body.b2b-modal-open {
	overflow: hidden !important;
}

.monte-b2b-modal {
	display: none !important;
	position: fixed !important;
	inset: 0 !important;
	left: 0 !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100% !important;
	height: 100% !important;
	z-index: 100060 !important;
	background: rgba(17, 17, 17, 0.52) !important;
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	align-items: center !important;
	justify-content: center !important;
	padding: 20px 14px !important;
	box-sizing: border-box !important;
	overflow: auto !important;
	margin: 0 !important;
}

.monte-b2b-modal.is-open {
	display: flex !important;
}

.monte-b2b-modal-content {
	position: relative !important;
	background: #fff !important;
	margin: auto !important;
	width: min(960px, 100%) !important;
	max-width: 960px !important;
	max-height: min(90vh, 920px) !important;
	overflow: auto !important;
	border: 0 !important;
	border-radius: 16px !important;
	padding: 0 !important;
	box-shadow: 0 28px 80px rgba(0, 0, 0, 0.28) !important;
	left: auto !important;
	right: auto !important;
	top: auto !important;
	bottom: auto !important;
	animation: b2b-modal-in 0.28s ease;
}

@keyframes b2b-modal-in {
	from {
		opacity: 0;
		transform: translateY(12px) scale(0.98);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

.monte-b2b-close {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 36px;
	height: 36px;
	border: 0;
	border-radius: 50%;
	background: #111;
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 2;
	padding: 0;
	transition: background 0.15s ease;
}

.monte-b2b-close:hover {
	background: #333;
}

.monte-b2b-close svg {
	fill: #fff !important;
	width: 12px;
	height: 12px;
}

.monte-b2b-modal-content.model-loader::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(255, 255, 255, 0.72);
	z-index: 5;
}

.monte-b2b-modal-content.model-loader::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 28px;
	height: 28px;
	margin: -14px 0 0 -14px;
	border: 2px solid #ddd;
	border-top-color: #111;
	border-radius: 50%;
	animation: b2b-spin 0.7s linear infinite;
	z-index: 6;
}

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

/* Size guide — right drawer (~40%) */
.monte-b2b-modal.b2b-size-drawer {
	align-items: stretch !important;
	justify-content: flex-end !important;
	padding: 0 !important;
	overflow: hidden !important;
	background: rgba(17, 17, 17, 0.45) !important;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

.monte-b2b-modal.b2b-size-drawer .b2b-size-drawer__panel,
.b2b-size-modal__dialog.b2b-size-drawer__panel {
	width: 40% !important;
	min-width: 360px;
	max-width: 560px !important;
	height: 100% !important;
	max-height: 100% !important;
	margin: 0 !important;
	border-radius: 0 !important;
	box-shadow: -12px 0 40px rgba(0, 0, 0, 0.18) !important;
	padding: 0 !important;
	overflow: hidden !important;
	display: flex !important;
	flex-direction: column;
	animation: b2b-drawer-in 0.32s ease;
}

@keyframes b2b-drawer-in {
	from { transform: translateX(100%); }
	to { transform: translateX(0); }
}

.b2b-size-drawer__close.monte-b2b-close {
	top: 16px;
	right: 16px;
	background: #f0f0f0;
	color: #333;
}

.b2b-size-drawer__close.monte-b2b-close:hover {
	background: #e4e4e4;
}

.b2b-size-drawer__close.monte-b2b-close svg {
	fill: #333 !important;
}

.b2b-size-drawer__scroll {
	flex: 1;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	padding: 28px 22px 40px;
	box-sizing: border-box;
}

.b2b-size-chart {
	margin-bottom: 36px;
}

.b2b-size-chart:last-child {
	margin-bottom: 8px;
}

.b2b-size-chart__badge {
	display: inline-block;
	background: #ececed;
	color: #2f3033;
	font-family: "Rubik", sans-serif;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 8px 14px;
	border-radius: 2px;
	margin-bottom: 10px;
}

.b2b-size-chart__subtitle {
	margin: 0 0 12px;
	font-size: 12px;
	color: #8a8a8a;
	font-family: "Rubik", sans-serif;
}

.guide-table-data {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 0;
	border-radius: 0;
}

.guide-table-data table {
	width: 100%;
	border-collapse: collapse;
	min-width: 480px;
	font-family: "Rubik", sans-serif;
}

.guide-table-data th,
.guide-table-data td {
	padding: 11px 10px;
	border-bottom: 1px solid #ececec;
	font-size: 12px;
	text-align: center;
	white-space: nowrap;
	color: #222;
}

.guide-table-data th:first-child,
.guide-table-data td:first-child {
	text-align: left;
	color: #1a1a1a;
	font-weight: 700;
	padding-left: 12px;
}

.guide-table-data thead th {
	background: #c5d9e8;
	font-weight: 700;
	color: #1a1a1a;
	border-bottom: 0;
}

.guide-table-data tbody tr:nth-child(even) {
	background: #f7fafc;
}

.guide-table-data tbody tr:hover {
	background: #eef5fa;
}

/* Cart modal — professional layout */
.b2b-cart-modal__dialog {
	width: min(980px, 100%);
	padding: 0 !important;
}

.b2b-cart-modal .modal-body-b2b {
	padding: 28px 26px 22px;
}

.b2b-cart-modal__grid.disflx {
	display: grid;
	grid-template-columns: 1.05fr 0.95fr;
	gap: 28px;
	align-items: start;
}

.b2b-cart-modal .mont-b2b-form h4,
.b2b-cart-modal .order-data-b2b-monte h4 {
	margin: 0 0 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--b2b-line) !important;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--b2b-ink);
	font-family: "Rubik", sans-serif;
}

.b2b-cart-modal .mont-b2b-form label {
	display: block !important;
	margin: 0 0 6px;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #888;
	font-family: "Rubik", sans-serif;
}

.b2b-cart-modal .form-group {
	margin-bottom: 14px;
}

.b2b-cart-modal .form-control {
	width: 100%;
	min-height: 44px;
	border: 1px solid #e8e8e8 !important;
	border-radius: 8px !important;
	padding: 10px 12px !important;
	font-size: 14px;
	box-sizing: border-box;
	background: #fafafa;
	transition: border-color 0.15s ease, background 0.15s ease;
	font-family: "Rubik", sans-serif;
}

.b2b-cart-modal .form-control:focus {
	outline: none;
	border-color: #bbb !important;
	background: #fff;
}

.b2b-cart-modal .footer-model-b2b-monte {
	margin-top: 8px;
	padding: 16px 26px 22px;
	border-top: 1px solid var(--b2b-line);
	text-align: right;
	background: #fafafa;
	border-radius: 0 0 16px 16px;
}

.b2b-cart-modal .order-btn {
	background: #111;
	color: #fff;
	border: 0;
	min-height: 48px;
	padding: 12px 28px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
	border-radius: 0;
	font-family: "Rubik", sans-serif;
	transition: background 0.15s ease;
}

.b2b-cart-modal .order-btn:hover {
	background: #333;
}

/* Cart items — clean summary cards */
.b2b-cart-modal .order-data-b2b-monte {
	min-width: 0;
}

.b2b-cart-modal .accordion-b2b,
.b2b-cart-modal #monteB2B {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding: 0;
}

.b2b-cart-modal .accordion-item-monte-b2b,
.b2b-cart-modal .b2b-cart-item {
	border: 1px solid var(--b2b-line) !important;
	border-radius: 12px !important;
	background: #fff !important;
	overflow: visible !important;
	margin: 0 !important;
	padding: 0 !important;
	position: relative;
}

.b2b-cart-modal .accordion-header-monte-b2b,
.b2b-cart-modal .b2b-cart-item__header {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 8px !important;
	margin: 0 !important;
	padding: 12px 12px 12px 14px !important;
	border: 0 !important;
	background: #fff !important;
	font-size: 14px !important;
	font-weight: 500;
	color: var(--b2b-ink);
	font-family: "Rubik", sans-serif;
	min-width: 0;
}

.b2b-cart-modal .b2b-cart-item__toggle,
.b2b-cart-modal .accordion-button-monte-b2b {
	flex: 1 1 auto;
	min-width: 0;
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	border: 0 !important;
	background: transparent !important;
	cursor: pointer;
	padding: 0 !important;
	margin: 0 !important;
	text-align: left;
	color: inherit;
	font: inherit;
	width: auto !important;
}

.b2b-cart-modal .b2b-cart-item__title {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 13px;
	font-weight: 500;
	color: var(--b2b-ink);
}

.b2b-cart-modal .b2b-cart-item__chevron {
	flex-shrink: 0;
	color: #999;
	font-size: 12px;
}

.b2b-cart-modal .monte-b2b-remove-item,
.b2b-cart-modal .b2b-cart-item__remove {
	position: static !important;
	top: auto !important;
	right: auto !important;
	flex: 0 0 32px !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 32px !important;
	height: 32px !important;
	min-width: 32px;
	border: 0 !important;
	border-radius: 50% !important;
	background: #f4f4f4 !important;
	color: #666 !important;
	font-size: 18px !important;
	line-height: 1 !important;
	cursor: pointer;
	padding: 0 !important;
	margin: 0 !important;
	box-shadow: none !important;
	transition: background 0.15s ease, color 0.15s ease;
}

.b2b-cart-modal .monte-b2b-remove-item:hover,
.b2b-cart-modal .b2b-cart-item__remove:hover {
	background: #111 !important;
	color: #fff !important;
}

.b2b-cart-modal .accordion-collapse-monte-b2b,
.b2b-cart-modal .b2b-cart-item__body {
	border: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
}

.b2b-cart-modal .accordion-body-monte-b2b {
	padding: 0 14px 14px !important;
	font-size: 13px;
	color: #555;
	font-family: "Rubik", sans-serif;
	line-height: 1.5;
	border-top: 1px solid #f0f0f0;
	margin: 0 !important;
}

.b2b-cart-meta {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding-top: 12px;
}

.b2b-cart-meta__row {
	display: grid;
	grid-template-columns: 78px 1fr;
	gap: 10px;
	align-items: start;
}

.b2b-cart-meta__label {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #999;
	padding-top: 1px;
}

.b2b-cart-meta__value,
.b2b-cart-meta__list {
	margin: 0;
	padding: 0;
	font-size: 13px;
	color: #333;
	font-weight: 400;
	list-style: none !important;
}

.b2b-cart-meta__list li {
	list-style: none !important;
	margin: 0 0 2px;
	padding: 0;
}

.b2b-cart-meta__list li::marker {
	content: none;
}

.b2b-cart-modal .empty-cart {
	padding: 36px 16px;
	text-align: center;
	color: #888;
}

.b2b-cart-modal .empty-cart h2 {
	margin: 0;
	font-size: 16px;
	font-weight: 500;
	color: #666;
	font-family: "Rubik", sans-serif;
}

@media (max-width: 820px) {
	:root {
		--b2b-fab-right: 16px;
		--b2b-fab-bottom: 100px;
	}

	.b2b-cart-modal__grid.disflx {
		grid-template-columns: 1fr;
		gap: 22px;
	}

	.monte-b2b-modal {
		padding: 0;
		align-items: flex-end;
	}

	.monte-b2b-modal-content,
	.b2b-cart-modal__dialog {
		width: 100%;
		max-height: 92vh;
		border-radius: 16px 16px 0 0;
		margin: 0;
	}

	.monte-b2b-modal.b2b-size-drawer {
		align-items: flex-end !important;
		justify-content: stretch !important;
	}

	.monte-b2b-modal.b2b-size-drawer .b2b-size-drawer__panel,
	.b2b-size-modal__dialog.b2b-size-drawer__panel {
		width: 100% !important;
		min-width: 0;
		max-width: 100% !important;
		height: min(92vh, 100%) !important;
		max-height: 92vh !important;
		border-radius: 18px 18px 0 0 !important;
		box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.18) !important;
		animation: b2b-sheet-in 0.32s ease;
	}

	@keyframes b2b-sheet-in {
		from { transform: translateY(100%); }
		to { transform: translateY(0); }
	}

	.b2b-size-drawer__scroll {
		padding: 20px 14px 28px;
	}

	.b2b-size-chart__badge {
		display: block;
		width: fit-content;
		font-size: 14px;
		padding: 9px 14px;
	}

	.b2b-size-chart__subtitle {
		font-size: 13px;
	}

	.guide-table-data table {
		min-width: 0;
		width: max-content;
		min-width: 100%;
	}

	.guide-table-data th,
	.guide-table-data td {
		padding: 10px 8px;
		font-size: 11px;
	}

	.guide-table-data th:first-child,
	.guide-table-data td:first-child {
		position: sticky;
		left: 0;
		z-index: 1;
		background: #fff;
		min-width: 108px;
		padding-left: 8px;
		padding-right: 10px;
		box-shadow: 4px 0 8px rgba(0, 0, 0, 0.04);
	}

	.guide-table-data thead th:first-child {
		background: #c5d9e8;
		z-index: 2;
	}

	.guide-table-data tbody tr:nth-child(even) td:first-child {
		background: #f7fafc;
	}

	.b2b-cart-modal .modal-body-b2b {
		padding: 24px 18px 16px;
	}

	.b2b-cart-modal .footer-model-b2b-monte {
		padding: 14px 18px 20px;
		text-align: stretch;
	}

	.b2b-cart-modal .order-btn {
		width: 100%;
	}
}