.e-grid .e-gridheader tr:first-child th {
    /*background: linear-gradient(180deg, #345B77 0%, #62C0BF 103.94%);*/
    background: #60BEBE;
    color: white;
    padding-bottom: 10px;
    padding-top: 10px;
    font-size: 12px !important;
}

/*.e-grid .e-gridheader tr th:last-child {
   border-top-right-radius: 10px;
}*/
.e-grid .e-gridheader tr th:first-child {
    border-top-left-radius: 10px;
}

.e-grid .e-headercelldiv {
    font-size: 12px !important;
    font-weight: 500 !important;
    align-items: end !important;
    display: flex;
    justify-content: flex-start !important;
    margin: 0px !important;
    padding: 0px !important;
    font-family: Montserrat;
}

.e-grid .e-rowcell {
    font-family: Montserrat;
    color: #3C5873 !important;
    border: none !important;
}

.text-darkblue {
    color: #3C5873 !important;
}

.e-grid .e-altrow .e-rowcell {
    background-color: #62c0bf0f !important;
    border: none !important;
}

.e-grid th.e-headercell[aria-sort=ascending] .e-headertext {
    color: white !important;
}

.e-grid th.e-headercell[aria-sort=ascending] .e-headertext,
.e-grid th.e-headercell[aria-sort=descending] .e-headertext,
.e-grid th.e-headercell[aria-sort=ascending] .e-sortfilterdiv,
.e-grid th.e-headercell[aria-sort=descending] .e-sortfilterdiv {

    color: white !important;
    opacity: 1;
}

.e-grid .e-gridheader .e-icons:not(.e-icon-hide):not(.e-check):not(.e-stop):not(.e-icon-reorderuparrow):not(.e-icon-reorderdownarrow) {
    color: white !important;
    float: right;
}

.e-grid {
    border-radius: 10px !important;
}

.e-grid td.e-active {
    background: #E0EDF7 !important;
}

.e-grid .e-rowcell {
    font-size: 12px !important;
    height: auto !important;
    padding: 4px 15px !important;
}


.e-contextmenu-wrapper ul.e-contextmenu,
.e-contextmenu-container ul.e-contextmenu {
    /* box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12); */
    box-shadow: 4px 6px 24px 0px rgba(109, 141, 173, 0.15) !important;
    border-radius: 5px !important;
}

.e-contextmenu-wrapper ul,
.e-contextmenu-container ul {
    border-radius: 5px !important;
    box-shadow: 4px 6px 24px 0px rgba(109, 141, 173, 0.15) !important;
}

.e-grid .e-col-menu.e-filter-popup {
    border-radius: 5px !important;
    box-shadow: 4px 6px 24px 0px rgba(109, 141, 173, 0.15) !important;
}

.dropdown-menu.show {
    display: block;
    border: none;
    box-shadow: 4px 6px 24px 0px rgba(109, 141, 173, 0.15) !important;
}

.dropdown-item {
    padding: 6px 15px !important;
}

.dropdown-item .bx {
    margin-right: 8px;
}

.dropdown-item ion-icon {
    margin-right: 8px !important;
}

.e-grid .e-focused:not(.e-menu-item):not(.e-editedbatchcell) {
    box-shadow: none !important;
}

.e-grid.e-resize-lines .e-headercell .e-rhandler,
.e-grid.e-resize-lines .e-headercell .e-rsuppress {
    border-right: 1px solid #1C7CC2 !important;
}


.e-grid .e-headercell .e-sorted {
    background-color: #FFDD57 !important;
    /* Custom background color for sorted columns */
}

th.e-headercell.e-sort-icon.e-fltr-icon.e-mousepointer:has(.e-filtered) {
    background-color: #005CA5 !important;
    /* Change to desired color */
}

.e-grid .e-content {
    min-height: 300px !important;
}

.e-table .e-row:hover td {
    background: #62C0BF30 !important;
}

/*.e-table .e-altrow {
    border: none !important;
    box-shadow: none !important;
    outline: none;
}*/

.e-parentmsgbar {
    font-family: Montserrat;
}

.e-grid .e-gridheader .e-sortfilter .e-fltr-icon .e-headercelldiv {
    white-space: nowrap;
    display: table;
    text-align: left !important;
    margin: 0px !important;
    padding: 0px 21px 0px 0px !important;
    max-width: 180px !important;
    line-height: 23px !important;
    white-space: normal !important;
    overflow-wrap: break-word;
    word-wrap: break-word !important;
    height: auto !important;
    font-size: 12px !important;
}

