body {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  background-color: #f5f7fa;
}

.navbar {
  box-shadow: 0 2px 4px rgba(0,0,0,.1);
}

.card {
  border: none;
  border-radius: .5rem;
}

.card-header {
  background-color: #f8f9fa;
  border-bottom: 1px solid rgba(0,0,0,.05);
  font-weight: 600;
}

.table > thead {
  font-size: .85rem;
  text-transform: uppercase;
  letter-spacing: .5px;
}

.btn-group-sm .btn {
  padding: .15rem .4rem;
}

.list-group-item {
  border-left: none;
  border-right: none;
}

.list-group-item:first-child {
  border-top: none;
}

/* ── Zebra striping for data tables ───────────────────────── */
.table-hover > tbody > tr:nth-child(odd) > * {
  background-color: #f0f2f5;
}
.table-hover > tbody > tr:hover > * {
  background-color: #dce0e5 !important;
}

@media print {
  .navbar, .btn, .alert, .card-header .btn { display: none; }
  .card { box-shadow: none; border: 1px solid #ddd; }
}

.text-justify {
  text-align: justify;
}

/* ── Mobile (iPhone 13 / <768px) ──────────────────────────── */
@media (max-width: 768px) {
  .container-fluid {
    padding-left: .5rem;
    padding-right: .5rem;
  }
  h4 {
    font-size: 1rem;
    word-break: break-word;
  }
  .navbar-brand {
    font-size: .95rem;
  }
  .card-body {
    padding: .65rem;
  }
  .table {
    font-size: .75rem;
  }
  .table td, .table th {
    white-space: nowrap;
    padding: .25rem .3rem;
  }
  .badge {
    font-size: .65rem;
  }
  /* Action button groups → stack vertically */
  .btn-group-xs .btn {
    padding: .15rem .35rem;
    font-size: .7rem;
  }
  td:last-child .btn-group {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 2px;
  }
  td:last-child .btn-group .btn {
    border-radius: .2rem !important;
    margin: 1px;
  }
  /* Make filter forms stack */
  .row.g-2.mb-3 > .col-auto {
    flex: 1 1 100%;
    max-width: 100%;
  }
  .row.g-2.mb-3 .form-select,
  .row.g-2.mb-3 .form-control-plaintext {
    width: 100%;
  }
  /* Prevent 16px zoom on iOS inputs */
  input.form-control,
  select.form-select,
  textarea.form-control {
    font-size: 16px !important;
  }
  /* Top toolbar - stack buttons */
  .d-flex.justify-content-between.align-items-center.mb-3 {
    flex-wrap: wrap;
    gap: .5rem;
  }
  .d-flex.justify-content-between.align-items-center.mb-3 > div {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
  }
  .d-flex.justify-content-between.align-items-center.mb-3 > div .btn {
    font-size: .75rem;
    padding: .2rem .5rem;
  }
  /* Calendar */
  .calendar-grid .btn {
    font-size: .7rem;
    padding: .2rem;
  }
  /* Dashboard stat cards — equal size on mobile */
  .row.g-3.mb-4 .col-md-3 {
    padding-left: .25rem;
    padding-right: .25rem;
  }
  .row.g-3.mb-4 .col {
    flex: 1 1 0;
    min-width: 80px;
  }
  .row.g-3.mb-4 .card-title {
    font-size: 1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .row.g-3.mb-4 .card-text {
    font-size: .75rem;
  }
}