* {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;

  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Arial,
    sans-serif;

  background: #f3f4f6;
  color: #1b1b1f;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

.container {
  width: 100%;
  max-width: 920px;

  margin: 0 auto;

  padding:
    28px 20px 60px;
}

/* ============================================================
   HEADER
   ============================================================ */

.header {
  margin-bottom: 18px;
}

.eyebrow {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.12em;

  opacity: 0.45;

  margin-bottom: 5px;
}

h1 {
  margin: 0;

  font-size: 34px;
  letter-spacing: -0.03em;
}

h2 {
  margin: 0 0 18px;

  font-size: 22px;
  letter-spacing: -0.02em;
}

.date {
  margin-top: 5px;

  font-size: 15px;
  opacity: 0.6;

  text-transform: capitalize;
}

/* ============================================================
   DATE
   ============================================================ */

.date-card {
  margin-bottom: 18px;
}

.date-controls {
  display: flex;
  gap: 8px;
  align-items: center;
}

.date-shortcut {
  min-height: 42px;

  border:
    1px solid #d9dadd;

  border-radius: 10px;

  padding: 8px 14px;

  background: white;

  font-weight: 700;
}

.date-shortcut.active {
  background: #18181b;
  color: white;

  border-color: #18181b;
}

.date-input {
  min-height: 42px;

  border:
    1px solid #d9dadd;

  border-radius: 10px;

  padding: 8px 12px;

  background: white;
}

/* ============================================================
   CARD
   ============================================================ */

.card {
  background: white;

  border:
    1px solid
    rgba(
      0,
      0,
      0,
      0.06
    );

  border-radius: 18px;

  padding: 22px;

  margin-bottom: 34px;

  box-shadow:
    0 3px 18px
    rgba(
      0,
      0,
      0.04
    );
}

/* ============================================================
   FORM
   ============================================================ */

.form-grid {
  display: grid;

  grid-template-columns:
    1fr 1fr;

  gap: 16px;
}

.field {
  margin-bottom: 16px;
}

label {
  display: block;

  font-size: 14px;
  font-weight: 700;

  margin-bottom: 7px;
}

select,
textarea,
input {
  width: 100%;

  border:
    1px solid #d8d9dd;

  border-radius: 11px;

  background: white;

  min-height: 50px;

  padding: 11px 13px;

  font-size: 16px;

  outline: none;
}

select:focus,
textarea:focus,
input:focus {
  border-color: #666;

  box-shadow:
    0 0 0 3px
    rgba(
      0,
      0,
      0.05
    );
}

textarea {
  min-height: 95px;
  resize: vertical;
}

.primary-button {
  width: 100%;

  min-height: 54px;

  border: 0;
  border-radius: 12px;

  padding: 12px 18px;

  font-size: 17px;
  font-weight: 750;

  background: #171719;
  color: white;
}

.primary-button:disabled {
  opacity: 0.5;
}

/* ============================================================
   PROJECT SEARCH
   ============================================================ */

.project-search-wrap {
  position: relative;
}

.project-results {
  position: absolute;

  z-index: 100;

  left: 0;
  right: 0;

  top:
    calc(
      100% + 5px
    );

  max-height: 360px;

  overflow-y: auto;

  background: white;

  border:
    1px solid #d8d9dd;

  border-radius: 12px;

  box-shadow:
    0 14px 35px
    rgba(
      0,
      0,
      0,
      0.15
    );
}

.project-result {
  display: block;

  width: 100%;

  border: 0;

  border-bottom:
    1px solid #eeeeef;

  background: white;

  padding: 12px 14px;

  text-align: left;
}

.project-result:last-child {
  border-bottom: 0;
}

.project-result:hover {
  background: #f5f5f6;
}

.project-result-title {
  display: block;

  font-size: 15px;
  font-weight: 700;

  line-height: 1.35;
}

.project-result-stage {
  display: block;

  margin-top: 4px;

  font-size: 12px;

  opacity: 0.55;
}

.project-no-results {
  padding: 18px;

  text-align: center;

  opacity: 0.55;
}

.selected-project {
  display: flex;

  justify-content: space-between;
  align-items: center;

  gap: 15px;

  margin-top: 8px;

  padding: 11px 12px;

  background: #f2f2f3;

  border-radius: 10px;
}

.selected-project-meta {
  margin-top: 3px;

  font-size: 12px;
  opacity: 0.55;
}

.clear-project-button {
  flex: 0 0 34px;

  width: 34px;
  height: 34px;

  border: 0;
  border-radius: 50%;

  background: #dedee1;

  font-size: 20px;
}

.hidden {
  display: none !important;
}

/* ============================================================
   DAY HEADER
   ============================================================ */

.section-header {
  display: flex;

  align-items: flex-start;

  justify-content:
    space-between;

  gap: 20px;
}

.section-header h2 {
  margin-bottom: 2px;
}

.shift-status {
  font-size: 13px;

  opacity: 0.5;
}

.day-summary {
  font-size: 16px;
  font-weight: 700;

  white-space: nowrap;
}

/* ============================================================
   EMPLOYEE
   ============================================================ */

.employee-block {
  overflow: hidden;

  background: white;

  border:
    1px solid
    rgba(
      0,
      0,
      0,
      0.06
    );

  border-radius: 16px;

  margin-bottom: 18px;

  box-shadow:
    0 2px 12px
    rgba(
      0,
      0,
      0,
      0.035
    );
}

.employee-title {
  display: flex;

  align-items: center;

  justify-content:
    space-between;

  padding: 16px 18px;

  background: #fafafa;

  border-bottom:
    1px solid #eeeeef;
}

.employee-name {
  font-size: 19px;
  font-weight: 800;
}

.employee-count {
  margin-top: 2px;

  font-size: 13px;

  opacity: 0.5;
}

.employee-hours {
  font-size: 19px;

  font-weight: 800;
}

/* ============================================================
   ASSIGNMENT
   ============================================================ */

.assignment {
  padding: 17px 18px;

  border-bottom:
    1px solid #eeeeef;
}

.assignment:last-child {
  border-bottom: none;
}

.assignment-top {
  display: flex;

  justify-content:
    space-between;

  align-items:
    flex-start;

  gap: 15px;
}

.assignment-main {
  flex: 1;
  min-width: 0;
}

.project-title {
  font-size: 16px;
  font-weight: 750;

  line-height: 1.3;
}

.process {
  margin-top: 4px;

  font-size: 13px;

  opacity: 0.55;
}

.task {
  margin-top: 12px;

  font-size: 15px;

  line-height: 1.45;
}

/* ============================================================
   PLAN FACT
   ============================================================ */

.plan-fact-row {
  display: flex;

  align-items: center;

  gap: 28px;

  margin-top: 14px;

  padding: 12px;

  background: #f7f7f8;

  border-radius: 10px;
}

.metric-label {
  display: block;

  margin-bottom: 2px;

  font-size: 11px;
  font-weight: 800;

  opacity: 0.45;
}

.assignment-status {
  flex: 0 0 auto;

  padding: 6px 9px;

  border-radius: 8px;

  font-size: 12px;
  font-weight: 700;
}

.status-planned {
  background: #eeeeef;
}

.status-partial {
  background: #fff2c7;
}

.status-done {
  background: #dff5e5;
}

.fact-entry {
  margin-top: 15px;

  padding: 15px;

  border:
    1px solid #e4e4e7;

  border-radius: 11px;
}

.fact-entry label {
  margin-top: 10px;
}

.fact-entry label:first-child {
  margin-top: 0;
}

.fact-buttons {
  display: grid;

  grid-template-columns:
    1fr 1fr;

  gap: 10px;

  margin-top: 14px;
}

.fact-buttons button {
  min-height: 48px;

  border: 0;

  border-radius: 10px;

  font-weight: 700;
}

.partial-button {
  background: #f0f0f1;
}

.done-button {
  background: #18181b;

  color: white;
}

.delete-button {
  margin-top: 12px;

  border: 0;

  background: transparent;

  padding: 0;

  font-size: 13px;

  opacity: 0.45;
}

.delete-button:hover {
  opacity: 0.9;
}

/* ============================================================
   EMPTY
   ============================================================ */

.empty {
  padding: 42px 20px;

  background: white;

  border-radius: 16px;

  text-align: center;

  color: #777;
}

.empty-title {
  margin-bottom: 5px;

  font-size: 17px;
  font-weight: 750;

  color: #333;
}

/* ============================================================
   MOBILE
   ============================================================ */

@media (
  max-width: 650px
) {

  .container {
    padding:
      18px 12px
      40px;
  }

  h1 {
    font-size: 29px;
  }

  .date-controls {
    display: grid;

    grid-template-columns:
      1fr 1fr;

    gap: 8px;
  }

  .date-input {
    grid-column:
      1 / -1;
  }

  .card {
    padding: 16px;

    border-radius: 15px;
  }

  .form-grid {
    grid-template-columns:
      1fr;

    gap: 0;
  }

  select,
  textarea,
  input {
    min-height: 52px;

    font-size: 17px;
  }

  textarea {
    min-height: 100px;
  }

  .primary-button {
    min-height: 58px;

    font-size: 18px;
  }

  .project-results {
    max-height: 320px;
  }

  .employee-title {
    padding: 15px;
  }

  .assignment {
    padding: 16px 15px;
  }

  .plan-fact-row {
    gap: 20px;
  }

  .assignment-status {
    font-size: 11px;
  }

  .fact-buttons {
    grid-template-columns:
      1fr;
  }

  .fact-buttons button {
    min-height: 54px;
  }

  .section-header {
    display: block;
  }

  .day-summary {
    margin:
      5px 0 15px;
  }
}

/* ============================================================
   MULTIWORKER
   ============================================================ */

.workers-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.workers-heading label {
  margin-bottom: 0;
}

.workers-hint {
  font-size: 12px;
  opacity: 0.5;
}

.worker-rows {
  display: grid;
  gap: 9px;
  margin-bottom: 10px;
}

.assignment-worker-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 120px 42px;
  align-items: start;
  gap: 8px;
}

