/* v1.0.20.5: native top-layer modal with native wheel scrolling. This file is RUCSS protected only on single products. */
dialog.yds-bis-panel.yds-bis-modal {
    position:fixed!important;
    inset:0!important;
    display:none;
    flex-direction:column;
    width:min(680px,calc(100vw - 28px));
    max-width:calc(100vw - 28px);
    max-height:min(82vh,760px);
    max-height:min(82dvh,760px);
    margin:auto!important;
    padding:0;
    box-sizing:border-box;
    overflow:hidden;
    border:1px solid #e5eae7;
    border-radius:18px;
    background:#fff;
    color:#3f4d46;
    box-shadow:0 18px 60px rgba(21,35,30,.24);
    text-align:left;
}
dialog.yds-bis-panel.yds-bis-modal[open]:not([hidden]) { display:flex!important; }
dialog.yds-bis-panel.yds-bis-modal[hidden],
dialog.yds-bis-panel.yds-bis-modal:not([open]) { display:none!important; }
dialog.yds-bis-panel.yds-bis-modal::backdrop { background:rgba(20,30,27,.54); }
.yds-bis-modal-header {
    flex:0 0 auto;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:14px;
    padding:13px 16px;
    border-bottom:1px solid #e9efec;
    background:#fafcfb;
}
.yds-bis-modal-header strong {font-size:16px;line-height:1.5;font-weight:700;color:#486459;}
.yds-bis-modal-close {
    appearance:none;
    display:inline-flex;align-items:center;justify-content:center;
    flex:0 0 34px;
    width:34px;height:34px;
    padding:0;margin:0;
    border:1px solid #e0e7e3;
    border-radius:50%;
    background:#fff;
    color:#65756c;
    font-size:23px;font-weight:400;line-height:1;
    cursor:pointer;
}
.yds-bis-modal-close:hover,.yds-bis-modal-close:focus-visible{background:#eef4f0;color:#395c4c;}
.yds-bis-modal-body {
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    padding:16px;
    box-sizing:border-box;
}
@media(max-width:600px){
    dialog.yds-bis-panel.yds-bis-modal {width:calc(100vw - 20px);max-width:calc(100vw - 20px);max-height:calc(90vh - 8px);border-radius:15px;}
    .yds-bis-modal-header {padding:10px 12px;}
    .yds-bis-modal-body {padding:12px 10px;}
}
.yds-bis-intro{display:flex;flex-direction:column;gap:3px;margin-bottom:12px}
.yds-bis-intro strong{font-size:14px;color:#3f4d46}
.yds-bis-intro span,.yds-bis-loading,.yds-bis-empty{font-size:13px;color:#777;line-height:1.6}
.yds-bis-list{
	display:flex;
	flex-direction:column;
	gap:8px;
	max-height:none;
	/* Keep this inner list out of the scroll chain.
	 * overflow-x:hidden made overflow-y:visible compute as auto.
	 * Together with overscroll-behavior:contain, this trapped wheel gestures
	 * even though the list itself had no scrolling range.
	 * The outer .yds-bis-modal-body is the sole scroll container. */
	overflow:visible;
	padding:8px 7px 8px 8px;
	border:1px solid #e9eeeb;
	border-radius:11px;
	background:#f8faf9;
	box-shadow:inset 0 1px 2px rgba(64,85,75,.035);
	scrollbar-width:thin;
	scrollbar-color:#bccbc5 transparent;
}
.yds-bis-list::-webkit-scrollbar{width:7px}
.yds-bis-list::-webkit-scrollbar-track{background:transparent}
.yds-bis-list::-webkit-scrollbar-thumb{background:#bccbc5;border-radius:999px;border:2px solid #f8faf9}
.yds-bis-list::-webkit-scrollbar-thumb:hover{background:#a9bbb3}
.yds-bis-item{
	display:grid;
	grid-template-columns:64px minmax(0,1fr) auto;
	gap:11px;
	align-items:center;
	padding:10px;
	border:1px solid #ecefed;
	border-radius:9px;
	background:#fff;
}
.yds-bis-image{display:block;width:64px;height:64px;object-fit:cover;border-radius:7px;background:#f5f5f5}
.yds-bis-product-image-zoom{width:64px;height:64px;border-radius:7px;overflow:hidden;align-self:center}
.yds-bis-info{min-width:0}
.yds-bis-variation-name{font-size:14px;font-weight:700;color:#444;line-height:1.45;word-break:break-word}
.yds-bis-stock{font-size:12px;color:#9a6d69;margin-top:4px}
.yds-bis-action{display:flex;align-items:center;gap:7px;min-width:0}
.yds-bis-email{
	width:clamp(108px,18vw,180px);
	height:38px;
	border:1px solid #d8ddda!important;
	border-radius:6px!important;
	padding:0 10px!important;
	font-size:13px!important;
	background:#fff!important;
}
.yds-bis-subscribe{
	min-height:38px;
	padding:0 13px;
	border:0;
	border-radius:19px;
	background:#7f9299;
	color:#fff;
	font-size:13px;
	font-weight:700;
	white-space:nowrap;
	cursor:pointer;
}
.yds-bis-subscribe:hover{background:#71858c}
.yds-bis-subscribe:disabled{cursor:default;opacity:.7}
.yds-bis-subscribe.is-subscribed{background:#e7ecee;color:#657a82;opacity:1}
.yds-bis-unsubscribe{
	min-height:38px;
	padding:0 13px;
	border:1px solid #d7cbc5;
	border-radius:19px;
	background:#eee8e3;
	color:#7c6860;
	font-size:13px;
	font-weight:700;
	white-space:nowrap;
	cursor:pointer;
}
.yds-bis-unsubscribe:hover{background:#e7ddd7}
.yds-bis-unsubscribe:disabled{cursor:default;opacity:.7}
.yds-bis-message{
	grid-column:2 / -1;
	min-height:0;
	font-size:12px;
	line-height:1.45;
}
.yds-bis-message:empty{display:none}
.yds-bis-message.is-success{color:#426454}
.yds-bis-message.is-error{color:#a45d57}

@media (max-width:768px){
	.yds-bis-item{
		grid-template-columns:54px minmax(0,1fr) auto;
		gap:8px;
		align-items:center;
		padding:8px;
	}
	.yds-bis-image{width:54px;height:54px}
	.yds-bis-product-image-zoom{width:54px;height:54px}
	.yds-bis-action{
		width:96px;
		flex-direction:column;
		align-items:stretch;
		gap:5px;
	}
	.yds-bis-email{width:96px;min-width:0}
	.yds-bis-subscribe,
	.yds-bis-unsubscribe{
		width:96px;
		min-height:36px;
		padding-left:8px;
		padding-right:8px;
		font-size:12px;
	}
}

