.disclaimer-feedback-links {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 1rem;
    padding-top: 0px;
}
.disclaimer-feedback-links a {
    color: #28a745;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: color 0.2s ease;
}
.disclaimer-feedback-links a:hover {
    color: #218838;
    text-decoration: underline;
}
.disclaimer-feedback-links .divider {
    width: 1px;
    height: 16px;
    background-color: rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .disclaimer-feedback-links a,
body[data-theme="dark"] .disclaimer-feedback-links a {
    color: #28a745;
}
html[data-theme="dark"] .disclaimer-feedback-links a:hover,
body[data-theme="dark"] .disclaimer-feedback-links a:hover {
    color: #34ce57;
}
html[data-theme="dark"] .disclaimer-feedback-links .divider,
body[data-theme="dark"] .disclaimer-feedback-links .divider {
    background-color: rgba(255, 255, 255, 0.3);
}


.export-dropdown {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.1);
}
html[data-theme="light"] .export-dropdown,
html:not([data-theme="dark"]) .export-dropdown,
body[data-theme="light"] .export-dropdown,
body:not([data-theme="dark"]) .export-dropdown {
    background-color: #fff;
    border-color: rgba(0, 0, 0, 0.1);
}
html[data-theme="light"] .export-dropdown-item,
html:not([data-theme="dark"]) .export-dropdown-item,
body[data-theme="light"] .export-dropdown-item,
body:not([data-theme="dark"]) .export-dropdown-item {
    color: #212529;
}
html[data-theme="light"] .export-dropdown-item:hover,
html:not([data-theme="dark"]) .export-dropdown-item:hover,
html[data-theme="light"] .export-dropdown-item:focus,
html:not([data-theme="dark"]) .export-dropdown-item:focus,
body[data-theme="light"] .export-dropdown-item:hover,
body:not([data-theme="dark"]) .export-dropdown-item:hover,
body[data-theme="light"] .export-dropdown-item:focus,
body:not([data-theme="dark"]) .export-dropdown-item:focus {
    background-color: #f8f9fa;
    color: #212529;
}
html[data-theme="light"] .export-dropdown-item .icon-svg,
html:not([data-theme="dark"]) .export-dropdown-item .icon-svg,
body[data-theme="light"] .export-dropdown-item .icon-svg,
body:not([data-theme="dark"]) .export-dropdown-item .icon-svg {
    color: rgba(0, 0, 0, 0.7) !important;
}
html[data-theme="light"] .export-dropdown-item:hover .icon-svg,
html:not([data-theme="dark"]) .export-dropdown-item:hover .icon-svg,
html[data-theme="light"] .export-dropdown-item:focus .icon-svg,
html:not([data-theme="dark"]) .export-dropdown-item:focus .icon-svg,
body[data-theme="light"] .export-dropdown-item:hover .icon-svg,
body:not([data-theme="dark"]) .export-dropdown-item:hover .icon-svg,
body[data-theme="light"] .export-dropdown-item:focus .icon-svg,
body:not([data-theme="dark"]) .export-dropdown-item:focus .icon-svg {
    color: rgba(0, 0, 0, 0.9) !important;
}
html[data-theme="dark"] .export-dropdown,
body[data-theme="dark"] .export-dropdown {
    background-color: #282828 !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}
html[data-theme="dark"] .export-dropdown-item,
body[data-theme="dark"] .export-dropdown-item {
    color: rgba(255, 255, 255, 0.9) !important;
}
html[data-theme="dark"] .export-dropdown-item:hover,
html[data-theme="dark"] .export-dropdown-item:focus,
body[data-theme="dark"] .export-dropdown-item:hover,
body[data-theme="dark"] .export-dropdown-item:focus {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
}
html[data-theme="dark"] .export-dropdown-item .icon-svg,
body[data-theme="dark"] .export-dropdown-item .icon-svg {
    color: rgba(255, 255, 255, 0.7) !important;
}
html[data-theme="dark"] .export-dropdown-item:hover .icon-svg,
html[data-theme="dark"] .export-dropdown-item:focus .icon-svg,
body[data-theme="dark"] .export-dropdown-item:hover .icon-svg,
body[data-theme="dark"] .export-dropdown-item:focus .icon-svg {
    color: #fff !important;
}
html[data-theme="dark"] #exportDropdownBtn::after,
body[data-theme="dark"] #exportDropdownBtn::after {
    border-top-color: #fff !important;
}
html[data-theme="light"] #exportDropdownBtn::after,
html:not([data-theme="dark"]) #exportDropdownBtn::after,
body[data-theme="light"] #exportDropdownBtn::after,
body:not([data-theme="dark"]) #exportDropdownBtn::after {
    border-top-color: #fff !important;
}


