﻿/* ============================================
   FIX: Make Kendo Popup Responsive and Scrollable
   ============================================ */
/*@media only screen and (max-width: 768px) {
    .k-window {
        width: 95% !important;
        max-width: 95% !important;
        left: 2.5% !important;
        top: 5% !important;
        max-height: 90vh !important;*/ /* Viewport height */
/*overflow-y: auto !important;*/ /* Scroll inside popup */
/*overflow-x: hidden !important;
        border-radius: 8px !important;
    }*/

/* Ensure content doesn’t get clipped inside */
/*.k-window .k-window-content {
            overflow-y: auto !important;
            padding-bottom: 60px !important;*/ /* make room for buttons */
/*}*/

/* Buttons centered at the bottom */
/*.k-window .k-button {
            min-width: 100px;
            margin: 8px 6px;
        }*/

/* Fix layout spacing inside panels/forms */
/*.k-window .ABCpanel1 {
            padding: 10px !important;
            margin: 0 !important;
        }*/

/* Form responsiveness */
/*.k-window .col-lg-4,
        .k-window .col-sm-12,
        .k-window .col-xs-12 {
            width: 100% !important;
            display: block !important;
            margin-bottom: 8px !important;
        }*/

/* Labels should stack nicely */
/*.k-window label {
            display: block;
            margin-bottom: 4px;
        }
}*/


@media (max-width: 768px) {
    /* FIX — override project-wide box-sizing */
    .k-grid table tbody tr,
    .k-grid table tbody tr td,
    .k-grid table tbody tr td:before,
    .k-grid table tbody tr td .k-button {
        box-sizing: border-box !important;
    }
    /* Hide grid header */
    .k-grid .k-grid-header {
        display: none !important;
    }
    /* CARD CONTAINER */
    .k-grid table tbody tr {
        display: block !important;
        background: #ffffff !important;
        padding: 0px 20px !important;
        margin: 5px 9px !important;
        border-radius: 14px !important;
        border: 1px solid #d9e2ec !important;
        box-shadow: 0 3px 6px rgba(0,0,0,0.12) !important;
        width: 185% !important;
    }

    ..k-grid table {
        margin: -4px;
        border-spacing: 0px;
        empty-cells: hide;
    }
    /* EACH ROW INSIDE THE CARD */
    .k-grid table tbody tr td {
        display: block !important;
        padding: 12px 0 !important;
        border-bottom: 1px solid #cfd8dc !important;
        border-left: 0px solid #cfd8dc !important;
        color: #333;
        font-size: 16px !important;
    }
        /* Remove last separator */
        .k-grid table tbody tr td:last-child {
            border-bottom: none !important;
        }
        /* LABEL (Auto from .Title()) */
        .k-grid table tbody tr td:before {
            content: attr(data-title) ":";
            font-weight: 700 !important;
            color: #003e69 !important;
            display: block;
            margin-bottom: 6px;
            font-size: 16px !important;
        }
        /* VALUE TEXT */
        .k-grid table tbody tr td span,
        .k-grid table tbody tr td {
            font-size: 16px !important;
            line-height: 22px !important;
        }
            /* BUTTON STYLING */
            .k-grid table tbody tr td .k-button {
                width: 100% !important;
                margin-top: 14px !important;
                border-radius: 8px !important;
                padding: 10px !important;
                font-size: 16px !important;
                text-align: center !important;
            }
}
