/* === EO Product Labels — Front-Office Styles === */
/* Version: 1.2.1 | Size target: <5KB */

.eo-labels-container{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;z-index:10;overflow:visible}
.eo-label{position:absolute;pointer-events:auto;line-height:1.2;white-space:nowrap;box-sizing:border-box;transition:opacity .2s ease}
.eo-label--top-left{top:8px;left:8px}
.eo-label--top-center{top:8px;left:0;right:0;width:fit-content;margin-inline:auto}
.eo-label--top-right{top:8px;right:8px}
.eo-label--middle-left{top:0;bottom:0;left:8px;height:fit-content;margin-block:auto}
.eo-label--middle-center{top:0;bottom:0;left:0;right:0;width:fit-content;height:fit-content;margin:auto}
.eo-label--middle-right{top:0;bottom:0;right:8px;height:fit-content;margin-block:auto}
.eo-label--bottom-left{bottom:8px;left:8px}
.eo-label--bottom-center{bottom:8px;left:0;right:0;width:fit-content;margin-inline:auto}
.eo-label--bottom-right{bottom:8px;right:8px}
.eo-label--image img{display:block;max-width:100%;height:auto}
.eo-label--text{display:inline-block}
.eo-label:hover{opacity:.85}

/* Parent containers need relative positioning */
.product-miniature .thumbnail-top,
.product-miniature .thumbnail-container,
.product-miniature .product-thumbnail,
.product-miniature .product-image,
.images-container,
.product-cover{position:relative !important;overflow:visible !important}

/* Multiple labels stacking */
.eo-labels-container .eo-label--top-left:nth-child(2){top:43px}
.eo-labels-container .eo-label--top-left:nth-child(3){top:78px}
.eo-labels-container .eo-label--top-right:nth-child(2){top:43px}
.eo-labels-container .eo-label--top-right:nth-child(3){top:78px}
.eo-labels-container .eo-label--bottom-left:nth-child(2){bottom:43px}
.eo-labels-container .eo-label--bottom-left:nth-child(3){bottom:78px}
.eo-labels-container .eo-label--bottom-right:nth-child(2){bottom:43px}
.eo-labels-container .eo-label--bottom-right:nth-child(3){bottom:78px}

/* Responsive */
@media(max-width:768px){
.eo-label--text{font-size:85% !important}
.eo-label--image img{max-width:60px}
}
@media(max-width:480px){
.eo-label--text{font-size:75% !important;padding:2px 8px !important}
.eo-label--image img{max-width:50px}
}

/* === Hint Popup (CSS-only) === */
.eo-label--has-hint{cursor:help;overflow:visible}
.eo-label-hint{display:none;position:absolute;background:#1E293B;color:#FFFFFF;font-size:12px;font-weight:normal;text-transform:none;line-height:1.4;padding:8px 12px;border-radius:6px;white-space:normal;min-width:150px;max-width:250px;width:max-content;z-index:100;box-shadow:0 2px 8px rgba(0,0,0,0.2);pointer-events:none}
.eo-label--has-hint:hover .eo-label-hint{display:block}
.eo-label--hint-bottom .eo-label-hint{top:calc(100% + 8px);left:50%;transform:translateX(-50%)}
.eo-label--hint-top .eo-label-hint{bottom:calc(100% + 8px);left:50%;transform:translateX(-50%)}
.eo-label--hint-left .eo-label-hint{right:calc(100% + 8px);top:50%;transform:translateY(-50%)}
.eo-label--hint-right .eo-label-hint{left:calc(100% + 8px);top:50%;transform:translateY(-50%)}

/* === Icon type === */
.eo-label--icon{display:flex;align-items:center;justify-content:center}
.eo-label--icon i,.eo-label--icon .material-icons{display:inline-block;line-height:1}

/* === Clickable labels === */
.eo-label-link{text-decoration:none;color:inherit;display:inline-block}
.eo-label-link:hover{opacity:.85}

/* === Position mode custom (drag editor) === */
.eo-label--position-custom{position:absolute}
.eo-label--anchor-top-left{/* default, no offset needed */}
.eo-label--anchor-top-center{translate:-50% 0}
.eo-label--anchor-top-right{translate:-100% 0}
.eo-label--anchor-center{translate:-50% -50%}
.eo-label--anchor-bottom-left{translate:0 -100%}
.eo-label--anchor-bottom-center{translate:-50% -100%}
.eo-label--anchor-bottom-right{translate:-100% -100%}

/* === WCAG Accessibility: Focus visible === */
.eo-label-link:focus-visible{outline:2px solid #2563EB;outline-offset:2px}
.eo-label-link:focus:not(:focus-visible){outline:none}

/* === Hint style: Expand (inline text on hover) === */
.eo-label--hint-expand{cursor:help;display:inline-flex;align-items:center;white-space:nowrap}
.eo-label--hint-expand>*:not(.eo-label-hint-expand){flex-shrink:0}
.eo-label--hint-expand .eo-label-hint-expand{flex-shrink:0;display:inline-block;max-width:0;overflow:hidden;opacity:0;white-space:nowrap;transition:max-width .35s ease,opacity .25s ease .05s,margin-left .35s ease;margin-left:0;font-weight:normal;text-transform:none}
.eo-label--hint-expand:hover .eo-label-hint-expand{max-width:400px;opacity:1;margin-left:6px}

/* === Dark mode === */
@media(prefers-color-scheme:dark){
.eo-labels-container{--eo-shadow-color:rgba(0,0,0,0.4)}
.eo-label-hint{background:#0F172A;color:#e0e0e0;border-color:#333}
}