.result-divider-wrapper {
    padding: 0;
}
.result-divider {
    position: relative;
    text-align: center;
    margin: 0;
    padding: 0;
}
.result-divider::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background-color: rgba(0, 0, 0, 0.1);
    transform: translateY(-50%);
}
.result-divider-text {
    position: relative;
    display: inline-block;
    padding: 0 1rem;
    background-color: #fff;
    color: rgba(0, 0, 0, 0.6);
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
html[data-theme="dark"] .result-divider::before,
body[data-theme="dark"] .result-divider::before {
    background-color: rgba(255, 255, 255, 0.1);
}
html[data-theme="dark"] .result-divider-text,
body[data-theme="dark"] .result-divider-text {
    background-color: #282828;
    color: rgba(255, 255, 255, 0.7);
}


    #validation-status-footer,
#bin-search-status-footer,
#match-status-footer,
#ssl-checker-footer,
#ip-lookup-footer,
#http-header-footer {
        border-top: none !important;
    }
    #validation-status-footer .d-flex,
#bin-search-status-footer .d-flex,
#match-status-footer .d-flex,
#ssl-checker-footer .d-flex,
#ip-lookup-footer .d-flex,
#http-header-footer .d-flex {
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
    }
    @media (max-width: 768px) {
        #validation-status-footer .d-flex,
#bin-search-status-footer .d-flex,
#match-status-footer .d-flex,
#ssl-checker-footer .d-flex,
#ip-lookup-footer .d-flex,
#http-header-footer .d-flex {
            flex-direction: column;
        }
        #validation-status-footer .d-flex > .btn,
#bin-search-status-footer .d-flex > .btn,
#match-status-footer .d-flex > .btn,
#ssl-checker-footer .d-flex > .btn,
#ip-lookup-footer .d-flex > .btn,
#http-header-footer .d-flex > .btn,
        #validation-status-footer .d-flex > .dropdown,
#bin-search-status-footer .d-flex > .dropdown,
#match-status-footer .d-flex > .dropdown,
#ssl-checker-footer .d-flex > .dropdown,
#ip-lookup-footer .d-flex > .dropdown,
#http-header-footer .d-flex > .dropdown {
            width: 100%;
            max-width: 300px;
            margin: 0.25rem auto !important;
        }
        #validation-status-footer .btn,
#bin-search-status-footer .btn,
#match-status-footer .btn,
#ssl-checker-footer .btn,
#ip-lookup-footer .btn,
#http-header-footer .btn {
            display: flex !important;
            flex-direction: row !important;
            flex-wrap: nowrap !important;
            align-items: center !important;
            justify-content: center !important;
            white-space: nowrap !important;
            text-align: center !important;
        }
        #validation-status-footer .btn .icon-svg,
#bin-search-status-footer .btn .icon-svg,
#match-status-footer .btn .icon-svg,
#ssl-checker-footer .btn .icon-svg,
#ip-lookup-footer .btn .icon-svg,
#http-header-footer .btn .icon-svg {
            display: inline-block !important;
            flex-shrink: 0 !important;
            margin-right: 0.5rem !important;
        }
        #validation-status-footer .dropdown,
#bin-search-status-footer .dropdown,
#match-status-footer .dropdown,
#ssl-checker-footer .dropdown,
#ip-lookup-footer .dropdown,
#http-header-footer .dropdown {
            width: 100%;
            max-width: 300px;
            margin: 0.25rem auto !important;
        }
        #validation-status-footer .dropdown > .btn,
