.custom-ordering {
	margin: 0 0 var(--spacing-06);
}
.custom-ordering__section-label {
	color: var(--color-text-primary-dark, #000);
	font: var(--text-form-label);
	letter-spacing: 0.5px;
	text-transform: uppercase;
	margin: 0 0 var(--spacing-02);
}

.custom-ordering__tabwrap {
    padding: var(--spacing-02);
    background-color: var(--color-surface-secondary);
    border: var(--border-weight-01) solid var(--color-border-secondary);
    border-radius: var(--border-radius-md);
    justify-content: space-between;
    flex-wrap: nowrap;
    width: 100%;
    margin-bottom: var(--spacing-04);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-02)
}
.custom-ordering__tab {
    padding: var(--spacing-03) var(--spacing-06);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--border-radius-sm);
    border: none;
    font: var(--text-body-md-compact);
    white-space: nowrap;
    width: 100%;
    background: inherit;
    position: relative;
    margin: 0;
}

.custom-ordering__tab:not(.custom-ordering__tab-active):hover {
    background-color: var(--color-surface-secondary-hover);
}

.custom-ordering__tab:focus-within {
    outline: #80bdff solid 1px;
	outline: -webkit-focus-ring-color solid 1px;
}

.custom-ordering__tab-active {
    color: var(--white);
    background-color: var(--black);
}

.custom_ordering__hidden-radio {
	position: absolute;
	width: 0;
	opacity: 0;
	pointerEvents: none;
}

.custom-ordering__section,
.custom-ordering__section-padded {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	align-self: stretch;
	gap: var(--spacing-04);
}

.custom-ordering__section {
	padding: 0;
}

