/* ========================================
   HEIGHT-BASED RESPONSIVE STYLING
   Adjust font sizes and control heights based on screen HEIGHT
   ======================================== */

/* VERY SMALL HEIGHT (< 600px) - Mobile Landscape, Low Res */
@media (max-height: 599px) {
    body {
        --form-font-size: 0.65rem;
        --form-control-height: 1.60rem;
        --button-height: 1.60rem;
        --card-padding: 0.3rem;
    }

    body .rz-button {
        height: 1.60rem !important;
        min-height: 1.5rem !important;
        font-size: 0.70rem !important;
        padding: 0.15rem 0.4rem !important;
    }

    body .rz-form-field input,
    body .rz-form-field textarea,
    body .rz-form-field .rz-inputtext,
    body .rz-form-field .rz-autocomplete,
    body .rz-form-field .rz-dropdown,
    body .rz-form-field .rz-datepicker,
    body .rz-form-field .rz-numeric {
        height: 1.75rem !important;
        font-size: 0.70rem !important;
    }

    body .rz-form-field-label {
        font-size: 0.65rem !important;
    }

    body .rz-grid-table thead th {
        font-size: 0.65rem !important;
        padding: 0.2rem 0.25rem !important;
    }

        body .rz-grid-table thead th .rz-cell-filter .rz-cell-filter-label {
            height: 30px !important;
        }
            body .rz-grid-table thead th .rz-cell-filter .rz-cell-filter-label .rz-textbox { height:25px !important;}

            body .rz-data-row td {
                font-size: 0.60rem !important;
                padding: 0.2rem 0.35rem !important;
            }

    .modern-enterprise-grid .rz-grid-table thead th {
        font-size: 0.60rem !important;
    }

    .modern-enterprise-grid .rz-data-row td {
        font-size: 0.60rem !important;
    }

    body .rz-card.rz-variant-flat {
        padding: 0.3rem !important;
    }

    body .rz-card.rz-variant-outlined {
        padding: 0.25rem !important;
    }
}

/* SMALL HEIGHT (600px - 720px) - iPad, Tablet Portrait */
@media (min-height: 600px) and (max-height: 720px) {
    body {
        --form-font-size: 0.63rem;
        --form-control-height: 1.55rem;
        --button-height: 1.55rem;
        --card-padding: 0.32rem;
    }

    body .rz-button {
        height: 1.55rem !important;
        min-height: 1.55rem !important;
        font-size: 0.63rem !important;
    }

    body .rz-form-field input,
    body .rz-form-field .rz-inputtext {
        height: 1.55rem !important;
        font-size: 0.63rem !important;
    }

    body .rz-form-field-label {
        font-size: 0.63rem !important;
    }

    body .rz-grid-table thead th {
        font-size: 0.63rem !important;
    }

    body .rz-data-row td {
        font-size: 0.63rem !important;
    }

    body .rz-card.rz-variant-flat {
        padding: 0.32rem !important;
    }
}

/* MEDIUM HEIGHT (720px - 900px) - Most Laptops, Tablets Landscape */
@media (min-height: 720px) and (max-height: 900px) {
    body {
        --form-font-size: 0.68rem;
        --form-control-height: 1.65rem;
        --button-height: 1.65rem;
        --card-padding: 0.4rem;
    }

    body .rz-button {
        height: 1.65rem !important;
        min-height: 1.65rem !important;
        font-size: 0.68rem !important;
    }

    body .rz-form-field input,
    body .rz-form-field .rz-inputtext {
        height: 1.65rem !important;
        font-size: 0.68rem !important;
    }

    body .rz-form-field-label {
        font-size: 0.68rem !important;
    }

    body .rz-grid-table thead th {
        font-size: 0.68rem !important;
    }

    body .rz-data-row td {
        font-size: 0.68rem !important;
    }

    body .rz-card.rz-variant-flat {
        padding: 0.4rem !important;
    }
}

/* STANDARD HEIGHT (900px - 1080px) - Full HD, Common Desktop */
@media (min-height: 900px) and (max-height: 1080px) {
    body {
        --form-font-size: 0.72rem;
        --form-control-height: 1.75rem;
        --button-height: 1.75rem;
        --card-padding: 0.5rem;
    }

    body .rz-button {
        height: 1.75rem !important;
        min-height: 1.75rem !important;
        font-size: 0.72rem !important;
    }

    body .rz-form-field input,
    body .rz-form-field .rz-inputtext {
        height: 1.75rem !important;
        font-size: 0.72rem !important;
    }

    body .rz-form-field-label {
        font-size: 0.72rem !important;
    }

    body .rz-grid-table thead th {
        font-size: 0.72rem !important;
    }

    body .rz-data-row td {
        font-size: 0.72rem !important;
    }

    body .rz-card.rz-variant-flat {
        padding: 0.5rem !important;
    }
}