#bin-search-status-footer .dropdown > .btn,
#match-status-footer .dropdown > .btn,
#ssl-checker-footer .dropdown > .btn,
#ip-lookup-footer .dropdown > .btn,
#http-header-footer .dropdown > .btn {
            width: 100% !important;
            display: flex !important;
            flex-direction: row !important;
            flex-wrap: nowrap !important;
            align-items: center !important;
            justify-content: center !important;
            white-space: nowrap !important;
            text-align: center !important;
        }
        #validation-status-footer .dropdown > .btn .icon-svg,
#bin-search-status-footer .dropdown > .btn .icon-svg,
#match-status-footer .dropdown > .btn .icon-svg,
#ssl-checker-footer .dropdown > .btn .icon-svg,
#ip-lookup-footer .dropdown > .btn .icon-svg,
#http-header-footer .dropdown > .btn .icon-svg {
            display: inline-block !important;
            flex-shrink: 0 !important;
            margin-right: 0.5rem !important;
        }
        #validation-status-footer .export-dropdown,
#bin-search-status-footer .export-dropdown,
#match-status-footer .export-dropdown,
#ssl-checker-footer .export-dropdown,
#ip-lookup-footer .export-dropdown,
#http-header-footer .export-dropdown {
            right: auto !important;
            left: 50% !important;
            transform: translateX(-50%) !important;
        }
    }


html[data-theme="dark"] .modal-body .form-control,
html[data-theme="dark"] .modal-body input.form-control,
html[data-theme="dark"] .modal-body .modal-input,
html[data-theme="dark"] .modal-body textarea.form-control,
body[data-theme="dark"] .modal-body .form-control,
body[data-theme="dark"] .modal-body input.form-control,
body[data-theme="dark"] .modal-body .modal-input,
body[data-theme="dark"] .modal-body textarea.form-control {
    background-color: #282828 !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: #fff !important;
}

html[data-theme="light"] .modal-body .form-control,
html:not([data-theme="dark"]) .modal-body .form-control,
html[data-theme="light"] .modal-body input.form-control,
html:not([data-theme="dark"]) .modal-body input.form-control,
html[data-theme="light"] .modal-body .modal-input,
html:not([data-theme="dark"]) .modal-body .modal-input,
html[data-theme="light"] .modal-body textarea.form-control,
html:not([data-theme="dark"]) .modal-body textarea.form-control,
body[data-theme="light"] .modal-body .form-control,
body:not([data-theme="dark"]) .modal-body .form-control,
body[data-theme="light"] .modal-body input.form-control,
body:not([data-theme="dark"]) .modal-body input.form-control,
body[data-theme="light"] .modal-body .modal-input,
body:not([data-theme="dark"]) .modal-body .modal-input,
body[data-theme="light"] .modal-body textarea.form-control,
body:not([data-theme="dark"]) .modal-body textarea.form-control {
    background-color: #f8f9fa !important;
    border: 1px solid #e9ecef !important;
    color: #495057 !important;
}

html[data-theme="dark"] .modal-body .col-form-label,
html[data-theme="dark"] .modal-body label,
html[data-theme="dark"] .modal-body .modal-label,
body[data-theme="dark"] .modal-body .col-form-label,
body[data-theme="dark"] .modal-body label,
body[data-theme="dark"] .modal-body .modal-label {
    color: rgba(255, 255, 255, 0.9) !important;
}

html[data-theme="light"] .modal-body .col-form-label,
html:not([data-theme="dark"]) .modal-body .col-form-label,
html[data-theme="light"] .modal-body label,
html:not([data-theme="dark"]) .modal-body label,
html[data-theme="light"] .modal-body .modal-label,
html:not([data-theme="dark"]) .modal-body .modal-label,
body[data-theme="light"] .modal-body .col-form-label,
body:not([data-theme="dark"]) .modal-body .col-form-label,
body[data-theme="light"] .modal-body label,
body:not([data-theme="dark"]) .modal-body label,
body[data-theme="light"] .modal-body .modal-label,
body:not([data-theme="dark"]) .modal-body .modal-label {
    color: #495057 !important;
}