.worker-skill-hint {
  min-height: 15px;
  margin-top: 4px;
  padding-left: 3px;
  font-size: 11px;
  line-height: 1.3;
  opacity: 0.45;
}

.remove-worker-button {
  width: 42px;
  height: 50px;

  border: 0;
  border-radius: 10px;

  background: #eeeeef;

  font-size: 23px;
}

.secondary-button {
  min-height: 44px;

  padding: 9px 14px;

  border: 1px solid #d8d9dd;
  border-radius: 10px;

  background: white;

  font-weight: 700;
}

.assignment-workers-list {
  margin-top: 15px;

  border: 1px solid #e7e7e9;
  border-radius: 11px;

  overflow: hidden;
}

.assignment-worker-line {
  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    auto
    30px;

  align-items: center;

  gap: 12px;

  padding: 11px 12px;

  border-bottom:
    1px solid #eeeeef;
}

.assignment-worker-line:last-child {
  border-bottom: 0;
}

.assignment-worker-name {
  font-weight: 700;
}

.assignment-worker-numbers {
  display: flex;
  gap: 13px;

  font-size: 12px;
  white-space: nowrap;
}

.assignment-worker-numbers span {
  opacity: 0.55;
}

.assignment-worker-numbers strong {
  margin-left: 3px;

  font-size: 15px;
  opacity: 1;
}

.worker-mini-status {
  width: 26px;
  height: 26px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: #eeeeef;

  font-weight: 800;
}