.e-grid .e-columnmenu {
    top: calc(100% - 3px);
    padding: 0px 5px !important;
}

.e-grid .e-headercell,
.e-grid .e-detailheadercell {
    height: auto !important;
    padding: 6px 15px !important;
    vertical-align: bottom !important;
}

.e-grid .btn-outline-primary {
    padding: 4px 7px !important;
    font-size: 12px !important;
    padding-right: 20px !important;
}

.e-grid .btn-outline-primary::after {
    content: "";
    color: #006CBB;
    border-color: #006CBB transparent transparent transparent;
    border-style: solid;
    border-width: 6px 4px 0 4px;
    height: 0;
    position: absolute;
    top: 45%;
    right: 7px;
    width: 0;
}

.e-grid .btn-outline-primary:hover::after {
    border-color: #fff transparent transparent transparent;
}

.table .btn-outline-primary {
    padding: 4px 7px !important;
    font-size: 12px !important;
    padding-right: 20px !important;
}

.table .btn-outline-primary::after {
    content: "";
    color: #006CBB;
    border-color: #006CBB transparent transparent transparent;
    border-style: solid;
    border-width: 6px 4px 0 4px;
    height: 0;
    position: absolute;
    top: 45%;
    right: 7px;
    width: 0;
}

.table .btn-outline-primary:hover::after {
    border-color: #fff transparent transparent transparent;
}

.e-grid .dropdown-item {
    padding: 4px 15px !important;
    font-size: 12px;
}

.e-grid a {
    font-size: 12px;
}

.e-grid .badge {
    width: 100px !important;
    font-size: 10px !important;
    padding: 8px;
    border-radius: 25px !important;
}

.e-checkbox-wrapper .e-frame,
.e-css.e-checkbox-wrapper .e-frame {
    border: 1px solid #75757575 !important;
}

.e-grid .e-pager {
    display: flex !important;
    justify-content: space-between !important;
    flex-direction: row-reverse !important;
}

.e-pager div.e-parentmsgbar {
    padding: 14px !important;
}

.e-toolbar .e-toolbar-item .e-tbar-btn .e-tbar-btn-text {
    font-size: 12px !important;
}

.e-grid .dropdown-item:hover,
.e-grid .dropdown-item:focus {
    color: #fff !important;
    background-color: #006CBB !important;
    border-radius: 4px;
}

.e-toolbar-right .e-toolbar-item .e-tbar-btn:focus {
    background: #fafafa !important;
}

.e-grid .e-columnchooser-btn::before,
.e-grid-menu .e-columnchooser-btn::before,
.e-toolbar-right .e-toolbar-item .e-tbar-btn .e-tbar-btn-text {
    color: #3C5873 !important;
}

.e-toolbar-right .e-toolbar-item .e-tbar-btn {
    color: #3C5873 !important;
    border: 1px solid #3C5873 !important;
    border-radius: 4px !important;
    padding-left: 5px;
}

.e-toolbar-right .e-toolbar-item .e-tbar-btn:hover {
    background: #3C5873 !important;
    box-shadow: none;
    color: #fff !important;
}

.e-toolbar-right .e-toolbar-item .e-tbar-btn:hover .e-columnchooser-btn::before,
.e-toolbar-right .e-toolbar-item .e-tbar-btn:hover .e-tbar-btn-text {
    color: #fff !important;
}

.e-toolbar-left .e-toolbar-item .e-tbar-btn:hover,
.e-toolbar-left .e-toolbar-item .e-tbar-btn:focus {
    background: none !important;
}

.e-pagenomsg,
.e-pagecountmsg,
.e-constant,
.e-input-group {
    font-size: 12px !important;
}

/*.e-gridheader {
    padding-right: 0px !important;
}*/

@font-face {
    font-family: 'e-grid-rowheight';
    src: url(data:application/x-font-ttf;charset=utf-8;base64,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) format('truetype');
    font-weight: normal;
    font-style: normal;
}

.e-grid .e-small-icon::before {
    font-family: 'e-grid-rowheight';
    content: '\e707';
}

.e-grid .e-medium-icon::before {
    font-family: 'e-grid-rowheight';
    content: '\e701';
}

