.gsp-time-tracking__panel {
  width: 100%;
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--gsp-color-border, #d6d6d6);
  border-radius: 16px;
  background: var(--gsp-color-surface, #ffffff);
  max-width: 680px;
}

.gsp-time-tracking__panel--admin {
  max-width: none;
}

.gsp-time-tracking__title {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--gsp-color-text-primary, #222222);
}

.gsp-time-tracking__admin-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.gsp-time-tracking__status-card {
  padding: 14px 16px;
  border-radius: 12px;
  background: var(--gsp-color-surface-muted, #f3f4ef);
  color: var(--gsp-color-text-secondary, #555555);
  display: grid;
  gap: 6px;
}

.gsp-time-tracking__status-card--working {
  background: var(--gsp-color-success-soft, #e7f1e2);
  color: var(--gsp-color-success-text, #3f7432);
}

.gsp-time-tracking__status-card--break {
  background: var(--gsp-color-warning-soft, #fff4cc);
  color: var(--gsp-color-warning-text, #7a5a00);
}

.gsp-time-tracking__status-card--completed {
  background: var(--gsp-color-surface-accent, #e7f1e2);
}

.gsp-time-tracking__status-title {
  font-size: 14px;
  font-weight: 700;
}

.gsp-time-tracking__status-main {
  font-size: 16px;
}

.gsp-time-tracking__status-duration {
  font-weight: 600;
}

.gsp-time-tracking__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.gsp-time-tracking__button {
  min-height: 52px;
  padding: 0 16px;
  border: 1px solid var(--gsp-color-border-strong, #c9c9c9);
  border-radius: 10px;
  background: var(--gsp-color-white, #ffffff);
  color: var(--gsp-color-text-primary, #222222);
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.gsp-time-tracking__button--primary {
  background: var(--gsp-color-primary, #5e9f4d);
  color: var(--gsp-color-white, #ffffff);
  border-color: var(--gsp-color-primary, #5e9f4d);
}

.gsp-time-tracking__button--warning {
  background: var(--gsp-color-warning-soft, #fff4cc);
  color: var(--gsp-color-warning-text, #7a5a00);
  border-color: var(--gsp-color-warning, #e6b800);
}

.gsp-time-tracking__button--danger {
  background: var(--gsp-color-danger, #c94a4a);
  color: var(--gsp-color-white, #ffffff);
  border-color: var(--gsp-color-danger, #c94a4a);
}

.gsp-time-tracking__button--secondary {
  min-height: 42px;
  font-size: 13px;
  font-weight: 500;
  background: var(--gsp-color-surface-muted, #f3f4ef);
  color: var(--gsp-color-text-secondary, #666666);
}

.gsp-time-tracking__button:disabled {
  opacity: 0.6;
  cursor: wait;
}

.gsp-time-tracking__utility-action {
  margin-top: 6px;
  display: flex;
  justify-content: flex-end;
}

.gsp-time-tracking__button--utility {
  min-height: 34px;
  padding: 4px 10px;
  border-style: dashed;
  font-size: 12px;
  font-weight: 500;
  background: transparent;
  color: var(--gsp-color-text-secondary, #666666);
}

.gsp-time-tracking__error {
  margin: 0;
  border: 1px solid var(--gsp-color-danger, #c94a4a);
  background: var(--gsp-color-danger-soft, #f6dede);
  color: var(--gsp-color-danger-text, #7f2f2f);
  border-radius: 10px;
  padding: 10px 12px;
}

.gsp-time-tracking__summary {
  border: 1px solid var(--gsp-color-border, #d6d6d6);
  background: var(--gsp-color-surface-muted, #f3f4ef);
  border-radius: 12px;
  padding: 12px;
  display: grid;
  gap: 6px;
}

.gsp-time-tracking__summary-title {
  margin: 0 0 4px;
  font-size: 16px;
}

.gsp-time-tracking__summary-line {
  margin: 0;
}

.gsp-time-tracking__summary-line--strong {
  font-weight: 700;
}

.gsp-time-tracking__admin-filters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}

.gsp-time-tracking__field {
  display: grid;
  gap: 6px;
}

.gsp-time-tracking__field-label {
  font-size: 13px;
  color: var(--gsp-color-text-secondary, #666666);
  font-weight: 600;
}

.gsp-time-tracking__input {
  width: 100%;
  min-height: 42px;
  border-radius: 10px;
  border: 1px solid var(--gsp-color-border, #d6d6d6);
  padding: 8px 10px;
  box-sizing: border-box;
}

.gsp-time-tracking__summary-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
}

.gsp-time-tracking__summary-card {
  border: 1px solid var(--gsp-color-border, #d6d6d6);
  border-radius: 12px;
  background: var(--gsp-color-surface-muted, #f3f4ef);
  padding: 10px;
}

.gsp-time-tracking__summary-card-label {
  margin: 0;
  font-size: 12px;
  color: var(--gsp-color-text-secondary, #666666);
}

.gsp-time-tracking__summary-card-value {
  margin: 4px 0 0;
  font-weight: 700;
  font-size: 16px;
}

.gsp-time-tracking__entries {
  display: grid;
  gap: 10px;
}

.gsp-time-tracking__entry-card {
  border: 1px solid var(--gsp-color-border, #d6d6d6);
  border-radius: 12px;
  padding: 12px;
  background: var(--gsp-color-surface, #ffffff);
}

.gsp-time-tracking__modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(0, 0, 0, 0.45);
}

.gsp-time-tracking__modal {
  width: min(920px, 100%);
  max-height: min(760px, 92vh);
  overflow: auto;
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--gsp-color-border, #d6d6d6);
  border-radius: 16px;
  background: var(--gsp-color-surface, #ffffff);
  box-shadow: var(--gsp-shadow-elevated, 0 12px 30px rgba(0, 0, 0, 0.18));
}

.gsp-time-tracking__modal-head,
.gsp-time-tracking__picker-filters {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.gsp-time-tracking__picker-list,
.gsp-time-tracking__picker-day {
  display: grid;
  gap: 10px;
}

.gsp-time-tracking__picker-day-title {
  margin: 4px 0 0;
  color: var(--gsp-color-text-secondary, #666666);
  font-size: 13px;
  font-weight: 700;
}

.gsp-time-tracking__picker-item {
  width: 100%;
  min-height: 58px;
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid var(--gsp-color-border, #d6d6d6);
  border-radius: 12px;
  background: var(--gsp-color-white, #ffffff);
  color: var(--gsp-color-text-primary, #222222);
  text-align: left;
  cursor: pointer;
}

.gsp-time-tracking__picker-item-main {
  font-weight: 700;
}

.gsp-time-tracking__picker-item-meta {
  color: var(--gsp-color-text-secondary, #666666);
  font-size: 13px;
}

.gsp-time-tracking__entry-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.gsp-time-tracking__entry-title {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
}

.gsp-time-tracking__entry-status {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 600;
  background: var(--gsp-color-surface-muted, #f3f4ef);
}

.gsp-time-tracking__entry-status--working {
  background: var(--gsp-color-success-soft, #e7f1e2);
  color: var(--gsp-color-success-text, #3f7432);
}

.gsp-time-tracking__entry-status--break {
  background: var(--gsp-color-warning-soft, #fff4cc);
  color: var(--gsp-color-warning-text, #7a5a00);
}

.gsp-time-tracking__entry-status--completed {
  background: var(--gsp-color-surface-accent, #e7f1e2);
}

.gsp-time-tracking__entry-line {
  margin: 6px 0 0;
  font-size: 14px;
}

.gsp-time-tracking__entry-line--strong {
  font-weight: 700;
}

.gsp-time-tracking__entry-note {
  margin: 6px 0 0;
  font-size: 13px;
  color: var(--gsp-color-text-secondary, #666666);
}

.gsp-time-tracking__entry-actions {
  margin-top: 10px;
}

.gsp-time-tracking__settings-card {
  display: grid;
  gap: 12px;
}

.gsp-time-tracking__settings-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.gsp-time-tracking__settings-actions--primary .gsp-time-tracking__button {
  min-width: 220px;
}

.gsp-time-tracking__settings-actions--secondary .gsp-time-tracking__button {
  min-width: 260px;
}

.gsp-time-tracking__dialog-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1300;
  background: rgba(0, 0, 0, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.gsp-time-tracking__dialog {
  width: min(100%, 420px);
  background: var(--gsp-color-surface, #ffffff);
  border-radius: 14px;
  border: 1px solid var(--gsp-color-border, #d6d6d6);
  padding: 14px;
  display: grid;
  gap: 12px;
}

.gsp-time-tracking__dialog--detail {
  width: min(100%, 680px);
  max-height: 85vh;
  overflow-y: auto;
}

.gsp-time-tracking__dialog-text {
  margin: 0;
}

.gsp-time-tracking__dialog-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.gsp-time-tracking__placeholder {
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--gsp-color-surface-muted, #f3f4ef);
  color: var(--gsp-color-text-secondary, #666666);
}

.gsp-time-tracking__notes {
  display: grid;
  gap: 6px;
}

.gsp-time-tracking__notes > .gsp-time-tracking__entry-title {
  margin: 4px 0;
}

.gsp-time-tracking__break-card {
  border: 1px solid var(--gsp-color-border, #d6d6d6);
  border-radius: 10px;
  padding: 8px;
}

@media (max-width: 480px) {
  .gsp-time-tracking__panel {
    padding: 14px;
    border-radius: 14px;
    max-width: none;
  }

  .gsp-time-tracking__actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .gsp-time-tracking__button {
    width: 100%;
  }

  .gsp-time-tracking__settings-actions {
    gap: 12px;
  }

  .gsp-time-tracking__settings-actions .gsp-time-tracking__button {
    min-width: 0;
  }

  .gsp-time-tracking__utility-action {
    justify-content: flex-start;
  }

  .gsp-time-tracking__button--utility {
    width: auto;
    max-width: 100%;
    white-space: nowrap;
  }

  .gsp-time-tracking__summary-cards {
    grid-template-columns: 1fr 1fr;
  }

  .gsp-time-tracking__entry-head {
    flex-wrap: wrap;
  }

  .gsp-time-tracking__admin-filters {
    grid-template-columns: 1fr;
  }
}