/* LARGE HEIGHT (1080px - 1440px) - Larger Monitors, 2K */
@media (min-height: 1080px) and (max-height: 1440px) {
    body {
        --form-font-size: 0.76rem;
        --form-control-height: 1.85rem;
        --button-height: 1.85rem;
        --card-padding: 0.6rem;
    }

    body .rz-button {
        height: 1.85rem !important;
        min-height: 1.85rem !important;
        font-size: 0.76rem !important;
        padding: 0.3rem 0.8rem !important;
    }

    body .rz-form-field input,
    body .rz-form-field .rz-inputtext {
        height: 1.85rem !important;
        font-size: 0.76rem !important;
    }

    body .rz-form-field-label {
        font-size: 0.76rem !important;
    }

    body .rz-grid-table thead th {
        font-size: 0.76rem !important;
        padding: 0.4rem 0.4rem !important;
    }

    body .rz-data-row td {
        font-size: 0.76rem !important;
        padding: 0.4rem 0.5rem !important;
    }

    body .rz-card.rz-variant-flat {
        padding: 0.6rem !important;
    }
}

/* EXTRA LARGE HEIGHT (> 1440px) - 4K, Premium Displays */
@media (min-height: 1440px) {
    body {
        --form-font-size: 0.82rem;
        --form-control-height: 2rem;
        --button-height: 2rem;
        --card-padding: 0.75rem;
    }

    body .rz-button {
        height: 2rem !important;
        min-height: 2rem !important;
        font-size: 0.82rem !important;
        padding: 0.35rem 0.9rem !important;
    }

    body .rz-form-field input,
    body .rz-form-field .rz-inputtext {
        height: 2rem !important;
        font-size: 0.82rem !important;
    }

    body .rz-form-field-label {
        font-size: 0.82rem !important;
    }

    body .rz-grid-table thead th {
        font-size: 0.82rem !important;
        padding: 0.5rem 0.5rem !important;
    }

    body .rz-data-row td {
        font-size: 0.82rem !important;
        padding: 0.5rem 0.6rem !important;
    }

    body .rz-card.rz-variant-flat {
        padding: 0.75rem !important;
    }
}

/* ========================================
   COMBINED WIDTH + HEIGHT OPTIMIZATION
   Fine-tune for specific device combinations
   ======================================== */

/* Small Laptop (1366x768) - MOST COMMON */
@media (min-width: 1200px) and (min-height: 700px) and (max-height: 800px) {
    body {
        --form-font-size: 0.68rem;
        --form-control-height: 1.65rem;
        --button-height: 1.65rem;
    }

    body .rz-button {
        height: 1.65rem !important;
        font-size: 0.68rem !important;
        padding: 0.2rem 0.5rem !important;
    }

    body .rz-form-field input,
    body .rz-form-field .rz-inputtext,
    body .rz-form-field .rz-autocomplete,
    body .rz-form-field .rz-dropdown {
        height: 1.65rem !important;
        font-size: 0.68rem !important;
    }
}

/* Standard Desktop (1920x1080) - SECOND MOST COMMON */
@media (min-width: 1800px) and (min-height: 1000px) and (max-height: 1100px) {
    body {
        --form-font-size: 0.75rem;
        --form-control-height: 1.8rem;
        --button-height: 1.8rem;
    }

    body .rz-button {
        height: 1.8rem !important;
        font-size: 0.75rem !important;
        padding: 0.25rem 0.7rem !important;
    }

    body .rz-form-field input,
    body .rz-form-field .rz-inputtext {
        height: 1.8rem !important;
        font-size: 0.75rem !important;
    }
}

/* iPad (1024x768) - Tablet Landscape */
@media (min-width: 1000px) and (min-height: 700px) and (max-height: 800px) {
    body {
        --form-font-size: 0.66rem;
        --form-control-height: 1.6rem;
        --button-height: 1.6rem;
    }

    body .rz-button {
        height: 1.6rem !important;
        font-size: 0.66rem !important;
    }

    body .rz-form-field input,
    body .rz-form-field .rz-inputtext {
        height: 1.6rem !important;
        font-size: 0.66rem !important;
    }
}

/* Mobile Phone (Landscape) - 667x375 typical */
@media (max-width: 600px) and (max-height: 500px) {
    body {
        --form-font-size: 0.58rem;
        --form-control-height: 1.45rem;
        --button-height: 1.45rem;
    }

    body .rz-button {
        height: 1.45rem !important;
        min-height: 1.45rem !important;
        font-size: 0.58rem !important;
        padding: 0.1rem 0.35rem !important;
    }

    body .rz-form-field input,
    body .rz-form-field .rz-inputtext {
        height: 1.45rem !important;
        font-size: 0.58rem !important;
    }

    body .rz-grid-table thead th {
        font-size: 0.58rem !important;
    }

    body .rz-data-row td {
        font-size: 0.58rem !important;
    }
}

/* ========================================
   DYNAMIC LINE HEIGHT & PADDING ADJUSTMENT
   Ensure text remains readable at all heights
   ======================================== */

