#ariaat-checker-panel {
    position: fixed;
    bottom: 20px;
    right: 20px;
    top: auto;
    left: auto;
    width: 480px !important;
    background: #fff !important;
    padding: 15px !important;
    z-index: 99999 !important;
    font-size: 14px !important;
    box-shadow: 0 0 15px rgba(0,0,0,0.2) !important;
    font-family: Arial, Helvetica, sans-serif !important;
    border-radius: 5px !important;
    border: 2px solid #5036ab;
}
#ariaat-checker-panel a {
    color: #5036ab !important;
    text-decoration: underline !important;
}
#ariaat-checker-panel #ariaat-checker-header {
    background: #5036ab !important;
    color: #fff !important;
    padding: 8px 15px !important;
    font-weight: bold !important;
    margin: -15px -15px 10px !important;
    font-size: 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#ariaat-checker-panel #ariaat-checker-header #ariaat-draggable {
    display: flex;
    align-items: center;
    cursor: move !important;
}
#ariaat-checker-panel #ariaat-checker-header #ariaat-draggable svg {
    vertical-align: middle;
    margin-right: 8px;
}
#ariaat-checker-header #run-ariaat-scan {
    margin: 0;
    font-size: 13px !important;
    padding: 6px 10px !important;
    line-height: 1.2 !important;
    background: #fff !important;
    color: #000000 !important;
    text-decoration: none !important;
    border: 1px solid #fff !important;
    font-size: 0.8rem !important;
    padding: 4px 15px !important;
    cursor: pointer !important;
    border-radius: 4px !important;
    text-decoration: none !important;
}

#ariaat-checker-header #run-ariaat-scan:hover {
    background: #fff !important;
    color: #5036ab !important;
}

#ariaat-checker-overview {
    margin: 16px 0 12px !important;
}
#ariaat-checker-panel .ariaat-summary {
    font-size: 0.8rem !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#ariaat-checker-panel .ariaat-summary .ariaat-issues {
    font-weight: bold !important;
}
#ariaat-checker-panel .ariaat-summary .ariaat-issues span {
    padding: 4px 7px;
    border-radius: 4px;
    margin-right: 4px;
}
#ariaat-checker-panel .ariaat-summary .ariaat-pro-text {
    font-size: 13px !important;
}

#ariaat-checker-panel button {
    background: #5036ab !important;
    color: #fff !important;
    text-decoration: none !important;
    border: 1px solid #1853a3 !important;
    font-size: 14px !important;
    padding: 6px 15px !important;
    cursor: pointer !important;
    border-radius: 4px !important;
    text-decoration: none !important;
}

#ariaat-checker-panel button:hover{
    background: #fff !important;
    color: #5036ab !important;
}

#ariaat-checker-panel button#ariaat-apply-fixes:hover {
    background: #fff !important;
    color: green !important;
    border-color: green !important;
}
.ariaat-auto-fix-text {
    font-size: 13px;
    font-style: italic;
}
#ariaat-checker-panel button#ariaat-apply-fixes {
    background: green !important;
    border-color: green !important;
    font-size: 13px !important;
    margin: 10px 0 5px;
    padding: 3px 12px !important;
}

#ariaat-checker-panel #ariaat-checker-results {
    max-height: 420px !important;
    overflow-y: auto !important;
    margin-top: 10px !important;
}

#ariaat-checker-panel .ariaat-hidden-warning {
    margin-top: 6px !important;
    background: #fff3cd !important;
    color: #856404 !important;
    border: 1px solid #ffeeba !important;
    border-radius: 4px !important;
    padding: 6px 8px !important;
    font-size: 12px !important;
}
#ariaat-checker-panel .ariaat-errors {
    list-style: none !important;
    padding: 5px 10px 5px 0 !important;
}
#ariaat-checker-panel .ariaat-errors li {
    margin-bottom: 10px !important;
    border: 1px solid #c9c0e6 !important;
    padding: 10px !important;
    font-size: 13px !important;
    line-height: 20px !important;
    border-radius: 5px !important;
    color: #444 !important;
    background: #fff !important;
    box-shadow: 0 2px 2px rgba(0,0,0,0.2);
}

#ariaat-checker-panel .ariaat-errors li a {
    text-decoration: underline !important;
}

#ariaat-checker-panel .ariaat-errors li .ariaat-error-title {
    display: inline-block !important;
    width: 100% !important;
    margin: 0 0 6px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
}
#ariaat-checker-panel .ariaat-errors li .ariaat-error-selector {
    margin: 0 0 5px 0 !important;
}
#ariaat-checker-panel .ariaat-errors li .ariaat-error-selector pre {
    max-width: unset !important;
    display: inline !important;
    padding: 2px 4px !important;
    margin: 0 3px 0 0 !important;
    background: #eef4f9 !important;
    border: 1px solid #bdd1e2 !important;
    font-size: 12px !important;
    white-space: pre-wrap;
    word-break: break-word;
    overflow-wrap: anywhere;
}
#ariaat-checker-panel .ariaat-errors li .ariaat-error-text {
    margin: 0 0 10px !important;
}
#ariaat-checker-panel .ariaat-errors li .ariaat-footer {
    background: #f2f1f9;
    padding: 4px 10px;
    margin: 4px -10px -10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

#ariaat-checker-panel .ariaat-errors li .ariaat-footer .ariaat-levelinfo {
    flex-shrink: 0;
}
#ariaat-checker-panel .ariaat-errors li .ariaat-footer a {
    text-decoration: none !important;
}
#ariaat-checker-panel .ariaat-errors li .ariaat-buttons {
    display: flex;
    gap: 6px;
    flex-shrink: 0;
}
#ariaat-checker-panel .ariaat-errors li .ariaat-sml-button {
    background: #fff !important;
    color: #5036ab !important;
    padding: 2px 5px !important;
    font-size: 11px !important;
    line-height: 15px !important;
    height: auto !important;
    display: inline-block !important;
    margin: 4px 1px 4px 0 !important;
    text-decoration: none !important;
}
#ariaat-checker-panel .ariaat-errors li .ariaat-sml-button:hover {
    background: #5036ab !important;
    color: #fff !important;
}
#ariaat-checker-panel .ariaat-errors li .ariaat-level-badge {
    padding: 4px 7px !important;
    font-size: 11px !important;
    line-height: 15px !important;
    height: auto !important;
    text-decoration: none !important;
    font-weight: bold;
    margin-left: 6px;
    border-radius: 4px;
    color: #fff !important;
    text-transform: uppercase;
    width: auto !important;
    margin: 4px 2px 4px 0 !important;
    display: inline-block !important;
}

#ariaat-checker-panel .type-error {
    background-color: #e74c3c;
    color: #fff;
}
#ariaat-checker-panel .type-warning {
    background-color: #f39c12;
    color: #fff;
}
#ariaat-checker-panel .ariaat-error-msg {
    flex-grow: 1 !important;
}


#ariaat-checker-panel .ariaat-no-issues {
    color: green !important;
    font-weight: bold !important;
}

.ariaat-error-outline {
    box-shadow: 0 0 0 4px orange !important;
    z-index: 9999 !important;
    pointer-events: auto !important;
}
