html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}


html, body {
    background-color: #F7F4EE !important;
}

/** Can't do entire theme background because then all textboxes/other objects are that color too
:root, [data-bs-theme="light"] {
    --bs-body-bg: #F7F4EE;
}
**/

.dropdown-menu {
    --bs-dropdown-bg: #F7F4EE;
}

/* 1. Main Grid Content and Row Cells Background */
.e-grid,
.e-grid .e-gridcontent,
.e-grid .e-rowcell,
.e-grid .e-emptyrow {
    background-color: #F7F4EE !important;
}


/* 2. Header and Column Headers Background */
.e-grid .e-gridheader,
.e-grid .e-headercell,
.e-grid .e-headercontent {
    background-color: #F7F4EE !important;
}

/* 3. Alternate Rows Background (If EnableAltRow is true) */
.e-grid .e-altrow {
    background-color: #F7F4EE !important;
}

/* 4. Toolbar and Grouping Bar Background (If used) */
.e-grid .e-toolbar,
.e-grid .e-toolbar-items,
.e-grid .e-groupdroparea {
    background-color: #F7F4EE !important;
}
    
/* 5. Pager Background (Bottom navigation) */
.e-grid .e-gridpager,
.e-grid .e-pagercontainer {
    background-color: #F7F4EE !important;
}

/* 1. Default state for all unselected page numbers */
.e-pager .e-numericitem {
    background-color: #F7F4EE !important;
    color: #212529 !important; /* Ensures the number text is dark and readable */
}

/* 2. Hover state when a user mouses over a number */
.e-pager .e-numericitem:hover {
    background-color: #E2DFD8 !important; /* Slightly darker shade for feedback */
    color: #000000 !important;
}

/* 3. The currently selected/active page number */
.e-pager .e-numericitem.e-currentitem {
    background-color: #0d6efd !important; /* Keeps standard Bootstrap primary blue, or change to your liking */
    color: #ffffff !important;
}


/* 1. Target all navigation arrow container items */
.e-pager .e-first,
.e-pager .e-prev,
.e-pager .e-next,
.e-pager .e-last,
.e-pager .e-firstpage,
.e-pager .e-prevpage,
.e-pager .e-nextpage,
.e-pager .e-lastpage {
    background-color: #F7F4EE !important;
    color: #212529 !important; /* Makes arrows dark and visible */
}

/* 2. Feedback state when hovering over the arrow buttons */
.e-pager .e-first:hover,
.e-pager .e-prev:hover,
.e-pager .e-next:hover,
.e-pager .e-last:hover {
    background-color: #E2DFD8 !important; /* Slightly darker shade for feedback */
}

/* 3. Style for disabled navigation buttons (e.g., 'prev' when on page 1) */
.e-pager .e-disabled {
    background-color: #F7F4EE !important;
    opacity: 0.5; /* Keeps background custom while graying out icon */
}

.table {
    --bs-table-bg: #F7F4EE;
}

.modal-content {
    --bs-modal-bg: #F7F4EE;
}

/*
@font-face {
    font-family: 'Pogonia';
    src: url('../fonts/Pogonia-Light.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

*/


.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
  /*font-family: 'Pogonia'*/
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/*
    Sunday Solved Colors:
    #22435D - darker blue
    #759DBD - lighter blue
    #F26A35 - orange
    #FFFFFF - white
*/

.btn-primary {
    background-color: #22435D;
}

.btn-success {
    background-color: #759DBD
}

.nav-pills .nav-link.active {
    background-color: #22435D;
}