/**
 * Responsive Switching CSS
 *
 * Controls which designer version is visible based on viewport width.
 * Breakpoint: 768px (tablets portrait = mobile, tablets landscape = desktop)
 */

/* Default: Desktop visible, Mobile hidden */
.lm-designer-desktop {
    display: block;
}

.lm-designer-mobile {
    display: none;
}

/* Mobile Breakpoint (< 768px): Switch to mobile designer */
@media (max-width: 767px) {
    .lm-designer-desktop {
        display: none !important;
    }

    .lm-designer-mobile {
        display: block !important;
    }
}

/* Print: Show desktop version only */
@media print {
    .lm-designer-desktop {
        display: block !important;
    }

    .lm-designer-mobile {
        display: none !important;
    }
}