/* Budget Plan Web App - Dorset Care */
:root {
  --teal:   #0f766e;
  --teal2:  #0b5f59;
  --navy:   #18314f;
  --accent: #0ea5a0;
  --pending:#e88a00;
  --danger: #c0392b;
  --success:#27ae60;
  --bg:     #eef4f2;
  --card:   #ffffff;
  --border: #d8e0e6;
  --text:   #1f2f3d;
  --muted:  #6b7c88;
  --row-alt:#f7faf9;
  --surface:#f8fbfa;
  --shadow: 0 14px 36px rgba(24,49,79,.10);
  --shadow-sm: 0 4px 14px rgba(24,49,79,.08);
}

* { box-sizing:border-box; margin:0; padding:0; }
body {
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  background:
    radial-gradient(circle at 10% 0%, rgba(14,165,160,.10), transparent 28rem),
    linear-gradient(180deg,#f8fbfa 0%, var(--bg) 48%, #edf3f6 100%);
  color:var(--text);
  font-size:14px;
}
.aws-site-ribbon {
  background:#0f766e !important;
  font-size:12px !important;
  padding:6px 12px !important;
}
.aws-site-ribbon + #login-page { padding-top:26px; }
.aws-site-ribbon + #login-page + #app #navbar,
.aws-site-ribbon ~ #app #navbar { top:26px; }
.aws-site-ribbon ~ #app #content { padding-top:40px; }

/* ── Layout ── */
#app { display:none; flex-direction:column; min-height:100vh; }
#app.app-ready { display:flex; }
#navbar  {
  background:rgba(24,49,79,.96);
  backdrop-filter:blur(12px);
  color:#fff;
  padding:0 24px;
  display:flex;
  align-items:center;
  min-height:58px;
  gap:12px;
  overflow-x:auto;
  overflow-y:hidden;
  position:sticky;
  top:0;
  z-index:100;
  box-shadow:0 8px 26px rgba(12,28,48,.18);
}
#navbar::-webkit-scrollbar { height:4px; }
#navbar::-webkit-scrollbar-thumb { background:rgba(255,255,255,.22); border-radius:999px; }
#navbar .brand { font-size:17px; font-weight:800; letter-spacing:0; flex:1; min-width:190px; }
#navbar .brand span { color:#79e0cd; font-weight:650; }
.site-env-pill {
  background:#107d73;
  border:1px solid rgba(255,255,255,.55);
  border-radius:999px;
  box-shadow:0 0 0 2px rgba(93,217,193,.18);
  color:#fff;
  flex-shrink:0;
  font-size:11px;
  font-weight:800;
  letter-spacing:.6px;
  line-height:1;
  padding:7px 11px;
}
.nav-btn {
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.16);
  color:#fff;
  padding:7px 12px;
  border-radius:6px;
  cursor:pointer;
  font-size:13px;
  font-weight:650;
  transition:background .18s, transform .18s, border-color .18s;
}
.nav-btn:hover { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.34); transform:translateY(-1px); }
.nav-btn.active {
  background:#f59e0b !important;
  border-color:#ffd37a !important;
  box-shadow:0 0 0 2px rgba(245,158,11,.26), inset 0 -3px 0 rgba(255,255,255,.35);
  color:#10233a !important;
  font-weight:850;
}
.nav-btn.active:hover {
  background:#fbbf24 !important;
  transform:none;
}
#content { flex:1; padding:26px 24px 34px; max-width:1480px; margin:0 auto; width:100%; }

/* ── Cards ── */
.card { background:var(--card); border-radius:8px; border:1px solid var(--border); padding:20px; margin-bottom:16px; box-shadow:var(--shadow-sm); }
.card-title { font-size:15px; font-weight:700; color:var(--navy); margin-bottom:14px; display:flex; align-items:center; gap:8px; }