.worker-mini-partial {
  background: #fff2c7;
}

.worker-mini-done {
  background: #dff5e5;
}

.assignment-total {
  margin-top: 11px;

  font-size: 13px;

  opacity: 0.65;
}

@media (max-width: 650px) {

  .workers-heading {
    display: block;
  }

  .workers-hint {
    margin-top: 3px;
  }

  .assignment-worker-row {
    grid-template-columns:
      minmax(0, 1fr)
      92px
      42px;
  }

  .assignment-worker-line {
    grid-template-columns:
      1fr
      28px;
  }

  .assignment-worker-numbers {
    grid-column:
      1 / -1;

    grid-row: 2;

    justify-content:
      flex-start;
  }

  .worker-mini-status {
    grid-column: 2;
    grid-row: 1;
  }
}

/* ============================================================
   WORKER UI V2
   ============================================================ */

.worker-body {
  margin: 0;
  background: #f3f3f1;
  color: #171717;
}

.worker-app {
  width: 100%;
  max-width: 720px;
  margin: 0 auto;

  padding:
    28px
    18px
    60px;
}

.worker-app-header {
  margin-bottom: 24px;
}

.worker-brand {
  margin-bottom: 5px;

  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.14em;

  opacity: 0.45;
}

.worker-app-header h1 {
  margin: 0;

  font-size: 38px;
  line-height: 1.05;

  letter-spacing: -0.035em;
}

.worker-date {
  margin-top: 7px;

  font-size: 16px;

  opacity: 0.55;
}


/* ============================================================
   LOGIN
   ============================================================ */

.worker-login-panel {
  padding: 22px;

  background: white;

  border-radius: 20px;

  box-shadow:
    0 4px 20px
    rgba(0, 0, 0, 0.04);
}

.worker-login-title {
  font-size: 25px;
  font-weight: 800;

  letter-spacing: -0.02em;
}

.worker-login-subtitle {
  margin-top: 4px;
  margin-bottom: 18px;

  font-size: 14px;

  opacity: 0.5;
}

.worker-buttons {
  display: grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  gap: 10px;
}

.worker-select-button {
  min-height: 88px;

  padding:
    14px 15px;

  border:
    1px solid #e1e1df;

  border-radius: 15px;

  background: #fafafa;

  text-align: left;

  cursor: pointer;
}

.worker-select-button:active {
  transform:
    scale(0.985);

  background:
    #ededeb;
}

.worker-select-button strong {
  display: block;

  font-size: 18px;
  line-height: 1.2;
}

.worker-select-button span {
  display: block;

  margin-top: 6px;

  font-size: 11px;
  line-height: 1.3;

  opacity: 0.4;
}


/* ============================================================
   CURRENT WORKER
   ============================================================ */

.worker-current-user {
  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 15px;

  margin-bottom: 12px;

  padding:
    15px 16px;

  background: #1c1c1c;
  color: white;

  border-radius: 16px;
}

.worker-current-caption {
  margin-bottom: 2px;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.12em;

  opacity: 0.45;
}

.worker-current-name {
  font-size: 21px;
  font-weight: 800;
}

.worker-change-button {
  min-height: 42px;

  padding:
    0 13px;

  border: 0;
  border-radius: 10px;

  background:
    rgba(255, 255, 255, 0.14);

  color: white;

  font-weight: 700;
}


/* ============================================================
   SUMMARY
   ============================================================ */

.worker-summary {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 8px;

  margin-bottom: 25px;
}

.worker-summary > div {
  padding:
    13px 9px;

  background: white;

  border-radius: 13px;

  text-align: center;
}

.worker-summary span {
  display: block;

  margin-bottom: 3px;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.06em;

  opacity: 0.42;
}

.worker-summary strong {
  display: block;

  font-size: 21px;
  line-height: 1.1;
}

.worker-section-heading {
  margin:
    0 2px 10px;

  font-size: 20px;
  font-weight: 800;
}


/* ============================================================
   ASSIGNMENT
   ============================================================ */

.worker-assignment-card {
  margin-bottom: 14px;

  padding: 19px;

  background: white;

  border-radius: 18px;

  box-shadow:
    0 3px 18px
    rgba(0, 0, 0, 0.035);
}

.worker-project {
  font-size: 20px;
  font-weight: 850;

  line-height: 1.25;

  letter-spacing: -0.015em;
}

.worker-process {
  display: inline-block;

  margin-top: 8px;

  padding:
    5px 9px;

  border-radius: 7px;

  background: #efefed;

  font-size: 12px;
  font-weight: 700;
}

.worker-task {
  margin-top: 17px;

  font-size: 19px;
  line-height: 1.4;
}


/* ============================================================
   PLAN / FACT
   ============================================================ */

.worker-plan-fact {
  display: grid;

  grid-template-columns:
    1fr 1fr;

  gap: 8px;

  margin-top: 18px;
}

.worker-plan-fact > div {
  padding:
    13px 14px;

  border-radius: 12px;

  background: #f4f4f2;
}

.worker-plan-fact span {
  display: block;

  margin-bottom: 2px;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.08em;

  opacity: 0.4;
}

.worker-plan-fact strong {
  display: block;

  font-size: 23px;
}


/* ============================================================
   FACT FORM
   ============================================================ */

.worker-fact-form {
  margin-top: 18px;

  padding-top: 18px;

  border-top:
    1px solid #e9e9e7;
}

.worker-fact-form label {
  display: block;

  margin:
    0 0 7px;

  font-size: 14px;
  font-weight: 750;
}

.worker-fact-form input {
  width: 100%;

  min-height: 58px;

  margin-bottom: 14px;

  padding:
    0 15px;

  border:
    1px solid #d8d8d6;

  border-radius: 12px;

  background: white;

  font-size: 21px;

  outline: none;
}

