/* OHelp mobile viewport stability */
html {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    overflow-x: clip;
    -webkit-text-size-adjust: 100%;
}

*, *::before, *::after {
    box-sizing: border-box;
}

@media (max-width: 767px) {
    #root, #app, #__next,
    .app-shell, .dashboard,
    .dashboard-container,
    .dashboard-content,
    main {
        max-width: 100%;
        min-width: 0;
    }

    img, svg, video, canvas {
        max-width: 100%;
    }

    input, textarea, select {
        max-width: 100%;
        min-width: 0;
        font-size: 16px;
    }

    .dashboard-grid,
    .quick-actions-grid,
    .services-grid {
        min-width: 0;
        max-width: 100%;
    }

    .dashboard-grid > *,
    .quick-actions-grid > *,
    .services-grid > * {
        min-width: 0;
        max-width: 100%;
    }

    .dashboard h1,
    .dashboard h2,
    .dashboard h3,
    .dashboard p {
        overflow-wrap: anywhere;
    }

    .dashboard .search-bar,
    .dashboard .search-container {
        max-width: 100%;
        min-width: 0;
    }
}