// Partner Application Review

.par-container {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow-y: auto;
  padding-bottom: 64px; // room for sticky footer
}

.par-loading {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--gb-color-text-secondary, #6b7494);
  padding: 20px 16px;
}

.par-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-size: 13px;
  color: var(--gb-color-text-tertiary, #aab4cc);
}

// ── Header ────────────────────────────────────────────────────────────────────
.par-header {
  padding: 14px 16px;
  border-bottom: 1px solid var(--gb-color-border, rgba(255, 255, 255, 0.08));
  flex-shrink: 0;
}

.par-header__name {
  font-size: 15px;
  font-weight: 700;
  color: var(--gb-color-text-primary, #eef0f6);
  margin-bottom: 5px;
}

.par-header__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--gb-color-text-secondary, #6b7494);
  flex-wrap: wrap;
}

.par-code {
  font-family: var(--gb-font-mono, monospace);
  font-size: 11px;
  color: var(--gb-color-primary, #3d7fff);
}

// ── Sections ──────────────────────────────────────────────────────────────────
.par-section {
  padding: 14px 16px;
  border-bottom: 1px solid var(--gb-color-border-subtle, rgba(255, 255, 255, 0.04));
}

.par-section__title {
  font-size: 10px;
  font-weight: 700;
  color: var(--gb-color-text-tertiary, #aab4cc);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 12px;
}

// ── Info grid (read-only fields) ──────────────────────────────────────────────
.par-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}

.par-info-row {
  padding: 7px 0;
  border-bottom: 1px solid var(--gb-color-border-subtle, rgba(255, 255, 255, 0.03));

  &:nth-child(odd) { padding-right: 16px; border-right: 1px solid var(--gb-color-border-subtle, rgba(255, 255, 255, 0.03)); }
  &:nth-child(even) { padding-left: 16px; }
  &:nth-last-child(-n+2) { border-bottom: none; }
}

.par-info-label {
  display: block;
  font-size: 10px;
  font-weight: 700;
  color: var(--gb-color-text-tertiary, #aab4cc);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  margin-bottom: 2px;
}

.par-info-value {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--gb-color-text-primary, #eef0f6);
}

.par-days--warning { color: var(--gb-color-warning, #f59e0b); }
.par-days--critical { color: var(--gb-color-danger, #f04444); }

// ── Editable fields ───────────────────────────────────────────────────────────
.par-field {
  margin-bottom: 12px;

  &__label {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: var(--gb-color-text-secondary, #b0b8d0);
    margin-bottom: 5px;
  }

  &__input {
    width: 100%;
    background: var(--gb-color-surface-raised, rgba(255, 255, 255, 0.04));
    border: 1.5px solid var(--gb-color-border, rgba(255, 255, 255, 0.10));
    border-radius: 8px;
    padding: 8px 11px;
    color: var(--gb-color-text-primary, #eef0f6);
    font-family: inherit;
    font-size: 12.5px;
    outline: none;
    transition: border-color 0.15s;

    &:focus { border-color: var(--gb-color-primary, #3d7fff); box-shadow: 0 0 0 3px var(--gb-color-primary-subtle, rgba(61, 127, 255, 0.10)); }
    &::placeholder { color: var(--gb-color-text-tertiary, #aab4cc); }
    &--textarea { resize: vertical; min-height: 72px; }
  }
}

.par-required { color: var(--gb-color-danger, #f04444); margin-left: 2px; }

// ── Badges ────────────────────────────────────────────────────────────────────
.par-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 20px;
  font-size: 10.5px;
  font-weight: 600;

  &::before { content: ''; width: 5px; height: 5px; border-radius: 50%; flex-shrink: 0; }
  &--submitted { background: rgba(167, 139, 250, 0.15); color: #a78bfa; &::before { background: #a78bfa; } }
  &--query { background: var(--gb-color-warning-subtle, rgba(245, 158, 11, 0.10)); color: var(--gb-color-warning, #f59e0b); &::before { background: var(--gb-color-warning, #f59e0b); } }
}

// ── Footer ────────────────────────────────────────────────────────────────────
.par-footer {
  position: sticky;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding: 10px 16px;
  border-top: 1px solid var(--gb-color-border, rgba(255, 255, 255, 0.08));
  background: var(--gb-color-surface, #111520);
  flex-shrink: 0;
}

.par-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 500;
  cursor: pointer;
  border: 1.5px solid transparent;
  font-family: inherit;
  transition: all 0.15s;

  &:disabled { opacity: 0.45; cursor: not-allowed; }

  &--success { background: var(--gb-color-success-subtle, rgba(34, 211, 160, 0.10)); color: var(--gb-color-success, #22d3a0); border-color: rgba(34, 211, 160, 0.3); &:hover:not(:disabled) { background: var(--gb-color-success, #22d3a0); color: #fff; } }
  &--warning { background: var(--gb-color-warning-subtle, rgba(245, 158, 11, 0.10)); color: var(--gb-color-warning, #f59e0b); border-color: rgba(245, 158, 11, 0.3); &:hover:not(:disabled) { background: var(--gb-color-warning, #f59e0b); color: #fff; } }
  &--danger  { background: var(--gb-color-danger-subtle, rgba(240, 68, 68, 0.10)); color: var(--gb-color-danger, #f04444); border-color: rgba(240, 68, 68, 0.3); &:hover:not(:disabled) { background: var(--gb-color-danger, #f04444); color: #fff; } }
}

.par-spinner {
  display: inline-block;
  width: 11px;
  height: 11px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-top-color: currentColor;
  border-radius: 50%;
  animation: par-spin 0.7s linear infinite;
}

@keyframes par-spin { to { transform: rotate(360deg); } }

// ── RTL support ───────────────────────────────────────────────────────────────
[dir="rtl"] {
  .par-header__meta,
  .par-footer { flex-direction: row-reverse; }
  .par-info-row {
    &:nth-child(odd) { padding-right: 0; padding-left: 16px; border-right: none; border-left: 1px solid var(--gb-color-border-subtle, rgba(255, 255, 255, 0.03)); }
    &:nth-child(even) { padding-left: 0; padding-right: 16px; }
  }
}