.worker-fact-form input:focus {
  border-color:
    #777;
}

.worker-fact-buttons {
  display: grid;

  grid-template-columns:
    1fr 1fr;

  gap: 9px;

  margin-top: 3px;
}

.worker-fact-buttons button {
  min-height: 64px;

  border: 0;
  border-radius: 12px;

  padding:
    8px 12px;

  font-size: 16px;
  font-weight: 800;
}

.worker-partial-button {
  background: #ededeb;
  color: #222;
}

.worker-done-button {
  background: #171717;
  color: white;
}

.worker-fact-buttons button:active {
  transform:
    scale(0.985);
}

.worker-fact-buttons button:disabled {
  opacity: 0.45;
}


/* ============================================================
   STATUS
   ============================================================ */

.worker-partial-label {
  margin-top: 12px;

  padding:
    10px 12px;

  border-radius: 10px;

  background: #fff4cd;

  font-size: 13px;
  font-weight: 650;
}

.worker-complete-label {
  margin-top: 16px;

  padding:
    13px;

  border-radius: 11px;

  background: #dff3e4;

  text-align: center;

  font-size: 16px;
  font-weight: 800;
}

.worker-done {
  opacity: 0.65;
}

.worker-done .worker-task {
  margin-bottom: 0;
}


/* ============================================================
   EMPTY
   ============================================================ */

.worker-assignments .empty {
  padding: 30px 20px;

  border-radius: 16px;

  background: white;

  text-align: center;
}

.worker-assignments .empty-title {
  margin-bottom: 5px;

  font-size: 19px;
  font-weight: 800;
}


/* ============================================================
   MOBILE
   ============================================================ */

@media (
  max-width: 600px
) {

  .worker-app {
    padding:
      20px
      11px
      45px;
  }

  .worker-app-header h1 {
    font-size: 34px;
  }

  .worker-buttons {
    grid-template-columns: 1fr;
  }

  .worker-select-button {
    min-height: 70px;
  }

  .worker-assignment-card {
    padding:
      17px 15px;
  }

  .worker-project {
    font-size: 19px;
  }

  .worker-task {
    font-size: 18px;
  }

  .worker-fact-buttons {
    grid-template-columns: 1fr;
  }

  .worker-fact-buttons button {
    min-height: 62px;
  }

  .worker-current-name {
    font-size: 19px;
  }
}

/* ============================================================
   UNPLANNED WORK
   ============================================================ */

.extra-work-main-button {
  width: 100%;

  min-height: 62px;

  margin:
    16px 0 22px;

  border: 0;
  border-radius: 14px;

  background: #e8e8e5;

  font-size: 17px;
  font-weight: 800;
}

.extra-work-panel {
  margin-bottom: 24px;

  padding: 18px;

  background: white;

  border-radius: 18px;
}

.extra-work-title {
  margin-bottom: 13px;

  font-size: 22px;
  font-weight: 850;
}

.extra-work-type-buttons {
  display: grid;

  grid-template-columns:
    1fr 1fr;

  gap: 9px;
}

.extra-type-button {
  min-height: 100px;

  padding: 14px;

  border:
    1px solid #dededb;

  border-radius: 13px;

  background: #f5f5f3;

  text-align: left;
}

.extra-type-button strong {
  display: block;

  font-size: 17px;
}

.extra-type-button span {
  display: block;

  margin-top: 6px;

  font-size: 12px;
  line-height: 1.3;

  opacity: 0.5;
}

.extra-form {
  margin-top: 18px;

  padding-top: 17px;

  border-top:
    1px solid #e8e8e5;
}

.extra-form label {
  display: block;

  margin:
    13px 0 6px;

  font-weight: 750;
}

.extra-form input,
.extra-form select {
  width: 100%;

  min-height: 54px;

  padding:
    0 12px;

  border:
    1px solid #d6d6d3;

  border-radius: 11px;

  background: white;

  font-size: 17px;
}

.extra-save-button {
  width: 100%;

  min-height: 60px;

  margin-top: 16px;

  border: 0;
  border-radius: 12px;

  background: #171717;

  color: white;

  font-size: 17px;
  font-weight: 800;
}

.extra-close-button {
  width: 100%;

  min-height: 48px;

  margin-top: 12px;

  border: 0;

  background: transparent;

  font-weight: 700;

  opacity: 0.5;
}

.extra-project-results {
  max-height: 300px;

  margin-top: 5px;

  overflow-y: auto;

  border:
    1px solid #ddd;

  border-radius: 10px;

  background: white;
}

.extra-project-results button {
  display: block;

  width: 100%;

  padding:
    11px 12px;

  border: 0;
  border-bottom:
    1px solid #eee;

  background: white;

  text-align: left;
}

.extra-project-results strong,
.extra-project-results span {
  display: block;
}

.extra-project-results span {
  margin-top: 3px;

  font-size: 11px;

  opacity: 0.45;
}

.extra-selected-project {
  margin-top: 7px;

  padding: 10px 12px;

  border-radius: 10px;

  background: #e8f2e9;
}

.extra-selected-project strong,
.extra-selected-project span {
  display: block;
}

.extra-selected-project span {
  margin-top: 3px;

  font-size: 12px;

  opacity: 0.5;
}

.today-extra-work {
  margin-top: 22px;
}

.extra-entry {
  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    auto
    36px;

  align-items: center;

  gap: 10px;

  margin-bottom: 8px;

  padding:
    12px 12px;

  background: white;

  border-radius: 12px;
}

.extra-entry-main strong,
.extra-entry-main span,
.extra-entry-main small {
  display: block;
}

.extra-entry-main span {
  margin-top: 3px;

  font-size: 12px;

  opacity: 0.5;
}

.extra-entry-main small {
  margin-top: 4px;

  font-size: 12px;

  opacity: 0.65;
}

