/* This is an edge case, you should not use Ids to overwrite styles but 
   RadzenDropDownDataGrid has a bug where it was impossible to use 
   virtual loading, loaddata overwrite and indicate loading at the same time.
   so i decided just to hide the pagination part*/
#popup-FixedSizeDropDownDataGridWithoutCallback .rz-data-grid > .rz-pager
{
    display: none;
}

/*  In radzen the only way to apply styling to a generated popup is to set the id 
    of the component that will create the popup and that component will generate 
    a div with id = popup-<ur id> so you need to copy paste alot of the same css lines
    to apply the same styling if you have multiple dropdowns on the same page.

    This file should contain all such bullshittery
*/
#popup-FixedSizeDropDownDataGridWithoutCallback,
#popup-WorkProjectFilterSearchDropDownDataGrid,
#popup-WorkHourEmployeeFilterSearchDropDownDataGrid {
    min-width: 370px !important;
    width: 370px !important;
    margin-left: -1em;
}

#popup-FixedSizeDropDownDataGridWithoutCallback .rz-data-grid-data,
#popup-WorkProjectFilterSearchDropDownDataGrid .rz-data-grid-data,
#popup-WorkHourEmployeeFilterSearchDropDownDataGrid {
        height: 300px;
        max-height: 300px;
        overflow-y: scroll;
        overflow-x: hidden;
    }

#popup-FixedSizeDropDownDataGrid {
    min-width: 370px !important;
    width: 370px !important;
    margin-left: -1em;
}

#popup-FixedSizeDropDownDataGrid .rz-data-grid-data {
    height: 300px;
    max-height: 300px;
    overflow-y: scroll;
    overflow-x: hidden;
}

/* ---------------------------DATA TABLE FILTER POPUPS---------------------
   RadzenDataGrid does not provide a built-in way to manually set the ID of the filter popup 
   so we need to do some css magic and try to find these popups dynamically.

   All the filters follow a pattern of popup<random characters><name of property>form
   so we create a css rule that tries to find all these cases and sets all elements 
   after 4th (because all elements after 4th belong to the second dropdonw) one to didplay:none.
*/
[id^="popup"][id$="ID-form"] > :nth-child(n+4),
[id^="popup"][id$="Payor-form"] > :nth-child(n+4),
[id^="popup"][id$="ProjectName-form"] > :nth-child(n+4),
[id^="popup"][id$="CustomerPhone-form"] > :nth-child(n+4),
[id^="popup"][id$="Owner-form"] > :nth-child(n+4),
[id^="popup"][id$="Status-form"] > :nth-child(n+4),
[id^="popup"][id$="CreatedFormatted-form"] > :nth-child(n+4),
[id^="popup"][id$="ContactFirstAndLastName-form"] > :nth-child(n+4),
[id^="popup"][id$="ContactPhone-form"] > :nth-child(n+4),
[id^="popup"][id$="LocationName-form"] > :nth-child(n+4),
[id^="popup"][id$="TaskName-form"] > :nth-child(n+4),
[id^="popup"][id$="SoldHours-form"] > :nth-child(n+4),
[id^="popup"][id$="Hours-form"] > :nth-child(n+4),
[id^="popup"][id$="Description-form"] > :nth-child(n+4),
[id^="popup"][id$="Notes-form"] > :nth-child(n+4),
[id^="popup"][id$="SerialNumber-form"] > :nth-child(n+4),
[id^="popup"][id$="ProductNumber-form"] > :nth-child(n+4),
[id^="popup"][id$="Name-form"] > :nth-child(n+4),
[id^="popup"][id$="Quantity-form"] > :nth-child(n+4),
[id^="popup"][id$="Amount-form"] > :nth-child(n+4),
[id^="popup"][id$="Discount-form"] > :nth-child(n+4),
[id^="popup"][id$="VatPercentage-form"] > :nth-child(n+4),
[id^="popup"][id$="EmployeeSSNFormatted-form"] > :nth-child(n+4),
[id^="popup"][id$="Employee-form"] > :nth-child(n+4),
[id^="popup"][id$="EmployeeSSN-form"] > :nth-child(n+4),
[id^="popup"][id$="UnitPrice-form"] > :nth-child(n+4),
[id^="popup"][id$="AmountWithVAT-form"] > :nth-child(n+4),
[id^="popup"][id$="RegisterDateAsString-form"] > :nth-child(n+4),
[id^="popup"][id$="RegisteredAsString-form"] > :nth-child(n+4),
[id^="popup"][id$="TotalPrice-form"] > :nth-child(n+4),
[id^="popup"][id$="TotalPriceWithVat-form"] > :nth-child(n+4),
[id^="popup"][id$="MarkupInPercent-form"] > :nth-child(n+4),
[id^="popup"][id$="InvoiceNumber-form"] > :nth-child(n+4),
[id^="popup"][id$="TotalPriceWithoutVAT-form"] > :nth-child(n+4),
[id^="popup"][id$="Task-form"] > :nth-child(n+4),
[id^="popup"][id$="TotalPriceWithVAT-form"] > :nth-child(n+4),
[id^="popup"][id$="PayorSSN-form"] > :nth-child(n+4),
[id^="popup"][id$="PayorEmail-form"] > :nth-child(n+4),
[id^="popup"][id$="ContactEmail-form"] > :nth-child(n+4){
    display: none !important;
}
