/* NewKSS common responsive utilities
   Purpose: shared mobile/tablet safety layer for newly added admin/security pages.
   Keep this file display-only; do not put business logic here. */

.newkss-page {
    width: 100%;
    min-width: 0;
}

.newkss-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1rem;
}

.newkss-table-scroll {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
}

.newkss-table-scroll table {
    min-width: 720px;
}

.newkss-table-scroll-sm table {
    min-width: 560px;
}

.newkss-break-text,
.newkss-table-scroll td,
.newkss-table-scroll th {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.newkss-nowrap {
    white-space: nowrap;
}

.newkss-mobile-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.newkss-mobile-actions .btn,
.newkss-mobile-actions button {
    min-height: 34px;
}

.newkss-status-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.newkss-sticky-table-head thead th,
.newkss-sticky-table-head thead td {
    position: sticky;
    top: 0;
    z-index: 2;
}

@media (max-width: 768px) {
    .newkss-page {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .newkss-page-title {
        font-size: 1.05rem !important;
        line-height: 1.35;
    }

    .newkss-card-grid {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .newkss-status-badges .badge {
        font-size: 0.72rem !important;
        max-width: 100%;
        white-space: normal;
        text-align: left;
    }

    .newkss-mobile-actions {
        width: 100%;
    }

    .newkss-mobile-actions .btn,
    .newkss-mobile-actions button,
    .newkss-mobile-actions select,
    .newkss-mobile-actions input {
        width: 100%;
    }

    .newkss-table-scroll {
        border: 1px solid #e9ecef;
        border-radius: 0.5rem;
    }

    .newkss-table-scroll table {
        min-width: 680px;
        font-size: 0.82rem;
    }

    .newkss-table-scroll-sm table {
        min-width: 520px;
    }

    .newkss-mobile-compact {
        font-size: 0.85rem !important;
    }

    .newkss-card-body-compact {
        padding: 0.85rem !important;
    }
}


/* Prevent nested scroll boxes from clipping the bottom of admin/security/QR tables.
   Let the page/tab own vertical scrolling; keep only horizontal table scrolling. */
.newkss-table-scroll {
    max-width: 100%;
}
.newkss-table-scroll:not(.newkss-inner-scroll) {
    overflow-y: visible !important;
    max-height: none !important;
}


/* Bounded vertical scroll is allowed only when a table wrapper opts in. */
.newkss-table-scroll.newkss-inner-scroll {
    overflow-y: auto !important;
}