/**
 * Compact modal presentation for the Effevision accessibility tools.
 * Loaded after frontend.css so the functional legacy layer remains backward compatible.
 */

#ev-a11y-root,
#ev-a11y-root *,
#ev-a11y-root *::before,
#ev-a11y-root *::after{
    box-sizing:border-box !important;
}

.ev-a11y-root{
    z-index:2147483000 !important;
    isolation:isolate !important;
}

.ev-a11y-root :where(button, a, input){
    max-width:100% !important;
    touch-action:manipulation !important;
}

.ev-a11y-backdrop{
    z-index:0 !important;
    background:rgba(15, 23, 42, .22) !important;
    -webkit-backdrop-filter:blur(1px) !important;
    backdrop-filter:blur(1px) !important;
}

.ev-a11y-toggle{
    position:relative !important;
    z-index:2 !important;
}

.ev-a11y-root[data-open="true"] .ev-a11y-toggle{
    opacity:0 !important;
    pointer-events:none !important;
    transform:scale(.92) !important;
}

.ev-a11y-panel,
.ev-a11y-panel-right,
.ev-a11y-panel-left{
    position:fixed !important;
    z-index:1 !important;
    inset:50% auto auto 50% !important;
    right:auto !important;
    bottom:auto !important;
    left:50% !important;
    width:min(520px, calc(100vw - 40px)) !important;
    height:auto !important;
    max-height:min(660px, calc(100vh - 72px)) !important;
    max-height:min(660px, calc(100dvh - 72px)) !important;
    margin:0 !important;
    display:flex !important;
    flex-direction:column !important;
    overflow:hidden !important;
    color:var(--ev-a11y-panel-text, #172033) !important;
    background:var(--ev-a11y-panel-bg, #fff) !important;
    border:1px solid var(--ev-a11y-panel-border, #dbe2ea) !important;
    border-radius:8px !important;
    box-shadow:0 14px 38px rgba(15, 23, 42, .17) !important;
    transform:translate(-50%, -50%) scale(1) !important;
    transform-origin:center !important;
    transition:opacity .16s ease, transform .16s ease !important;
}

.ev-a11y-root[data-open="false"] .ev-a11y-panel{
    opacity:0 !important;
    transform:translate(-50%, calc(-50% + 8px)) scale(.985) !important;
}

.ev-a11y-root[data-open="true"] .ev-a11y-panel{
    opacity:1 !important;
    transform:translate(-50%, -50%) scale(1) !important;
}

.ev-a11y-panel-head{
    position:relative !important;
    top:auto !important;
    z-index:2 !important;
    flex:0 0 auto !important;
    min-height:60px !important;
    padding:9px 11px !important;
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) auto !important;
    align-items:center !important;
    gap:10px !important;
    color:var(--ev-a11y-header-text, #fff) !important;
    background:var(--ev-a11y-header-bg, #101820) !important;
    border:0 !important;
    border-bottom:1px solid rgba(148, 163, 184, .2) !important;
    border-radius:0 !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
}

.ev-a11y-panel-brand{
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:34px minmax(0, 1fr) !important;
    align-items:center !important;
    gap:9px !important;
}

.ev-a11y-panel-logo{
    width:34px !important;
    height:34px !important;
    display:grid !important;
    place-items:center !important;
    flex:0 0 34px !important;
    color:var(--ev-a11y-header-bg, #101820) !important;
    background:var(--ev-a11y-header-text, #fff) !important;
    border:1px solid rgba(255, 255, 255, .32) !important;
    border-radius:6px !important;
}

.ev-a11y-panel-logo svg{
    width:20px !important;
    height:20px !important;
    max-width:20px !important;
    max-height:20px !important;
    display:block !important;
}

.ev-a11y-panel-copy{
    min-width:0 !important;
}

.ev-a11y-panel-copy h2{
    margin:0 0 2px !important;
    color:var(--ev-a11y-header-text, #fff) !important;
    font-size:18px !important;
    font-weight:700 !important;
    line-height:1.2 !important;
    letter-spacing:0 !important;
}

.ev-a11y-panel-copy p{
    margin:0 !important;
    max-width:360px !important;
    color:var(--ev-a11y-header-muted, rgba(255, 255, 255, .72)) !important;
    font-size:11.5px !important;
    font-weight:400 !important;
    line-height:1.35 !important;
    letter-spacing:0 !important;
}

.ev-a11y-panel-actions{
    min-width:max-content !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:6px !important;
    flex-shrink:0 !important;
}

.ev-a11y-chip-reset,
.ev-a11y-close{
    min-height:32px !important;
    height:32px !important;
    margin:0 !important;
    border:1px solid rgba(255, 255, 255, .28) !important;
    color:var(--ev-a11y-header-text, #fff) !important;
    background:rgba(255, 255, 255, .09) !important;
    box-shadow:none !important;
}

.ev-a11y-chip-reset{
    min-width:auto !important;
    padding:0 10px !important;
    border-radius:6px !important;
    font-size:12px !important;
    font-weight:600 !important;
    line-height:1 !important;
}

.ev-a11y-close{
    width:32px !important;
    min-width:32px !important;
    padding:0 !important;
    border-radius:6px !important;
    font-size:21px !important;
    font-weight:400 !important;
    line-height:1 !important;
}

.ev-a11y-chip-reset:not(:disabled):hover,
.ev-a11y-close:hover{
    color:var(--ev-a11y-header-text, #fff) !important;
    background:rgba(255, 255, 255, .17) !important;
    border-color:rgba(255, 255, 255, .5) !important;
    transform:none !important;
}

.ev-a11y-chip-reset:disabled,
.ev-a11y-chip-reset[aria-disabled="true"]{
    color:var(--ev-a11y-header-muted, rgba(255, 255, 255, .72)) !important;
    background:rgba(255, 255, 255, .05) !important;
    border-color:rgba(255, 255, 255, .14) !important;
    opacity:.58 !important;
}

.ev-a11y-panel :where(button, a, input):focus-visible{
    outline:3px solid var(--ev-a11y-brand-ring, rgba(0, 229, 180, .3)) !important;
    outline-offset:2px !important;
}

.ev-a11y-panel-body{
    flex:1 1 auto !important;
    min-height:0 !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    scrollbar-gutter:stable !important;
    padding:10px !important;
    display:flex !important;
    flex-direction:column !important;
    gap:8px !important;
    background:var(--ev-a11y-panel-muted, #f4f6f8) !important;
}

.ev-a11y-panel-body::-webkit-scrollbar{
    width:8px !important;
}

.ev-a11y-panel-body::-webkit-scrollbar-thumb{
    background:rgba(100, 116, 139, .28) !important;
    border:2px solid transparent !important;
    border-radius:999px !important;
    background-clip:padding-box !important;
}

.ev-a11y-section,
.ev-a11y-section-primary,
.ev-a11y-section-secondary{
    margin:0 !important;
    padding:11px !important;
    color:var(--ev-a11y-panel-text, #172033) !important;
    background:var(--ev-a11y-panel-bg, #fff) !important;
    border:1px solid var(--ev-a11y-panel-border, #dbe2ea) !important;
    border-radius:8px !important;
    box-shadow:none !important;
}

.ev-a11y-section + .ev-a11y-section,
.ev-a11y-section + .ev-a11y-panel-toolbar,
.ev-a11y-panel-toolbar + .ev-a11y-section{
    margin-top:0 !important;
}

.ev-a11y-section h3{
    margin:0 0 8px !important;
    color:var(--ev-a11y-panel-text, #172033) !important;
    font-size:14px !important;
    font-weight:700 !important;
    line-height:1.3 !important;
    letter-spacing:0 !important;
}

.ev-a11y-stepper-grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:6px !important;
}

.ev-a11y-stepper{
    min-width:0 !important;
    min-height:52px !important;
    padding:7px !important;
    display:grid !important;
    grid-template-columns:30px minmax(0, 1fr) auto !important;
    align-items:center !important;
    gap:7px !important;
    color:var(--ev-a11y-panel-text, #172033) !important;
    background:var(--ev-a11y-panel-muted, #f4f6f8) !important;
    border:1px solid var(--ev-a11y-panel-border, #dbe2ea) !important;
    border-radius:7px !important;
    box-shadow:none !important;
}

.ev-a11y-stepper-icon,
.ev-a11y-card-icon{
    width:30px !important;
    height:30px !important;
    display:grid !important;
    place-items:center !important;
    color:var(--ev-a11y-brand-dark, #008f73) !important;
    background:transparent !important;
    border:0 !important;
    border-radius:6px !important;
}

.ev-a11y-stepper-icon svg,
.ev-a11y-card-icon svg{
    width:18px !important;
    height:18px !important;
    max-width:18px !important;
    max-height:18px !important;
}

.ev-a11y-stepper-copy{
    min-width:0 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:center !important;
    gap:2px !important;
}

.ev-a11y-stepper-label{
    max-width:100% !important;
    overflow:visible !important;
    color:var(--ev-a11y-panel-text, #172033) !important;
    font-size:12px !important;
    font-weight:600 !important;
    line-height:1.25 !important;
    white-space:normal !important;
    text-overflow:clip !important;
}

.ev-a11y-stepper-value{
    color:var(--ev-a11y-muted, #657289) !important;
    font-size:11px !important;
    font-weight:500 !important;
    line-height:1.2 !important;
}

.ev-a11y-stepper-actions{
    grid-column:auto !important;
    display:flex !important;
    justify-content:flex-end !important;
    gap:4px !important;
}

.ev-a11y-stepper-btn{
    width:25px !important;
    height:25px !important;
    min-width:25px !important;
    padding:0 !important;
    color:var(--ev-a11y-panel-text, #172033) !important;
    background:var(--ev-a11y-panel-bg, #fff) !important;
    border:1px solid var(--ev-a11y-panel-border, #dbe2ea) !important;
    border-radius:6px !important;
    box-shadow:none !important;
}

.ev-a11y-card-grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:6px !important;
}

.ev-a11y-card{
    width:100% !important;
    min-width:0 !important;
    min-height:50px !important;
    padding:7px !important;
    display:grid !important;
    grid-template-columns:30px minmax(0, 1fr) !important;
    align-items:center !important;
    justify-content:initial !important;
    gap:8px !important;
    color:var(--ev-a11y-panel-text, #172033) !important;
    background:var(--ev-a11y-panel-muted, #f4f6f8) !important;
    border:1px solid var(--ev-a11y-panel-border, #dbe2ea) !important;
    border-radius:7px !important;
    box-shadow:none !important;
    text-align:left !important;
    cursor:pointer !important;
    transform:none !important;
    transition:background-color .14s ease, border-color .14s ease, box-shadow .14s ease !important;
}

.ev-a11y-card[aria-pressed="true"]{
    color:var(--ev-a11y-panel-text, #172033) !important;
    background:var(--ev-a11y-brand-soft, rgba(0, 229, 180, .12)) !important;
    border-color:var(--ev-a11y-brand, #00e5b4) !important;
    box-shadow:inset 2px 0 0 var(--ev-a11y-brand, #00e5b4) !important;
}

.ev-a11y-card[aria-pressed="true"] .ev-a11y-card-icon{
    color:var(--ev-a11y-brand-dark, #008f73) !important;
    background:transparent !important;
}

.ev-a11y-card-label{
    display:block !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow:visible !important;
    color:inherit !important;
    font-size:12.5px !important;
    font-weight:600 !important;
    line-height:1.3 !important;
    overflow-wrap:anywhere !important;
    white-space:normal !important;
    text-overflow:clip !important;
}

.ev-a11y-profile-list{
    gap:5px !important;
}

.ev-a11y-profile{
    min-height:48px !important;
    padding:7px 9px !important;
    color:var(--ev-a11y-panel-text, #172033) !important;
    background:var(--ev-a11y-panel-muted, #f4f6f8) !important;
    border:1px solid var(--ev-a11y-panel-border, #dbe2ea) !important;
    border-radius:7px !important;
    box-shadow:none !important;
    transform:none !important;
    transition:background-color .14s ease, border-color .14s ease, box-shadow .14s ease !important;
}

.ev-a11y-profile[aria-pressed="true"]{
    background:var(--ev-a11y-brand-soft, rgba(0, 229, 180, .12)) !important;
    border-color:var(--ev-a11y-brand, #00e5b4) !important;
    box-shadow:inset 2px 0 0 var(--ev-a11y-brand, #00e5b4) !important;
}

.ev-a11y-search{
    grid-template-columns:minmax(0, 1fr) auto !important;
    gap:7px !important;
}

.ev-a11y-search-input,
.ev-a11y-search-btn,
.ev-a11y-chip:not(.ev-a11y-chip-reset){
    min-height:38px !important;
    border-radius:6px !important;
}

.ev-a11y-search-input{
    min-width:0 !important;
    color:var(--ev-a11y-panel-text, #172033) !important;
    background:var(--ev-a11y-panel-bg, #fff) !important;
    border-color:var(--ev-a11y-panel-border, #dbe2ea) !important;
}

.ev-a11y-search-btn,
.ev-a11y-chip:not(.ev-a11y-chip-reset){
    color:var(--ev-a11y-brand-dark, #008f73) !important;
    background:var(--ev-a11y-panel-bg, #fff) !important;
    border:1px solid var(--ev-a11y-panel-border, #dbe2ea) !important;
    box-shadow:none !important;
    transform:none !important;
}

@media (hover: hover){
    .ev-a11y-card:hover,
    .ev-a11y-profile:hover{
        color:var(--ev-a11y-panel-text, #172033) !important;
        background:var(--ev-a11y-panel-bg, #fff) !important;
        border-color:var(--ev-a11y-brand, #00e5b4) !important;
        box-shadow:0 0 0 1px var(--ev-a11y-brand-ring, rgba(0, 229, 180, .3)) !important;
        transform:none !important;
    }

    .ev-a11y-card[aria-pressed="true"]:hover,
    .ev-a11y-profile[aria-pressed="true"]:hover{
        background:var(--ev-a11y-brand-soft, rgba(0, 229, 180, .12)) !important;
        box-shadow:inset 2px 0 0 var(--ev-a11y-brand, #00e5b4) !important;
    }

    .ev-a11y-stepper-btn:hover,
    .ev-a11y-search-btn:hover,
    .ev-a11y-chip:not(.ev-a11y-chip-reset):hover{
        color:var(--ev-a11y-brand-dark, #008f73) !important;
        background:var(--ev-a11y-brand-soft, rgba(0, 229, 180, .12)) !important;
        border-color:var(--ev-a11y-brand, #00e5b4) !important;
        box-shadow:none !important;
        transform:none !important;
    }
}

.ev-a11y-stepper-btn:focus:not(:focus-visible),
.ev-a11y-card:focus:not(:focus-visible),
.ev-a11y-profile:focus:not(:focus-visible),
.ev-a11y-search-btn:focus:not(:focus-visible),
.ev-a11y-chip:focus:not(:focus-visible),
.ev-a11y-close:focus:not(:focus-visible){
    outline:none !important;
    box-shadow:none !important;
}

.ev-a11y-panel-toolbar,
.ev-a11y-panel-toolbar-bottom{
    margin:0 !important;
    padding:0 !important;
}

.ev-a11y-status:empty{
    display:none !important;
}

.ev-a11y-status{
    min-height:0 !important;
    margin:0 !important;
    padding:0 2px !important;
    color:var(--ev-a11y-muted, #657289) !important;
    font-size:12px !important;
    font-weight:400 !important;
    line-height:1.4 !important;
}

.ev-a11y-panel-foot{
    flex:0 0 auto !important;
    min-height:30px !important;
    padding:6px 12px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    color:var(--ev-a11y-muted, #657289) !important;
    background:var(--ev-a11y-panel-bg, #fff) !important;
    border-top:1px solid var(--ev-a11y-panel-border, #dbe2ea) !important;
}

.ev-a11y-panel-foot:empty{
    display:none !important;
}

.ev-a11y-panel-foot a{
    color:var(--ev-a11y-muted, #657289) !important;
    font-size:11.5px !important;
    font-weight:400 !important;
    line-height:1.2 !important;
}

@media (max-width: 782px){
    .ev-a11y-panel,
    .ev-a11y-panel-right,
    .ev-a11y-panel-left{
        inset:auto 10px max(10px, env(safe-area-inset-bottom)) 10px !important;
        right:10px !important;
        bottom:max(10px, env(safe-area-inset-bottom)) !important;
        left:10px !important;
        width:auto !important;
        height:auto !important;
        max-height:min(720px, calc(100dvh - 24px)) !important;
        border:1px solid var(--ev-a11y-panel-border, #dbe2ea) !important;
        border-radius:14px !important;
        box-shadow:0 18px 48px rgba(15, 23, 42, .2) !important;
        transform:none !important;
    }

    .ev-a11y-root[data-open="false"] .ev-a11y-panel{
        opacity:0 !important;
        transform:translateY(12px) scale(.99) !important;
    }

    .ev-a11y-root[data-open="true"] .ev-a11y-panel{
        opacity:1 !important;
        transform:none !important;
    }

    .ev-a11y-panel-head{
        min-height:58px !important;
        padding:9px 10px !important;
        gap:8px !important;
        border-radius:13px 13px 0 0 !important;
    }

    .ev-a11y-panel-brand{
        grid-template-columns:32px minmax(0, 1fr) !important;
        gap:8px !important;
    }

    .ev-a11y-panel-logo{
        width:32px !important;
        height:32px !important;
    }

    .ev-a11y-panel-copy h2{
        font-size:16px !important;
        white-space:normal !important;
    }

    .ev-a11y-panel-copy p{
        display:none !important;
    }

    .ev-a11y-panel-body{
        padding:8px !important;
        gap:8px !important;
        scrollbar-gutter:auto !important;
    }

    .ev-a11y-section{
        padding:9px 10px !important;
        border-radius:10px !important;
    }

    .ev-a11y-section h3{
        margin-bottom:5px !important;
        font-size:13px !important;
    }

    .ev-a11y-stepper-grid,
    .ev-a11y-card-grid{
        grid-template-columns:1fr !important;
        gap:0 !important;
    }

    .ev-a11y-stepper{
        min-height:54px !important;
        padding:7px 2px !important;
        grid-template-columns:28px minmax(0, 1fr) auto !important;
        gap:8px !important;
        background:transparent !important;
        border:0 !important;
        border-radius:0 !important;
    }

    .ev-a11y-stepper + .ev-a11y-stepper,
    .ev-a11y-card + .ev-a11y-card{
        border-top:1px solid var(--ev-a11y-panel-border, #dbe2ea) !important;
    }

    .ev-a11y-stepper-icon,
    .ev-a11y-card-icon{
        width:28px !important;
        height:28px !important;
    }

    .ev-a11y-stepper-label{
        font-size:13px !important;
        font-weight:600 !important;
        line-height:1.3 !important;
        overflow-wrap:break-word !important;
    }

    .ev-a11y-stepper-value{
        font-size:11.5px !important;
    }

    .ev-a11y-chip-reset,
    .ev-a11y-close{
        min-height:36px !important;
        height:36px !important;
    }

    .ev-a11y-chip-reset{
        min-width:auto !important;
        padding:0 6px !important;
        font-size:12.5px !important;
        white-space:nowrap !important;
        background:transparent !important;
        border-color:transparent !important;
    }

    .ev-a11y-close{
        width:36px !important;
        min-width:36px !important;
    }

    .ev-a11y-stepper-btn{
        width:34px !important;
        height:34px !important;
        min-width:34px !important;
        min-height:34px !important;
        font-size:17px !important;
        border-radius:999px !important;
    }

    .ev-a11y-card{
        min-height:48px !important;
        padding:8px 2px !important;
        grid-template-columns:28px minmax(0, 1fr) !important;
        gap:8px !important;
        background:transparent !important;
        border:0 !important;
        border-radius:0 !important;
    }

    .ev-a11y-card[aria-pressed="true"]{
        background:var(--ev-a11y-brand-soft, rgba(0, 229, 180, .12)) !important;
        box-shadow:inset 2px 0 0 var(--ev-a11y-brand, #00e5b4) !important;
    }

    .ev-a11y-card-label{
        font-size:13.5px !important;
        font-weight:600 !important;
        line-height:1.35 !important;
        overflow-wrap:break-word !important;
        word-break:normal !important;
    }

    .ev-a11y-profile{
        min-height:48px !important;
        background:transparent !important;
        border-width:0 0 1px !important;
        border-radius:0 !important;
    }

    .ev-a11y-search-input,
    .ev-a11y-search-btn,
    .ev-a11y-chip:not(.ev-a11y-chip-reset){
        min-height:44px !important;
    }

    .ev-a11y-panel-foot{
        min-height:32px !important;
        padding:6px 12px max(6px, env(safe-area-inset-bottom)) !important;
        border-radius:0 0 13px 13px !important;
    }
}

@media (max-width: 440px){
    .ev-a11y-panel-head{
        grid-template-columns:minmax(0, 1fr) auto !important;
    }

    .ev-a11y-panel-brand{
        grid-template-columns:30px minmax(0, 1fr) !important;
        gap:7px !important;
    }

    .ev-a11y-panel-logo{
        width:30px !important;
        height:30px !important;
    }

    .ev-a11y-panel-actions{
        gap:5px !important;
    }

    .ev-a11y-chip-reset{
        padding:0 4px !important;
    }

    .ev-a11y-search{
        grid-template-columns:1fr !important;
    }

    .ev-a11y-search-btn{
        width:100% !important;
    }
}

@media (prefers-reduced-motion: reduce){
    .ev-a11y-panel,
    .ev-a11y-toggle{
        transition:none !important;
    }
}
