/* Opt-in adapter for the shared sportyModal shell and production product list. */
#tagsurf-modal { position:fixed; inset:0; z-index:2147483010; pointer-events:none; }
#smodal.tagsurf-shop-picker { z-index:2147483011; }
#tagsurf-modal::before { content:""; position:absolute; inset:0; background:rgba(0,0,0,.65); }
#tagsurf-modal:not(.open) { display:none; }
#tagsurf-modal.open { pointer-events:auto; }
#tagsurf-modal.open .vmodal_holder { opacity:1; transform:none; transition:none; }
#tagsurf-modal .vmodal { display:flex; flex-direction:column; width:1320px; min-width:0; max-width:calc(100vw - 32px); height:calc(100dvh - 32px); max-height:none; padding:24px; }
#tagsurf-modal .title { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px 20px; flex:none; margin:0 44px 9px 0; font-size:calc(var(--plist_title_font_size) * 0.8); }
#tagsurf-modal .title > #tagsurf-modal-title { flex:none; }
#tagsurf-modal .tagsurf-modal-controls { display:flex; align-items:center; justify-content:flex-end; flex:0 1 742px; width:742px; max-width:100%; flex-wrap:wrap; gap:12px; margin-left:auto; }
#tagsurf-modal .desc { flex:1; min-height:0; max-height:none; overflow:auto; overscroll-behavior:contain; background:var(--bg-site,#fff); color:var(--text-body,#222); border-radius:var(--theme_radius_xs,5px); padding:0 16px 16px; font-size:var(--body-font-size,13px); line-height:1.4; }
/* Admin modal styles use white headings and labels for dark dialogs; the product browser has a light surface. */
#tagsurf-modal .desc :is(h1, h2, h3, h4, h5, h6, label) { color:inherit; }
/* The admin shell does not load front_v3.css, which owns the storefront filter controls. */
#tagsurf-modal .filters input[type="checkbox"],
#tagsurf-modal .filters input[type="radio"] {
    appearance:none;
    -webkit-appearance:none;
    box-sizing:border-box;
    position:relative;
    width:18px;
    height:18px;
    min-width:18px;
    min-height:18px;
    margin:0;
    padding:0;
    vertical-align:-4px;
    border:1px solid #bbb;
    border-radius:50%;
    background-color:#fff;
    box-shadow:0 0 0 0 var(--checkbox-active-color) inset;
    outline:none;
    transition:all .15s ease-in-out;
    cursor:pointer;
}
#tagsurf-modal .filters input[type="checkbox"]:focus-visible,
#tagsurf-modal .filters input[type="radio"]:focus-visible { outline:2px solid #333; outline-offset:2px; }
#tagsurf-modal .filters input[type="checkbox"] { border-radius:5px; }
#tagsurf-modal .filters input[type="checkbox"]::after,
#tagsurf-modal .filters input[type="radio"]::after {
    content:"";
    display:block;
    position:absolute;
    top:50%;
    left:50%;
    transform:scale(.2);
    opacity:0;
    transition:all .15s ease-in-out .1s;
}
#tagsurf-modal .filters input[type="checkbox"]::after { width:10px; height:8px; margin:-4px 0 0 -5px; background-image:url('/img/new_check.svg?v=1'); }
#tagsurf-modal .filters input[type="radio"]::after { width:4px; height:4px; margin:-2px 0 0 -2px; border-radius:50%; background-color:#fff; }
#tagsurf-modal .filters input[type="checkbox"]:checked,
#tagsurf-modal .filters input[type="radio"]:checked { border-color:var(--checkbox-active-color); box-shadow:0 0 0 10px var(--checkbox-active-color) inset; }
#tagsurf-modal .filters input[type="checkbox"]:checked::after,
#tagsurf-modal .filters input[type="radio"]:checked::after { transform:scale(1); opacity:1; }
#tagsurf-modal .vmodal > .btn_holder { display:none; }
#tagsurf-modal .close_btn { min-width:44px; min-height:44px; background:none; border:0; color:#fff; }
#tagsurf-modal .tagsurf-modal-status { margin:0; padding:24px; }
#tagsurf-modal .tagsurf-modal-status:empty { display:none; }
#tagsurf-modal .tagsurf-modal-status.is-loading { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; min-height:220px; }
#tagsurf-modal .tagsurf-modal-status .loader { position:relative; width:60px; height:60px; flex:none; }
@media (prefers-reduced-motion:reduce) {
    #tagsurf-modal .tagsurf-modal-status .loader::after { animation:none; }
}
#tagsurf-modal .tagsurf-modal-controls:empty { display:none; }
#tagsurf-modal .tagsurf-modal-shop { display:flex; align-items:center; min-width:0; flex:0 1 300px; width:300px; max-width:100%; }
#tagsurf-modal .tagsurf-modal-shop .modal_select_btn { position:relative; display:flex; align-items:center; justify-content:flex-start; gap:6px; width:100%; min-width:0; height:38px; min-height:38px; padding:8px 12px; color:#f5f5f5; background:#424242; border:1px solid #666; font-size:14px; font-weight:400; text-align:left; text-transform:none; }
#tagsurf-modal .tagsurf-modal-shop .modal_select_btn:hover { color:#fff; background:#4e4e4e; }
#tagsurf-modal .tagsurf-modal-shop .modal_select_btn:focus { color:#222; background:#fff; }
#tagsurf-modal .tagsurf-modal-shop .vms_select_btn__label { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#tagsurf-modal .btn-icon-text { display:inline-flex; align-items:center; justify-content:center; gap:6px; }
#tagsurf-modal .plist { width:100%; max-width:none; margin:0; }
#tagsurf-modal .plist__head { margin-left:-10px; margin-right:-10px; top:0; transition:none; }
/* Desktop filters scroll inside the modal viewport, not the browser viewport. */
@media (min-width:769px) {
    #tagsurf-modal .filters {
        top:var(--tagsurf-modal-filter-top,60px);
        max-height:var(--tagsurf-modal-filter-height,none);
    }
}
#tagsurf-modal .pcontain { padding-left:0; padding-right:0; }
#tagsurf-modal .plist .container { width:100%; max-width:100%; }
#tagsurf-modal .pc [data-tagsurf-select] { width:100%; min-width:0; max-width:none; min-height:44px; margin:auto 0 0; align-self:flex-end; }
#tagsurf-modal .pc .tagsurf-modal-select-short { display:none; }
#tagsurf-modal .pc { position:relative; }
#tagsurf-modal :focus-visible { outline:3px solid var(--primary-color,#ff4f00); outline-offset:3px; }
#tagsurf-modal [hidden] { display:none!important; }
@media(max-width:767px) {
    #tagsurf-modal .vmodal { width:100%; max-width:100%; height:100dvh; padding:12px; border-radius:0; }
    #tagsurf-modal .title > #tagsurf-modal-title { width:100%; }
    #tagsurf-modal .tagsurf-modal-controls { flex:1 1 100%; width:100%; }
    #tagsurf-modal .tagsurf-modal-shop { flex:1 1 100%; width:100%; max-width:none; }
    #tagsurf-modal .desc { padding:0 8px 8px; }
    #tagsurf-modal .plist__head { top:0 !important; margin-left:-8px; margin-right:-8px; }
    #tagsurf-modal .plist { min-width:0; }
    #tagsurf-modal .pc [data-tagsurf-select] { padding-left:6px; padding-right:6px; white-space:nowrap; }
    #tagsurf-modal .pc .tagsurf-modal-select-full { display:none; }
    #tagsurf-modal .pc .tagsurf-modal-select-short { display:inline; }
    #tagsurf-modal input, #tagsurf-modal select { font-size:16px; }
}

/* Shop shortcuts reuse UX Lab's native admin checkbox; layout belongs to this modal. */
#tagsurf-modal .tagsurf-modal-shop-shortcuts { display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; }
#tagsurf-modal .tagsurf-modal-shop-shortcuts .admin-ui-check-line { margin:0; font-size:14px; font-weight:normal; color:inherit; min-height:32px; }