.custom-ordering__section-padded {
	padding: var(--spacing-04);
	border-radius: var(--border-radius-md, 8px);
	border: 1px solid var(--color-border-primary, #CCC);
}

.custom-ordering__section-radio-options,
.custom-ordering__section-checkbox-options {
	list-style: none;
	border-radius: var(--border-radius-sm, 4px);
	background: var(--color-surface-primary, #FFF);
	padding: 0;
	width: 100%;
}

.custom-ordering__section-radio-options {
	border: 1px solid var(--color-border-form-default, #757575);
	margin: 0;
}

.custom-ordering__section-checkbox-options {
	border: 1px solid var(--color-border-primary, #CCC);
	margin: 0;
}

.custom-ordering__section-radio-option,
.custom-ordering__section-checkbox-option-header {
	display: flex;
	gap: var(--spacing-03);
}

.custom-ordering__section-radio-option {
	padding: var(--spacing-04);
}

.custom-ordering__section-checkbox-option-header {
	padding: 0;
}



.custom-ordering__section-radio-option {
	border-bottom: 1px solid var(--color-border-form-default, #757575);
}

.custom-ordering__section-checkbox-option {
	border-bottom: 1px solid var(--color-border-primary, #CCC);
	display: flex;
	flex-direction: column;
	gap: var(--spacing-04);
	padding: var(--spacing-04);
	
}

.custom-ordering__section-radio-option:last-child,
.custom-ordering__section-checkbox-option:last-child {
	border: none;
}

.custom-ordering__section-option-service,
.custom-ordering__section-option-text {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-02);
}

.custom-ordering__section-option-text {
	flex: 1 1 auto;
}

.custom-ordering__section-option-service {
	flex: 0 0 62px;
}

.custom-ordering__section-option-label {
	color: var(--color-text-primary-dark, #000);
	font: var(--text-form-option);
	margin: 0;
}

.custom-ordering__section-option-input {
	margin-right: var(--spacing-02);
}

.custom-ordering__section-option-description {
	color: var(--color-text-form-helper, #757575);
	font: var(--text-form-helper);
	margin: 0;
}

.custom-ordering__section-option-price {
	color: var(--color-text-primary-dark, #000);
	text-align: right;
	font: var(--text-form-option);
	margin: 0;
}

.custom-ordering__section-option-service-fee {
	color: var(--color-text-secondary, #757575);
	font: var(--text-body-xs-compact);
	margin: 0;
}

.custom-ordering__selection {
	width: 100%;
}

.custom-ordering__selection-heading {
	color: var(--color-text-primary-dark, #000);
	font: var(--text-form-label);
	letter-spacing: 0.5px;
	text-transform: uppercase;
	padding-bottom: var(--spacing-02);
	margin: 0;
}

.custom-ordering__selection-button {
	border-radius: var(--border-radius-sm, 4px);
	border: 1px solid var(--color-border-form-default, #757575);
	display: flex;
	gap: var(--spacing-03);
	padding: var(--spacing-03);
	align-items: center;
	width: 100%;
	margin: 0;
}

.custom-ordering__selection-img-wrap {
	width: 80px;
	padding: var(--spacing-02);
}

.custom-ordering__selection-img {
	width: 64px;
}

.custom-ordering__selection-text,
.custom-ordering__selection-text-name,
.custom-ordering__selection-text-price {
	margin: 0;
	flex: 1;
	text-align: left;
	color: var(--color-text-form-active, #000);
	font: var(--text-body-md-compact);
}

/*.custom-ordering__section-option-list {
	width: 100%;
	padding: 0;
	margin: 0;
}

.custom-ordering__section-option-list-item {
	display: flex;
	justify-content: space-between;
	border-bottom: 1px solid var(--color-border-form-default, #757575);
}

.custom-ordering__section-option-list-item:last-child {
	border: none;
}*/

.custom-ordering__additonal-info {
	width: 100%;
	display: flex;
	gap: var(--spacing-01);
	flex-direction: column;
	padding: 0;
}

@keyframes lift-label {
	0% {
		top: 0;
		font-size: 1rem;
	}
	100% {
		top: -21px;
		font-size: 0.8125rem;
	}
}

@keyframes lower-label {
	0% {
		top: -21px;
		font-size: 0.8125rem;
	}
	100% {
		top: 0;
		font-size: 1rem;
	}
}

label.is-lifted.custom-ordering__is-lifted {
    animation: lift-label 0.2s ease-out 0s;
}

label.custom-ordering__label.zero {
	animation: lower-label 0.2s ease-in 0s;
}

.custom-ordering__additonal-info-subtext {
	margin: 0;
	color: var(--color-text-form-helper, #757575);
	font: var(--text-form-helper);
}
/* Hide number arrows start */
input.custom-ordering__form-control::-webkit-outer-spin-button,
input.custom-ordering__form-control::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0; 
}

input.custom-ordering__form-control[type=number] {
    -moz-appearance:textfield; /* Firefox */
}
/* Hide number arrows end */


.custom-ordering__form-group {
	padding: 0; 
	margin: 0;
}

.custom-ordering__selection-subtext {
	margin: 0;
	color: var(--color-text-secondary);
	font: var(--text-form-helper);
}

.item-drawer__content-wrapper {
	scroll-margin-top: calc(var(--icon-size-lg) + var(--spacing-04) * 2);
}

.item-drawer__type-selection {
	padding: var(--spacing-04) var(--spacing-04) 0;
	border-bottom: 1px solid var(--color-border-primary, #CCC);
}
.item-drawer__search {
 position: relative; 
 margin: 0 0 var(--spacing-04);
}

.item-drawer__search-input {
	width: 100%;
    padding: var(--spacing-03) var(--spacing-10) var(--spacing-03) var(--spacing-03);
	border-radius: var(--Radius-border-radius-sm, 4px);
	border: 1px solid var(--color-border-primary, #CCC);
	background: var(--white, #FFF);
}
.item-drawer__search-icon-wrapper {
	position: absolute;
	top: var(--spacing-03);
	right: var(--spacing-03);
}

.item-drawer__swiper-wrapper {
	margin: 0 0 var(--spacing-06);
}

.item-drawer__swiper-header {
	color: var(--color-text-primary-dark, #000);
	font: var(--text-title-sm);
	margin: 0 0 var(--spacing-02);
	padding: 0;
}

.item-drawer__swiper {
	margin: 0 0 var(--spacing-04);
}

.swiper-slide.item-drawer__pill-wrap { /* Need Specificity of 0 2 0 to override swiperjs' css */
	width: fit-content;
	padding: 0 8px 0 0;
}

.item-drawer__pill {
	display: flex;
	min-width: 64px;
	padding: var(--spacing-02, 8px) var(--spacing-04, 16px);
	align-items: flex-start;
	width: fit-content;
	font: var(--text-title-md);
	border-radius: var(--border-radius-lg, 200px);
	border: 1px solid var(--color-border-primary, #000);
	background: var(--color-surface-primary, #FFF);
	color: var(--color-text-primary-dark);
	cursor: pointer;
}

.item-drawer__pill-active {
	background: var(--color-surface-primary-inverse, #000);
	color: var(--color-brand-text-on-primary);
	border-color: var(--color-border-primary-active)
}

.item-drawer__pill:not(.item-drawer__pill-active):hover {
    border-color: var(--color-border-primary-hover);
}

.item-drawer__pill-scrollbar {
	height: var(--spacing-02);
	border-radius: var(--border-radius-lg, 200px);
	background: var(--color-surface-secondary, #F4F4F4);
	margin: 0;
}
.item-drawer__product-list {
	list-style: none;
	padding: 0;
}
.item-drawer__product-list-title {
	padding: var(--spacing-06) var(--spacing-04);
	border-bottom: 1px solid var(--color-border-primary, #CCC);
	display: flex;
	flex-direction: column;
	gap: var(--spacing-02);
}

.item-drawer__product-list-header {
	color: var(--color-text-primary-dark, #000);
	font: var(--text-title-lg);
	margin: 0;
}

.item-drawer__product-list-description {
	color: var(--color-text-secondary, #757575);
	font: var(--text-body-sm-compact);
	margin: 0;
}

.item-drawer__product-list-item {
	padding: var(--spacing-04);
	border: none;
	border-bottom: 1px solid var(--color-border-primary, #CCC);
	display: flex;
	gap: var(--spacing-04);
	width: 100%;
	text-align: left;
	
}

.item-drawer__product-list-item-img-wrap {
	padding: var(--spacing-02);
	width: 80px;
}

.item-drawer__product-list-item-img {
	width: 64px;
}

.item-drawer__product-list-item-text {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-01);
}

.item-drawer__product-list-item-flag {
	color: var(--color-text-flag-promo, #B21D26);
	font: var(--text-flag);
}

.item-drawer__product-list-item-flag-newitem {
	color: var(--color-text-flag-new)
}

.item-drawer__product-list-item-flag-bestseller {
	color: var(--color-text-flag-bestseller)
}

.item-drawer__product-list-item-flag-closeout,
.item-drawer__product-list-item-flag-saleitem,
.item-drawer__product-list-item-flag-reduced {
	color: var(--color-text-flag-promo, #B21D26);
}

.item-drawer__product-list-item-name {
	color: var(--color-text-primary-dark, #000);
	font: var(--text-product-name-sm);
}

.item-drawer__product-list-item-price {
	color: var(--color-text-price-primary, #000);
	font: var(--text-price-md);
}

.item-drawer__product-list-item-old-price {
	text-decoration: line-through;
	color: var(--color-text-price-msrp);
	margin: 0 0 0 var(--spacing-02);
}

.item-drawer__package-list{
	padding: var(--spacing-06);
	display: flex;
	flex-direction: column;
	gap: var(--spacing-04);
	list-style: none;
}

.item-drawer__package-list-item {
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: var(--spacing-04);
	gap: var(--spacing-04);
	border-radius: var(--border-radius-md);
	border: 1px solid var(--color-border-form-default, #757575);
	background: var(--color-surface-form-default, #FFF);
}

.item-drawer__package-list-item:hover {
	border: 1px solid var(--color-border-form-hover, #000);
	box-shadow: 0 0 0 1px var(--color-basic-black, #000);
}

.item-drawer__package-list-item-header {
	display: flex;
	justify-content: space-between;
	width: 100%;
}

.item-drawer__package-list-item-name {
	color: var(--color-text-primary-dark, #000);
	font: var(--text-title-md); 
	text-align: left;
}

.item-drawer__package-list-item-price {
	color: var(--color-text-primary-dark, #000);
	font: var(--text-price-md);
}

.item-drawer__package-list-item-description {
	color: var(--color-text-secondary, #757575);
	font: var(--text-body-sm-compact);
	text-align: left;
}
.js-ordering-errors-container .alert:last-child,
.ordering_area .alert:last-child {
	margin-bottom: var(--spacing-06);
}
.custom-ordering__error-focus:focus:not(:focus-visible),
.alert-danger:focus:not(:focus-visible) {
	outline: #80bdff solid 1px;
	outline: -webkit-focus-ring-color solid 1px;
	/* outline: var(--color-border-support-critical) solid 1px; */
}