#feedbackModal #feedback-form input.form-control,
#feedbackModal #feedback-form textarea.form-control,
#feedbackModal #feedback-form .form-control {
    box-sizing: border-box !important;
}

html[data-theme="dark"] #feedbackModal #feedback-form input.form-control,
html[data-theme="dark"] #feedbackModal #feedback-form textarea.form-control,
html[data-theme="dark"] #feedbackModal #feedback-form .form-control,
body[data-theme="dark"] #feedbackModal #feedback-form input.form-control,
body[data-theme="dark"] #feedbackModal #feedback-form textarea.form-control,
body[data-theme="dark"] #feedbackModal #feedback-form .form-control {
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

html[data-theme="light"] #feedbackModal #feedback-form input.form-control,
html[data-theme="light"] #feedbackModal #feedback-form textarea.form-control,
html[data-theme="light"] #feedbackModal #feedback-form .form-control,
html:not([data-theme="dark"]) #feedbackModal #feedback-form input.form-control,
html:not([data-theme="dark"]) #feedbackModal #feedback-form textarea.form-control,
html:not([data-theme="dark"]) #feedbackModal #feedback-form .form-control,
body[data-theme="light"] #feedbackModal #feedback-form input.form-control,
body[data-theme="light"] #feedbackModal #feedback-form textarea.form-control,
body[data-theme="light"] #feedbackModal #feedback-form .form-control,
body:not([data-theme="dark"]) #feedbackModal #feedback-form input.form-control,
body:not([data-theme="dark"]) #feedbackModal #feedback-form textarea.form-control,
body:not([data-theme="dark"]) #feedbackModal #feedback-form .form-control {
    border: 1px solid #e9ecef !important;
}

html[data-theme="dark"] #feedbackModal #feedback-form input:hover:not(:disabled):not([readonly]),
html[data-theme="dark"] #feedbackModal #feedback-form textarea:hover:not(:disabled):not([readonly]),
html[data-theme="dark"] #feedbackModal #feedback-form .form-control:hover:not(:disabled):not([readonly]),
body[data-theme="dark"] #feedbackModal #feedback-form input:hover:not(:disabled):not([readonly]),
body[data-theme="dark"] #feedbackModal #feedback-form textarea:hover:not(:disabled):not([readonly]),
body[data-theme="dark"] #feedbackModal #feedback-form .form-control:hover:not(:disabled):not([readonly]) {
    background-color: #282828 !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
}

html[data-theme="light"] #feedbackModal #feedback-form input:hover:not(:disabled):not([readonly]),
html[data-theme="light"] #feedbackModal #feedback-form textarea:hover:not(:disabled):not([readonly]),
html[data-theme="light"] #feedbackModal #feedback-form .form-control:hover:not(:disabled):not([readonly]),
html:not([data-theme="dark"]) #feedbackModal #feedback-form input:hover:not(:disabled):not([readonly]),
html:not([data-theme="dark"]) #feedbackModal #feedback-form textarea:hover:not(:disabled):not([readonly]),
html:not([data-theme="dark"]) #feedbackModal #feedback-form .form-control:hover:not(:disabled):not([readonly]),
body[data-theme="light"] #feedbackModal #feedback-form input:hover:not(:disabled):not([readonly]),
body[data-theme="light"] #feedbackModal #feedback-form textarea:hover:not(:disabled):not([readonly]),
body[data-theme="light"] #feedbackModal #feedback-form .form-control:hover:not(:disabled):not([readonly]),
body:not([data-theme="dark"]) #feedbackModal #feedback-form input:hover:not(:disabled):not([readonly]),
body:not([data-theme="dark"]) #feedbackModal #feedback-form textarea:hover:not(:disabled):not([readonly]),
body:not([data-theme="dark"]) #feedbackModal #feedback-form .form-control:hover:not(:disabled):not([readonly]) {
    background-color: #f8f9fa !important;
    border: 1px solid rgba(0, 0, 0, 0.15) !important;
}

