/* .my-pagination-btn {
  background-color: #ccc !important;
  padding: 6px 10px !important;
  border-radius: 15px !important;
  margin-right: 2px !important;
}
.my-pagination-current {
  background-color: #0065F8 !important;
  color: #FFFFFF !important;
}
.gridjs-search {
  width: 100% !important; /* or your preferred width */
/*}
.gridjs-search input {
  width: 100% !important; /* or your preferred width */
/*} */
/*  */
div.suggest-box{
  position: absolute;
  width: 90%;
  border:1px solid #CCC;
  z-index: 99999;
  border-radius: 4px;
  color:#000000;
  overflow-y: auto;
  margin-top: 0%;
  display: none;
}
div.suggest-box a{
  width: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-size: 1em;
  cursor: pointer;
  text-decoration: none;
  color: #000000;
  text-align: left !important;
  border-bottom: 1px solid rgba(204,204,204,1);
}
div.suggest-box div#time{
  width: 100%;
  padding:1%;
  font-style: normal;
  font-size: 1em;
  font-weight: normal;
  border-bottom: 2px solid #eee;
  letter-spacing: 1px;
  margin:0;
}
div.suggest-box div#time:hover{
  background-color: rgba(204,204,204,0.5);
}
div.suggest-box p#noRecords{
  text-align: center;
  font-style: italic;
  font-size: 0.95em;
  font-weight: normal;
  padding:0 6% 0 6%;
}
/*  */
.pagination-wrapper {
      background: #ffffff;
      padding: 18px 22px;
      border-radius: 18px;
      box-shadow: 0 12px 35px rgba(15, 23, 42, 0.12);
    }

    .pagination {
      display: flex;
      align-items: center;
      gap: 8px;
      list-style: none;
      flex-wrap: wrap;
      justify-content: center;
    }

    .pagination li a {
      min-width: 42px;
      height: 42px;
      padding: 0 14px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 12px;
      text-decoration: none;
      color: #334155;
      font-size: 14px;
      font-weight: 600;
      background: #f8fafc;
      border: 1px solid #e2e8f0;
      transition: all 0.25s ease;
    }

    .pagination li a:hover {
      background: #2563eb;
      color: #ffffff;
      border-color: #2563eb;
      transform: translateY(-2px);
      box-shadow: 0 8px 18px rgba(37, 99, 235, 0.25);
    }

    .pagination li.active a {
      background: linear-gradient(135deg, #2563eb, #1d4ed8);
      color: #ffffff;
      border-color: #2563eb;
      box-shadow: 0 8px 20px rgba(37, 99, 235, 0.35);
    }

    .pagination li.disabled a {
      color: #94a3b8;
      background: #f1f5f9;
      border-color: #e2e8f0;
      pointer-events: none;
      cursor: not-allowed;
    }

    .pagination li.dots a {
      background: transparent;
      border: none;
      pointer-events: none;
      color: #64748b;
      min-width: 25px;
    }

    .page-btn {
      gap: 6px;
    }

    @media (max-width: 520px) {
      .pagination-wrapper {
        width: 92%;
        padding: 14px;
      }

      .pagination li a {
        min-width: 38px;
        height: 38px;
        font-size: 13px;
        padding: 0 11px;
      }

      .hide-mobile {
        display: none;
      }
    }
/* =====================================================================
   Responsive enhancements (added) — safe, additive rules for any device
   ===================================================================== */
/* smooth momentum scrolling for every horizontal scroller
   (data tables, horizontal nav, report header button rows) */
.is-scrollbar-hidden.overflow-x-auto,
.overflow-x-auto {
  -webkit-overflow-scrolling: touch;
}

/* keep wide data tables readable on tablets/phones: scroll cleanly
   instead of squashing columns into unreadable wraps */
@media (max-width: 1024px) {
  .overflow-x-auto > table { min-width: 640px; }
}

@media (max-width: 640px) {
  /* more usable width on phones */
  .card { padding-left: 0.85rem; padding-right: 0.85rem; }
  /* compact, wrapping pagination on phones */
  .pagination { gap: 6px; row-gap: 8px; }
  .pagination-wrapper { width: 100%; padding: 12px; }
  /* stack two-column form grids on very small screens */
  .grid.grid-cols-2 { grid-template-columns: 1fr; }
}

/* tablet: let dense multi-column grids relax to 2 columns */
@media (min-width: 641px) and (max-width: 1024px) {
  .grid.sm\:grid-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* paginator "Showing X-Y of Z entries" info line (shown on list AND report tables) */
.pagination-wrapper .fp-page-info {
  text-align: center;
  font-size: 13px;
  font-weight: 500;
  color: #64748b;
  margin-bottom: 10px;
}
.dark .pagination-wrapper .fp-page-info { color: #94a3b8; }

/* report pages: remove the legacy "Show Records Per Page" dropdown + old count text
   (superseded by the global paginator's info line + numbered nav) */
label:has(#pageLimit) { display: none !important; }
.num-records { display: none !important; }

/* mobile: let in-page action button rows wrap instead of overflowing off-screen */
@media (max-width: 640px) {
  .flex.justify-center.space-x-2 { flex-wrap: wrap; gap: 0.5rem; }
  .flex.justify-center.space-x-2 > * { margin-left: 0 !important; }
}

/* ===== Report pages — responsive, cleaner UI on phones/tablets ===== */
@media (max-width: 768px) {
  /* report header tab pills (Patient List / Activity / ...): wrap instead of long scroll */
  .flex.items-center.justify-start.border-b { flex-wrap: wrap; gap: 0.4rem; }
  .flex.items-center.justify-start.border-b > .btn { margin-right: 0 !important; }

  /* report meta header (report title + logo + export menu): stack vertically */
  .flex.items-center.justify-between.space-x-2:has(img.size-28) {
    flex-direction: column;
    align-items: stretch;
    gap: 1rem;
  }
  .flex.items-center.justify-between.space-x-2:has(img.size-28) > * { margin-left: 0 !important; }

  /* report title text shouldn't break one word per line */
  .flex.items-center.justify-between.space-x-2:has(img.size-28) .text-2xl { font-size: 1.25rem; }

  /* smaller report logo on phones */
  img.size-28 { width: 5rem !important; height: 5rem !important; }
}