.extra-entry-hours {
  font-size: 18px;
  font-weight: 850;
}

.extra-delete {
  width: 34px;
  height: 34px;

  border: 0;
  border-radius: 8px;

  background: #eee;

  font-size: 20px;
}

@media (
  max-width: 600px
) {

  .extra-work-type-buttons {
    grid-template-columns:
      1fr;
  }

  .extra-type-button {
    min-height: 82px;
  }
}

/* ============================================================
   WORKDAY / TIME BALANCE
   ============================================================ */

.workday-card {
  margin-bottom: 14px;
  padding: 18px;

  background: white;
  border-radius: 18px;

  box-shadow:
    0 3px 18px
    rgba(0, 0, 0, 0.035);
}

.workday-title {
  font-size: 22px;
  font-weight: 850;
}

.workday-subtitle {
  margin-top: 3px;
  margin-bottom: 16px;

  font-size: 13px;
  opacity: 0.5;
}

.workday-grid {
  display: grid;
  grid-template-columns:
    1fr 1fr 1fr;

  gap: 9px;
}

.workday-field label {
  display: block;

  margin-bottom: 6px;

  font-size: 12px;
  font-weight: 800;

  opacity: 0.55;
}

.workday-field input {
  width: 100%;
  min-height: 52px;

  padding: 0 11px;

  border:
    1px solid #d7d7d4;

  border-radius: 11px;

  background: white;

  font-size: 18px;
}

.workday-comment-field {
  margin-top: 10px;
}

.workday-save-button {
  width: 100%;

  min-height: 54px;

  margin-top: 13px;

  border: 0;
  border-radius: 12px;

  background: #171717;
  color: white;

  font-size: 16px;
  font-weight: 800;
}

.workday-save-button:disabled {
  opacity: 0.45;
}

.workday-balance {
  margin-top: 14px;

  padding: 14px;

  border-radius: 12px;
}

.workday-balanced {
  background: #dff3e4;
}

.workday-under {
  background: #fff0bd;
}

.workday-over {
  background: #ffdede;
}

.balance-row {
  display: flex;

  justify-content:
    space-between;

  gap: 15px;

  margin-bottom: 7px;

  font-size: 14px;
}

.balance-row strong {
  white-space: nowrap;
}

.balance-result {
  margin-top: 10px;
  padding-top: 10px;

  border-top:
    1px solid
    rgba(0, 0, 0, 0.1);

  font-size: 17px;
  font-weight: 850;
}

@media (
  max-width: 600px
) {

  .workday-grid {
    grid-template-columns:
      1fr 1fr;
  }

  .workday-grid
  .workday-field:last-child {
    grid-column:
      1 / -1;
  }
}

/* ============================================================
   FACT EDITING
   ============================================================ */

.worker-fact-history {
  margin-top: 14px;

  padding: 12px;

  border-radius: 11px;

  background: #f5f5f3;
}

.worker-fact-history-title {
  margin-bottom: 8px;

  font-size: 11px;
  font-weight: 800;

  letter-spacing: 0.06em;

  opacity: 0.45;
}

.worker-fact-history-row {
  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 12px;

  padding: 7px 0;

  border-bottom:
    1px solid #e5e5e2;
}

.worker-fact-history-row:last-child {
  border-bottom: 0;
}

.worker-fact-history-row strong,
.worker-fact-history-row span {
  display: block;
}

.worker-fact-history-row span {
  margin-top: 2px;

  font-size: 12px;

  opacity: 0.55;
}

.worker-fact-history-row button,
.extra-entry-edit {
  min-height: 36px;

  padding:
    0 10px;

  border: 0;
  border-radius: 8px;

  background: #e8e8e5;

  font-size: 12px;
  font-weight: 750;
}


/* overlay */

.fact-edit-overlay {
  position: fixed;

  inset: 0;

  z-index: 1000;

  display: flex;

  align-items: center;
  justify-content: center;

  padding: 18px;

  background:
    rgba(0, 0, 0, 0.46);
}

.fact-edit-card {
  width: 100%;
  max-width: 450px;

  padding: 20px;

  border-radius: 18px;

  background: white;

  box-shadow:
    0 15px 60px
    rgba(0, 0, 0, 0.25);
}

.fact-edit-title {
  font-size: 23px;
  font-weight: 850;
}

.fact-edit-description {
  margin:
    4px 0 17px;

  font-size: 14px;
  line-height: 1.35;

  opacity: 0.55;
}

.fact-edit-card label {
  display: block;

  margin:
    12px 0 6px;

  font-size: 13px;
  font-weight: 750;
}

.fact-edit-card input {
  width: 100%;

  min-height: 55px;

  padding:
    0 13px;

  border:
    1px solid #d5d5d2;

  border-radius: 11px;

  font-size: 19px;
}

.fact-edit-actions {
  display: grid;

  grid-template-columns:
    1fr 1fr;

  gap: 8px;

  margin-top: 17px;
}

.fact-edit-actions button {
  min-height: 54px;

  border: 0;
  border-radius: 11px;

  font-size: 15px;
  font-weight: 800;
}

.fact-edit-cancel {
  background: #ededeb;
}

.fact-edit-save {
  background: #171717;
  color: white;
}

.fact-edit-delete {
  width: 100%;

  min-height: 45px;

  margin-top: 10px;

  border: 0;

  background: transparent;

  color: #a62828;

  font-weight: 750;
}

/* ============================================================
   RP MANAGEMENT TABLE V1
   ============================================================ */

.rp-table-toolbar {
  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 15px;

  margin:
    15px 0 14px;
}

.rp-view-switch {
  display: inline-flex;

  padding: 4px;

  border-radius: 11px;

  background: #ececea;
}

