/*
 * Administration presentation layer.
 *
 * This file is deliberately scoped with :has() to administration forms. It
 * improves the existing markup without changing table structure, form names,
 * actions, or JavaScript behaviour.
 */
:where(.app-content-wrap:has(.app-main form[action*="admin_"]) .app-content-header,
       .app-content-wrap:has(.app-main form[name="user_details"]) .app-content-header,
       .app-main:has(form[action*="admin_"]) > .page-header,
       .app-main:has(form[name="user_details"]) > .page-header) {
  margin-bottom: 16px;
  padding: 14px 18px;
  border: 1px solid #d8e0dc;
  border-radius: 6px;
  background: #fff;
  box-shadow: none;
}

:where(.app-content-wrap:has(.app-main form[action*="admin_"]) .app-content-header h1,
       .app-content-wrap:has(.app-main form[name="user_details"]) .app-content-header h1,
       .app-main:has(form[action*="admin_"]) > .page-header h1,
       .app-main:has(form[name="user_details"]) > .page-header h1) {
  color: #005b3a;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.25;
}

:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) {
  color: #17352b;
  font-family: "Segoe UI", Arial, sans-serif;
}

:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) form {
  box-sizing: border-box;
  padding: 18px;
  border: 1px solid #d8e0dc;
  border-radius: 6px;
  background: #fff;
  box-shadow: none;
}

:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) .formsectionheader {
  margin: 16px 0 8px;
  padding: 9px 12px;
  border: 1px solid #d8e0dc;
  border-radius: 6px;
  color: #17352b;
  background: #f4f8f6;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.3;
}

:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) .formlabel,
:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) .formlabelrequired {
  color: #17352b;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 13px;
  font-weight: 500;
  vertical-align: middle;
}

:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) select,
:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) textarea {
  box-sizing: border-box;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid #c7d6cf;
  border-radius: 4px;
  color: #17352b;
  background: #fff;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
}

:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):focus,
:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) select:focus,
:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) textarea:focus {
  border-color: #087b4c;
  outline: 2px solid #cbe8da;
  outline-offset: 1px;
}

:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) input[type="date"] {
  appearance: auto;
  color-scheme: light;
  cursor: pointer;
}

:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) input[type="date"]::-webkit-calendar-picker-indicator {
  width: 16px;
  height: 16px;
  margin-right: 0;
  opacity: 1;
  cursor: pointer;
}

.admin-user-history__controls input[type="date"] {
  appearance: auto;
  color-scheme: light;
  cursor: pointer;
}

.admin-user-history__controls input[type="date"]::-webkit-calendar-picker-indicator {
  width: 16px;
  height: 16px;
  margin-right: 0;
  opacity: 1;
  cursor: pointer;
}

:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) .formbutton,
:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) button:not(.app-sidebar__menu-toggle) {
  min-height: 40px;
  padding: 8px 18px;
  border: 1px solid #005b3a;
  border-radius: 4px;
  color: #fff;
  background: #005b3a;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .3px;
  cursor: pointer;
  transition: background-color .15s ease, box-shadow .15s ease;
}

:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) .formbutton:hover,
:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) .formbutton:focus-visible,
:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) button:not(.app-sidebar__menu-toggle):hover,
:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) button:not(.app-sidebar__menu-toggle):focus-visible {
  background: #087b4c;
  box-shadow: 0 2px 6px rgba(0, 91, 58, .18);
}

:where(.app-main:has(form[action*="admin_"]),
       .app-main:has(form[name="user_details"])) .admin-user-list__item {
  min-height: 30px;
  color: #17352b;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 14px;
  font-weight: 500;
}

@media (max-width: 1024px) {
  :where(.app-content-wrap:has(.app-main form[action*="admin_"]) .app-content-header h1,
         .app-content-wrap:has(.app-main form[name="user_details"]) .app-content-header h1,
         .app-main:has(form[action*="admin_"]) > .page-header h1,
         .app-main:has(form[name="user_details"]) > .page-header h1) {
    font-size: 20px;
  }
}

@media (max-width: 600px) {
  :where(.app-content-wrap:has(.app-main form[action*="admin_"]) .app-content-header h1,
         .app-content-wrap:has(.app-main form[name="user_details"]) .app-content-header h1,
         .app-main:has(form[action*="admin_"]) > .page-header h1,
         .app-main:has(form[name="user_details"]) > .page-header h1) {
    font-size: 18px;
  }
}

