.avs-root {
  color: #0d1b3d;
  display: grid;
  gap: 20px;
}
.avs-root h2 {
  font-size: 20px;
  margin: 0 0 16px;
}
.avs-setup {
  background: white;
  border: 1px solid #e3e8ef;
  border-radius: 12px;
  padding: 22px;
}
.avs-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.avs-steps button {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  background: #f6f8fb;
  text-align: left;
}
.avs-steps span,
.avs-last {
  font-size: 13px;
  color: #5b6779;
}
.avs-tabs {
  display: flex;
  gap: 8px;
  border-bottom: 1px solid #e3e8ef;
  overflow: auto;
}
.avs-tabs button {
  border: 0;
  background: transparent;
  border-radius: 0;
  white-space: nowrap;
  padding: 14px 12px;
}
.avs-tabs button[aria-current=true] {
  border-bottom: 2px solid #0d1b3d;
  font-weight: 700;
}
.avs-last {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.avs-content {
  display: grid;
  gap: 16px;
}
.avs-table-wrap {
  overflow: auto;
  border: 1px solid #e3e8ef;
  border-radius: 12px;
  background: #fff;
}
.avs-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.avs-table th {
  background: #f6f8fb;
  text-align: left;
  color: #5b6779;
  font-weight: 500;
}
.avs-table th,
.avs-table td {
  padding: 14px 16px;
  border-bottom: 1px solid #eef1f5;
  vertical-align: middle;
}
.avs-table tr:last-child td {
  border-bottom: 0;
}
.avs-table td > button {
  border: 0;
  background: transparent;
  text-align: left;
  padding: 0;
}
.avs-person {
  display: flex;
  gap: 10px;
  align-items: center;
  min-width: 140px;
}
.avs-person strong,
.avs-person small {
  display: block;
}
.avs-person small {
  font-size: 12px;
  color: #5b6779;
  margin-top: 4px;
}
.avs-avatar {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  border-radius: 50%;
  background: #ecf0f5;
  overflow: hidden;
}
.avs-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.avs-inline {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.avs-inline button[aria-pressed=true] {
  background: #0d1b3d;
  color: #fff;
}
.avs-note {
  color: #5b6779;
  font-size: 13px;
  line-height: 1.65;
}
.avs-place {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: white;
  border: 1px solid #e3e8ef;
  border-radius: 12px;
  padding: 18px;
}
.avs-place h3 {
  margin: 0 0 8px;
  font-size: 16px;
}
.avs-place p {
  font-size: 14px;
  margin: 6px 0;
}
.avs-place small {
  color: #5b6779;
}
.avs-panel {
  position: fixed;
  inset: 0 0 0 auto;
  margin: 0;
  width: 560px;
  max-width: 100vw;
  height: 100dvh;
  max-height: 100dvh;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: white;
  color: #0d1b3d;
  box-shadow: -12px 0 32px #0d1b3d29;
}
.avs-panel[open] {
  display: flex;
  flex-direction: column;
}
.avs-panel::backdrop {
  background: #0d1b3d40;
}
.avs-panel > header,
.avs-panel > footer {
  padding: 18px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid #e3e8ef;
  flex-shrink: 0;
}
.avs-panel > header h2 {
  font: 700 20px/1.4 inherit;
  margin: 0;
}
.avs-panel > footer {
  border-top: 1px solid #e3e8ef;
  border-bottom: 0;
}
.avs-panel-body {
  padding: 24px;
  overflow: auto;
  flex: 1;
  min-height: 0;
  display: block;
}
.avs-form {
  display: grid;
  gap: 16px;
}
.avs-form label,
.avs-confirm > label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  color: #3e4b5f;
}
.avs-form input:not([type=checkbox]),
.avs-form select,
.avs-form textarea,
.avs-confirm textarea {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  border: 1px solid #dce3ec;
  border-radius: 8px;
  min-height: 42px;
  padding: 9px 10px;
  background: white;
  color: #0d1b3d;
  font: inherit;
  font-size: 14px;
}
.avs-form fieldset {
  margin: 0;
  padding: 14px;
  border: 1px solid #e3e8ef;
  border-radius: 10px;
  display: grid;
  gap: 12px;
  min-width: 0;
}
.avs-form .avs-check,
.avs-confirm .avs-check {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  min-height: 32px;
}
.avs-check input,
.avs-member-option input {
  width: 18px;
  height: 18px;
  accent-color: #0d1b3d;
}
.avs-form .avs-days {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.avs-error {
  color: #a14b14;
  font-size: 14px;
  margin: 0;
  padding: 0 24px;
}
.avs-error:empty {
  display: none;
}
.avs-error:not(:empty) {
  padding-bottom: 16px;
}
.avs-toast {
  color: #24573f;
  font-size: 14px;
}
.avs-toast:empty {
  display: none;
}
.avs-member-option {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  padding: 12px;
  border: 1px solid #e3e8ef;
  border-radius: 10px;
  gap: 10px;
  margin: 8px 0;
}
.avs-member-option .avs-person {
  flex: 1;
}
.avs-member-option small {
  font-size: 12px;
}
.avs-business-results {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 260px;
  overflow: auto;
}
.avs-history {
  border-bottom: 1px solid #e3e8ef;
  padding: 16px 0;
  font-size: 14px;
  overflow-wrap: anywhere;
}
.avs-map {
  height: 180px;
  background: #eef2f7;
  border-radius: 12px;
  overflow: hidden;
  display: grid;
  place-items: center;
  font-size: 13px;
  color: #5b6779;
}
.avs-holidays {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.avs-confirm {
  display: grid;
  gap: 16px;
}
.avs-panel [hidden] {
  display: none !important;
}
.avs-panel button:focus-visible,
.avs-root button:focus-visible {
  outline: 2px solid #4d6f92;
  outline-offset: 3px;
}
@media (max-width: 640px) {
  .avs-setup {
    padding: 16px;
  }
  .avs-steps {
    grid-template-columns: 1fr;
  }
  .avs-root {
    gap: 16px;
  }
  .avs-last {
    align-items: flex-start;
    gap: 8px;
  }
  .avs-table thead {
    display: none;
  }
  .avs-table,
  .avs-table tbody {
    display: block;
  }
  .avs-table tr {
    display: block;
    padding: 12px;
    border-bottom: 1px solid #e3e8ef;
  }
  .avs-table td {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    border: 0;
    padding: 8px 0;
    text-align: right;
    overflow-wrap: anywhere;
  }
  .avs-table td::before {
    content: attr(data-label);
    color: #5b6779;
    text-align: left;
    flex-shrink: 0;
  }
  .avs-table td:first-child {
    display: block;
    text-align: left;
  }
  .avs-table td:first-child::before {
    display: none;
  }
  .avs-place {
    flex-direction: column;
    align-items: stretch;
  }
  .avs-panel {
    width: 100vw;
  }
  .avs-panel > header,
  .avs-panel > footer,
  .avs-panel-body {
    padding: 16px;
  }
  .avs-panel > header h2 {
    font-size: 18px;
  }
  .avs-panel > footer .at-button {
    font-size: 13px;
  }
  .avs-member-option {
    flex-wrap: wrap;
  }
}
/* The attendance shell has ID-scoped table/button defaults. Override only this view. */
#view-attendance .avs-table { min-width: 0; width: 100%; }
#view-attendance .avs-table td > .at-button { border: 0; background: transparent; padding: 0; text-align: left; }
#view-attendance .avs-tabs .at-button { border: 0; border-radius: 0; background: transparent; white-space: nowrap; padding: 14px 12px; }
#view-attendance .avs-tabs .at-button[aria-selected=true] { border-bottom: 2px solid #0d1b3d; font-weight: 700; }
#view-attendance .avs-steps .at-button { background: #f6f8fb; padding: 16px; }
.avs-panel .at-button { min-height: 44px; padding: 10px 16px; border: 1px solid #dce3ec; border-radius: 8px; background: white; color: #0d1b3d; font: inherit; cursor: pointer; }
.avs-panel .at-button.primary { background: #0d1b3d; color: white; border-color: #0d1b3d; }
.avs-panel .at-button:disabled { opacity: .5; cursor: not-allowed; }
.avs-panel input:focus-visible,.avs-panel select:focus-visible,.avs-panel textarea:focus-visible { outline: 2px solid #4d6f92; outline-offset: 2px; }
@media(max-width:640px) {
 #view-attendance .avs-table td { border: 0; padding: 8px 0; white-space: normal; }
 #view-attendance .avs-table-wrap { overflow: visible; }
 #view-attendance .avs-table td > span { min-width: 0; }
}
/* C v2 standalone reference: keep the Workboard shell and live data bindings. */
#view-attendance:has(#at-settings:not([hidden]) .avs-root) .at-content { max-width:1240px; }
#view-attendance .avs-root { color:#1f2a3d; font-size:14px; line-height:1.55; gap:20px; }
#view-attendance .avs-root h2 { font-size:17px; color:#0d1b3d; margin:0; }
#view-attendance .avs-setup { padding:18px 20px; border-radius:16px; }
.avs-setup-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:14px; }
.avs-setup-heading p { margin:2px 0 0; }
.avs-setup-heading progress { width:160px; height:6px; flex-shrink:0; appearance:none; border:0; border-radius:999px; overflow:hidden; }
.avs-setup-heading progress::-webkit-progress-bar { background:#eef1f5; }
.avs-setup-heading progress::-webkit-progress-value { background:#0d1b3d; }
.avs-steps { list-style:none; margin:0; padding:0; gap:10px; }
.avs-step { display:flex; align-items:center; gap:10px; padding:14px; border:1px solid #dce3ec; border-radius:12px; min-width:0; }
.avs-step-number { display:grid; place-items:center; flex:0 0 28px; height:28px; background:#0d1b3d; color:white !important; border-radius:50%; font-weight:700; }
.avs-step-copy { display:flex; flex-direction:column; gap:2px; flex:1; min-width:0; }
.avs-step-copy strong { color:#0d1b3d; font-size:14px; }
.avs-step.is-complete { background:#f6faf7; }
.avs-step.is-complete .avs-step-number { background:#24573f; }
#view-attendance .avs-step .at-button { border:1px solid #0d1b3d; background:white; border-radius:8px; padding:6px 12px; min-height:36px; font-size:13px; font-weight:600; white-space:nowrap; }
.avs-setup-note { font-size:12px; margin:12px 0 0; }
#view-attendance .avs-tabs { gap:4px; }
#view-attendance .avs-tabs .at-button { color:#5b6779; padding:12px 14px; }
#view-attendance .avs-tabs .at-button[aria-selected=true] { color:#0d1b3d; }
.avs-last { justify-content:flex-start; gap:10px; margin-top:-6px; }
#view-attendance .avs-last .at-button { border:0; background:transparent; color:#34506e; font-weight:600; font-size:13px; text-decoration:underline; text-underline-offset:3px; padding:6px 2px; min-height:32px; }
.avs-card { background:#fff; border:1px solid #e3e8ef; border-radius:16px; overflow:hidden; min-width:0; }
.avs-card-toolbar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:14px 18px; border-bottom:1px solid #eef1f5; }
.avs-card-toolbar > .at-button:last-child, .avs-card-toolbar > .avs-inline { margin-left:auto; }
.avs-card-toolbar input[type=search] { width:220px; max-width:100%; min-height:40px; border:1px solid #dce3ec; border-radius:10px; padding:8px 12px; font:inherit; }
.avs-card .avs-table-wrap { border:0; border-radius:0; }
#view-attendance .avs-table th { background:white; font-size:13px; font-weight:600; padding:10px 12px; }
#view-attendance .avs-table td { padding:10px 12px; white-space:normal; }
#view-attendance .avs-table th:first-child, #view-attendance .avs-table td:first-child { padding-left:18px; }
#view-attendance .avs-table td > .at-button { min-height:40px; }
.avs-table tr:has(button):hover { background:#fbfcfd; }
.avs-identity { display:flex; align-items:baseline; flex-wrap:nowrap; white-space:nowrap; }
#view-attendance .avs-member-row { cursor:pointer; }
#view-attendance .avs-member-row:focus-within { background:#f6f8fb; }
.avs-person .avs-identity strong { display:inline; font-size:14px; }
.avs-role { font-size:13px; color:#5b6779; font-weight:400; }
.avs-person small { margin-top:0; line-height:1.4; }
.avs-badge { display:inline-flex; align-items:center; white-space:nowrap; border-radius:6px; padding:2px 8px; font-size:12px; font-weight:600; background:#f0f3f7; color:#5b6779; }
.avs-badge.success { background:#e8f2ec; color:#24573f; }
.avs-badge.scheduled { background:#fff3e4; color:#8a5a20; }
.avs-worktime { display:inline-flex; align-items:center; flex-wrap:wrap; gap:6px; font-variant-numeric:tabular-nums; }
.avs-worktime .avs-badge { padding:1px 6px; font-size:11px; }
.avs-empty { padding:40px 20px; text-align:center; }
.avs-empty h3 { margin:0 0 8px; font-size:16px; }
.avs-card > .avs-note, .avs-card-notice { padding:12px 18px; margin:0; font-size:13px; }
.avs-card-notice { background:#fbfcfd; }
.avs-content-location { grid-template-columns:minmax(0,1fr) auto; align-items:center; }
.avs-content-location > :not(.avs-location-tabs):not(.primary) { grid-column:1/-1; }
.avs-location-tabs { width:max-content; max-width:100%; border-radius:10px; background:#e9edf3; padding:4px; gap:4px; }
#view-attendance .avs-location-tabs .at-button { border:0; border-radius:8px; background:transparent; padding:7px 14px; min-height:36px; color:#5b6779; }
#view-attendance .avs-location-tabs .at-button[aria-pressed=true] { background:white; color:#0d1b3d; box-shadow:0 1px 3px #0d1b3d14; font-weight:600; }
.avs-place { padding:16px 18px; border-radius:16px; }
#view-attendance .avs-switch { display:inline-flex; align-items:center; gap:6px; border:0; background:transparent; font-size:13px; padding:6px; }
.avs-switch::before { content:""; width:34px; height:20px; border-radius:999px; background:radial-gradient(circle at 10px 10px,white 7px,transparent 8px),#b6c0cd; flex-shrink:0; }
.avs-switch[aria-checked=true]::before { background:radial-gradient(circle at 24px 10px,white 7px,transparent 8px),#0d1b3d; }
#view-attendance .avs-content-map .at-card { padding:20px; border:1px solid #e3e8ef; border-radius:16px; box-shadow:none; }
#view-attendance .avs-content-map .at-connection-results { font-size:13px; }
.avs-panel { width:520px; }
.avs-panel > header { padding:18px 22px; }
.avs-panel-body { padding:20px 22px; }
.avs-panel-body > .avs-person { padding-bottom:18px; border-bottom:1px solid #eef1f5; margin-bottom:20px; }
.avs-detail-section { padding:16px 0; border-bottom:1px solid #eef1f5; }
.avs-detail-section h3 { font-size:15px; margin:0 0 12px; }
.avs-detail-section dl { display:grid; grid-template-columns:110px minmax(0,1fr); gap:8px; margin:0; font-size:14px; }
.avs-detail-section dt { color:#5b6779; }
.avs-detail-section dd { margin:0; overflow-wrap:anywhere; }
.avs-time-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.avs-form .avs-days { border:0; padding:0; gap:6px; }
.avs-days .avs-check { position:relative; }
.avs-days input { position:absolute; opacity:0; width:100%; height:100%; inset:0; margin:0; cursor:pointer; }
.avs-days .avs-check span { border:1px solid #dce3ec; border-radius:8px; min-width:36px; min-height:36px; display:grid; place-items:center; }
.avs-days input:checked + span { background:#0d1b3d; color:white; border-color:#0d1b3d; }
.avs-days input:focus-visible + span { outline:2px solid #4d6f92; outline-offset:3px; }
@media(max-width:900px) { .avs-steps { grid-template-columns:1fr; } .avs-setup-heading progress { width:100px; } }
@media(max-width:640px) {
 #view-attendance .avs-setup { padding:16px; }
 .avs-setup-heading { align-items:flex-start; flex-direction:column; gap:8px; }
 .avs-setup-heading progress { width:100%; }
 .avs-step { padding:12px; }
 .avs-step-copy strong { font-size:13px; }
 .avs-step-copy > span { font-size:12px; }
 .avs-last { flex-wrap:wrap; }
 .avs-card-toolbar { padding:12px 16px; }
 #view-attendance .avs-table td { padding:6px 0; }
 #view-attendance .avs-table td:first-child { padding-left:0; }
 .avs-content-policy .avs-table tr { position:relative; padding:14px 16px; }
 .avs-content-policy .avs-table td:nth-child(6) { position:absolute; top:14px; right:16px; }
 .avs-content-policy .avs-table td:nth-child(6)::before { display:none; }
 .avs-content-policy .avs-table td:first-child { padding-right:64px; }
 .avs-content-policy .avs-table td:nth-child(2) { margin-top:6px; }
 .avs-content-policy .avs-person { min-width:0; }
 .avs-content-policy .avs-avatar { width:40px; height:40px; flex-basis:40px; }
 .avs-content-location { grid-template-columns:minmax(0,1fr); }
 .avs-content-location > .primary { justify-self:start; }
 .avs-panel { width:100vw; }
 .avs-panel-body { padding:16px; }
}

body:has(#view-attendance:not([hidden]) #at-settings:not([hidden]) .avs-root) { background:#f4f6f9; }
#view-attendance .avs-root > .avs-setup { border:1px solid #e3e8ef; margin:0; }
#view-attendance .avs-root > .avs-tabs { margin:0; padding:0; width:100%; border-bottom:1px solid #dce3ec; }
#view-attendance .avs-setup-note { margin:12px 0 0; }
#view-attendance .avs-card { border:1px solid #e3e8ef; }
.avs-mobile-summary { display:none; }
@media(max-width:640px) {
 .avs-content-policy .avs-table td:nth-child(3), .avs-content-policy .avs-table td:nth-child(4), .avs-content-policy .avs-table td:nth-child(5) { display:none; }
 .avs-content-policy .avs-table td:nth-child(2)::before { display:none; }
 .avs-content-policy .avs-table td:nth-child(2) { text-align:left; padding-left:50px !important; margin-top:0; }
 .avs-content-policy .avs-worktime { justify-content:flex-start; font-size:13px; }
 .avs-mobile-summary { display:block; flex-basis:100%; color:#5b6779; font-size:12px; line-height:1.6; }
}
#view-attendance .avs-table { font-size:14px; }
#view-attendance .avs-tabs .at-button { font-size:14px; }
#view-attendance .avs-card-toolbar .avs-inline .at-button { font-size:13px; border-radius:999px; }
#view-attendance .avs-card-toolbar .avs-inline .at-button[aria-pressed=true] { background:#0d1b3d; color:white; }

/* Review parity: compact forms without hiding field labels or mobile inputs. */
.avs-form-heading { font-size:15px; margin:8px 0 0; padding-top:16px; border-top:1px solid #e3e8ef; }
.avs-form-heading:first-child { border:0; padding:0; }
.avs-holiday-input { display:flex; gap:8px; align-items:center; }
.avs-holiday-input input { flex:1; }
.avs-holiday-input .at-button { flex-shrink:0; padding:8px 12px; }
.avs-panel .avs-close { font-size:26px; line-height:1; border:0; width:44px; padding:0; }
.avs-selected-customer { padding:10px 12px; border-radius:8px; background:#eef3fa; color:#0d1b3d; font-weight:600; }
.avs-business-results button[aria-pressed=true] { border-color:#0d1b3d; background:#eef3fa; }
.avs-overtime-preview { background:#f4f6f9; padding:12px; border-radius:8px; margin:0; }
.avs-transport-panel { width:820px; }
.avs-form .avs-transport-row { grid-template-columns:64px 100px 80px minmax(120px,1fr) 110px; align-items:end; gap:10px; }
.avs-transport-row legend { font-size:14px; font-weight:600; }
@media(max-width:640px) {
 .avs-form .avs-transport-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .avs-transport-row > label:nth-of-type(4) { grid-column:1/-1; }
}