/* YomRide isolated checkbox UI v2.1
   IMPORTANT: This file intentionally targets only checkbox controls.
   It must not contain body typography, headings, buttons, cards or layout rules.
*/

body input[type="checkbox"],
body .form-check-input[type="checkbox"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    flex: 0 0 22px !important;
    margin: 0 !important;
    float: none !important;
    border: 1.5px solid #cbd9d4 !important;
    border-radius: 7px !important;
    background-color: #ffffff !important;
    background-image: none !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 13px 13px !important;
    box-shadow: none !important;
    cursor: pointer !important;
    vertical-align: middle !important;
    transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .14s ease !important;
}

body input[type="checkbox"]:hover:not(:disabled),
body .form-check-input[type="checkbox"]:hover:not(:disabled) {
    border-color: #85cbb4 !important;
    background-color: #f5fbf8 !important;
}

body input[type="checkbox"]:checked,
body .form-check-input[type="checkbox"]:checked {
    background-color: #10b981 !important;
    border-color: #10b981 !important;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20fill%3D%27none%27%20stroke%3D%27white%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%20stroke-width%3D%272.6%27%20d%3D%27M4.2%2010.3%208.1%2014.1%2015.8%206.4%27%2F%3E%3C%2Fsvg%3E") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 13px 13px !important;
    box-shadow: 0 5px 14px rgba(16,185,129,.20) !important;
}

body input[type="checkbox"]:focus,
body input[type="checkbox"]:focus-visible,
body .form-check-input[type="checkbox"]:focus,
body .form-check-input[type="checkbox"]:focus-visible {
    outline: none !important;
    border-color: #10b981 !important;
    box-shadow: 0 0 0 4px rgba(16,185,129,.14) !important;
}

body input[type="checkbox"]:active:not(:disabled),
body .form-check-input[type="checkbox"]:active:not(:disabled) {
    transform: scale(.94) !important;
}

body input[type="checkbox"]:disabled,
body .form-check-input[type="checkbox"]:disabled {
    cursor: not-allowed !important;
    opacity: .55 !important;
    background-color: #f0f3f2 !important;
    border-color: #d7dfdc !important;
}

/* Bootstrap alignment only — no global text-size changes */
body .form-check {
    display: flex !important;
    align-items: flex-start !important;
    gap: 9px !important;
    padding-left: 0 !important;
}

body .form-check-input[type="checkbox"] {
    margin-top: 0 !important;
    background-image: none;
}

/* Preserve the custom Remember Me component */
body .auth-remember input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 1px !important;
    height: 1px !important;
    min-width: 1px !important;
    min-height: 1px !important;
}

@media (max-width: 767px) {
    body input[type="checkbox"],
    body .form-check-input[type="checkbox"] {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        flex-basis: 24px !important;
        border-radius: 8px !important;
        background-size: 14px 14px !important;
    }
}