.e-grid .e-big-icon::before {
    font-family: 'e-grid-rowheight';
    content: '\e702';
}

/*.e-spinner-pane.e-spin-show {
    display: none !important;
}*/

.e-toolbar .e-toolbar-item .e-tbar-btn .e-icons {
    color: #3C5873 !important;
}

.e-toolbar .e-toolbar-item .e-tbar-btn:hover .e-icons {
    color: #fff !important;
}


.emptyRecordTemplate {
    text-align: center;
    padding: 30px 0;
    font-size: 15px;
    color: #666;
    font-family: Montserrat;
}

.e-emptyRecord {
    display: block;
    margin: 0 auto 12px auto;
    max-width: 220px;
}

.e-ddl.e-input-group.e-control-wrapper .e-ddl-icon::before {
    content: "\f078" !important;
    font-family: "FontAwesome" !important;
}

.e-input-group-icon.e-spin-down::before {
    content: "\f078" !important;
    font-family: "FontAwesome" !important;
}

.e-input-group-icon.e-spin-up::before {
    content: "\f077" !important;
    font-family: "FontAwesome" !important;
}

.e-grid .e-responsivetoolbaritems-btn::before,
.e-grid .e-columnmenu::before,
.e-grid .e-columnmenu.e-filtered::before,
.e-grid-menu .e-responsivetoolbaritems-btn::before,
.e-grid-menu .e-columnmenu::before,
.e-grid-menu .e-columnmenu.e-filtered::before {
    /*font-family: "FontAwesome" !important;
    content: "\f0b0" !important;*/
    font-size: 14px !important;
    font-family: "bootstrap-icons";
    /* important */
    content: "\F3E1" !important;
}

.e-grid .e-icon-grightarrow::before,
.e-grid-menu .e-icon-grightarrow::before {
    content: "\f054" !important;
    font-family: "FontAwesome" !important;
}

.e-grid .e-icon-gdownarrow::before,
.e-grid-menu .e-icon-gdownarrow::before {
    content: "\f078" !important;
    font-family: "FontAwesome" !important;
}

.detailtable {
    width: 100vw !important;
}

.detailtable td {
    font-size: 12px;
    padding: 4px;
    max-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: normal;
}

.detailtable td span {
    font-size: 12px !important;
}

.photo {
    width: 100px;
    height: 100px;
    border-radius: 50px;
    box-shadow: inset 0 0 1px #e0e0e0, inset 0 0 14px rgba(0, 0, 0, 0.2);
}

.photo img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.item-photo {
    width: 150px;
    height: 150px;
    border-radius: 5px;
    box-shadow: inset 0 0 1px #e0e0e0, inset 0 0 14px rgba(0, 0, 0, 0.2);
}

.item-photo img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.e-toolbar-right {
    display: flex !important;
    gap: 10px;
}

.e-toolbar-right .e-toolbar-item {
    padding: 0px !important;
    min-width: 30px !important;
}

.e-toolbar-right .e-toolbar-item .e-tbar-btn {
    width: 100% !important;
}

.e-input-group.e-search {
    padding-right: 5px !important;
}

.e-grid .e-toolbar {
    padding: 8px 0px !important;
    font-family: Montserrat;
}

.e-toolbar .e-toolbar-item .e-tbar-btn .e-tbar-btn-text,
.e-input.e-search {
    font-family: Montserrat !important;
}

.e-toolbar .e-toolbar-left {
    padding-left: 10px;
}

.e-toolbar .e-toolbar-right {
    padding-right: 10px;
}

/*
.e-checkbox-wrapper .e-frame + .e-label, .e-css.e-checkbox-wrapper .e-frame + .e-label {
    margin-left: 0px !important;
}*/

.e-grid .e-ccdlg .e-cc-lab-name,
.e-grid .e-ccdlg .e-checkbox-wrapper .e-label {
    margin-left: 8px !important;
}

.e-btn.e-primary,
.e-css.e-btn.e-primary {
    background: #60BEBE !important;
    font-size: 12px;
}

.e-btn {
    border-radius: 26px !important;
}

.e-grid .e-headercontent {
    border: none !important;
}

.e-grid .e-gridheader {
    background-color: #60BEBE !important;
    border-top-right-radius: 10px;
}

.e-contextmenu-wrapper ul .e-menu-item,
.e-contextmenu-container ul .e-menu-item {
    font-size: 12px;
    height: 33px;
    line-height: 33px;
}

