/* Valenzo POS v275 — real personnel salary and advance ledger.
   The dark category rail stays owned by the hybrid admin shell; this module
   follows only the independently selected management palette. */
.finance-v275-personnel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 16px;
  align-items: start;
}

.finance-v275-personnel > main {
  min-width: 0;
}

.finance-v275-personnel-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 11px;
  margin-bottom: 13px;
}

.finance-v275-personnel-kpis article {
  min-width: 0;
  border: 1px solid var(--f264-line);
  border-radius: 15px;
  padding: 17px;
  background: var(--f264-surface);
  box-shadow: 0 5px 16px rgba(0, 0, 0, .12);
}

.finance-v275-personnel-kpis article:nth-child(2) {
  border-color: var(--f264-info-line);
  background: var(--f264-info-soft);
}

.finance-v275-personnel-kpis small {
  display: block;
  color: var(--f264-muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .07em;
}

.finance-v275-personnel-kpis b {
  display: block;
  margin-top: 6px;
  overflow-wrap: anywhere;
  color: var(--f264-ink);
  font-size: 22px;
  font-weight: 950;
  letter-spacing: -.025em;
}

.finance-v275-personnel-list {
  display: grid;
  gap: 9px;
}

.finance-v275-personnel-row {
  min-width: 0;
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) 86px 116px;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--f264-line);
  border-radius: 13px;
  padding: 12px 14px;
  background: var(--f264-surface);
  color: var(--f264-ink);
}

.finance-v275-personnel-row time,
.finance-v275-personnel-row small {
  color: var(--f264-muted);
  font-size: 10px;
}

.finance-v275-personnel-row > span {
  min-width: 0;
}

.finance-v275-personnel-row > span b,
.finance-v275-personnel-row > span small {
  display: block;
  overflow-wrap: anywhere;
}

.finance-v275-personnel-row > span b {
  color: var(--f264-ink);
  font-size: 12px;
}

.finance-v275-personnel-row > span small {
  margin-top: 3px;
}

.finance-v275-personnel-row em {
  justify-self: start;
  border: 1px solid var(--f264-success-line);
  border-radius: 999px;
  padding: 5px 9px;
  background: var(--f264-success-soft);
  color: var(--f264-success);
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
}

.finance-v275-personnel-row em.advance {
  border-color: var(--f264-info-line);
  background: var(--f264-info-soft);
  color: var(--f264-info);
}

.finance-v275-personnel-row > strong {
  color: var(--f264-ink);
  text-align: right;
  font-size: 13px;
  white-space: nowrap;
}

.finance-v275-personnel > aside {
  position: sticky;
  top: 12px;
  border: 1px solid var(--f264-line);
  border-radius: 16px;
  padding: 18px;
  background: var(--f264-surface);
  color: var(--f264-ink);
  box-shadow: 0 10px 25px rgba(0, 0, 0, .16);
}

.finance-v275-personnel > aside h3 {
  margin: 0 0 14px;
  color: var(--f264-ink);
  font-size: 18px;
  font-weight: 950;
}

.finance-v275-personnel form {
  display: grid;
  gap: 11px;
}

.finance-v275-personnel form > label,
.finance-v275-personnel fieldset {
  display: grid;
  gap: 6px;
  color: var(--f264-muted);
  font-size: 11px;
  font-weight: 850;
}

.finance-v275-personnel :is(input), .finance-v275-personnel :is(select), .finance-v275-personnel :is(textarea) {
  width: 100%;
  min-height: 43px;
  border: 1px solid var(--f264-line) !important;
  border-radius: 10px;
  padding: 9px 11px;
  background: var(--f264-input) !important;
  color: var(--f264-ink) !important;
  -webkit-text-fill-color: var(--f264-ink) !important;
  color-scheme: var(--f264-color-scheme) !important;
  font: inherit;
  font-size: 12px;
  outline: none;
}

.finance-v275-personnel textarea {
  min-height: 74px;
  resize: vertical;
}

.finance-v275-personnel :is(input):focus, .finance-v275-personnel :is(select):focus, .finance-v275-personnel :is(textarea):focus {
  border-color: #48a7eb !important;
  box-shadow: 0 0 0 3px rgba(20, 136, 238, .14);
}

.finance-v275-personnel fieldset {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 0;
  padding: 0;
}

.finance-v275-personnel fieldset legend {
  grid-column: 1 / -1;
  margin-bottom: 6px;
}

.finance-v275-personnel fieldset label {
  min-height: 43px;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--f264-line);
  border-radius: 10px;
  padding: 8px 10px;
  background: var(--f264-raised);
  color: var(--f264-ink);
  cursor: pointer;
}

.finance-v275-personnel fieldset input {
  width: 18px;
  min-height: 18px;
  height: 18px;
  margin: 0;
  padding: 0;
  accent-color: var(--f264-blue);
}

.finance-v275-personnel form > button {
  min-height: 46px;
  border: 0;
  border-radius: 11px;
  background: linear-gradient(135deg, #1592f7, #0877d3);
  color: #fff;
  font: inherit;
  font-weight: 950;
  cursor: pointer;
}

.finance-v275-personnel form > button:disabled {
  cursor: not-allowed;
  opacity: .55;
}

.finance-v275-personnel-warning {
  margin: 0 0 13px;
  border: 1px solid var(--f264-danger-line);
  border-radius: 11px;
  padding: 10px 12px;
  background: var(--f264-danger-soft);
  color: var(--f264-danger) !important;
  font-size: 11px;
  line-height: 1.45;
}

@media (max-width: 1200px) {
  .finance-v275-personnel-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .finance-v275-personnel {
    grid-template-columns: minmax(0, 1fr);
  }

  .finance-v275-personnel > aside {
    position: static;
  }
}

@media (max-width: 620px) {
  .finance-v275-personnel-kpis {
    grid-template-columns: minmax(0, 1fr);
  }

  .finance-v275-personnel-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .finance-v275-personnel-row time {
    grid-column: 1 / -1;
  }

  .finance-v275-personnel-row em {
    grid-column: 1;
    grid-row: 3;
  }

  .finance-v275-personnel-row > strong {
    grid-column: 2;
    grid-row: 2 / 4;
  }
}

@media (forced-colors: active) {
  .finance-v275-personnel-row,
  .finance-v275-personnel > aside,
  .finance-v275-personnel-kpis article,
  .finance-v275-personnel fieldset label {
    border-color: CanvasText;
  }
}