html[data-theme="dark"] #feedbackModal #feedback-form input:focus,
html[data-theme="dark"] #feedbackModal #feedback-form textarea:focus,
html[data-theme="dark"] #feedbackModal #feedback-form .form-control:focus,
body[data-theme="dark"] #feedbackModal #feedback-form input:focus,
body[data-theme="dark"] #feedbackModal #feedback-form textarea:focus,
body[data-theme="dark"] #feedbackModal #feedback-form .form-control:focus {
    background-color: #282828 !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.1) !important;
    outline: none !important;
}

html[data-theme="light"] #feedbackModal #feedback-form input:focus,
html[data-theme="light"] #feedbackModal #feedback-form textarea:focus,
html[data-theme="light"] #feedbackModal #feedback-form .form-control:focus,
html:not([data-theme="dark"]) #feedbackModal #feedback-form input:focus,
html:not([data-theme="dark"]) #feedbackModal #feedback-form textarea:focus,
html:not([data-theme="dark"]) #feedbackModal #feedback-form .form-control:focus,
body[data-theme="light"] #feedbackModal #feedback-form input:focus,
body[data-theme="light"] #feedbackModal #feedback-form textarea:focus,
body[data-theme="light"] #feedbackModal #feedback-form .form-control:focus,
body:not([data-theme="dark"]) #feedbackModal #feedback-form input:focus,
body:not([data-theme="dark"]) #feedbackModal #feedback-form textarea:focus,
body:not([data-theme="dark"]) #feedbackModal #feedback-form .form-control:focus {
    background-color: #f8f9fa !important;
    border: 1px solid #04b962 !important;
    box-shadow: 0 0 0 3px rgba(4, 185, 98, 0.15) !important;
    outline: none !important;
}


html[data-theme="light"] .modal-body .copy-btn,
html:not([data-theme="dark"]) .modal-body .copy-btn,
html[data-theme="light"] .modal-body .btn-outline-primary,
html:not([data-theme="dark"]) .modal-body .btn-outline-primary,
body[data-theme="light"] .modal-body .copy-btn,
body:not([data-theme="dark"]) .modal-body .copy-btn,
body[data-theme="light"] .modal-body .btn-outline-primary,
body:not([data-theme="dark"]) .modal-body .btn-outline-primary {
    border-color: rgba(0, 0, 0, 0.3) !important;
    color: rgba(0, 0, 0, 0.7) !important;
    background-color: transparent !important;
}
html[data-theme="light"] .modal-body .copy-btn:hover,
html:not([data-theme="dark"]) .modal-body .copy-btn:hover,
html[data-theme="light"] .modal-body .btn-outline-primary:hover,
html:not([data-theme="dark"]) .modal-body .btn-outline-primary:hover,
body[data-theme="light"] .modal-body .copy-btn:hover,
body:not([data-theme="dark"]) .modal-body .copy-btn:hover,
body[data-theme="light"] .modal-body .btn-outline-primary:hover,
body:not([data-theme="dark"]) .modal-body .btn-outline-primary:hover {
    border-color: rgba(0, 0, 0, 0.5) !important;
    background-color: rgba(0, 0, 0, 0.05) !important;
    color: rgba(0, 0, 0, 0.9) !important;
}
html[data-theme="light"] .modal-body .copy-btn .icon-svg,
html:not([data-theme="dark"]) .modal-body .copy-btn .icon-svg,
html[data-theme="light"] .modal-body .btn-outline-primary .icon-svg,
html:not([data-theme="dark"]) .modal-body .btn-outline-primary .icon-svg,
body[data-theme="light"] .modal-body .copy-btn .icon-svg,
body:not([data-theme="dark"]) .modal-body .copy-btn .icon-svg,
body[data-theme="light"] .modal-body .btn-outline-primary .icon-svg,
body:not([data-theme="dark"]) .modal-body .btn-outline-primary .icon-svg {
    color: rgba(0, 0, 0, 0.7) !important;
}
html[data-theme="light"] .modal-body .copy-btn:hover .icon-svg,
html:not([data-theme="dark"]) .modal-body .copy-btn:hover .icon-svg,
html[data-theme="light"] .modal-body .btn-outline-primary:hover .icon-svg,
html:not([data-theme="dark"]) .modal-body .btn-outline-primary:hover .icon-svg,
body[data-theme="light"] .modal-body .copy-btn:hover .icon-svg,
body:not([data-theme="dark"]) .modal-body .copy-btn:hover .icon-svg,
body[data-theme="light"] .modal-body .btn-outline-primary:hover .icon-svg,
body:not([data-theme="dark"]) .modal-body .btn-outline-primary:hover .icon-svg {
    color: rgba(0, 0, 0, 0.9) !important;
}