/* ── Buttons ── */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:8px 15px; border-radius:6px; border:none; cursor:pointer; font-size:13px; font-weight:700; transition:all .18s; white-space:nowrap; }
.btn-primary  { background:var(--teal);  color:#fff; }
.btn-primary:hover  { background:var(--teal2); box-shadow:0 8px 18px rgba(15,118,110,.20); transform:translateY(-1px); }
.btn-secondary{ background:#fff; color:var(--teal); border:1.5px solid var(--teal); }
.btn-secondary:hover{ background:#f0faf9; transform:translateY(-1px); }
.btn-danger   { background:var(--danger); color:#fff; }
.btn-danger:hover   { background:#a93226; }
.btn-warning  { background:var(--pending); color:#fff; }
.btn-sm       { padding:4px 10px; font-size:12px; }
.btn-icon     { padding:5px 8px; }
.btn:disabled { opacity:.5; cursor:not-allowed; }

/* ── Tables ── */
.tbl-wrap { overflow-x:auto; border-radius:8px; border:1px solid var(--border); background:#fff; }
table  { width:100%; border-collapse:collapse; background:var(--card); }
thead tr { background:#17445f; color:#fff; }
th { padding:9px 10px; text-align:left; font-size:12px; font-weight:600; white-space:nowrap; }
.sortable { cursor:pointer; user-select:none; position:relative; padding-right:22px; }
.sortable::after { content:'↕'; position:absolute; right:8px; top:50%; transform:translateY(-50%); font-size:11px; opacity:.45; }
.sortable.sort-asc::after { content:'↑'; opacity:1; }
.sortable.sort-desc::after { content:'↓'; opacity:1; }
td { padding:8px 10px; font-size:13px; border-bottom:1px solid var(--border); vertical-align:middle; }
tr:last-child td { border-bottom:none; }
tr.alt { background:var(--row-alt); }
tr:hover td { background:#edf7f5; }
.num { text-align:right; font-variant-numeric:tabular-nums; }
.neg-num { color:var(--danger) !important; font-weight:700; }
.count-pill { background:#e7eef8; color:var(--navy); border:1px solid var(--border); border-radius:999px; padding:3px 10px; font-size:12px; font-weight:600; }

/* ── Forms ── */
.form-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:12px; }
.form-group { display:flex; flex-direction:column; gap:4px; }
.form-group label { font-size:12px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.4px; }
.form-group input, .form-group select, .form-group textarea {
  padding:8px 10px; border:1.5px solid var(--border); border-radius:6px;
  font-size:13px; color:var(--text); background:#fff; transition:border .15s;
}
.form-group input:focus, .form-group select:focus { outline:none; border-color:var(--teal); }
.form-group input[readonly] { background:#f5f5f5; color:var(--muted); }

/* ── Badges ── */
.badge { display:inline-block; padding:3px 9px; border-radius:999px; font-size:11px; font-weight:800; letter-spacing:.1px; }
.badge-active  { background:#d5f0e8; color:#1a6640; }
.badge-pending { background:#fdeec8; color:#8a5100; }
.badge-inactive{ background:#eee;    color:#888; }
.badge-admin   { background:#dde8ff; color:#1a3080; }
.badge-draft   { background:#eee;    color:#555; }
.badge-approved{ background:#d5f0e8; color:#1a6640; }

/* ── Page header ── */
.page-hdr { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; flex-wrap:wrap; gap:14px; }
.page-hdr h2 { font-size:23px; color:var(--navy); letter-spacing:0; }
.page-subtitle { color:var(--muted); margin-top:5px; line-height:1.45; }
.page-actions { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.admin-hero {
  background:rgba(255,255,255,.72);
  border:1px solid rgba(216,224,230,.88);
  border-radius:8px;
  box-shadow:var(--shadow-sm);
  padding:16px;
}
.control-input {
  padding:8px 12px;
  border:1.5px solid var(--border);
  border-radius:6px;
  font-size:13px;
  min-width:260px;
  background:#fff;
}
.control-input:focus { outline:none; border-color:var(--teal); box-shadow:0 0 0 3px rgba(15,118,110,.10); }
.search-bar { display:flex; gap:8px; align-items:center; }
.search-bar input { padding:7px 12px; border:1.5px solid var(--border); border-radius:5px; font-size:13px; min-width:200px; }
.search-bar select { padding:7px 12px; border:1.5px solid var(--border); border-radius:5px; font-size:13px; background:#fff; }
.client-filter-bar input { min-width:140px; }
.client-meta { font-size:12px; line-height:1.35; color:var(--muted); white-space:nowrap; }
#page-clients .page-hdr > div:last-child {
  flex:1 1 640px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
#page-clients .page-hdr .search-bar:first-child {
  flex:1 1 240px;
  min-width:220px;
}
#page-clients .client-filter-bar {
  flex:2 1 430px;
  flex-wrap:wrap;
}
#page-clients .client-filter-bar select { flex:1 1 120px; }
#page-clients .client-filter-bar input { flex:1 1 135px; }
#page-clients #client-search { width:100%; }

/* ── Budget Summary ── */
.summary-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.smry-tbl { width:100%; border-collapse:collapse; font-size:13px; }
.smry-tbl th { background:var(--teal); color:#fff; padding:8px 12px; text-align:right; }
.smry-tbl th:first-child { text-align:left; }
.smry-tbl td { padding:6px 12px; border-bottom:1px solid var(--border); text-align:right; }
.smry-tbl td:first-child { text-align:left; }
.smry-tbl tr.section-hdr td { background:#e8f4f4; font-weight:700; color:var(--teal); }
.smry-tbl tr.total-row td { background:var(--navy); color:#fff; font-weight:700; }
.smry-tbl tr.avail-row td { background:var(--teal); color:#fff; font-weight:700; }
.smry-tbl tr.alloc-row td { background:#222; color:#fff; font-weight:700; }
.summary-client-card { border:1px solid var(--border); border-radius:8px; padding:16px 18px; margin-bottom:16px; background:linear-gradient(180deg,#f8fbfc 0%, #ffffff 100%); }
.summary-client-title { font-size:16px; font-weight:700; color:var(--navy); margin-bottom:12px; }
.summary-client-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:10px 14px; }
.summary-client-item { border:1px solid #e5edf2; border-radius:6px; padding:10px 12px; background:#fff; }
.summary-client-label { font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.4px; margin-bottom:4px; }
.summary-client-value { font-size:14px; color:var(--navy); font-weight:600; word-break:break-word; }
.summary-section-title { font-size:16px; font-weight:700; color:var(--navy); margin:22px 0 10px; }
.summary-note { font-size:12px; color:var(--muted); margin-bottom:8px; }
.summary-detail-wrap { overflow-x:auto; border:1px solid var(--border); border-radius:8px; margin-top:8px; }
.summary-detail-tbl { width:100%; border-collapse:collapse; font-size:12px; }
.summary-detail-tbl thead tr { background:var(--teal); color:#fff; }
.summary-detail-tbl th { padding:8px; font-size:11px; }
.summary-detail-tbl td { padding:6px 8px; border-bottom:1px solid var(--border); vertical-align:top; }
.summary-detail-tbl tr:nth-child(even) td { background:#fafcfd; }
.summary-detail-tbl tr.total-row td { background:var(--navy); color:#fff; font-weight:700; }

/* ── Detail table ── */
.detail-tbl th { font-size:11px; padding:7px 6px; }
.detail-tbl td { font-size:12px; padding:5px 6px; }
.detail-tbl input, .detail-tbl select {
  border:1px solid var(--border); border-radius:3px; padding:3px 5px; font-size:12px;
  width:100%; background:#fff;
}
.detail-tbl input[readonly] { background:#f5f5f5; }
.detail-tbl tr.total-row td { background:#222; color:#fff; font-weight:700; }

/* ── Modal ── */
.modal-overlay { position:fixed; inset:0; background:rgba(15,27,41,.56); z-index:200; display:flex; align-items:center; justify-content:center; padding:20px; }
.modal { background:#fff; border-radius:10px; width:100%; max-width:860px; max-height:90vh; display:flex; flex-direction:column; box-shadow:0 24px 72px rgba(0,0,0,.28); border:1px solid rgba(255,255,255,.72); overflow:hidden; }
.modal-hdr { padding:16px 20px; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; background:linear-gradient(180deg,#fff,#f8fbfa); }
.modal-hdr h3 { font-size:16px; color:var(--navy); font-weight:700; }
.modal-body { padding:20px; overflow-y:auto; flex:1; }
.modal-footer { padding:14px 20px; border-top:1px solid var(--border); display:flex; justify-content:flex-end; gap:10px; }
.close-btn { background:none; border:none; font-size:20px; cursor:pointer; color:var(--muted); line-height:1; }

/* ── Provider search popup ── */
.provider-search-tbl { font-size:12px; }
.provider-search-tbl tr:hover td { background:#d0eeee; cursor:pointer; }
.provider-search-tbl tr.status-pending td { background:#fff9ee; }

/* ── Tabs ── */
.tabs { display:flex; gap:0; border-bottom:2px solid var(--border); margin-bottom:16px; }
.tab  { padding:9px 18px; cursor:pointer; font-size:13px; font-weight:600; color:var(--muted); border-bottom:2px solid transparent; margin-bottom:-2px; transition:all .15s; }
.tab.active { color:var(--teal); border-bottom-color:var(--teal); }
.tab:hover  { color:var(--teal); }
.tab-content { display:none; }
.tab-content.active { display:block; }

/* ── Login ── */
#login-page { min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#102f45 0%,#0f766e 100%); }
#login-page.login-hidden { display:none; }
.login-box { background:#fff; padding:40px; border-radius:12px; width:100%; max-width:380px; box-shadow:0 20px 60px rgba(0,0,0,.3); }
.login-box .logo { text-align:center; margin-bottom:24px; }
.login-box .logo h1 { color:var(--navy); font-size:22px; }
.login-box .logo p  { color:var(--muted); font-size:13px; margin-top:4px; }
.login-box .logo .site-env-login {
  display:inline-block;
  background:#e3f7f1;
  border:1px solid #8bd8c4;
  border-radius:999px;
  color:#0f766e;
  font-size:11px;
  font-weight:800;
  letter-spacing:.8px;
  margin-top:10px;
  padding:5px 11px;
}
.login-box .form-group { margin-bottom:14px; }
.login-error { background:#fde8e8; color:var(--danger); padding:8px 12px; border-radius:5px; font-size:13px; margin-bottom:12px; }

/* ── Alerts ── */
.alert { padding:10px 14px; border-radius:5px; margin-bottom:12px; font-size:13px; }
.alert-success { background:#d5f0e8; color:#1a6640; }
.alert-error   { background:#fde8e8; color:var(--danger); }
.alert-info    { background:#ddeeff; color:#1a3080; }

/* ── Loading spinner ── */
.spinner { display:inline-block; width:20px; height:20px; border:2px solid var(--border); border-top-color:var(--teal); border-radius:50%; animation:spin .7s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }

/* ── Export buttons row ── */
.export-row { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }

/* ── Responsive ── */
@media(max-width:768px) {
  #content { padding:12px; }
  .summary-grid { grid-template-columns:1fr; }
  .form-grid { grid-template-columns:1fr; }
}

/* ── Breadcrumb ── */
.breadcrumb { font-size:13px; color:var(--muted); margin-bottom:14px; display:flex; gap:6px; align-items:center; }
.breadcrumb a { color:var(--teal); text-decoration:none; cursor:pointer; }
.breadcrumb a:hover { text-decoration:underline; }

/* ── Batch Edit inputs ── */
.batch-inp {
  width: 100%;
  padding: 3px 6px;
  border: 1.5px solid var(--teal);
  border-radius: 4px;
  font-size: 12px;
  font-family: inherit;
  background: #f0faff;
  box-sizing: border-box;
}
.batch-inp:focus {
  outline: none;
  border-color: var(--navy);
  background: #fff;
}
.batch-inp.num { text-align: right; }
select.batch-inp { padding: 3px 4px; }
#services-admin-tbody.batch-mode td { padding: 3px 6px; }

/* ── Provider profile view ── */
.metric-strip {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:12px;
  margin:0 0 14px;
}
.metric-card {
  background:#fff;
  border:1px solid var(--border);
  border-radius:8px;
  box-shadow:var(--shadow-sm);
  padding:14px 16px;
}
.metric-label { color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; }
.metric-value { color:var(--navy); font-size:24px; font-weight:850; line-height:1.1; margin-top:5px; }
.provider-admin-list,
.provider-picker-list {
  display:flex;
  flex-direction:column;
  gap:12px;
}
.provider-group-card {
  background:#fff;
  border:1px solid var(--border);
  border-radius:8px;
  box-shadow:var(--shadow-sm);
  overflow:hidden;
}
.provider-group-card[open] { box-shadow:var(--shadow); }
.provider-group-summary {
  display:flex;
  align-items:center;
  gap:14px;
  list-style:none;
  padding:15px 16px;
  cursor:pointer;
  background:linear-gradient(180deg,#ffffff 0%,#f8fbfa 100%);
}
.provider-group-summary::-webkit-details-marker { display:none; }
.provider-group-summary::before {
  content:'';
  width:10px;
  height:10px;
  border-right:2px solid var(--teal);
  border-bottom:2px solid var(--teal);
  transform:rotate(-45deg);
  transition:transform .18s;
  flex-shrink:0;
}
.provider-group-card[open] .provider-group-summary::before { transform:rotate(45deg); }
.provider-title-block { min-width:0; flex:1; }
.provider-title {
  color:var(--navy);
  font-size:16px;
  font-weight:850;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  flex-shrink:0;
}
.provider-meta {
  color:var(--muted);
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  font-size:12px;
  margin-top:4px;
}
.provider-service-list {
  border-top:1px solid var(--border);
  display:flex;
  flex-direction:column;
}
.provider-service-row {
  display:grid;
  grid-template-columns:minmax(220px,1.8fr) 82px repeat(4,minmax(92px,.7fr)) 110px;
  gap:10px;
  align-items:center;
  padding:12px 16px;
  border-bottom:1px solid var(--border);
}
.provider-service-row:last-child { border-bottom:none; }
.provider-service-row:hover { background:#f5fbfa; }
.provider-service-main { min-width:0; }
.provider-service-name { color:var(--text); font-weight:750; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.provider-service-id { color:var(--muted); font-size:12px; margin-top:2px; }
.provider-cell-label { color:var(--muted); display:block; font-size:10px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; }
.provider-cell-value { color:var(--text); display:block; font-size:13px; font-weight:700; margin-top:2px; }
.provider-picker-list {
  max-height:460px;
  overflow:auto;
  padding-right:4px;
}
.provider-picker-card {
  background:#fff;
  border:1px solid var(--border);
  border-radius:8px;
  overflow:hidden;
}
.provider-picker-card h4 {
  background:#f8fbfa;
  border-bottom:1px solid var(--border);
  color:var(--navy);
  font-size:15px;
  padding:12px 14px;
}
.provider-picker-option {
  display:grid;
  grid-template-columns:minmax(240px,1.8fr) repeat(5,minmax(82px,.65fr)) 96px;
  gap:10px;
  align-items:center;
  border-bottom:1px solid var(--border);
  padding:11px 14px;
  cursor:pointer;
}
.provider-picker-option:last-child { border-bottom:none; }
.provider-picker-option:hover { background:#eaf8f5; }
.provider-profile-head {
  display:flex;
  align-items:flex-end;
  gap:14px;
  margin-bottom:10px;
}
.provider-name-field { flex:1; }
.provider-profile-actions { padding-bottom:1px; }
.provider-profile-hint {
  background:#eef8f5;
  border:1px solid #cce6df;
  border-radius:8px;
  color:#245f58;
  font-size:13px;
  line-height:1.45;
  margin-bottom:14px;
  padding:11px 13px;
}
.provider-service-editor-wrap {
  border:1px solid var(--border);
  border-radius:8px;
  overflow:auto;
  max-height:56vh;
}
.provider-service-editor { min-width:1060px; }
.provider-service-editor thead tr { background:#17445f; }
.provider-service-editor td { padding:8px; }
.provider-service-editor input,
.provider-service-editor select,
.provider-service-editor textarea {
  width:100%;
  border:1px solid var(--border);
  border-radius:6px;
  color:var(--text);
  font:inherit;
  padding:7px 8px;
}
.provider-service-editor textarea { min-height:34px; resize:vertical; }
.provider-service-editor .service-id-input { min-width:170px; }
.provider-service-editor .loaded-rate {
  background:#f5f7f8;
  color:var(--navy);
  font-weight:800;
}
.row-muted { opacity:.58; }
.empty-state {
  background:#fff;
  border:1px dashed #b9c8d2;
  border-radius:8px;
  color:var(--muted);
  padding:28px;
  text-align:center;
}
.empty-state strong {
  color:var(--navy);
  display:block;
  font-size:16px;
  margin-bottom:6px;
}
.responsive-card-list {
  display:none;
  flex-direction:column;
  gap:12px;
}
.record-card {
  background:#fff;
  border:1px solid var(--border);
  border-radius:8px;
  box-shadow:var(--shadow-sm);
  padding:14px;
}
.record-card-main {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.record-card-title {
  color:var(--navy);
  font-size:16px;
  font-weight:850;
  line-height:1.25;
}
.record-card-subtitle {
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
  margin-top:3px;
}
.record-card-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.record-card-grid div {
  background:var(--surface);
  border:1px solid #e5edf0;
  border-radius:7px;
  padding:9px 10px;
  min-width:0;
}
.record-card-grid span,
.record-card-edit-grid label {
  color:var(--muted);
  display:block;
  font-size:10px;
  font-weight:850;
  letter-spacing:.45px;
  text-transform:uppercase;
}
.record-card-grid strong {
  color:var(--text);
  display:block;
  font-size:13px;
  line-height:1.25;
  margin-top:3px;
  word-break:break-word;
}
.record-card-edit-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-top:12px;
}
.record-card-edit-grid .notes-field { grid-column:1/-1; }
.record-card-edit-grid input,
.record-card-edit-grid select {
  border:1px solid var(--border);
  border-radius:6px;
  color:var(--text);
  font:inherit;
  margin-top:4px;
  padding:8px 9px;
  width:100%;
}
.record-card-actions {
  display:flex;
  gap:8px;
  justify-content:flex-end;
  margin-top:12px;
}

@media(max-width:980px) {
  #navbar {
    align-items:center;
    flex-wrap:nowrap;
    min-height:56px;
    padding:8px 12px;
  }
  #navbar .brand { flex:0 0 auto; min-width:178px; }
  #nav-admin-btns { gap:8px; flex:0 0 auto; }
  #nav-user { flex:0 0 auto; }
  .site-env-pill { flex:0 0 auto; }
  #content { padding:18px 12px 28px; }
  .provider-service-row,
  .provider-picker-option {
    grid-template-columns:1fr 1fr;
  }
  .provider-service-row .btn,
  .provider-picker-option .btn { grid-column:1/-1; }
  .provider-profile-head { align-items:stretch; flex-direction:column; }
}

@media(max-width:760px) {
  .budget-table-card,
  .service-items-card .tbl-wrap { display:none; }
  #budgets-card-list,
  #items-card-list,
  #zoho-export-card-list { display:flex; }
  .provider-profile-modal { max-width:calc(100vw - 24px) !important; }
  .provider-profile-modal .modal-body { padding:16px; }
  .provider-profile-modal .modal-footer {
    align-items:stretch;
    flex-direction:column-reverse;
  }
  .provider-profile-modal .modal-footer .btn { width:100%; }
  .provider-service-editor-wrap {
    border:0;
    border-radius:0;
    max-height:none;
    overflow:visible;
  }
  .provider-service-editor,
  .provider-service-editor tbody,
  .provider-service-editor tr,
  .provider-service-editor td {
    display:block;
    min-width:0;
    width:100%;
  }
  .provider-service-editor thead { display:none; }
  .provider-service-editor tr {
    background:#fff;
    border:1px solid var(--border);
    border-radius:8px;
    box-shadow:var(--shadow-sm);
    margin-bottom:12px;
    padding:12px;
  }
  .provider-service-editor td {
    border:0;
    margin-bottom:10px;
    padding:0;
  }
  .provider-service-editor td::before {
    content:attr(data-label);
    color:var(--muted);
    display:block;
    font-size:11px;
    font-weight:800;
    letter-spacing:.5px;
    margin-bottom:5px;
    text-transform:uppercase;
  }
  .provider-service-editor .provider-service-cell::before,
  .provider-service-editor .provider-row-actions::before { display:none; }
  .provider-service-editor .provider-row-actions {
    display:flex;
    justify-content:flex-end;
    margin-bottom:0;
    padding-top:2px;
  }
  .provider-service-editor .service-id-input { min-width:0; }
  .page-hdr { align-items:stretch; flex-direction:column; }
  #page-clients .page-hdr > div:last-child {
    display:grid !important;
    grid-template-columns:1fr;
    flex:0 0 auto;
    width:100%;
  }
  #page-clients .search-bar,
  #page-clients .client-filter-bar {
    display:grid;
    grid-template-columns:1fr;
  }
  .page-actions,
  .search-bar,
  .client-filter-bar { width:100%; }
  .control-input,
  .search-bar input,
  .search-bar select,
  .client-filter-bar input { min-width:0; width:100%; }
  .record-card-grid { grid-template-columns:1fr; }
  .record-card-edit-grid { grid-template-columns:1fr 1fr; }
}