/* Named component hooks for future administration templates. */
.dnet-admin-title { font-size: 24px; font-weight: 600; }
.dnet-admin-section { font-size: 18px; font-weight: 600; }
.dnet-admin-label { font-size: 13px; font-weight: 500; }
.dnet-admin-value { font-size: 14px; font-weight: 400; }
.dnet-admin-button { min-height: 40px; border-radius: 4px; font-size: 14px; font-weight: 600; letter-spacing: .3px; }

/* Bank statement status navigation and its dynamically loaded listing. */
.bank-statement-screen #tabs { box-sizing: border-box; width: 100%; max-width: 100%; min-width: 0; margin: 16px 0 10px; overflow: hidden; }
.bank-statement-screen #tabs > ul { display: flex; flex-wrap: nowrap; gap: 4px; max-width: 100%; margin: 0; padding: 0; overflow-x: auto; overflow-y: hidden; list-style: none; border-bottom: 1px solid #c8d9d0; scrollbar-width: thin; }
.bank-statement-screen #tabs > ul > li { flex: 0 0 auto; margin: 0; }
.bank-statement-screen #tabs > ul > li.bank-statement-tab--cashup:not(:last-child) { margin-left: auto; }
.bank-statement-screen #tabs > ul > li > a { display: block; padding: 8px 14px; white-space: nowrap; border: 1px solid #c8d9d0; border-bottom: 0; border-radius: 5px 5px 0 0; color: #005b3a; background: #f3f8f5; font-weight: 600; text-decoration: none; }
.bank-statement-screen #tabs > ul > li > a:hover, .bank-statement-screen #tabs > ul > li > a:focus-visible { background: #e2f0e8; }
.bank-statement-screen #bank-statement-results { min-height: 80px; min-width: 0; }
.bank-statement-screen .bank-statement-pagination { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 6px 0; font-size: 12px; }
.bank-statement-screen .bank-statement-pagination a, .bank-statement-screen .bank-statement-pagination span { margin: 0; }
.bank-statement-screen .bank-statement-pagination a { color: #005b3a; font-weight: 600; }
.bank-statement-screen .bank-statement-pagination span[aria-disabled="true"] { color: #8a9992; }
.bank-statement-screen .bank-statement-grid-wrap { max-height: calc(100vh - 350px); min-height: 120px; overflow: auto; border: 1px solid #d5e2dc; }
.bank-statement-screen table.bank-statement-grid { width: 100%; min-width: 0; table-layout: fixed; border-collapse: separate; border-spacing: 0; font-size: 8pt; }
.bank-statement-screen .bank-statement-grid th { position: sticky; top: 0; z-index: 2; padding: 7px 6px; border-bottom: 1px solid #a9c3b7; background: #edf6f1; color: #21483a; white-space: nowrap; }
.bank-statement-screen .bank-statement-grid td { box-sizing: border-box; padding: 6px; overflow: hidden; border-bottom: 1px solid #e2ebe6; text-overflow: ellipsis; vertical-align: middle; white-space: nowrap; }
.bank-statement-screen .bank-statement-grid tbody tr:nth-child(even) { background: #f7faf8; }
.bank-statement-screen .bank-statement-grid tbody tr:hover { background: #e8f3ed; }
.bank-statement-screen .bank-statement-grid__account { width: 11%; }
.bank-statement-screen .bank-statement-grid__date { width: 9%; text-align: center; }
.bank-statement-screen .bank-statement-grid__description { width: auto; text-align: left; }
.bank-statement-screen .bank-statement-grid__amount { width: 9%; text-align: right; }
.bank-statement-screen .bank-statement-grid__audit { width: 5%; text-align: center; }
.bank-statement-screen .bank-statement-grid__actions { width: 15%; text-align: left; }
.bank-statement-screen .bank-statement-grid__actions select { box-sizing: border-box; width: 100%; min-width: 0; }
.bank-statement-screen .bank-statement-grid button:focus-visible, .bank-statement-screen .bank-statement-grid select:focus-visible, .bank-statement-screen .bank-statement-pagination a:focus-visible { outline: 2px solid #087248; outline-offset: 1px; }
@media (max-width: 1100px) { .bank-statement-screen .bank-statement-grid { font-size: 7.5pt; } .bank-statement-screen .bank-statement-grid th, .bank-statement-screen .bank-statement-grid td { padding-left: 4px; padding-right: 4px; } .bank-statement-screen .bank-statement-grid__account { width: 10%; } .bank-statement-screen .bank-statement-grid__date { width: 10%; } .bank-statement-screen .bank-statement-grid__amount { width: 9%; } .bank-statement-screen .bank-statement-grid__audit { width: 4%; } .bank-statement-screen .bank-statement-grid__actions { width: 17%; } }

/* Compact Statement Run form. */
.statement-run-form { width: 100%; color: #17352b; font-size: 13px; }
.statement-run-heading { margin: 0 0 12px; padding: 9px 12px; border-bottom: 1px solid #c8d9d0; color: #17352b; font-size: 16px; font-weight: 600; }
.statement-run-layout { display: grid; grid-template-columns: minmax(420px, 1fr) minmax(260px, 330px); gap: 28px; align-items: start; padding: 0 12px 12px; }
.statement-run-fields { display: grid; gap: 13px; max-width: 640px; padding-top: 3px; }
.statement-run-field { display: grid; grid-template-columns: 180px minmax(180px, 250px); gap: 12px; align-items: center; }
.statement-run-field > label { color: #4a5c54; text-align: right; }
.statement-run-control { min-width: 0; }
.statement-run-control .formcontrol { box-sizing: border-box; width: 250px; max-width: 100%; min-height: 32px; }
.statement-run-date { width: 200px !important; }
.statement-run-static-value { display: inline-block; padding: 7px 0; color: #17352b; }
.statement-run-checkbox-field { align-items: center; }
.statement-run-checkbox-field input { width: 16px; height: 16px; margin: 0; }
.statement-run-branch-panel { min-width: 0; margin: 0; padding: 0 1px 2px; border: 1px solid #c8d9d0; }
.statement-run-branch-panel legend { width: 100%; box-sizing: border-box; margin: 0; padding: 3px 8px; color: #fff; background: #087f4f; font-size: 12px; font-weight: 600; text-align: center; }
.statement-run-branch-actions { display: flex; justify-content: center; gap: 14px; padding: 1px 6px; line-height: 18px; }
.statement-run-link { border: 0; padding: 0; color: #0047b3; background: transparent; cursor: pointer; font-size: 12px; text-decoration: underline; }
.statement-run-link:focus-visible, .statement-run-branch-list:focus-visible { outline: 2px solid #087248; outline-offset: 1px; }
.statement-run-branch-list, .branch-list { max-height: 300px; overflow-y: auto; overflow-x: hidden; background: #fff; }
.statement-run-branch-option, .statement-run-region-option, .branch-item { display: flex; align-items: center; justify-content: space-between; gap: 8px; box-sizing: border-box; min-height: 24px; height: 24px; margin: 0; padding: 2px 8px; color: #17352b; cursor: pointer; line-height: 20px; }
.statement-run-branch-option:nth-child(even), .statement-run-region-option:nth-child(even), .branch-item:nth-child(even) { background: #f4f8f5; }
.statement-run-branch-option:hover, .statement-run-region-option:hover, .branch-item:hover { background: #e8f2ec; }
.statement-run-branch-option .branch-label, .statement-run-region-option .branch-label, .branch-item .branch-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; line-height: 20px; }
.statement-run-branch-option input, .statement-run-region-option input, .branch-item .branch-checkbox { flex: 0 0 auto; width: 16px; height: 16px; margin: 0; }
.statement-run-empty-branches { display: block; padding: 4px 8px; color: #667870; }
.statement-run-actions { margin: 0 12px 12px; padding-top: 8px; border-top: 1px solid #4c554f; text-align: center; }
.statement-run-results { min-height: 38px; margin: 0 12px 12px; padding: 12px; border: 1px solid #d7dfda; border-radius: 6px; background: #fbfcfb; text-align: center; }
@media (max-width: 760px) { .statement-run-layout { grid-template-columns: 1fr; gap: 16px; } .statement-run-fields { max-width: none; } .statement-run-branch-panel { max-width: 100%; } }
@media (max-width: 520px) { .statement-run-field { grid-template-columns: 1fr; gap: 5px; } .statement-run-field > label { text-align: left; } .statement-run-control .formcontrol, .statement-run-date { width: 100% !important; } }

/* Customer Centre workspace. */
.customer-center { width: 100%; color: #17352b; font-size: 13px; }
.customer-center-title { margin: 0 0 14px; padding: 8px 12px; border: 1px solid #b9d7c7; border-radius: 4px; background: #e5f1e9; color: #17352b; font-size: 16px; font-weight: 600; text-align: center; }
.customer-center-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(300px, .9fr); gap: 10px; align-items: start; }
.customer-center-side { display: grid; gap: 10px; min-width: 0; }
.customer-center-card { min-width: 0; overflow: hidden; border: 1px solid #a9cdb9; border-radius: 5px; background: #fff; }
.customer-center-card__header { padding: 4px 8px; color: #fff; background: #087f4f; font-size: 12px; font-weight: 600; text-align: center; }
.customer-center-card__body { padding: 7px 9px; }
.customer-center-card__body h3 { margin: 0; padding: 5px 0; border-bottom: 1px solid #cbd9d2; color: #17352b; font-size: 14px; font-weight: 600; }
.customer-center-details { width: 100%; border-collapse: collapse; }
.customer-center-details th, .customer-center-details td { padding: 4px 7px; border-bottom: 1px solid #edf1ef; vertical-align: top; line-height: 1.3; }
.customer-center-details th { width: 150px; color: #4a5c54; font-weight: 500; text-align: right; }
.customer-center-details td { color: #17352b; }
.customer-center-contact { margin-bottom: 5px; }
.customer-center-card__footer { padding: 6px 9px; border-top: 1px solid #d7e3dc; background: #f1f7f3; text-align: center; }
.customer-center-card__footer a, .customer-center-card__footer button { color: #005b3a; font-weight: 600; }
.customer-center-ageing-form { display: grid; grid-template-columns: auto minmax(130px, 1fr) auto; gap: 7px; align-items: center; margin-bottom: 8px; }
.customer-center-ageing-form label { color: #4a5c54; text-align: right; }
.customer-center-ageing-form select { min-width: 0; width: 100%; min-height: 32px; }
.customer-center-ageing-form button, .customer-center-notes__form button { min-height: 32px; padding: 5px 10px; }
.customer-center-ageing-table { max-height: 230px; overflow: auto; }
.customer-center-ageing-table table { width: 100%; border-collapse: collapse; }
.customer-center-ageing-table th, .customer-center-ageing-table td { padding: 5px 7px; border: 1px solid #cbd5cf; }
.customer-center-ageing-table tr:nth-child(odd) { background: #e8f1f9; }
.customer-center-ageing-table th { width: 65%; font-weight: 500; }
.customer-center-ageing-table td { text-align: right; }
.customer-center-notes__subject { padding: 7px 9px; border-bottom: 1px solid #d7e3dc; background: #f4f6df; font-weight: 600; }
.customer-center-notes__list { max-height: 285px; overflow: auto; }
.customer-center-note { display: grid; gap: 2px; padding: 7px 9px; border-bottom: 1px solid #cbd5cf; background: #e8f1f9; }
.customer-center-note:nth-child(even) { background: #fff; }
.customer-center-note small { color: #4a5c54; }
.customer-center-note span { white-space: pre-wrap; }
.customer-center-notes__list > p { margin: 0; padding: 12px; color: #667870; }
.customer-center-notes__form { display: grid; grid-template-columns: 1fr auto; gap: 7px; align-items: start; padding: 8px; border-top: 1px solid #d7e3dc; }
.customer-center-notes__form textarea { box-sizing: border-box; width: 100%; min-height: 76px; resize: vertical; }
.customer-center-transactions { margin-top: 18px; }
.customer-center-transactions h2 { margin: 0 0 8px; padding: 7px 10px; border-bottom: 1px solid #cbd9d2; color: #17352b; font-size: 15px; font-weight: 600; }
@media (max-width: 900px) { .customer-center-grid { grid-template-columns: 1fr; } .customer-center-side { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .customer-center-side { grid-template-columns: 1fr; } .customer-center-details th { width: 38%; } .customer-center-notes__form { grid-template-columns: 1fr; } }

/* Compact two-pane Receipts workspace. */
.receipts-screen { display: grid; grid-template-columns: 222px minmax(0, 1fr); gap: 18px; align-items: start; min-width: 0; color: #17352b; }
.receipts-list-pane { min-width: 0; overflow: hidden; border: 1px solid #a9cdb9; border-radius: 5px; background: #fff; }
.receipts-list-pane h2 { margin: 0; padding: 4px 8px; color: #fff; background: #087f4f; font-size: 12px; font-weight: 600; text-align: center; }
.receipts-list { max-height: 485px; overflow-y: auto; }
.receipts-list a, .receipts-list-empty { display: block; padding: 4px 8px; border-bottom: 1px solid #e2ebe6; color: #0047b3; font-size: 12px; line-height: 18px; text-decoration: none; }
.receipts-list a:hover, .receipts-list a:focus-visible { background: #edf5f0; text-decoration: underline; }
.receipts-list a.is-selected { border-left: 3px solid #087f4f; padding-left: 5px; background: #e1f0e8; font-weight: 600; }
.receipts-list-empty { color: #667870; }
.receipts-main { min-width: 0; }
.receipts-form { min-width: 0; }
.receipts-section { margin: 0 0 12px; padding: 0 10px 9px; border-bottom: 1px solid #cbd9d2; }
.receipts-section h2 { margin: 0 0 7px; padding: 0 0 5px; border-bottom: 1px solid #cbd9d2; color: #17352b; font-size: 14px; font-weight: 600; }
.receipts-details-grid { display: grid; grid-template-columns: minmax(180px, 38%) minmax(0, 1fr); gap: 5px 12px; margin: 0; font-size: 13px; }
.receipts-details-grid dt, .receipts-details-grid > label, .receipts-details-grid > span { color: #4a5c54; font-weight: 500; text-align: right; }
.receipts-details-grid dd { min-width: 0; margin: 0; color: #17352b; }
.receipts-entry-grid { align-items: center; }
.receipts-entry-grid input[type="text"] { box-sizing: border-box; width: 210px; max-width: 100%; min-height: 30px; }
.receipts-payment-method { font-weight: 400; }
.receipts-details-grid input[type="radio"], .receipts-details-grid input[type="checkbox"] { width: 16px; height: 16px; vertical-align: middle; }
.receipts-details-grid a { color: #005b3a; font-weight: 600; }
.receipts-allocation { padding-bottom: 0; border-bottom: 0; }
.receipts-unallocated { margin: 0 0 8px; color: #4a5c54; font-size: 13px; text-align: center; }
.receipts-table-wrap { overflow-x: auto; }
.receipts-invoice-table { width: 100%; min-width: 650px; border-collapse: collapse; font-size: 12px; }
.receipts-invoice-table th { padding: 5px 7px; color: #17352b; background: #d8eadc; font-weight: 600; text-align: left; white-space: nowrap; }
.receipts-invoice-table td { padding: 3px 7px; border-bottom: 1px solid #fff; vertical-align: middle; }
.receipts-invoice-table tr.listing_color1 { background: #e5f2e8; }
.receipts-invoice-table tr.listing_color2 { background: #f4f8f5; }
.receipts-invoice-table tr:hover { background: #d8eadc; }
.receipts-invoice-table td:nth-child(6), .receipts-invoice-table td:nth-child(7) { text-align: center; }
.receipts-invoice-table input[type="checkbox"] { width: 16px; height: 16px; vertical-align: middle; }
.receipts-invoice-table input[type="text"] { box-sizing: border-box; width: 100px; min-height: 25px; }
.receipts-invoice-table a { color: #0047b3; font-weight: 600; }
.receipts-submit { margin-top: 10px; padding: 5px; border: 1px solid #a9cdb9; border-radius: 3px; background: #d8eadc; text-align: center; }
.receipts-submit .formbutton { min-width: 80px; }
.journals-new-link { display: block; padding: 6px 8px; border-top: 1px solid #d7e3dc; color: #005b3a; background: #e1f0e8; font-size: 12px; text-align: center; text-decoration: none; }
.journals-new-link:hover, .journals-new-link:focus-visible { background: #d8eadc; text-decoration: underline; }
.journals-link-button { margin: 0; padding: 0; border: 0; color: #0047b3; background: transparent; cursor: pointer; font: inherit; text-decoration: underline; }
.journals-link-button:focus-visible, .journals-document-button:focus-visible { outline: 2px solid #087248; outline-offset: 1px; }
.journals-document-button { padding: 0; border: 0; color: #0047b3; background: transparent; cursor: pointer; font: inherit; text-decoration: underline; }
.journals-screen .receipts-invoice-table input[type="text"] { width: 80px; }
.journals-screen .receipts-details-grid select { box-sizing: border-box; width: 250px; max-width: 100%; min-height: 30px; }
@media (max-width: 760px) { .receipts-screen { grid-template-columns: 1fr; } .receipts-list { max-height: 220px; } .receipts-details-grid { grid-template-columns: minmax(125px, 35%) minmax(0, 1fr); } }