html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
  background: #f4f7fb;
}

/* Visual Studio's browser-refresh overlay can remain empty after navigation. */
#dotnet-compile-error:empty { display: none !important; }

.nav-logout { margin-inline-start: 3.5rem; padding-inline-start: 1.25rem; border-inline-start: 1px solid #dbe5ec; }
.navbar-profile { display: inline-grid; place-items: center; width: 42px; height: 42px; margin-inline-end: 1rem; border: 2px solid #b7d5e5; border-radius: 50%; background: #eef7fb; color: #17536e; text-decoration: none; font-size: 1.4rem; overflow: hidden; }
.navbar-profile img { width: 100%; height: 100%; object-fit: cover; }
.navbar-profile:focus-visible { outline: 3px solid #258cfb; outline-offset: 2px; }
.navbar-notifications-toggle { position: relative; display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid #b7d5e5; border-radius: .7rem; background: #eef7fb; color: #17536e; font-size: 1.3rem; }
.navbar-notifications-toggle:hover, .navbar-notifications-toggle:focus-visible { background: #dceef7; outline: 2px solid #258cfb; outline-offset: 2px; }
.navbar-notifications-count { position: absolute; top: -.45rem; right: -.45rem; min-width: 1.35rem; height: 1.35rem; padding: 0 .25rem; border-radius: 99px; background: #c52c3a; color: #fff; font-size: .75rem; font-weight: 700; line-height: 1.35rem; }
.navbar-notifications-menu { width: min(360px, calc(100vw - 2rem)); max-height: min(70vh, 520px); overflow-y: auto; box-shadow: 0 12px 28px rgba(22, 58, 95, .16); }
.navbar-notifications-item { padding: .7rem 1rem; white-space: normal; border-bottom: 1px solid #edf1f4; }
.navbar-notifications-item:hover, .navbar-notifications-item:focus { background: #eef7fb; }
tr:target { outline: 2px solid #d39e27; outline-offset: -2px; background: #fff8df; scroll-margin-top: 1rem; }
.app-shell { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 1.5rem; align-items: start; transition: grid-template-columns .2s ease; }
.app-shell.sidebar-collapsed { grid-template-columns: minmax(0, 1fr) 58px; }
.app-content { min-width: 0; }
.permission-sidebar { grid-column: 2; grid-row: 1; position: sticky; top: 1rem; max-height: calc(100vh - 2rem); overflow-y: auto; padding: .85rem; background: #fff; border: 1px solid #dbe5ec; border-radius: .9rem; box-shadow: 0 6px 22px rgba(22, 58, 95, .07); }
.permission-sidebar-head { display: flex; justify-content: space-between; align-items: center; gap: .5rem; padding: .1rem .3rem .7rem; }
.permission-sidebar-title { font-size: 1.1rem; font-weight: 700; margin: 0; color: #123c55; white-space: nowrap; }
.permission-sidebar-toggle { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border: 1px solid #cbdce6; border-radius: .5rem; background: #f4f9fc; color: #19556f; }
.permission-sidebar-toggle:hover, .permission-sidebar-toggle:focus { background: #dceef7; }
.sidebar-custody { display: grid; gap: .1rem; margin: .25rem 0 .8rem; padding: .85rem 1rem; border-radius: .7rem; color: #fff; background: #176b87; text-decoration: none; }
.sidebar-custody:hover { color: #fff; background: #125a74; }
.sidebar-custody span { font-size: .8rem; }
.sidebar-custody strong { font-size: 1.5rem; line-height: 1.3; }
.sidebar-custody small { opacity: .9; }
.permission-sidebar-nav { display: grid; gap: .4rem; }
.permission-sidebar-group { border: 1px solid #e3ebf1; border-radius: .65rem; overflow: hidden; background: #fbfdff; }
.permission-sidebar-group summary { display: flex; align-items: center; gap: .55rem; padding: .7rem .75rem; font-weight: 700; color: #174b68; background: #eff6fa; cursor: pointer; list-style: none; }
.permission-sidebar-group summary::-webkit-details-marker { display: none; }
.permission-sidebar-group summary:hover { background: #e2f0f7; }
.sidebar-icon { display: inline-grid; place-items: center; flex: none; width: 1.5rem; font-size: 1.2rem; line-height: 1; }
.sidebar-label { white-space: nowrap; }
.sidebar-chevron { margin-inline-start: auto; transition: transform .15s ease; }
.permission-sidebar-group:not([open]) .sidebar-chevron { transform: rotate(90deg); }
.permission-sidebar-items { padding: .25rem .3rem .35rem; }
.permission-sidebar-link { display: block; padding: .52rem .65rem; color: #254e62; text-decoration: none; border-radius: .4rem; border-inline-start: 3px solid transparent; }
.permission-sidebar-link:hover, .permission-sidebar-link:focus, .permission-sidebar-link.is-active { background: #e8f3fa; color: #0c5779; border-inline-start-color: #1683a6; }
.sidebar-home { background: #f1f7fb; font-weight: 700; }
.sidebar-home { display: flex; align-items: center; gap: .5rem; }
.sidebar-home .sidebar-icon { font-size: 1.5rem; }
.sidebar-collapsed .permission-sidebar { padding: .65rem; overflow: hidden; }
.sidebar-collapsed .permission-sidebar-head { padding: 0; justify-content: center; }
.sidebar-collapsed .permission-sidebar-title, .sidebar-collapsed .sidebar-custody, .sidebar-collapsed .sidebar-label, .sidebar-collapsed .sidebar-chevron, .sidebar-collapsed .permission-sidebar-items { display: none; }
.sidebar-collapsed .permission-sidebar-nav { margin-top: .7rem; }
.sidebar-collapsed .permission-sidebar-group summary, .sidebar-collapsed .sidebar-home { justify-content: center; padding: .65rem 0; }
.sidebar-collapsed .permission-sidebar-group { overflow: visible; }
.admin-overview-placeholder { display: grid; place-content: center; text-align: center; min-height: 280px; padding: 2rem; border: 2px dashed #d5e2ea; border-radius: 1rem; background: #fff; color: #657080; }
.admin-overview-placeholder h2 { color: #21465d; font-size: 1.25rem; }
.admin-overview-icon { font-size: 2.5rem; color: #176b87; }
@media (max-width: 767px) { .app-shell, .app-shell.sidebar-collapsed { display: flex; flex-direction: column; gap: .75rem; } .permission-sidebar { position: static; width: 100%; max-height: none; } .app-content { width: 100%; } .sidebar-collapsed .permission-sidebar { width: 58px; } }
@media (max-width: 575px) {
  .nav-logout { margin: .75rem 0 0; padding: .75rem 0 0; border-inline-start: 0; border-top: 1px solid #dbe5ec; }
}

.auth-page {
  display: grid;
  place-items: center;
  min-height: calc(100vh - 185px);
  padding: 2rem 0;
}

.auth-card {
  width: min(100%, 440px);
  padding: 2.5rem;
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 12px 32px rgba(22, 58, 95, 0.12);
}

.auth-heading { margin-bottom: 2rem; }
.auth-heading h1 { font-size: 1.75rem; margin-bottom: .5rem; }
.auth-heading p:not(.auth-kicker) { color: #657080; margin-bottom: 0; }
.auth-kicker { color: #176b87; font-size: .85rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.auth-link, .auth-back { color: #176b87; text-decoration: none; }
.auth-back { display: block; margin-top: 1.25rem; text-align: center; }

.dashboard-header {
  margin: 2.5rem 0 2rem;
}

.dashboard-header h1 { font-size: clamp(1.75rem, 3vw, 2.5rem); }
.dashboard-header p:not(.auth-kicker) { color: #657080; }

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1.25rem;
  margin-bottom: 3rem;
}

.dashboard-card {
  display: block;
  padding: 1.5rem;
  color: inherit;
  background: #fff;
  border: 1px solid #e0e6ed;
  border-radius: .9rem;
  box-shadow: 0 4px 14px rgba(22, 58, 95, .06);
  text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease;
}

.dashboard-card:hover {
  color: inherit;
  box-shadow: 0 10px 24px rgba(22, 58, 95, .12);
  transform: translateY(-3px);
}

.dashboard-card h2 { font-size: 1.2rem; margin: .75rem 0 .4rem; }
.dashboard-card p { color: #657080; margin: 0; }
.dashboard-icon { font-size: 1.75rem; }

.reception-dashboard {
  max-width: 1320px;
  margin: 1.25rem auto 3rem;
}

.reception-heading {
  text-align: right;
  margin-bottom: 1rem;
}

.reception-heading h1 { font-size: clamp(1.75rem, 3vw, 2.5rem); }
.reception-heading p:not(.auth-kicker) { color: #657080; }
.custody-banner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; padding: 1.25rem 1.5rem; color: #fff; background: #176b87; border-radius: .9rem; text-decoration: none; }
.custody-banner:hover { color: #fff; background: #145a72; }
.custody-banner strong { font-size: 1.6rem; }
.custody-page { max-width: 1080px; margin: 2rem auto 3rem; }
.custody-totals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.custody-totals > div { padding: 1.25rem; background: #fff; border: 1px solid #dbe5ec; border-radius: .8rem; }
.custody-totals span, .custody-totals strong { display: block; }
.custody-totals span { color: #657080; }
.custody-totals strong { margin-top: .4rem; font-size: 1.5rem; }
.custody-totals .custody-balance { color: #fff; background: #176b87; }
.custody-totals .custody-balance span { color: #e4f7ff; }
@media (max-width: 700px) {
  .custody-banner { align-items: flex-start; flex-direction: column; }
  .custody-totals { grid-template-columns: 1fr; }
}

.reception-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .75rem;
}

.reception-card {
  display: flex;
  align-items: center;
  gap: .65rem;
  min-width: 0;
  min-height: 4.25rem;
  padding: .65rem .85rem;
  color: #17324d;
  font-family: Tahoma, Arial, sans-serif;
  font-size: clamp(.88rem, 1.2vw, 1.05rem);
  font-weight: 700;
  text-align: right;
  background: #fff;
  border: 1px solid #dbe5ec;
  border-radius: .75rem;
  box-shadow: 0 4px 14px rgba(22, 58, 95, .06);
  cursor: pointer;
  text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.reception-card:hover {
  border-color: #176b87;
  box-shadow: 0 10px 24px rgba(22, 58, 95, .12);
  transform: translateY(-3px);
}

.reception-card:visited { color: #17324d; }

.reception-icon {
  display: inline-grid;
  place-items: center;
  width: 2.35rem;
  height: 2.35rem;
  flex: 0 0 2.35rem;
  font-size: 1.2rem;
  background: #e6f4f8;
  border-radius: .7rem;
}
@media (max-width: 900px) {
  .reception-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.arrivals-section { margin-top: 1.4rem; }
.arrivals-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: .55rem; }
.arrivals-heading h2 { font-size: 1.35rem; margin: 0; }
.arrivals-heading span { color: #657080; font-size: .9rem; }
.arrivals-empty { padding: 1.25rem; color: #657080; background: #fff; border: 1px dashed #cbd8e1; border-radius: .75rem; }
.arrival-legend { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: .8rem; }
.arrival-legend-item { padding: .2rem .55rem; border-radius: 999px; font-size: .75rem; font-weight: 700; }
.dentist-waiting-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: .75rem; align-items: start; }
.dentist-waiting-group { min-width: 0; overflow: hidden; background: #fff; border: 1px solid #dbe5ec; border-radius: .75rem; box-shadow: 0 3px 10px rgba(22, 58, 95, .05); }
.dentist-waiting-group h3 { display: flex; justify-content: space-between; gap: .5rem; align-items: center; margin: 0; padding: .65rem .8rem; background: #e6f4f8; color: #14566e; font-size: .98rem; }
.dentist-waiting-group h3 span { color: #526775; font-size: .72rem; font-weight: 500; white-space: nowrap; }
.arrivals-list { display: grid; gap: .3rem; padding: .45rem; max-height: 58vh; overflow-y: auto; }
.arrival-item { display: flex; align-items: center; justify-content: space-between; gap: .4rem; min-width: 0; padding: .48rem .6rem; color: #17324d; border: 1px solid transparent; border-radius: .45rem; text-decoration: none; }
.arrival-item:hover, .arrival-item:focus-visible { color: #17324d; border-color: #176b87; outline: 0; }
.arrival-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .88rem; font-weight: 700; }
.arrival-meta { display: flex; align-items: center; gap: .4rem; flex-shrink: 0; }
.arrival-status { font-size: .7rem; font-weight: 700; white-space: nowrap; }
.arrival-details { color: #657080; font-size: .7rem; white-space: nowrap; }
.arrival-status-reception { background: #e8f3ff; color: #13559a; }
.arrival-status-room { background: #fff0d8; color: #80500a; }
.arrival-status-finished { background: #edf0f2; color: #53616c; }
@media (max-width: 480px) { .arrival-details { display: none; } }
.form-page { display: grid; place-items: center; min-height: calc(100vh - 185px); padding: 2rem 0; }
.client-file dl { display: grid; grid-template-columns: auto 1fr; gap: .75rem 1.25rem; margin: 1.5rem 0; }
.client-file dt { color: #657080; font-weight: 500; }
.client-file dd { margin: 0; font-weight: 700; }
.client-search { position: relative; }
.client-results { position: absolute; z-index: 10; width: 100%; overflow: hidden; background: #fff; border-radius: 0 0 .65rem .65rem; box-shadow: 0 8px 18px rgba(22, 58, 95, .14); }
.client-result { display: block; width: 100%; padding: .75rem 1rem; color: #17324d; text-align: right; background: #fff; border: 0; border-bottom: 1px solid #eef2f5; }
.client-result:hover, .client-result:focus { background: #e6f4f8; outline: 0; }
.client-file-page { max-width: 1040px; margin: 2rem auto 3rem; }
.file-header, .section-heading, .control-row, .inline-form, .balance-grid, .file-two-columns { display: flex; align-items: center; }
.file-header, .section-heading { justify-content: space-between; gap: 1rem; }
.file-header { margin-bottom: 1.25rem; }
.file-header h1 { margin: 0; }
.client-file-actions { border-color: #bdd7e8; background: #f6fbfe; }
.client-file-actions h2 { margin-bottom: .75rem; }
.client-file-actions .control-row, .client-file-actions .inline-form { flex-wrap: nowrap; align-items: center; }
.client-file-actions .control-row { gap: 1rem; }
.client-file-actions form { margin: 0; }
.client-file-actions .inline-form label { white-space: nowrap; }
@media (max-width: 760px) { .client-file-actions .control-row, .client-file-actions .inline-form { flex-wrap: wrap; } }
.client-file-summary { padding: 1.4rem 1.6rem; background: #fff; border: 1px solid #dbe5ec; border-radius: .9rem; }
.client-file-summary .clinic-status { display: inline-block; margin-top: .7rem; }
.client-file-summary-facts { display: flex; gap: 1rem; flex-wrap: wrap; }
.client-file-summary-facts > div { min-width: 140px; padding: .65rem 1rem; background: #f4f7fb; border-radius: .7rem; }
.client-file-summary-facts span, .client-file-summary-facts strong, .client-file-summary-facts small { display: block; }
.client-file-summary-facts span, .client-file-summary-facts small { color: #657080; font-size: .85rem; }
.client-file-summary-facts strong { font-size: 1.25rem; }
.client-file-tabs { gap: .35rem; margin-bottom: 1.25rem; border-bottom-color: #bcd6e4; }
.client-file-tabs .nav-link { color: #245772; font-weight: 700; }
.client-file-tabs .nav-link.active { color: #0c5b80; border-color: #bcd6e4 #bcd6e4 #fff; }
.clinic-status { padding: .45rem .8rem; font-weight: 700; border-radius: 999px; }
.status-in { color: #0e6c46; background: #d9f5e7; }
.status-out { color: #76511a; background: #fff0d0; }
.file-section { margin-bottom: 1.25rem; padding: 1.5rem; background: #fff; border: 1px solid #dbe5ec; border-radius: .9rem; }
.file-section h2 { margin-bottom: 1.25rem; font-size: 1.3rem; }
.control-row { flex-wrap: wrap; gap: .75rem; }
.inline-form { flex-wrap: wrap; gap: .6rem; }
.inline-form label { font-weight: 600; }
.inline-form .form-select, .inline-form .form-control { width: auto; min-width: 150px; }
.section-heading span { color: #657080; font-size: .9rem; }
.balance-grid { align-items: stretch; gap: 1rem; }
.balance-grid > div { flex: 1; padding: 1rem; background: #f4f7fb; border-radius: .65rem; }
.balance-grid span, .balance-grid strong { display: block; }
.balance-grid span { color: #657080; font-size: .9rem; }
.balance-grid strong { margin-top: .35rem; font-size: 1.35rem; }
.client-balance-ledgers { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 1rem; margin-top: 1.5rem; }
.client-balance-ledger { min-width: 0; padding: 1rem; border: 1px solid #dbe5ec; border-radius: .75rem; background: #fff; }
.client-balance-ledger h3 { margin: 0 0 .75rem; }
.client-balance-ledger .table { margin-bottom: 0; }
.client-ledger-tooth { font-weight: 700; }
.client-ledger-status { display: inline-block; margin-inline-start: .4rem; padding: .15rem .45rem; border-radius: 999px; font-size: .75rem; font-weight: 700; white-space: nowrap; }
.client-ledger-status.is-complete { color: #146c43; background: #d9f3e4; }
.client-ledger-status.is-progress { color: #9a5b00; background: #fff0ca; }
@media (max-width: 760px) { .client-balance-ledgers { grid-template-columns: 1fr; } }
.balance-total { color: #fff; background: #176b87 !important; }
.balance-total span { color: #e4f7ff; }
.payment-panel, .procedure-panel { margin-top: 1.25rem; }
.payment-panel summary, .procedure-panel summary { color: #176b87; font-weight: 700; cursor: pointer; }
.payment-form { margin-top: 1rem; }
.file-two-columns { align-items: stretch; gap: 1.25rem; }
.file-two-columns .file-section { flex: 1; }
.file-details { display: grid; grid-template-columns: auto 1fr; gap: .75rem 1.25rem; margin: 0; }
.file-details dt { color: #657080; font-weight: 500; }
.file-details dd { margin: 0; font-weight: 600; }
.medical-notes { margin: 0; white-space: pre-line; }
.tooth-chart { padding: 1rem; border: 1px solid #dbe5ec; border-radius: .75rem; background: #fbfdff; }
.tooth-chart-row { display: grid; grid-template-columns: repeat(16, minmax(48px, 1fr)); gap: .35rem; overflow-x: auto; padding-bottom: .35rem; }
.tooth-chart[data-chart-dentition="deciduous"] .tooth-chart-row { grid-template-columns: repeat(10, minmax(55px, 1fr)); }
.tooth-chart-cell { min-height: 78px; padding: .45rem .3rem; border: 1px solid #d4e2ea; border-radius: .55rem; background: #fff; text-align: center; cursor: pointer; }
.tooth-chart-cell input { display: block; margin: 0 auto .2rem; }
.tooth-chart-icon { display: block; font-size: 1.35rem; line-height: 1.3; }
.tooth-chart-cell strong, .tooth-chart-cell small { display: block; }
.tooth-chart-cell small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .7rem; color: #627380; }
.tooth-chart-cell.has-diagnosis { border-color: #1f7b9c; background: #e5f4f8; }
.tooth-chart-cell:has(input:checked) { outline: 2px solid #0d6efd; background: #e8f0ff; }
.dental-finding-row { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; padding: .6rem .75rem; border-bottom: 1px solid #e4ebf0; }
.dental-case-card { border: 1px solid #dbe5ec; border-right: 4px solid #176b87; border-radius: .6rem; padding: 1rem; background: #fbfdff; }
.dental-workspace-grid { display: grid; grid-template-columns: minmax(240px, 290px) minmax(0, 1fr); align-items: stretch; border: 1px solid #dce5eb; border-radius: .8rem; overflow: hidden; background: #fff; }
.dental-workspace { display: flex; flex-direction: column; }
.dental-workspace > .section-heading { order: -2; }
.dental-workspace > .dental-workflow-tabs { order: -1; }
.dental-workspace > .dental-chart-stage { order: 0; }
.dental-workspace > .dental-workflow-list, .dental-workspace > .dental-workflow-detail { order: 1; }
.dental-workspace { scroll-margin-top: 1rem; }
.dental-workflow-tabs { display: flex; gap: .5rem; flex-wrap: wrap; margin: 0 0 1rem; }
.dental-workflow-tabs[hidden], #dental-records[hidden] { display: none !important; }
.dental-workflow-tab { border: 1px solid #cbdde8; background: #f6fafc; color: #215268; padding: .6rem 1rem; border-radius: .65rem; font-weight: 700; }
.dental-workflow-tab.active { background: #126887; border-color: #126887; color: #fff; }
.dental-workflow-list { margin: .5rem 0 1rem; padding: .85rem; border: 1px solid #dce5eb; border-radius: .7rem; background: #f8fbfd; }
.dental-workflow-group { border-top: 1px solid #dce5eb; padding: .6rem 0; }
.dental-workflow-row { display: flex; align-items: center; justify-content: space-between; gap: .6rem; width: 100%; text-align: right; border: 1px solid #dce5eb; border-radius: .5rem; background: #fff; padding: .55rem .75rem; margin: .35rem 0; color: #173e51; }
.dental-workflow-row:hover, .dental-workflow-row:focus-visible { border-color: #126887; background: #eaf5f9; }
.dental-plan-draft { padding: .7rem; border: 1px solid #c8dfe8; border-radius: .55rem; background: #f5fbfd; }
.dental-plan-draft-row { display: flex; align-items: center; justify-content: space-between; gap: .4rem; padding: .4rem 0; border-bottom: 1px solid #dce9ee; font-size: .85rem; }
.dental-workflow-detail { margin: .5rem 0 1rem; padding: 1rem; border: 1px solid #b9d7e3; border-radius: .8rem; background: #f8fcfe; scroll-margin-top: 1rem; }
.dental-return-to-procedures { flex-shrink: 0; padding: .6rem 1rem; border: 2px solid #0b6284; border-radius: .65rem; background: #0b6284; color: #fff; font-weight: 700; box-shadow: 0 2px 8px #0b628433; }
.dental-return-to-procedures:hover, .dental-return-to-procedures:focus-visible { background: #084f6a; border-color: #084f6a; color: #fff; }
.dental-return-to-procedures span { margin-inline-end: .35rem; font-size: 1.2em; }
.dental-treatment-footer { display: flex; justify-content: center; margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid #d4e4eb; }
.dental-focused-layout { display: grid; direction: ltr; grid-template-columns: minmax(200px, 240px) minmax(0, 1fr); gap: 1rem; align-items: start; }
.dental-focused-summary, .dental-focused-main { direction: rtl; }
.dental-focused-summary { padding: .8rem; border: 1px solid #d4e4eb; border-radius: .7rem; background: #fff; }
.dental-focused-item-button { display: flex; justify-content: space-between; align-items: center; gap: .5rem; width: 100%; padding: .65rem; margin: .35rem 0; border: 1px solid #d7e4ea; border-radius: .55rem; background: #f8fbfc; text-align: right; }
.dental-focused-item-button:hover, .dental-focused-item-button.active { border-color: #16718f; background: #e8f5f9; }
.dental-focused-item-button small { display: block; color: #526977; }
.dental-focused-main { min-width: 0; padding: 1rem; border: 1px solid #d4e4eb; border-radius: .7rem; background: #fff; }
.dental-step-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin: .65rem 0 1rem; }
.dental-step-history .dental-step-note td { background: #f5fafc; color: #3d5360; border-top: 0; white-space: pre-wrap; }
.dental-step-dialog { width: min(94vw, 540px); max-width: none; border: 1px solid #b7d2df; border-radius: .8rem; padding: 1.25rem; direction: rtl; }
.dental-step-dialog::backdrop { background: rgba(13, 35, 47, .45); }
.dental-step-dialog-form { margin: 0; }
.dental-treatment-teeth { display: grid; direction: ltr; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(88px, auto)); gap: .5rem; margin: .75rem 0; position: relative; }
.dental-treatment-teeth::before { content: ''; position: absolute; top: 0; bottom: 0; right: 50%; border-right: 2px dashed #9cb8c6; pointer-events: none; }
.dental-treatment-teeth::after { content: ''; position: absolute; left: 0; right: 0; top: 50%; border-top: 2px dashed #9cb8c6; pointer-events: none; }
.dental-treatment-quadrant { display: flex; direction: rtl; flex-direction: column; gap: .2rem; border: 1px solid #d6e5eb; background: #fff; border-radius: .5rem; padding: .65rem; }
.dental-treatment-quadrant-upper-right { grid-column: 1; grid-row: 1; }
.dental-treatment-quadrant-upper-left { grid-column: 2; grid-row: 1; }
.dental-treatment-quadrant-lower-right { grid-column: 1; grid-row: 2; }
.dental-treatment-quadrant-lower-left { grid-column: 2; grid-row: 2; }
.dental-arch-tooth:has(input:disabled) { opacity: .25; cursor: not-allowed; }
.dental-arch-tooth input:disabled { cursor: not-allowed; }
.dental-workspace-grid > * { padding: 1rem; min-width: 0; }
.dental-workspace-options { grid-column: 1; grid-row: 1; border-right: 1px solid #dce5eb; background: #f8fafc; }
.dental-workspace-chart { grid-column: 2; grid-row: 1; }
.dental-tooth-history[hidden] { display: none !important; }
.dental-workspace-form[hidden], .dental-arch[hidden] { display: none !important; }
.dental-option-list { display: grid; gap: .45rem; max-height: 310px; overflow-y: auto; padding: .15rem; }
.dental-option-heading { font-size: .82rem; color: #687988; margin: .65rem 0 .05rem; }
.dental-specialty-group { border: 1px solid #d4e2e9; border-radius: .55rem; background: #fff; overflow: hidden; }
.dental-specialty-group summary { display: flex; align-items: center; justify-content: space-between; padding: .65rem .8rem; color: #174d65; font-weight: 700; cursor: pointer; list-style: none; }
.dental-specialty-group summary::-webkit-details-marker { display: none; }
.dental-specialty-group summary::before { content: '▸'; margin-inline-end: .5rem; color: #427d97; }
.dental-specialty-group[open] summary::before { content: '▾'; }
.dental-specialty-group summary span { margin-inline-start: auto; padding: .1rem .45rem; border-radius: 999px; background: #e5f2f7; font-size: .75rem; }
.dental-specialty-group .dental-option-tile { margin: .35rem; }
.dental-option-tile { display: flex; align-items: center; gap: .5rem; min-height: 2.55rem; padding: .45rem .7rem; border: 1px solid #d5e1e8; border-radius: .5rem; background: #fff; cursor: pointer; }
.dental-option-tile:has(input:checked) { border-color: #176b87; color: #0d526b; background: #e4f4f8; font-weight: 700; }
.dental-option-tile input { margin: 0; flex: none; }
.dental-workspace-chart { background: #fff; }
.dental-arch { position: relative; width: min(100%, 560px); aspect-ratio: 1.18; margin: .75rem auto 1rem; overflow: visible; }
.dental-arch::before { content: ''; position: absolute; inset: 10% 11%; border: 1px dashed #e4ecf0; border-radius: 50%; pointer-events: none; }
.dental-arch::after { content: ''; position: absolute; left: 50%; top: 7%; bottom: 7%; border-left: 1px dashed #9cb3c0; pointer-events: none; }
.dental-arch-row, .dental-arch-teeth { position: absolute; inset: 0; }
.dental-arch-row-title { position: absolute; left: 50%; z-index: 2; transform: translateX(-50%); margin: 0; color: #627987; font-size: .76rem; font-weight: 700; white-space: nowrap; }
.dental-arch-row-upper .dental-arch-row-title { top: 46%; }
.dental-arch-row-lower .dental-arch-row-title { bottom: 46%; }
.dental-arch-tooth { position: absolute; z-index: 1; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; justify-content: center; width: 7%; min-width: 25px; height: 19%; min-height: 58px; border: 1px solid transparent; border-radius: .45rem; cursor: pointer; color: #727d85; }
.dental-arch-tooth input { position: absolute; inset: 0; z-index: 2; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.dental-arch-tooth svg { display: block; width: 100%; height: calc(100% - 12px); overflow: visible; filter: drop-shadow(0 1px 2px #b5c2c8); }
.dental-arch-tooth.lower svg { transform: rotate(180deg); }
.dental-arch-tooth .tooth-root { fill: #eee2c7; stroke: #9e927e; stroke-width: 1.5; }
.dental-arch-tooth .tooth-crown { fill: #fff5dd; stroke: #988b71; stroke-width: 1.5; }
.dental-arch-tooth .tooth-anatomy { fill: none; stroke: #c3ae8e; stroke-width: 1; opacity: .85; }
.dental-arch-tooth.has-diagnosis .tooth-crown { stroke: #be634b; }
.dental-arch-tooth.status-simple .tooth-crown { fill: #ffe5ac; }
.dental-arch-tooth.status-deep .tooth-crown { fill: #e9aaa8; stroke-width: 2; }
.dental-arch-tooth.status-roots .tooth-crown { fill: #d5c7cb; stroke: #713c4b; }
.dental-arch-tooth.status-missing .tooth-root, .dental-arch-tooth.status-missing .tooth-crown { opacity: .12; }
.dental-arch-tooth.status-missing .tooth-extraction { display: block; fill: none; stroke: #ad3a4f; stroke-width: 5; stroke-linecap: round; }
.dental-arch-tooth .tooth-canal, .dental-arch-tooth .tooth-filling, .dental-arch-tooth .tooth-implant, .dental-arch-tooth .tooth-crown-overlay, .dental-arch-tooth .tooth-bridge-overlay, .dental-arch-tooth .tooth-extraction { display: none; }
.dental-arch-tooth.status-missing .tooth-extraction { display: block; fill: none; stroke: #ad3a4f; stroke-width: 5; stroke-linecap: round; }
.dental-arch-tooth.treatment-filling .tooth-filling { display: block; fill: #3e93d1; stroke: #236a9b; }
.dental-arch-tooth.treatment-root-canal .tooth-canal { display: block; fill: none; stroke: #2e75bb; stroke-width: 4; stroke-linecap: round; }
.dental-arch-tooth.treatment-crown .tooth-crown-overlay, .dental-arch-tooth.treatment-bridge .tooth-crown-overlay { display: block; fill: #d8e8f5; stroke: #3a78ac; stroke-width: 2; }
.dental-arch-tooth.treatment-bridge .tooth-bridge-overlay { display: block; fill: none; stroke: #3a78ac; stroke-width: 3; }
.dental-arch-tooth.treatment-implant .tooth-root, .dental-arch-tooth.treatment-all-on-x .tooth-root { opacity: .12; }
.dental-arch-tooth.treatment-implant .tooth-implant, .dental-arch-tooth.treatment-all-on-x .tooth-implant { display: block; fill: #a9b8c0; stroke: #547586; stroke-width: 2; }
.dental-arch-tooth.treatment-all-on-x .tooth-crown-overlay { display: block; fill: #d6e9f5; stroke: #3a78ac; stroke-width: 2; }
.dental-arch-tooth.treatment-extracted .tooth-root, .dental-arch-tooth.treatment-extracted .tooth-crown { opacity: .12; }
.dental-arch-tooth.treatment-extracted .tooth-extraction { display: block; fill: none; stroke: #ad3a4f; stroke-width: 5; stroke-linecap: round; }
.dental-arch-tooth.has-plan { border-color: #75a3ce; border-style: dashed; }
.dental-arch-tooth:has(input:checked) { border-color: #d18b08; background: #fff2d2; }
.dental-arch-tooth:has(input:focus-visible) { outline: 3px solid #0d6efd; }
.dental-arch-number { position: absolute; z-index: 2; color: #33454f; font-size: .7rem; font-weight: 800; line-height: 1; }
.dental-arch-tooth.upper .dental-arch-number { bottom: -9px; }
.dental-arch-tooth.lower .dental-arch-number { top: -9px; }
.dental-tooth-detail { position: absolute; bottom: -1.1rem; z-index: 3; display: none; padding: .2rem .35rem; border-radius: .25rem; background: #264c61; color: #fff; font-size: .65rem; white-space: nowrap; pointer-events: none; }
.dental-arch-tooth:hover .dental-tooth-detail, .dental-arch-tooth:focus-within .dental-tooth-detail { display: block; }
.dental-arch-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: .8rem; margin: .15rem 0 .5rem; font-size: .75rem; color: #657582; }
.dental-arch-legend span { display: inline-flex; align-items: center; gap: .3rem; }
.dental-arch-legend i { display: inline-block; width: .7rem; height: .7rem; border-radius: 50%; }
.dental-legend-status { background: #f9c9b7; border: 1px solid #be634b; }
.dental-legend-filling { background: #3e93d1; }
.dental-legend-canal { background: #2e75bb; }
.dental-legend-crown { background: #d8e8f5; border: 1px solid #3a78ac; }
.dental-legend-implant { background: #a9b8c0; border: 1px solid #547586; }
.dental-legend-plan { background: #e7f0ff; border: 2px solid #427aaa; }
.dental-legend-selected { background: #ffe7a5; border: 2px solid #d18b08; }
.dental-action { display: flex; align-items: center; flex-wrap: wrap; gap: .25rem .5rem; width: 100%; padding: .7rem; margin-bottom: .6rem; border: 1px solid #d4e1e8; border-radius: .6rem; background: #fff; color: #23475b; text-align: right; }
.dental-action:hover, .dental-action.active { background: #e3f2f8; border-color: #176b87; }
.dental-action > span { font-size: 1.15rem; }
.dental-action small { width: 100%; color: #72838d; padding-right: 1.7rem; }
.dental-selection-summary { margin-top: 1rem; padding: .65rem; border-radius: .5rem; background: #edf3f7; color: #39586b; font-size: .85rem; }
.dental-price-preview { margin-top: .65rem; padding: .65rem; border: 1px solid #b8d6e2; border-radius: .5rem; background: #e9f5f8; color: #12576e; font-size: .84rem; font-weight: 700; }
.dental-row-details { min-width: 185px; margin-top: .45rem; }
.dental-row-details summary { color: #176b87; font-weight: 700; cursor: pointer; }
.dental-row-details[open] { padding: .55rem; border: 1px solid #d5e3e9; border-radius: .5rem; background: #fff; }
.dental-visit-teeth { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; }
.dental-visit-teeth fieldset { padding: .55rem; border: 1px solid #d5e3e9; border-radius: .45rem; }
.dental-visit-teeth legend { float: none; width: auto; margin-bottom: .25rem; font-size: .82rem; }
.dental-visit-teeth label { display: inline-flex; align-items: center; gap: .2rem; margin: .15rem .25rem; white-space: nowrap; }
.dental-visit-detail { display: grid; gap: .35rem; margin-top: .65rem; padding: .65rem; border: 1px solid #d5e3e9; border-radius: .45rem; background: #f7fafc; }
.dental-visit-detail[hidden] { display: none; }
.dental-visit-detail-tooth[hidden] { display: none; }
.dental-visit-history-item { display: grid; gap: .2rem; margin-top: .55rem; padding: .6rem; border-right: 3px solid #3c8fa7; background: #f2f8fa; font-size: .82rem; }
.dental-visit-history-item p { white-space: pre-line; }
.dental-tooth-history { max-height: min(70vh, 620px); overflow-y: auto; padding: .75rem; border: 1px solid #d9e5eb; border-radius: .6rem; background: #f9fcfd; }
.dental-tooth-history-entry[hidden], .dental-tooth-history-empty[hidden] { display: none; }
.dental-tooth-history-entry { margin-top: .8rem; padding: 0 .6rem .25rem; border: 1px solid #d4e5ed; border-radius: .6rem; background: #fff; overflow: hidden; }
.dental-tooth-history-entry > h4 { margin: 0 -.6rem .3rem !important; padding: .55rem .75rem; border-bottom: 1px solid #bad6e3; background: #dceef6; color: #134d69; font-weight: 800; }
.dental-history-line, .dental-history-treatment { display: block; padding: .55rem 0; border-top: 1px solid #e0e9ed; font-size: .82rem; }
.dental-history-treatment summary { position: relative; cursor: pointer; list-style: none; padding-left: .8rem; }
.dental-history-treatment summary::-webkit-details-marker { display: none; }
.dental-history-treatment summary::after { content: '▾'; position: absolute; left: 0; bottom: .1rem; color: #37738c; font-size: .8rem; }
.dental-history-treatment[open] summary::after { content: '▴'; }
.dental-history-primary { display: flex; align-items: baseline; gap: .4rem; min-width: 0; line-height: 1.4; }
.dental-history-primary time { white-space: nowrap; color: #506876; }
.dental-history-primary strong { overflow-wrap: anywhere; }
.dental-history-dot { display: inline-block; flex: 0 0 .65rem; width: .65rem; height: .65rem; border-radius: 50%; background: #8395a0; }
.dental-history-dot.is-planned { background: #8b93a1; }
.dental-history-dot.is-progress { background: #d58a1a; }
.dental-history-dot.is-completed { background: #168956; }
.dental-history-dot.is-diagnosis { background: #497fa7; }
.dental-history-key { display: flex; flex-wrap: wrap; gap: .35rem .65rem; margin-bottom: .5rem; color: #5a7180; font-size: .72rem; }
.dental-history-key span { display: inline-flex; align-items: center; gap: .25rem; }
.dental-history-line > small, .dental-history-treatment summary > small { display: block; margin: .2rem 1.05rem 0 0; color: #647987; }
.dental-history-visit { padding: .4rem .55rem; margin: .25rem 0; border-right: 2px solid #9bc5d2; background: #fff; }
.dental-history-visit p { white-space: pre-line; }
@media (max-width: 700px) { .dental-visit-teeth { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .dental-workspace-grid { grid-template-columns: 1fr; } .dental-workspace-chart { grid-column: 1; grid-row: 1; } .dental-workspace-options { grid-column: 1; grid-row: 2; border-right: 0; border-top: 1px solid #dce5eb; } .dental-arch { width: min(100%, 440px); } }
@media (max-width: 700px) { .dental-focused-layout { grid-template-columns: 1fr; } .dental-focused-summary { display: flex; flex-wrap: wrap; gap: .35rem; } .dental-focused-summary h4, .dental-focused-summary p { width: 100%; } .dental-focused-item-button { width: auto; flex: 1 1 140px; } }
.medical-conditions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 0; row-gap: .25rem; }
.medical-conditions legend { grid-column: 1 / -1; }
.medical-conditions .form-check { display: flex; align-items: center; gap: .65rem; min-height: 2.75rem; margin: 0; padding: .35rem .75rem; cursor: pointer; }
.medical-conditions .form-check:nth-of-type(odd) { border-inline-end: 1px solid #cbd8e1; }
.medical-conditions .form-check-input { float: none; flex: none; margin: 0; }
.medical-conditions .form-check-label { flex: 1; }
.allergy-check { display: flex; align-items: center; gap: .65rem; padding: 0; cursor: pointer; }
.allergy-check .form-check-input { float: none; flex: none; margin: 0; }
@media (max-width: 576px) {
  .medical-conditions { grid-template-columns: 1fr; }
  .medical-conditions .form-check:nth-of-type(odd) { border-inline-end: 0; }
  .medical-conditions .form-check + .form-check { border-top: 1px solid #eef2f5; }
}
.medical-condition-list { margin: 0 0 1rem; padding-right: 1.25rem; }
.income-card { width: min(100%, 620px); }
.income-fields[hidden], .income-rental-dates[hidden] { display: none; }
.income-rental-dates, .income-numbers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.income-total { display: flex; justify-content: space-between; padding: 1rem; color: #17324d; background: #e6f4f8; border-radius: .65rem; font-weight: 700; }
.payment-method-details[hidden] { display: none; }
.payment-setting-missing { margin: 0; padding: .8rem 1rem; color: #76511a; background: #fff0d0; border-radius: .5rem; }
.payment-qr { display: block; width: min(100%, 240px); height: auto; margin-top: .5rem; }
.income-review { display: grid; grid-template-columns: auto 1fr; gap: .7rem 1rem; margin-bottom: 1.5rem; }
.income-review dt { color: #657080; font-weight: 500; }
.income-review dd { margin: 0; font-weight: 600; }
.income-review .review-total { color: #176b87; font-size: 1.35rem; }
.expense-page { max-width: 1120px; margin: 2rem auto 3rem; }
.expense-card { width: 100%; }
.expense-list-heading, .expense-line { display: grid; grid-template-columns: minmax(150px, 2fr) minmax(145px, 1.5fr) 90px 120px 110px 42px; gap: .65rem; align-items: start; }
.expense-list-heading { padding: 0 .85rem .5rem; color: #657080; font-size: .85rem; font-weight: 700; }
.expense-line { margin-bottom: .75rem; padding: .85rem; background: #f4f7fb; border: 1px solid #dbe5ec; border-radius: .65rem; }
.expense-field label { display: none; margin-bottom: .3rem; font-size: .85rem; color: #657080; }
.expense-line-total { display: block; padding: .65rem .2rem; font-weight: 700; }
.expense-category small { display: block; margin-top: .25rem; color: #657080; font-size: .75rem; }
.remove-expense-line { min-height: 38px; font-size: 1.2rem; line-height: 1; }
.expense-summary { max-width: 420px; margin-inline-start: auto; }
.expense-payment-section { max-width: 420px; margin: 1.5rem 0 0 auto; padding: 1.25rem; background: #f4f7fb; border: 1px solid #dbe5ec; border-radius: .65rem; }
.expense-summary > div { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid #e0e6ed; }
.expense-summary .form-control { width: 145px; }
.expense-grand-total { color: #176b87; font-size: 1.2rem; }
.expense-review-totals { display: grid; grid-template-columns: 1fr auto; gap: .6rem 1.5rem; max-width: 380px; margin: 1.5rem 0 2rem auto; }
.expense-review-totals dd { margin: 0; text-align: left; font-weight: 700; }
.expense-review-totals dt:last-of-type, .expense-review-totals dd:last-of-type { color: #176b87; font-size: 1.15rem; }
@media (max-width: 900px) {
  .expense-list-heading { display: none; }
  .expense-line { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .expense-field label { display: block; }
  .remove-expense-line { justify-self: end; }
}
@media (max-width: 576px) {
  .expense-line { grid-template-columns: 1fr; }
  .expense-summary { max-width: none; }
}
@media (max-width: 576px) {
  .income-rental-dates, .income-numbers { grid-template-columns: 1fr; gap: 0; }
}
.procedure-form { display: grid; grid-template-columns: 1fr 150px 180px auto; align-items: end; gap: .75rem; margin-top: 1rem; }
.procedure-form label { display: block; margin-bottom: .35rem; font-weight: 600; }
@media (max-width: 768px) {
  .file-header, .section-heading, .balance-grid, .file-two-columns { align-items: stretch; flex-direction: column; }
  .procedure-form { grid-template-columns: 1fr; }
}

@media (max-width: 576px) {
  .reception-grid { grid-template-columns: 1fr; }
  .auth-card { padding: 1.75rem; }
}
.admin-form { max-width: 980px; border-color: #dbe5ec; border-radius: .9rem; box-shadow: 0 8px 24px rgba(22, 58, 95, .05); }
.admin-form-section { padding-top: 1.25rem; margin-top: .5rem; border-top: 1px solid #dbe5ec; }
.admin-form-section:first-child { padding-top: 0; margin-top: 0; border-top: 0; }
.admin-employee-thumb { width: 48px; height: 48px; object-fit: cover; border-radius: 50%; border: 1px solid #dbe5ec; }
.admin-employee-placeholder { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #eef2f5; color: #657080; }
.admin-photo-preview { display: block; width: 72px; height: 72px; margin-top: .7rem; object-fit: cover; border-radius: .65rem; }
.employee-detail { max-width: 980px; }
.employee-detail-photo { width: 80px; height: 80px; object-fit: cover; border-radius: 50%; border: 1px solid #dbe5ec; }
.employee-detail-grid { display: grid; grid-template-columns: minmax(150px, 230px) 1fr; gap: .8rem 1rem; margin: 0; }
.employee-detail-grid dt { color: #657080; font-weight: 500; }
.employee-detail-grid dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.employee-assignments { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 1rem; }
.employee-assignment-card { padding: 1.25rem; border: 1px solid #dbe5ec; border-radius: .75rem; background: #f8fbfd; }
.employee-assignment-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; margin: 1.25rem 0; }
.employee-assignment-facts dt { color: #657080; font-size: .82rem; font-weight: 500; }
.employee-assignment-facts dd { margin: .2rem 0 0; font-weight: 700; }
.employee-assignment-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; padding-top: .85rem; border-top: 1px solid #dbe5ec; }
.employee-assignment-actions .form-control { width: 145px; }
.assignment-history-list { padding-right: 1.25rem; }
.assignment-history-list li { padding: .4rem 0; border-top: 1px solid #eef2f5; }
.procedure-batch-rows { display: grid; gap: .75rem; }
.procedure-batch-row { padding: .75rem; border: 1px solid #dbe5ec; border-radius: .6rem; background: #f8fbfd; }
.security-permission-group { padding: 1rem 0; border-bottom: 1px solid #dbe5ec; }
.security-group-header { display: flex; align-items: center; gap: .7rem; margin-bottom: .7rem; font-weight: 700; cursor: pointer; }
.security-group-header input, .security-permission-option input { flex: none; width: 1.1rem; height: 1.1rem; margin: 0; accent-color: #0d6efd; }
.security-permission-fields { min-width: 0; padding: 0; border: 0; }
.security-permission-fields:disabled, .security-permission-fields[disabled] { opacity: .5; }
.security-permission-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid #e5edf2; }
.security-permission-option { display: flex; align-items: center; gap: .7rem; min-height: 2.8rem; padding: .5rem .8rem; margin: 0; border-bottom: 1px solid #e5edf2; cursor: pointer; }
.security-permission-option:nth-child(odd) { border-inline-end: 1px solid #cbd8e1; }
.security-override-row { display: grid; grid-template-columns: minmax(180px, 1fr) 160px; align-items: center; gap: 1rem; padding: .5rem 0; border-bottom: 1px solid #eef2f5; }
.security-overrides-heading { display: flex; justify-content: space-between; align-items: start; flex-wrap: wrap; gap: 1rem; border-top: 1px solid #dbe5ec; padding-top: 1.25rem; }
.security-mode-legend { display: flex; flex-wrap: wrap; gap: .45rem; }
.security-legend-item { border-radius: 999px; padding: .25rem .7rem; font-size: .8rem; font-weight: 700; }
.security-legend-item.mode-inherit { background: #e9f2fc; color: #23547c; }
.security-legend-item.mode-allow { background: #e5f5ed; color: #176847; }
.security-legend-item.mode-deny { background: #fdeceb; color: #a43732; }
.security-override-groups { display: grid; gap: .8rem; margin-top: 1.1rem; }
.security-override-group { --group-color: #61758a; --group-tint: #f1f5f8; border: 1px solid #dbe5ec; border-radius: .75rem; overflow: hidden; background: #fff; }
.security-override-group.tone-reception { --group-color: #0b7491; --group-tint: #eaf7fa; }
.security-override-group.tone-hr { --group-color: #6752a4; --group-tint: #f1edfa; }
.security-override-group.tone-catalog { --group-color: #29795a; --group-tint: #eaf6ef; }
.security-override-group.tone-pricing { --group-color: #a46b13; --group-tint: #fcf5e7; }
.security-override-group.tone-accounts { --group-color: #9e4b64; --group-tint: #fbf0f4; }
.security-override-group.tone-system { --group-color: #445a72; --group-tint: #edf2f7; }
.security-override-group summary { display: flex; align-items: center; gap: .65rem; padding: .8rem 1rem; background: var(--group-tint); color: var(--group-color); font-weight: 700; cursor: pointer; list-style: none; }
.security-override-group summary::-webkit-details-marker { display: none; }
.security-group-mark { width: .5rem; height: 1.65rem; border-radius: .3rem; background: var(--group-color); }
.security-group-name { font-size: 1rem; }
.security-group-count { color: #5d6975; font-size: .8rem; font-weight: 500; }
.security-group-changes { margin-inline-start: auto; border-radius: 999px; background: #fff; color: #704616; font-size: .75rem; padding: .1rem .55rem; }
.security-group-changes:empty { display: none; }
.security-group-chevron { font-size: 1.15rem; transition: transform .15s ease; }
.security-override-group:not([open]) .security-group-chevron { transform: rotate(90deg); }
.security-override-list { padding: .25rem .7rem .7rem; }
.security-override-item { display: grid; grid-template-columns: minmax(0, 1fr) minmax(145px, 190px); align-items: center; gap: .8rem; border-inline-start: 4px solid transparent; border-bottom: 1px solid #e8eef2; border-radius: .3rem; padding: .55rem .75rem; }
.security-override-item:last-child { border-bottom: 0; }
.security-override-item.mode-inherit { background: #f7fbff; border-inline-start-color: #7ca9d2; }
.security-override-item.mode-allow { background: #ecf8f1; border-inline-start-color: #31946a; }
.security-override-item.mode-deny { background: #fff0ef; border-inline-start-color: #d45b54; }
.security-override-description label { display: block; font-weight: 600; margin-bottom: .1rem; }
.security-effective-state { display: block; color: #566674; font-size: .79rem; }
.security-override-item.mode-allow .security-effective-state { color: #176847; }
.security-override-item.mode-deny .security-effective-state { color: #a43732; }
.security-override-item.mode-allow .security-mode-select { border-color: #66b88e; color: #176847; font-weight: 700; }
.security-override-item.mode-deny .security-mode-select { border-color: #e19a96; color: #a43732; font-weight: 700; }
@media (max-width: 576px) { .security-override-item { grid-template-columns: 1fr; gap: .35rem; } }
@media (max-width: 576px) { .employee-detail-grid { grid-template-columns: 1fr; gap: .2rem; } .employee-detail-grid dd { margin-bottom: .7rem; } .security-permission-grid { grid-template-columns: 1fr; } .security-permission-option:nth-child(odd) { border-inline-end: 0; } }

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}
.manual-topic { border-color: #dbe5ec; overflow: hidden; }
.manual-topic summary { cursor: pointer; color: #123c55; list-style-position: inside; }
.manual-topic summary:hover, .manual-topic summary:focus-visible { background: #eef7fb; }
.manual-topic[open] { border-color: #91bed4; box-shadow: 0 6px 20px rgba(22, 58, 95, .08); }
.manual-topic li { padding-inline-start: .25rem; }
.daily-report-payment > td { color: #146c43; }
.daily-report-outgoing > td { color: #b42318; }
.daily-report-card { border: 1px solid #d8e2e8; border-radius: .8rem; background: #fff; overflow: hidden; box-shadow: 0 3px 12px rgba(20, 48, 70, .06); }
.daily-report-card > summary { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem 1rem; cursor: pointer; padding: 1rem 1.2rem; list-style: none; }
.daily-report-card > summary::-webkit-details-marker { display: none; }
.daily-report-card > summary::before { content: '⌄'; font-size: 1.3rem; line-height: 1; color: #526979; transition: transform .15s ease; }
.daily-report-card[open] > summary::before { transform: rotate(180deg); }
.daily-report-card > summary:focus-visible { outline: 3px solid #80b9d1; outline-offset: -3px; }
.daily-report-card-title { font-size: 1.1rem; font-weight: 700; color: #173c52; }
.daily-report-card-count { border-radius: 999px; padding: .2rem .7rem; background: #eef3f6; color: #415768; font-size: .9rem; }
.daily-report-card-totals { display: flex; flex-wrap: wrap; gap: .25rem .8rem; margin-inline-start: auto; font-weight: 700; }
.daily-report-card-payment .daily-report-card-totals { color: #146c43; }
.daily-report-card-outgoing .daily-report-card-totals { color: #b42318; }
.daily-report-card .table-responsive { border-top: 1px solid #e1e8ed; }