html[data-theme="dark"] .modal-body .copy-btn,
html[data-theme="dark"] .modal-body .btn-outline-primary,
html[data-theme="dark"] .card-body .copy-btn,
html[data-theme="dark"] .card-body .btn-outline-primary,
body[data-theme="dark"] .modal-body .copy-btn,
body[data-theme="dark"] .modal-body .btn-outline-primary,
body[data-theme="dark"] .card-body .copy-btn,
body[data-theme="dark"] .card-body .btn-outline-primary {
    border-color: rgba(255, 255, 255, 0.3) !important;
    color: rgba(255, 255, 255, 0.7) !important;
    background-color: transparent !important;
}
html[data-theme="dark"] .modal-body .copy-btn:hover,
html[data-theme="dark"] .modal-body .btn-outline-primary:hover,
html[data-theme="dark"] .card-body .copy-btn:hover,
html[data-theme="dark"] .card-body .btn-outline-primary:hover,
body[data-theme="dark"] .modal-body .copy-btn:hover,
body[data-theme="dark"] .modal-body .btn-outline-primary:hover,
body[data-theme="dark"] .card-body .copy-btn:hover,
body[data-theme="dark"] .card-body .btn-outline-primary:hover {
    border-color: rgba(255, 255, 255, 0.5) !important;
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: rgba(255, 255, 255, 0.9) !important;
}
html[data-theme="dark"] .modal-body .copy-btn .icon-svg,
html[data-theme="dark"] .modal-body .btn-outline-primary .icon-svg,
html[data-theme="dark"] .card-body .copy-btn .icon-svg,
html[data-theme="dark"] .card-body .btn-outline-primary .icon-svg,
body[data-theme="dark"] .modal-body .copy-btn .icon-svg,
body[data-theme="dark"] .modal-body .btn-outline-primary .icon-svg,
body[data-theme="dark"] .card-body .copy-btn .icon-svg,
body[data-theme="dark"] .card-body .btn-outline-primary .icon-svg {
    color: rgba(255, 255, 255, 0.7) !important;
}
html[data-theme="dark"] .modal-body .copy-btn:hover .icon-svg,
html[data-theme="dark"] .modal-body .btn-outline-primary:hover .icon-svg,
html[data-theme="dark"] .card-body .copy-btn:hover .icon-svg,
html[data-theme="dark"] .card-body .btn-outline-primary:hover .icon-svg,
body[data-theme="dark"] .modal-body .copy-btn:hover .icon-svg,
body[data-theme="dark"] .modal-body .btn-outline-primary:hover .icon-svg,
body[data-theme="dark"] .card-body .copy-btn:hover .icon-svg,
body[data-theme="dark"] .card-body .btn-outline-primary:hover .icon-svg {
    color: rgba(255, 255, 255, 0.9) !important;
}