@media (max-height: 720px) {
    body .rz-form-field input,
    body .rz-form-field textarea,
    body .rz-form-field .rz-inputtext {
        padding: 0.15rem 0.35rem !important;
        line-height: 1.1 !important;
    }

    body .rz-grid-table thead th {
        line-height: 1.2 !important;
    }

    body .rz-data-row td {
        line-height: 1.2 !important;
    }
}

@media (min-height: 720px) and (max-height: 900px) {
    body .rz-form-field input,
    body .rz-form-field textarea,
    body .rz-form-field .rz-inputtext {
        padding: 0.18rem 0.4rem !important;
        line-height: 1.2 !important;
    }
}

@media (min-height: 900px) and (max-height: 1080px) {
    body .rz-form-field input,
    body .rz-form-field textarea,
    body .rz-form-field .rz-inputtext {
        padding: 0.2rem 0.45rem !important;
        line-height: 1.3 !important;
    }
}

@media (min-height: 1080px) {
    body .rz-form-field input,
    body .rz-form-field textarea,
    body .rz-form-field .rz-inputtext {
        padding: 0.25rem 0.5rem !important;
        line-height: 1.4 !important;
    }
}

/* ========================================
   GRID AND TABLE HEIGHT OPTIMIZATION
   Ensure grids are scrollable and visible
   ======================================== */

@media (max-height: 600px) {
    .modern-grid-container,
    .modern-enterprise-grid {
        max-height: 200px;
        overflow-y: auto;
    }
}

@media (min-height: 600px) and (max-height: 800px) {
    .modern-grid-container,
    .modern-enterprise-grid {
        max-height: 250px;
        overflow-y: auto;
    }
}

@media (min-height: 800px) and (max-height: 1000px) {
    .modern-grid-container,
    .modern-enterprise-grid {
        max-height: 300px;
        overflow-y: auto;
    }
}

@media (min-height: 1000px) {
    .modern-grid-container,
    .modern-enterprise-grid {
        max-height: 400px;
        overflow-y: auto;
    }
}

/* ========================================
   ACTION BUTTON HEIGHT ADJUSTMENT
   Header buttons scale with screen height
   ======================================== */

@media (max-height: 720px) {
    .action-btn-modern {
        height: 1.5rem !important;
        min-height: 1.5rem !important;
        padding: 0 0.5rem !important;
    }

    .action-btn-icon {
        font-size: 0.85rem !important;
    }

    .action-btn-label {
        font-size: 0.58rem !important;
    }
}

@media (min-height: 720px) and (max-height: 900px) {
    .action-btn-modern {
        height: 1.65rem !important;
        padding: 0 0.6rem !important;
    }

    .action-btn-icon {
        font-size: 0.9rem !important;
    }

    .action-btn-label {
        font-size: 0.63rem !important;
    }
}

@media (min-height: 900px) and (max-height: 1080px) {
    .action-btn-modern {
        height: 1.75rem !important;
        padding: 0 0.7rem !important;
    }

    .action-btn-icon {
        font-size: 0.95rem !important;
    }

    .action-btn-label {
        font-size: 0.68rem !important;
    }
}

@media (min-height: 1080px) {
    .action-btn-modern {
        height: 1.9rem !important;
        padding: 0 0.8rem !important;
    }

    .action-btn-icon {
        font-size: 1.05rem !important;
    }

    .action-btn-label {
        font-size: 0.75rem !important;
    }
}

/* ========================================
   FORM LABEL ADJUSTMENT FOR READABILITY
   Keep labels readable at all heights
   ======================================== */

@media (max-height: 600px) {
    body .rz-form-field-label {
        margin-bottom: 0.05rem !important;
        line-height: 1.1 !important;
    }
}

@media (min-height: 600px) and (max-height: 900px) {
    body .rz-form-field-label {
        margin-bottom: 0.08rem !important;
        line-height: 1.2 !important;
    }
}

@media (min-height: 900px) {
    body .rz-form-field-label {
        margin-bottom: 0.12rem !important;
        line-height: 1.3 !important;
    }
}

/* ========================================
   TYPOGRAPHY CONSISTENCY LOCK
   Keep same font family/size in all height breakpoints
   ======================================== */

body .rz-button,
body .rz-button .rz-button-text,
body .rz-form-field-label,
body .rz-form-field input,
body .rz-form-field textarea,
body .rz-form-field .rz-inputtext,
body .rz-form-field .rz-dropdown,
body .rz-form-field .rz-dropdown-label,
body .rz-form-field .rz-autocomplete,
body .rz-form-field .rz-numeric,
body .rz-form-field .rz-datepicker,
body .rz-grid-table thead th,
body .rz-data-row td,
body .rz-tabview-nav li button,
body .rz-dropdown-item,
body .rz-autocomplete-item,
body .rz-pager,
body .rz-navigation-item-link {
    font-family: var(--font-family) !important;
    font-size: var(--form-font-size) !important;
    line-height: var(--line-height) !important;
}