.rp-view-switch button {
  min-height: 38px;

  padding:
    0 13px;

  border: 0;
  border-radius: 8px;

  background: transparent;

  font-size: 13px;
  font-weight: 750;

  cursor: pointer;
}

.rp-view-switch button.active {
  background: white;

  box-shadow:
    0 1px 5px
    rgba(0,0,0,0.08);
}

.rp-table-sort {
  min-height: 42px;

  padding:
    0 10px;

  border:
    1px solid #dadad7;

  border-radius: 9px;

  background: white;
}

.rp-table-group {
  margin-bottom: 18px;

  overflow: hidden;

  border:
    1px solid #dfdfdc;

  border-radius: 14px;

  background: white;
}

.rp-group-header {
  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 15px;

  padding:
    12px 14px;

  background: #f1f1ef;
}

.rp-group-header strong {
  font-size: 15px;
}

.rp-group-header span {
  font-size: 12px;

  white-space: nowrap;

  opacity: 0.55;
}

.rp-table-scroll {
  width: 100%;

  overflow-x: auto;
}

.rp-production-table {
  width: 100%;

  border-collapse: collapse;

  font-size: 13px;
}

.rp-production-table th {
  padding:
    9px 10px;

  border-bottom:
    1px solid #e4e4e1;

  background: #fafaf9;

  text-align: left;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.04em;

  text-transform: uppercase;

  opacity: 0.48;
}

.rp-production-table td {
  padding:
    10px 10px;

  border-bottom:
    1px solid #eeeeeb;

  vertical-align: top;
}

.rp-production-table tbody tr:last-child td {
  border-bottom: 0;
}

.rp-production-table tbody tr:hover {
  background: #fafaf8;
}

.rp-cell-process {
  min-width: 125px;

  font-weight: 700;
}

.rp-cell-project {
  min-width: 220px;

  font-weight: 750;
}

.rp-cell-task {
  min-width: 210px;

  max-width: 360px;

  line-height: 1.35;
}

.rp-cell-employee {
  min-width: 135px;
}

.rp-number {
  min-width: 55px;

  text-align: right;

  font-size: 15px;
  font-weight: 800;
}

.rp-status {
  display: inline-block;

  min-width: 72px;

  padding:
    5px 7px;

  border-radius: 7px;

  text-align: center;

  font-size: 11px;
  font-weight: 750;

  white-space: nowrap;
}

.rp-status-done {
  background: #dff3e4;
}

.rp-status-partial {
  background: #fff0bd;
}

.rp-status-planned {
  background: #ececea;
}

.rp-actions button {
  width: 30px;
  height: 30px;

  border: 0;
  border-radius: 7px;

  background: #eeeeec;

  font-size: 17px;
}


@media (
  max-width: 700px
) {

  .rp-table-toolbar {
    display: block;
  }

  .rp-view-switch {
    display: grid;

    grid-template-columns:
      repeat(3, 1fr);

    width: 100%;
  }

  .rp-view-switch button {
    padding:
      0 5px;
  }

  .rp-table-sort {
    width: 100%;

    margin-top: 8px;
  }

  .rp-group-header {
    align-items: flex-start;
  }

  .rp-group-header span {
    white-space: normal;

    text-align: right;
  }

  .rp-production-table {
    min-width: 900px;
  }
}

/* ============================================================
   PROJECT PROCESS PLAN
   ============================================================ */

.project-process-plan {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 8px;

  margin:
    5px 0 18px;

  padding: 13px;

  border-radius: 13px;
}

.project-process-plan > div {
  padding:
    9px 10px;

  border-radius: 9px;

  background:
    rgba(255,255,255,0.65);
}

.project-process-plan span {
  display: block;

  margin-bottom: 3px;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.05em;

  opacity: 0.48;
}

.project-process-plan strong {
  display: block;

  font-size: 20px;
}

.project-plan-ok {
  background: #e5f2e7;
}

.project-plan-over {
  background: #ffdede;
}

.project-plan-missing {
  background: #fff0bd;
}

.project-plan-status {
  grid-column:
    1 / -1;

  font-size: 13px;
  font-weight: 750;
}

@media (
  max-width: 600px
) {

  .project-process-plan {
    grid-template-columns:
      1fr 1fr;
  }

  .project-plan-status {
    grid-column:
      1 / -1;
  }
}

/* ============================================================
   RP MAIN TABS
   ============================================================ */

.rp-main-tabs {
  display: inline-flex;

  gap: 4px;

  margin:
    2px 0 18px;

  padding: 4px;

  border-radius: 11px;

  background: #e8e8e5;
}

.rp-main-tab {
  min-height: 40px;

  padding:
    0 16px;

  border: 0;
  border-radius: 8px;

  background: transparent;

  font-weight: 800;
}

.rp-main-tab.active {
  background: white;

  box-shadow:
    0 1px 5px
    rgba(0,0,0,0.08);
}


/* ============================================================
   DAY CONTROL
   ============================================================ */

.day-control-summary {
  display: grid;

  grid-template-columns:
    repeat(4, 1fr);

  gap: 8px;

  margin-bottom: 14px;
}

.day-control-summary > div {
  padding:
    13px 11px;

  border-radius: 12px;

  background: white;
}

.day-control-summary span {
  display: block;

  margin-bottom: 3px;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.04em;

  opacity: 0.45;
}

.day-control-summary strong {
  display: block;

  font-size: 20px;
}

.day-control-table-wrap {
  overflow-x: auto;

  border:
    1px solid #dfdfdc;

  border-radius: 14px;

  background: white;
}

.day-control-table {
  width: 100%;

  border-collapse: collapse;

  font-size: 13px;
}

.day-control-table th {
  padding:
    10px;

  border-bottom:
    1px solid #e4e4e1;

  background: #fafaf9;

  text-align: left;

  font-size: 10px;
  font-weight: 800;

  text-transform: uppercase;

  opacity: 0.5;
}