html[data-theme="light"] .card-body .copy-btn,
html:not([data-theme="dark"]) .card-body .copy-btn,
html[data-theme="light"] .card-body .btn-outline-primary,
html:not([data-theme="dark"]) .card-body .btn-outline-primary,
body[data-theme="light"] .card-body .copy-btn,
body:not([data-theme="dark"]) .card-body .copy-btn,
body[data-theme="light"] .card-body .btn-outline-primary,
body:not([data-theme="dark"]) .card-body .btn-outline-primary {
    border-color: rgba(0, 0, 0, 0.3) !important;
    color: rgba(0, 0, 0, 0.7) !important;
    background-color: transparent !important;
}
html[data-theme="light"] .card-body .copy-btn:hover,
html:not([data-theme="dark"]) .card-body .copy-btn:hover,
html[data-theme="light"] .card-body .btn-outline-primary:hover,
html:not([data-theme="dark"]) .card-body .btn-outline-primary:hover,
body[data-theme="light"] .card-body .copy-btn:hover,
body:not([data-theme="dark"]) .card-body .copy-btn:hover,
body[data-theme="light"] .card-body .btn-outline-primary:hover,
body:not([data-theme="dark"]) .card-body .btn-outline-primary:hover {
    border-color: rgba(0, 0, 0, 0.5) !important;
    background-color: rgba(0, 0, 0, 0.05) !important;
    color: rgba(0, 0, 0, 0.9) !important;
}
html[data-theme="light"] .card-body .copy-btn .icon-svg,
html:not([data-theme="dark"]) .card-body .copy-btn .icon-svg,
html[data-theme="light"] .card-body .btn-outline-primary .icon-svg,
html:not([data-theme="dark"]) .card-body .btn-outline-primary .icon-svg,
body[data-theme="light"] .card-body .copy-btn .icon-svg,
body:not([data-theme="dark"]) .card-body .copy-btn .icon-svg,
body[data-theme="light"] .card-body .btn-outline-primary .icon-svg,
body:not([data-theme="dark"]) .card-body .btn-outline-primary .icon-svg {
    color: rgba(0, 0, 0, 0.7) !important;
}
html[data-theme="light"] .card-body .copy-btn:hover .icon-svg,
html:not([data-theme="dark"]) .card-body .copy-btn:hover .icon-svg,
html[data-theme="light"] .card-body .btn-outline-primary:hover .icon-svg,
html:not([data-theme="dark"]) .card-body .btn-outline-primary:hover .icon-svg,
body[data-theme="light"] .card-body .copy-btn:hover .icon-svg,
body:not([data-theme="dark"]) .card-body .copy-btn:hover .icon-svg,
body[data-theme="light"] .card-body .btn-outline-primary:hover .icon-svg,
body:not([data-theme="dark"]) .card-body .btn-outline-primary:hover .icon-svg {
    color: rgba(0, 0, 0, 0.9) !important;
}
html[data-theme="dark"] #ssl-status-card,
body[data-theme="dark"] #ssl-status-card {
    background-color: #282828;
}


.bin-table-wrapper.table-responsive {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    touch-action: pan-x pan-y;
    border-radius: 15px;
    margin-bottom: 0;
}

.bin-table-scroll-hint {
    font-size: 0.8125rem;
    text-align: center;
    color: rgba(0, 0, 0, 0.55);
}

html[data-theme="dark"] .bin-table-scroll-hint,
body[data-theme="dark"] .bin-table-scroll-hint {
    color: rgba(255, 255, 255, 0.55);
}

.bin-table-wrapper.table-responsive::-webkit-scrollbar {
    height: 6px;
}

.bin-table-wrapper.table-responsive::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.25);
    border-radius: 3px;
}

html[data-theme="dark"] .bin-table-wrapper.table-responsive::-webkit-scrollbar-thumb,
body[data-theme="dark"] .bin-table-wrapper.table-responsive::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.3);
}

.bin-reference-table {
    font-size: 0.9rem;
    width: max-content !important;
    min-width: 48rem;
    margin-bottom: 0;
    border-collapse: separate !important;
    border-spacing: 0;
}

.bin-reference-table thead th,
.bin-reference-table tbody td {
    white-space: nowrap;
}


.bin-reference-table thead th:nth-child(1),
.bin-reference-table tbody td:nth-child(1) {
    max-width: 180px;
    white-space: normal;
    word-break: break-word;
}

.bin-reference-table thead th:nth-child(2),
.bin-reference-table tbody td:nth-child(2) {
    max-width: 200px;
    white-space: normal;
    word-break: break-word;
}


.bin-reference-table thead th:nth-child(6),
.bin-reference-table tbody td:nth-child(6) {
    max-width: 150px;
    white-space: normal;
    word-break: break-word;
}

