/* ── iPhone / Mobile comprehensive styles ─────────── */
/* Loaded automatically on devices < 768px             */

/* Reset container padding for max space */
.container-fluid {
  padding-left: .4rem !important;
  padding-right: .4rem !important;
}

/* Smaller headings */
h4 { font-size: 1rem; }
h5 { font-size: .9rem; }
h6 { font-size: .8rem; }

/* Smaller text */
body, p, label, .form-label {
  font-size: .85rem;
}

/* Cards - tighter padding */
.card-body { padding: .5rem; }
.card-header { padding: .4rem .6rem; font-size: .85rem; }

/* ── Top toolbar ─────────────────────────────── */
.d-flex.justify-content-between.align-items-center.mb-3 {
  flex-wrap: wrap;
  gap: .4rem;
}
.d-flex.justify-content-between.align-items-center.mb-3 > div {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  width: 100%;
}
.d-flex.justify-content-between.align-items-center.mb-3 > div .btn {
  font-size: .75rem;
  padding: .2rem .5rem;
}

/* ── Tables ──────────────────────────────────── */
.table {
  font-size: .72rem;
  margin-bottom: 0;
}
.table td, .table th {
  padding: .25rem .25rem;
  white-space: nowrap;
}
.table td:first-child, .table th:first-child {
  padding-left: .3rem;
}
.table td:last-child, .table th:last-child {
  padding-right: .3rem;
}
.badge { font-size: .6rem; }

/* Action button groups - wrap without breaking */
td:last-child .btn-group,
td .btn-group {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 1px;
}
td:last-child .btn-group .btn,
td .btn-group .btn {
  border-radius: .15rem !important;
  margin: 1px 0;
  padding: .1rem .3rem;
  font-size: .65rem;
}

/* ── Filter forms (status / client selects) ──── */
.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%;
}

/* ── Forms (invoice/act add/edit) ────────────── */
form .row.g-3 > [class*="col-"] {
  padding-left: .25rem;
  padding-right: .25rem;
}
input.form-control,
select.form-select,
textarea.form-control {
  font-size: 16px !important;
}

/* Items table in invoice/act forms */
#itemsTable th {
  font-size: .65rem;
  white-space: nowrap;
}
#itemsTable td {
  padding: .2rem .15rem;
  vertical-align: middle;
}
#itemsTable .form-control,
#itemsTable .form-select {
  font-size: .7rem;
  padding: .15rem .2rem;
  height: auto;
  min-height: auto;
}

/* ── Invoice/act submit buttons ──────────────── */
form .btn-primary,
form .btn-success,
form .btn-secondary {
  font-size: .8rem;
  padding: .3rem .5rem;
}

/* ── View pages (col-6 → stack on mobile) ───── */
[class*="col-"]:not([class*="col-sm"]):not([class*="col-md"]):not([class*="col-lg"]):not([class*="col-xl"]) {
  flex: 0 0 100%;
  max-width: 100%;
}

/* ── Dashboard stat cards ────────────────────── */
.row.g-3.mb-4 .card-title { font-size: 1rem; }
.row.g-3.mb-4 .card-text { font-size: .75rem; }

/* ── Calendar grid ───────────────────────────── */
.calendar-grid .btn {
  font-size: .65rem;
  padding: .2rem;
}

/* ── Modal dialogs ───────────────────────────── */
.modal-dialog { margin: .5rem; }
.modal-body { padding: .5rem; }
.modal-header { padding: .5rem; }
.modal-footer { padding: .5rem; }

/* ── Settings accordion ──────────────────────── */
.accordion-body { padding: .5rem; }
.accordion-button { font-size: .85rem; padding: .5rem; }

/* ── Navbar ──────────────────────────────────── */
.navbar-brand { font-size: 1rem; }
.navbar-toggler { padding: .4rem .6rem; border: none; }
.nav-link {
  font-size: .95rem;
  padding: .75rem .5rem;
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: .4rem;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.navbar-nav .dropdown-menu {
  border: none;
  background: rgba(0,0,0,.15);
  margin: 0;
  padding: .3rem 0;
  border-radius: 0;
}
.navbar-nav .dropdown-item {
  font-size: .9rem;
  padding: .7rem 1rem;
  min-height: 44px;
  display: flex;
  align-items: center;
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.navbar-nav .dropdown-item:hover,
.navbar-nav .dropdown-item:focus {
  background: rgba(255,255,255,.1);
  color: #fff;
}
.navbar-nav .dropdown-divider { border-color: rgba(255,255,255,.1); }
.navbar-nav:last-child { margin-top: .5rem; }

/* ── Reconciliation summary ──────────────────── */
#recSummary .col-4 {
  flex: 0 0 33.33%;
  max-width: 33.33%;
}
#recSummary .col-4 p {
  font-size: .7rem;
}
#recSummary .col-4 strong {
  font-size: 1rem;
}

/* ── Entries table in reconciliation ─────────── */
#entriesTable th {
  font-size: .65rem;
  white-space: nowrap;
}
#entriesTable td {
  padding: .2rem .15rem;
}
#entriesTable .form-control,
#entriesTable .form-select {
  font-size: .7rem;
  padding: .15rem .2rem;
  height: auto;
}

/* ── Fix for invoice/act view col-6 ──────────── */
/* Force col-6 to stack on mobile */
.col-6 {
  flex: 0 0 100%;
  max-width: 100%;
}

/* ── Client detail tabs ──────────────────────── */
.nav-tabs .nav-link {
  font-size: .8rem;
  padding: .3rem .5rem;
}

/* ── Services page toggle icon ───────────────── */
.bi-x-circle-fill, .bi-check-circle-fill {
  font-size: 1.1rem;
}

/* ── Archive page ────────────────────────────── */
#yearAccordion .accordion-button {
  font-size: .8rem;
  padding: .4rem .6rem;
}
#yearAccordion .list-group-item {
  font-size: .75rem;
  padding: .3rem .5rem;
}
#yearAccordion .list-group-item .btn-group .btn {
  font-size: .65rem;
  padding: .1rem .3rem;
}

/* ── Invoice/Act form header (service selector + add btn) ── */
.card-header.d-flex.justify-content-between.align-items-center {
  flex-wrap: wrap;
  gap: .4rem;
}
.card-header.d-flex.justify-content-between.align-items-center > div {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  width: 100%;
}
.card-header.d-flex.justify-content-between.align-items-center select#serviceSelect {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  font-size: .75rem;
}
.card-header.d-flex.justify-content-between.align-items-center .btn-success.btn-sm {
  font-size: .75rem;
  padding: .2rem .5rem;
}

/* ── Save buttons row ────────────────────────── */
form .mt-3.d-flex.flex-wrap .btn {
  font-size: .85rem;
  padding: .4rem .5rem;
  text-align: center;
}