.day-control-table td {
  padding:
    11px 10px;

  border-bottom:
    1px solid #eeeeeb;
}

.day-control-table tbody tr:last-child td {
  border-bottom: 0;
}

.day-control-status {
  display: inline-block;

  min-width: 100px;

  padding:
    6px 8px;

  border-radius: 8px;

  text-align: center;

  font-size: 11px;
  font-weight: 800;
}

.day-control-balanced {
  background: #dff3e4;
}

.day-control-under {
  background: #fff0bd;
}

.day-control-over {
  background: #ffdede;
}

.day-control-no-workday {
  background: #ececea;
}

@media (
  max-width: 700px
) {

  .day-control-summary {
    grid-template-columns:
      repeat(2, 1fr);
  }

  .day-control-table {
    min-width: 850px;
  }

  .rp-main-tabs {
    display: grid;

    grid-template-columns:
      1fr 1fr;

    width: 100%;
  }
}

/* ============================================================
   TIMESHEET
   ============================================================ */

.rp-main-tabs {
  grid-template-columns:
    repeat(3, 1fr);
}

.timesheet-toolbar {
  display: flex;

  align-items: center;

  gap: 10px;

  margin-bottom: 12px;
}

.timesheet-toolbar label {
  font-weight: 800;
}

.timesheet-toolbar input {
  min-height: 42px;

  padding: 0 10px;

  border:
    1px solid #d8d8d5;

  border-radius: 9px;

  background: white;
}

.timesheet-scroll {
  width: 100%;

  overflow-x: auto;

  border:
    1px solid #dfdfdc;

  border-radius: 12px;

  background: white;
}

.timesheet-grid {
  border-collapse: collapse;

  min-width: 1200px;

  font-size: 11px;
}

.timesheet-grid th,
.timesheet-grid td {
  min-width: 34px;

  padding:
    8px 5px;

  border-right:
    1px solid #eeeeeb;

  border-bottom:
    1px solid #eeeeeb;

  text-align: center;
}

.timesheet-grid th {
  background: #f4f4f2;

  font-weight: 800;
}

.timesheet-grid .timesheet-name {
  position: sticky;

  left: 0;

  z-index: 2;

  min-width: 160px;

  background: white;

  text-align: left;

  font-weight: 800;
}

.timesheet-grid thead
.timesheet-name {
  z-index: 3;

  background: #f4f4f2;
}

.timesheet-total {
  font-weight: 850;

  background: #f4f4f2;
}

.timesheet-ok {
  background: #e2f3e6;
}

.timesheet-warning {
  background: #fff0bd;
}

.timesheet-legend {
  margin-top: 9px;

  font-size: 11px;

  opacity: 0.55;
}

/* ============================================================
   TIMESHEET DETAILS V2
   ============================================================ */

.timesheet-day-cell {
  cursor: pointer;
}

.timesheet-day-cell:hover {
  outline:
    2px solid
    rgba(0,0,0,0.12);

  outline-offset:
    -2px;
}

.timesheet-day-overlay {
  position: fixed;

  inset: 0;

  z-index: 1200;

  display: flex;

  align-items: center;
  justify-content: center;

  padding: 18px;

  background:
    rgba(0,0,0,0.46);
}

.timesheet-day-card {
  width: 100%;
  max-width: 470px;

  padding: 20px;

  border-radius: 18px;

  background: white;

  box-shadow:
    0 18px 70px
    rgba(0,0,0,0.26);
}

.timesheet-day-header {
  display: flex;

  align-items: flex-start;
  justify-content: space-between;

  gap: 15px;
}

.timesheet-day-employee {
  font-size: 23px;
  font-weight: 850;
}

.timesheet-day-date {
  margin-top: 3px;

  font-size: 14px;

  opacity: 0.5;
}

.timesheet-day-close {
  width: 38px;
  height: 38px;

  border: 0;
  border-radius: 9px;

  background: #eeeeeb;

  font-size: 22px;
}

.timesheet-day-content {
  margin-top: 18px;
}

.timesheet-detail-grid {
  display: grid;

  grid-template-columns:
    1fr 1fr;

  gap: 8px;
}

.timesheet-detail-grid > div {
  padding: 12px;

  border-radius: 11px;

  background: #f4f4f2;
}

.timesheet-detail-grid span {
  display: block;

  margin-bottom: 3px;

  font-size: 10px;
  font-weight: 800;

  opacity: 0.45;
}

.timesheet-detail-grid strong {
  display: block;

  font-size: 18px;
}

.timesheet-detail-balance {
  margin-top: 12px;

  padding: 13px;

  border-radius: 11px;

  text-align: center;

  font-weight: 850;
}

.timesheet-detail-ok {
  background: #dff3e4;
}

.timesheet-detail-warning {
  background: #fff0bd;
}

.timesheet-detail-danger {
  background: #ffdede;
}

/* ============================================================
   RP TABLE — FIXED ACTIONS COLUMN
   ============================================================ */

.rp-production-table th:last-child,
.rp-actions {
  position: sticky;
  right: 0;
  z-index: 3;

  min-width: 76px;
  width: 76px;

  background: white;

  white-space: nowrap;
}

.rp-production-table th:last-child {
  z-index: 4;
  background: #fafaf9;
}

.rp-production-table tbody tr:hover .rp-actions {
  background: #fafaf8;
}

.rp-actions {
  padding-left: 6px !important;
  padding-right: 6px !important;
}

.rp-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  margin-left: 3px;

  cursor: pointer;
}

/* ============================================================
   ASSIGNMENT EDITOR
   ============================================================ */

#assignmentEditOverlay {
  align-items: flex-start;
  overflow-y: auto;
  padding-top: 30px;
  padding-bottom: 30px;
}

