/* Aplica 100% em telas pequenas (mobile) */
@media (max-width: 767.98px) {
    .offcanvas {
        width: 100% !important;
    }
}

/* Aplica 80% em telas maiores (tablet e desktop) */
@media (min-width: 768px) {
    .offcanvas {
        width: 90% !important;
        max-width: 100%;
    }
}


input[readonly],
textarea[readonly],
select[readonly] {
    background: linear-gradient(180deg, #f5f5f5, #e0e0e0);
    color: #555;
    border-color: #ccc;
    cursor: not-allowed;
}