.e-checkbox-wrapper .e-label,
.e-css.e-checkbox-wrapper .e-label {
    font-size: 12px !important;
    color: rgba(0, 0, 0, .87) !important;
    font-family: Montserrat !important;
}

@media (max-width: 767px) {
    .e-grid td.e-active, .e-grid td, .e-grid .e-altrow .e-rowcell {
        background: transparent !important;
    }
    .e-hscroll.e-scroll-device{
    }
    /* --- GLOBAL: Hide Toolbar Scroll Arrows on Mobile --- */
    /* This ensures the arrow doesn't overlap text/buttons in ANY grid */
   /* .e-grid .e-toolbar .e-scroll-nav,
    .e-grid .e-toolbar .e-nav-arrow {
        display: none !important;
    }
*/
    .e-grid .e-toolbar .e-toolbar-items {
        display: block !important;
        height: auto !important;
        overflow: visible !important;
    }

    /* Global Mobile Card Grid Styles */
    .mobile-card-grid .e-gridheader {
        display: none !important;
    }

    /* Force Table to behave like a block container */
    .mobile-card-grid .e-gridcontent .e-table {
        display: block !important;
        width: 100% !important;
    }

    .mobile-card-grid .e-gridcontent tbody {
        display: block !important;
        width: 100% !important;
        padding:5px;
    }

    /* Card Style for Rows */
    .mobile-card-grid .e-gridcontent .e-row {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        margin-bottom: 20px;
        background: #fff;
        border-radius: 12px;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
        border: 1px solid #eef2f6;
        padding: 15px;
        position: relative;
    }

    /* Cells as Rows within Card */
    .mobile-card-grid .e-gridcontent .e-rowcell {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
        border: none !important;
        padding: 8px 0 !important;
        text-align: right;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        font-size: 14px !important;
        height: auto !important;
    }

    .mobile-card-grid .e-gridcontent .e-rowcell::before {
        /* Default label styles */
        font-weight: 600;
        color: #8898aa;
        font-size: 13px;
        margin-right: auto;
    }

    /* Default Action Buttons - Full Width */
    .mobile-card-grid .e-gridcontent .e-rowcell .btn {
        width: 100%;
        padding: 10px;
    }


    /* --- Specific Layout: Prescription Grid --- */

    /* Checkbox - First column */
    .mobile-card-grid.prescription-grid-labels .e-gridcontent .e-rowcell[aria-colindex="1"] {
        position: absolute !important;
        top: 15px;
        right: 15px;
        width: auto !important;
        min-width: auto !important;
        padding: 0 !important;
        justify-content: flex-end;
        border-bottom: none !important;
    }

    /* ID Column */
    .mobile-card-grid.prescription-grid-labels .e-gridcontent .e-rowcell[aria-colindex="2"] {
        border-bottom: 1px solid #f5f7fa !important;
        margin-bottom: 8px;
        padding-bottom: 12px !important;
    }

    .mobile-card-grid.prescription-grid-labels .e-gridcontent .e-rowcell[aria-colindex="2"]::before {
        content: "ID";
        color: #3C5873;
    }

    /* Patient Column */
    .mobile-card-grid.prescription-grid-labels .e-gridcontent .e-rowcell[aria-colindex="3"]::before {
        content: "Patient";
    }

    /* Ordered Column */
    .mobile-card-grid.prescription-grid-labels .e-gridcontent .e-rowcell[aria-colindex="4"]::before {
        content: "Ordered";
    }

    /* Status Column */
    .mobile-card-grid.prescription-grid-labels .e-gridcontent .e-rowcell[aria-colindex="5"]::before {
        content: "Status";
    }

    /* Actions Column - Force bottom full width layout */
    .mobile-card-grid.prescription-grid-labels .e-gridcontent .e-rowcell[aria-colindex="6"] {
        display: block !important;
        margin-top: 10px;
        text-align: center;
        padding-top: 15px !important;
        border-top: 1px solid #f5f7fa !important;
    }

    /* Adjust checkbox placement overlap */
    .mobile-card-grid.prescription-grid-labels .e-gridcontent .e-row {
        padding-top: 35px;
    }
}
.e-pager .e-currentitem, .e-pager .e-currentitem:hover{
    background:#60BEBE!important;
}