#assignmentEditOverlay .timesheet-day-card {
  max-height: calc(100vh - 60px);
  overflow-y: auto;
}

#assignmentEditWorkers {
  display: grid !important;
  gap: 6px !important;
}

#assignmentEditWorkers label {
  display: flex;
  align-items: center;
  justify-content: flex-start;

  gap: 10px;

  width: 100%;
  min-height: 42px;

  margin: 0;
  padding: 7px 10px;

  border-radius: 9px;

  background: #f5f5f3;

  font-size: 15px;
  font-weight: 650;

  cursor: pointer;
}

#assignmentEditWorkers input[type="checkbox"] {
  flex: 0 0 auto;

  width: 20px !important;
  height: 20px !important;
  min-height: 0;

  margin: 0;
  padding: 0;
}

#assignmentEditWorkers label span {
  display: block;
  min-width: 0;
}

#assignmentEditProject,
#assignmentEditProcess,
#assignmentEditTask {
  width: 100%;
}

#assignmentEditFactInfo {
  padding: 10px 12px;

  border-radius: 9px;

  background: #f1f1ef;
}

@media (max-width: 700px) {

  #assignmentEditOverlay {
    padding:
      12px 8px;
  }

  #assignmentEditOverlay .timesheet-day-card {
    max-height:
      calc(100vh - 24px);

    padding: 16px;
  }
}

/* ============================================================
   ASSIGNMENT PRIORITY
   ============================================================ */

.assignment-worker-row {
  grid-template-columns:
    minmax(0, 1fr)
    120px
    42px;
}

.assignment-worker-priority {
  min-height: 50px;
  text-align: center;
}

#assignmentEditWorkers
.assignment-edit-priority {
  flex: 0 0 110px;
  width: 110px !important;
  min-height: 36px;
  height: 36px;
  padding: 5px 8px;
}

/* ============================================================
   MORNING REPORT
   ============================================================ */

.morning-report-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;

  margin-bottom: 16px;
}

.morning-report-toolbar h2 {
  margin-bottom: 3px;
}

.morning-report-subtitle {
  font-size: 13px;
  opacity: .5;
}

.morning-report-toolbar
.date-input {
  width: auto;
  min-width: 165px;
}

.morning-report-summary {
  display: grid;
  grid-template-columns:
    repeat(4, 1fr);

  gap: 8px;

  margin-bottom: 18px;
}

.morning-report-summary > div {
  padding: 12px;

  border-radius: 11px;

  background: white;
}

.morning-report-summary span {
  display: block;

  margin-bottom: 3px;

  font-size: 10px;
  font-weight: 800;

  opacity: .45;

  text-transform: uppercase;
}

.morning-report-summary strong {
  font-size: 18px;
}

.morning-employee {
  margin-bottom: 18px;

  overflow: hidden;

  border:
    1px solid #dfdfdc;

  border-radius: 14px;

  background: white;
}

.morning-employee-header {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 15px;

  padding: 13px 15px;

  background: #eeeeeb;
}

.morning-employee-header strong {
  font-size: 17px;
}

.morning-employee-header span {
  font-size: 13px;
  font-weight: 750;
}

.morning-assignment {
  display: grid;

  grid-template-columns:
    105px
    minmax(0, 1fr)
    150px;

  gap: 14px;
  align-items: start;

  padding: 14px 15px;

  border-bottom:
    1px solid #ededeb;
}

.morning-assignment:last-child {
  border-bottom: 0;
}

.morning-assignment-checked {
  background: #f3f7f3;
}

.morning-check {
  display: flex;
  align-items: center;

  gap: 7px;

  margin: 2px 0 0;

  font-size: 12px;
  font-weight: 700;

  cursor: pointer;
}

.morning-check input {
  width: 19px !important;
  height: 19px !important;

  min-height: 0;

  margin: 0;
  padding: 0;

  flex: 0 0 auto;
}

.morning-project {
  font-size: 15px;
  font-weight: 800;
}

.morning-meta {
  margin-top: 3px;

  font-size: 12px;

  opacity: .5;
}

.morning-manager-comment,
.morning-worker-comment {
  margin-top: 8px;

  padding: 8px 10px;

  border-radius: 8px;

  font-size: 13px;
  line-height: 1.35;
}

.morning-manager-comment {
  background: #f1f1ef;
}

.morning-worker-comment {
  background: #edf3f8;
}

.morning-manager-comment span,
.morning-worker-comment span {
  font-weight: 800;
}

.morning-result {
  text-align: right;
}

.morning-result > strong {
  display: block;

  margin-bottom: 5px;

  font-size: 18px;
}

.morning-status {
  display: inline-block;

  padding: 5px 7px;

  border-radius: 7px;

  font-size: 11px;
  font-weight: 750;
}

.morning-status-done {
  background: #dff3e4;
}

.morning-status-partial {
  background: #fff0bd;
}

.morning-status-not-started {
  background: #ececea;
}

.morning-status-missing {
  background: #ffdede;
}

.morning-extra-title {
  padding: 10px 15px;

  background: #fafaf8;

  font-size: 11px;
  font-weight: 800;

  text-transform: uppercase;

  opacity: .6;
}

.morning-extra {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 15px;

  padding: 12px 15px;

  border-top:
    1px solid #ededeb;
}

@media (max-width: 700px) {

  .morning-report-toolbar {
    display: block;
  }

  .morning-report-toolbar
  .date-input {
    width: 100%;
    margin-top: 10px;
  }

  .morning-report-summary {
    grid-template-columns:
      1fr 1fr;
  }

  .morning-assignment {
    grid-template-columns:
      1fr;

    gap: 8px;
  }

  .morning-result {
    text-align: left;
  }
}
.project-refresh-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 18px;
}

.project-refresh-status {
  color: #5f6368;
  font-size: 14px;
}