.tf71424-period-panel {
  margin-top: 14px;
  padding: 16px;
  border: 1px solid #cbd9d3;
  border-radius: 12px;
  background: #f7fbf9;
}

.tf71424-period-panel[hidden] {
  display: none !important;
}

.tf71424-period-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.tf71424-period-panel h4,
.tf71424-period-panel p {
  margin: 0;
}

.tf71424-period-panel p {
  margin-top: 4px;
}

.tf71424-period-picker {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  align-items: end;
  gap: 10px;
  margin-top: 14px;
}

.tf71424-period-picker label {
  display: grid;
  gap: 6px;
  font-weight: 700;
}

.tf71424-period-picker select {
  width: 100%;
  min-height: 44px;
}

.tf71424-period-status {
  min-height: 20px;
  margin-top: 9px;
}

.tf71424-pay-error {
  margin-top: 12px;
}

@media (max-width: 760px) {
  .tf71424-period-panel {
    padding: 14px;
  }

  .tf71424-period-panel-head,
  .tf71424-period-picker {
    grid-template-columns: 1fr;
    flex-direction: column;
  }

  .tf71424-period-panel-head .tf71424-close,
  .tf71424-period-picker .btn {
    width: 100%;
  }
}