/* ---- SafeTag Dev styles ---- */
body {
    background: #0f172a;
    color: #e2e8f0;
}

.card {
    background: #0b1222;
    border-color: #1e293b;
}

.form-label {
    font-weight: 700;
    color: #f8fafc;
}

.text-muted {
    color: #e5e7eb !important;
}

.help-hint {
    font-size: .9rem;
    color: #cbd5e1;
}

.brand {
    font-weight: 800;
    letter-spacing: .3px;
}

a, a:visited {
    color: #93c5fd;
}

.is-hidden {
    display: none !important;
}

.required::after {
    content: " *";
    color: #fca5a5;
}

.footer {
    font-size: .875rem;
    color: #94a3b8;
}

/* QR image */
.qr-img {
    max-width: 240px;
    background: #fff;
}

/* Optional: buttons/forms contrast tweaks */
.btn-primary {
    color: #fff;
}

/* Make form controls pop a bit more on dark bg */
.form-control, .form-check-input {
    background-color: #0b1222;
    color: #e2e8f0;
    border-color: #334155;
}

    .form-control::placeholder {
        color: #94a3b8;
    }

    .form-control:focus {
        background-color: #0b1222;
        color: #e2e8f0;
        border-color: #60a5fa;
        box-shadow: 0 0 0 .2rem rgba(96,165,250,.25);
    }

/* Checkbox + label contrast & states */
.form-check-label {
    color: #f8fafc; /* high contrast on dark bg */
    font-weight: 600;
    line-height: 1.35;
}

.form-check-input {
    background-color: #0b1222;
    border-color: #475569; /* slightly brighter border */
    transform: scale(1.1); /* make the box a bit larger */
}

    .form-check-input:checked {
        background-color: #60a5fa; /* same blue as focus ring */
        border-color: #60a5fa;
    }

    .form-check-input:focus {
        border-color: #60a5fa;
        box-shadow: 0 0 0 .2rem rgba(96,165,250,.35);
    }

    /* Validation feedback for required (unchecked) */
    .was-validated .form-check-input:invalid ~ .form-check-label,
    .form-check-input.is-invalid ~ .form-check-label {
        color: #fecaca; /* soft red to signal required */
    }