/* ============================================================================
   PACIOLI ERP — Utilities
   Responsive visibility, helper classes.
   Depends on: pacioli.tokens.css
   ============================================================================ */

/* ── Responsive visibility ── */

/* Hide on desktop */
@media only screen and (min-width: 1024px) {
    .d-desktop-none { display: none !important; }
}

/* Hide on tablet */
@media only screen and (min-width: 768px) and (max-width: 1023px) {
    .d-tablet-none { display: none !important; }
}

/* Hide on mobile */
@media only screen and (max-width: 767px) {
    .d-mobile-none { display: none !important; }
}

/* Show only on mobile */
.d-mobile-only { display: none !important; }
@media only screen and (max-width: 767px) {
    .d-mobile-only { display: block !important; }
}

/* Table column visibility */
@media (max-width: 1023px) {
    .table .d-none-tablet { display: none !important; }
}

@media (max-width: 767px) {
    .table .d-none-mobile { display: none !important; }
}

/* ── Table card layout for mobile ── */
.table-mobile-cards { display: table; }

@media (max-width: 767px) {
    .table-mobile-cards {
        display: block;
    }

    .table-mobile-cards thead {
        display: none;
    }

    .table-mobile-cards tbody,
    .table-mobile-cards tr,
    .table-mobile-cards td {
        display: block;
        width: 100%;
    }

    .table-mobile-cards tr {
        margin-bottom: 1rem;
        border: 1px solid #dee2e6;
        border-radius: var(--pacioli-radius-sm);
        padding: 0.75rem;
        background: #fff;
    }

    .table-mobile-cards td {
        text-align: left !important;
        padding: 0.25rem 0;
        border: none;
    }

    .table-mobile-cards td::before {
        content: attr(data-label);
        font-weight: 600;
        display: inline-block;
        margin-right: 0.5rem;
    }
}

/* ── Select2 responsive ── */
@media (max-width: 1023px) {
    .select2-container { width: 100% !important; }
}

@media (max-width: 767px) {
    .select2-container--bootstrap-5 .select2-dropdown {
        width: 100% !important;
    }

    .select2-container--bootstrap-5 .select2-selection {
        min-height: 44px;
    }
}

/* ── DataTables responsive ── */
@media (max-width: 1023px) {
    .dataTables_wrapper .dataTables_length,
    .dataTables_wrapper .dataTables_filter {
        float: none;
        text-align: left;
    }

    .dataTables_wrapper .dataTables_length label,
    .dataTables_wrapper .dataTables_filter label {
        width: 100%;
    }

    .dataTables_wrapper .dataTables_length select,
    .dataTables_wrapper .dataTables_filter input {
        width: 100%;
    }

    .dataTables_wrapper .dataTables_info,
    .dataTables_wrapper .dataTables_paginate {
        float: none;
        text-align: center;
    }

    .table-responsive {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* ── Offcanvas responsive ── */
@media (max-width: 767px) {
    .offcanvas {
        max-width: 90%;
    }
}

/* ── Modal responsive ── */
@media (max-width: 1023px) {
    .modal-lg {
        max-width: 90%;
    }

    .offcanvas-body {
        padding: 1rem;
    }
}

/* ── Grid adjustments ── */
@media (max-width: 1023px) {
    .row > [class*="col-lg-3"],
    .row > [class*="col-lg-4"] {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .btn-icon .btn-text {
        display: none;
    }
}