/* FORCE vpisnica mobile overflow guard for custom selects */
@media (max-width: 640px) {
    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
        overflow-x: clip;
    }
    .force-vpis-section,
    .force-vpis-panels,
    .force-vpis-panel,
    .force-vpis-form,
    .force-vpis-block,
    .force-vpis-field,
    .force-vpis-options,
    .force-option-grid,
    .force-select,
    .force-select-button,
    .force-select-list {
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }
    .force-vpis-section {
        overflow-x: clip;
    }
    .force-vpis-form {
        width: 100% !important;
        overflow-x: clip;
    }
    .force-vpis-grid.two {
        grid-template-columns: 1fr !important;
    }
    .force-option-grid {
        width: 100% !important;
    }
    .force-option-pill {
        max-width: 100% !important;
    }
    .force-option-pill span {
        max-width: 100% !important;
        white-space: normal;
        overflow-wrap: anywhere;
    }
    .force-vpis-field .force-select {
        width: 100% !important;
        overflow: visible;
    }
    .force-vpis-field .force-select-button {
        width: 100% !important;
        gap: 10px;
        padding: 13px 12px 13px 14px;
        overflow: hidden;
    }
    .force-vpis-field .force-select-button span {
        min-width: 0 !important;
        white-space: normal;
        overflow: hidden;
        text-overflow: clip;
        overflow-wrap: anywhere;
        word-break: normal;
    }
    .force-vpis-field .force-select-button i {
        flex: 0 0 28px;
        width: 28px;
    }
    .force-vpis-field .force-select-list {
        left: 0 !important;
        right: 0 !important;
        width: auto !important;
        overflow-x: hidden !important;
    }
    .force-vpis-field .force-select-option {
        max-width: 100%;
        white-space: normal;
        overflow-wrap: anywhere;
    }
}