.bin-reference-table .bin-table-header,
.bin-reference-table thead.bin-table-header {
    background-color: #f8f9fa;
}

.bin-reference-table thead th:first-child {
    border-top-left-radius: 15px !important;
}

.bin-reference-table thead th:last-child {
    border-top-right-radius: 15px !important;
}

.bin-reference-table tbody tr:last-child td:first-child {
    border-bottom-left-radius: 15px !important;
}

.bin-reference-table tbody tr:last-child td:last-child {
    border-bottom-right-radius: 15px !important;
}

.bin-reference-table thead th {
    font-weight: 700;
    padding: 0.75rem;
}

.bin-reference-table .bin-active-yes,
.bin-reference-table td[style*="color: #04b962"] {
    color: #04b962;
    font-weight: bold;
}

.bin-reference-table .bin-active-no,
.bin-reference-table td[style*="color: red"] {
    color: red;
    font-weight: bold;
}

@media (max-width: 767.98px) {
    .bin-table-wrapper.table-responsive {
        max-width: 100%;
    }

    .bin-reference-table {
        font-size: 0.8125rem;
    }

    .bin-reference-table thead th,
    .bin-reference-table tbody td {
        padding: 0.5rem 0.625rem;
    }
}

html[data-theme="dark"] .bin-reference-table,
body[data-theme="dark"] .bin-reference-table {
    background-color: #2d2d2d;
    border-color: rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.85);
}

html[data-theme="dark"] .bin-reference-table .bin-table-header,
html[data-theme="dark"] .bin-reference-table thead,
body[data-theme="dark"] .bin-reference-table .bin-table-header,
body[data-theme="dark"] .bin-reference-table thead {
    background-color: #3a3a3a !important;
    border-color: rgba(255, 255, 255, 0.15);
}

html[data-theme="dark"] .bin-reference-table .bin-table-header th,
html[data-theme="dark"] .bin-reference-table thead th,
body[data-theme="dark"] .bin-reference-table .bin-table-header th,
body[data-theme="dark"] .bin-reference-table thead th {
    background-color: #3a3a3a !important;
    color: rgba(255, 255, 255, 0.9) !important;
    border-color: rgba(255, 255, 255, 0.15);
}

html[data-theme="dark"] .bin-reference-table .bin-table-header th b,
html[data-theme="dark"] .bin-reference-table thead th b,
body[data-theme="dark"] .bin-reference-table .bin-table-header th b,
body[data-theme="dark"] .bin-reference-table thead th b {
    color: rgba(255, 255, 255, 0.9) !important;
}

html[data-theme="dark"] .bin-reference-table tbody,
body[data-theme="dark"] .bin-reference-table tbody {
    background-color: #2d2d2d;
}

html[data-theme="dark"] .bin-reference-table tbody tr,
body[data-theme="dark"] .bin-reference-table tbody tr {
    background-color: #2d2d2d;
    border-color: rgba(255, 255, 255, 0.15);
}

html[data-theme="dark"] .bin-reference-table tbody tr:hover,
body[data-theme="dark"] .bin-reference-table tbody tr:hover {
    background-color: #353535;
}

html[data-theme="dark"] .bin-reference-table tbody td,
body[data-theme="dark"] .bin-reference-table tbody td {
    background-color: transparent;
    color: rgba(255, 255, 255, 0.85);
    border-color: rgba(255, 255, 255, 0.15);
}

html[data-theme="dark"] .bin-reference-table .bin-active-yes,
html[data-theme="dark"] .bin-reference-table tbody td[style*="color: #04b962"],
body[data-theme="dark"] .bin-reference-table .bin-active-yes,
body[data-theme="dark"] .bin-reference-table tbody td[style*="color: #04b962"] {
    color: #4ade80 !important;
}

html[data-theme="dark"] .bin-reference-table .bin-active-no,
html[data-theme="dark"] .bin-reference-table tbody td[style*="color: red"],
body[data-theme="dark"] .bin-reference-table .bin-active-no,
body[data-theme="dark"] .bin-reference-table tbody td[style*="color: red"] {
    color: #f87171 !important;
}