/* Viewport dinámico para móvil (usado por app_layout_simple) */
.container { height: calc(var(--vh, 1vh) * 100); }

.qr-container svg {
    max-width: 400px;
    height: auto;
    width: 100%;
}

.alert { transition: all 0.3s ease; }
.card  { transition: none; }

.qr-container { transition: all 0.3s ease; }

@keyframes pulse {
    0%   { box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
    50%  { box-shadow: 0 10px 30px rgba(102,126,234,0.3); }
    100% { box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
}

@media (max-width: 992px) {
    .qr-container svg { max-width: 350px; }
}

@media (max-width: 768px) {
    .qr-container svg { max-width: 300px; }
    .card-body { padding: 2rem !important; }
    .row.align-items-center { flex-direction: column; }
    .col-lg-6:first-child { order: 2; margin-top: 1rem; }
    .col-lg-6:last-child  { order: 1; }
}

@media (max-width: 576px) {
    .qr-container svg { max-width: 250px; }
    .card-body { padding: 1.5rem !important; }
}