/**
 * Mobile-first enhancements: touch targets, overflow, blocks, tables, modals.
 * Подключено в common_user, common_admin, common_no.
 */

/* ——— Base: prevent horizontal scroll, safe area ——— */
@media (max-width: 767.98px) {
    #page-container {
        overflow-x: hidden;
        min-height: 100vh;
    }

    body.dashboard-ui .content,
    body.dashboard-ui .content.content-boxed,
    body.dashboard-ui .aifo-workspace-content {
        padding-left: 12px;
        padding-right: 12px;
        max-width: 100%;
    }

    .container,
    .container-fluid {
        padding-left: 12px;
        padding-right: 12px;
        max-width: 100%;
    }
}

@media (max-width: 575.98px) {
    body.dashboard-ui .content,
    body.dashboard-ui .aifo-workspace-content {
        padding-left: 10px;
        padding-right: 10px;
    }

    .container,
    .container-fluid {
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* ——— Block header: title + options stack on mobile ——— */
@media (max-width: 767.98px) {
    .block-header.block-header-default,
    .block-header {
        flex-wrap: wrap;
        gap: 10px;
        padding: 12px 14px;
    }

    .block-title {
        flex: 1 1 100%;
        font-size: 1.1rem;
        margin-bottom: 0;
    }

    .block-options {
        flex: 1 1 100%;
        margin-top: 4px;
    }

    .block-options .btn {
        min-height: 44px;
        padding: 10px 14px;
    }

    .block-content.px-4,
    .block-content.px-lg-5 {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }
}

/* ——— Tables: horizontal scroll, readable on small screens ——— */
@media (max-width: 767.98px) {
    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin-left: -12px;
        margin-right: -12px;
        padding-left: 12px;
        padding-right: 12px;
    }

    .table-responsive .table {
        min-width: 280px;
        font-size: 0.9rem;
    }

    .table-responsive .table th,
    .table-responsive .table td {
        padding: 10px 8px;
        white-space: nowrap;
    }

    .table-responsive .table th[style*="width:200px"] {
        min-width: 120px;
    }
}

/* ——— Modals: full width on mobile, safe margins ——— */
@media (max-width: 575.98px) {
    .modal-dialog {
        margin: 10px;
        max-width: calc(100vw - 20px);
    }

    .modal-content {
        border-radius: 16px;
        max-height: calc(100vh - 20px);
        overflow-y: auto;
    }

    .modal-body {
        padding: 16px;
    }

    .modal-footer {
        padding: 12px 16px;
        flex-wrap: wrap;
        gap: 8px;
    }

    .modal-footer .btn {
        min-height: 44px;
        flex: 1 1 100%;
    }
}

/* ——— Touch targets: buttons and clickable links ——— */
@media (max-width: 767.98px) {
    .btn:not(.btn-sm):not(.btn-lg) {
        min-height: 44px;
        padding: 10px 16px;
    }

    .btn-sm {
        min-height: 40px;
        padding: 8px 12px;
    }

    .aifo-nav-link {
        min-height: 44px;
        padding: 10px 8px 10px 10px;
    }

    .kassa-copy-btn,
    .btn[title],
    [role="button"]:not(.btn) {
        min-width: 44px;
        min-height: 44px;
    }
}

/* ——— Forms: full width inputs on mobile ——— */
@media (max-width: 767.98px) {
    .form-control,
    .form-select,
    .settings-input,
    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="number"],
    select,
    textarea {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .admin-settings-page .contact-row-fields {
        flex-direction: column;
        align-items: stretch;
    }

    .admin-settings-page .contact-row-fields .field-name,
    .admin-settings-page .contact-row-fields .field-value,
    .admin-settings-page .contact-row-fields .field-remove {
        min-width: 0;
    }

    .admin-settings-page .contact-row-fields .field-remove {
        align-self: flex-start;
    }
}

/* ——— Kassa info card: stack layout ——— */
@media (max-width: 767.98px) {
    .kassa-info-card {
        padding: 16px;
    }

    .kassa-info-content {
        flex-direction: column;
        gap: 16px;
    }

    .kassa-info-left {
        width: 100%;
    }

    .kassa-info-details {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .kassa-info-item {
        flex-wrap: wrap;
        gap: 6px;
    }

    .kassa-info-value,
    .kassa-info-link {
        word-break: break-all;
    }
}

/* ——— Breadcrumb: wrap or truncate ——— */
@media (max-width: 767.98px) {
    .breadcrumb {
        flex-wrap: wrap;
        font-size: 0.85rem;
    }

    .breadcrumb-item {
        max-width: 100%;
    }

    .breadcrumb-item + .breadcrumb-item::before {
        margin: 0 6px;
    }
}

/* ——— Cards and panels ——— */
@media (max-width: 767.98px) {
    .card-body,
    .dashboard-info-card,
    .settings-card {
        padding: 14px 16px;
    }

    .settings-card-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .settings-card-icon {
        width: 40px;
        height: 40px;
        min-width: 40px;
        font-size: 1.1rem;
    }
}

/* ——— Public / contact page: block spacing ——— */
@media (max-width: 767.98px) {
    body.dashboard-ui--public .block.block-rounded {
        border-radius: 16px;
    }

    body.dashboard-ui--public .block-content {
        padding: 16px;
    }
}