/* Ganymede v4 clean Command UI overrides for Razor/Identity pages. */

.id-shell,
.id-shell * {
  box-sizing: border-box;
}

.id-shell {
  --id-bg: #f0f2f5;
  --id-topbar: #001529;
  --id-card: #fff;
  --id-card-soft: #fafafa;
  --id-border: #f0f0f0;
  --id-border-strong: #d9d9d9;
  --id-text: rgba(0,0,0,0.88);
  --id-text-muted: rgba(0,0,0,0.65);
  --id-text-dim: rgba(0,0,0,0.45);
  --id-accent: #1677ff;
  --id-accent-hover: #4096ff;
  --id-accent-active: #0958d9;
  --id-danger: #cf1322;
  --id-danger-hover: #ff4d4f;
  --id-danger-bg: #fff1f0;
  --id-danger-border: #ffa39e;
  --id-success: #389e0d;
  --id-success-bg: #f6ffed;
  --id-success-border: #b7eb8f;
  --id-info: #0958d9;
  --id-info-bg: #e6f4ff;
  --id-info-border: #91caff;
  min-height: 100vh;
  display: grid;
  grid-template-rows: 56px 1fr auto;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,.018) 0 1px, transparent 1px 32px),
    repeating-linear-gradient(90deg, rgba(0,0,0,.018) 0 1px, transparent 1px 32px),
    var(--id-bg);
  color: var(--id-text);
  font-family: var(--font-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif);
  font-size: 14px;
  line-height: 1.55;
}

.id-topbar {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 0 24px;
  background: var(--id-topbar);
  color: #fff;
}

.id-logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
}

.id-logo:hover,
.id-logo:focus-visible {
  color: #fff;
}

.id-logo-img {
  filter: drop-shadow(0 0 8px rgba(22,119,255,0.5));
}

.id-logo-text {
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0;
}

.id-topbar-spacer {
  flex: 1;
}

.id-topbar-link {
  color: rgba(255,255,255,0.72);
  font-size: 13px;
  text-decoration: none;
  transition: color 160ms ease;
}

.id-topbar-link:hover,
.id-topbar-link:focus-visible {
  color: #fff;
}

.id-main {
  width: min(1040px, calc(100% - 48px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(280px, 420px) minmax(320px, 480px);
  gap: 24px;
  align-items: center;
  justify-content: center;
  padding: 48px 0;
}

.id-main-manage {
  width: min(1120px, calc(100% - 48px));
  grid-template-columns: minmax(280px, 400px) minmax(380px, 620px);
}

.id-brief,
.id-card {
  background: var(--id-card);
  border: 1px solid var(--id-border);
  border-radius: 8px;
  box-shadow: 0 1px 2px 0 rgba(0,0,0,.03), 0 1px 6px -1px rgba(0,0,0,.02), 0 2px 4px 0 rgba(0,0,0,.02);
}

.id-brief {
  min-height: 520px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 14px;
  padding: 32px;
  color: #fff;
  border-color: rgba(0,21,41,0.12);
  background:
    linear-gradient(180deg, rgba(0,21,41,0.08), rgba(0,21,41,0.92)),
    radial-gradient(circle at 72% 28%, rgba(22,119,255,0.5), transparent 30%),
    var(--id-topbar);
  overflow: hidden;
}

.id-brief .id-kicker {
  color: rgba(255,255,255,0.62);
}

.id-brief h2 {
  margin: 0;
  color: #fff;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.12;
}

.id-brief p {
  max-width: 330px;
  margin: 0;
  color: rgba(255,255,255,0.72);
}

.id-brief-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0 0;
}

.id-brief-stats div {
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 6px;
  background: rgba(255,255,255,0.07);
}

.id-brief-stats dt {
  color: rgba(255,255,255,0.52);
  font-family: var(--font-mono, "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.id-brief-stats dd {
  margin: 3px 0 0;
  color: #fff;
  font-weight: 600;
}

.id-card {
  width: 100%;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.id-card-manage {
  gap: 24px;
}

.id-card-header {
  display: grid;
  gap: 8px;
}

.id-kicker {
  color: var(--id-accent);
  font-family: var(--font-mono, "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.id-card-header h1 {
  margin: 0;
  color: var(--id-text);
  font-family: inherit;
  font-size: 30px;
  font-weight: 600;
  line-height: 1.16;
}

.id-card-header p {
  margin: 0;
  color: var(--id-text-muted);
  line-height: 1.6;
}

.id-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.id-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.id-field label {
  color: var(--id-text);
  font-size: 13px;
  font-weight: 500;
}

.id-field input,
.id-field select,
.id-field textarea {
  min-height: 40px;
  border: 1px solid var(--id-border-strong);
  border-radius: 6px;
  background: #fff;
  color: var(--id-text);
  font: 14px/1.45 var(--font-body, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  padding: 4px 11px;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.id-field input:hover,
.id-field select:hover,
.id-field textarea:hover {
  border-color: var(--id-accent-hover);
}

.id-field input:focus,
.id-field select:focus,
.id-field textarea:focus {
  border-color: var(--id-accent);
  box-shadow: 0 0 0 2px rgba(5,145,255,0.1);
  outline: 0;
}

.id-field input::placeholder,
.id-field textarea::placeholder {
  color: rgba(0,0,0,0.32);
}

.id-check {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--id-text-muted);
  font-size: 13px;
  cursor: pointer;
}

.id-check input {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  accent-color: var(--id-accent);
}

.id-submit,
.id-action {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--id-accent);
  border-radius: 6px;
  background: var(--id-accent);
  color: #fff;
  cursor: pointer;
  font: 500 14px/1 var(--font-body, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  letter-spacing: 0;
  text-decoration: none;
  text-transform: none;
  box-shadow: 0 2px 0 rgba(5,145,255,0.1);
  transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.id-submit:hover:not(:disabled),
.id-submit:focus-visible:not(:disabled),
.id-action:hover,
.id-action:focus-visible {
  background: var(--id-accent-hover);
  border-color: var(--id-accent-hover);
  color: #fff;
  box-shadow: 0 3px 6px -4px rgba(0,0,0,.12), 0 6px 16px 0 rgba(0,0,0,.08);
  outline: 0;
}

.id-submit:active:not(:disabled),
.id-action:active {
  transform: translateY(1px);
  box-shadow: none;
}

.id-submit:disabled {
  border-color: var(--id-border-strong);
  background: rgba(0,0,0,0.04);
  color: var(--id-text-dim);
  cursor: not-allowed;
  box-shadow: none;
}

.id-submit-danger {
  background: var(--id-danger);
  border-color: var(--id-danger);
}

.id-submit-danger:hover:not(:disabled),
.id-submit-danger:focus-visible:not(:disabled) {
  background: var(--id-danger-hover);
  border-color: var(--id-danger-hover);
}

.id-links {
  display: flex;
  align-items: center;
  gap: 10px 16px;
  flex-wrap: wrap;
}

.id-links a,
.id-link {
  color: var(--id-accent);
  font-size: 13px;
  text-decoration: none;
  transition: color 160ms ease;
}

.id-links a:hover,
.id-links a:focus-visible,
.id-link:hover,
.id-link:focus-visible {
  color: var(--id-accent-hover);
}

.id-status-message,
.id-validation-summary {
  border-radius: 6px;
  padding: 10px 12px;
  font-size: 13px;
  line-height: 1.5;
}

.id-status-message {
  color: var(--id-info);
  background: var(--id-info-bg);
  border: 1px solid var(--id-info-border);
}

.id-status-ok {
  color: var(--id-success);
  background: var(--id-success-bg);
  border-color: var(--id-success-border);
}

.id-status-error {
  color: var(--id-danger);
  background: var(--id-danger-bg);
  border-color: var(--id-danger-border);
}

.id-validation-summary {
  color: var(--id-danger);
  background: var(--id-danger-bg);
  border: 1px solid var(--id-danger-border);
}

.id-validation-summary:empty {
  display: none;
}

.id-validation-summary ul {
  margin: 0;
  padding-left: 18px;
}

.text-danger,
.validation-message,
.field-validation-error {
  color: var(--id-danger) !important;
  font-size: 12px;
}

.field-validation-valid {
  display: none;
}

.id-profile-grid {
  display: grid;
  gap: 12px;
}

.id-profile-row {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr);
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--id-border);
  border-radius: 6px;
  background: var(--id-card-soft);
}

.id-profile-row dt {
  color: var(--id-text-dim);
  font-family: var(--font-mono, "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace);
  font-size: 11px;
  letter-spacing: 0.08em;
  margin: 0;
  text-transform: uppercase;
}

.id-profile-row dd {
  min-width: 0;
  margin: 0;
  color: var(--id-text);
  overflow-wrap: anywhere;
}

.id-manage-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.id-manage-actions a,
.id-manage-actions button {
  width: 100%;
}

.id-manage-shell {
  display: grid;
  gap: 24px;
}

.id-manage-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 6px;
  border: 1px solid var(--id-border);
  border-radius: 8px;
  background: var(--id-card-soft);
}

.id-manage-link {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--id-text-muted);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.25;
  text-decoration: none;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease;
}

.id-manage-link:hover,
.id-manage-link:focus-visible {
  color: var(--id-accent);
  background: #fff;
  border-color: var(--id-info-border);
  outline: 0;
}

.id-manage-link.is-active {
  color: #fff;
  background: var(--id-accent);
  border-color: var(--id-accent);
  box-shadow: 0 2px 0 rgba(5,145,255,0.1);
}

.id-manage-content {
  display: grid;
  gap: 20px;
  min-width: 0;
}

.id-footer {
  padding: 16px 24px;
  color: rgba(0,0,0,0.45);
  text-align: center;
  font-size: 12px;
}

/* Built-in Identity UI compatibility inside the Ganymede auth shell. */
.id-card h1,
.id-card h2,
.id-card h3,
.id-card h4,
.id-card h5,
.id-card h6 {
  margin: 0;
  color: var(--id-text);
  font-family: inherit;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.2;
}

.id-card h1 {
  font-size: 30px;
}

.id-card h2 {
  font-size: 22px;
}

.id-card h3 {
  font-size: 18px;
}

.id-card p {
  margin: 0;
  color: var(--id-text-muted);
}

.id-card a:not(.id-action):not(.id-manage-link):not(.id-logo):not(.id-topbar-link) {
  color: var(--id-accent);
  text-decoration: none;
  transition: color 160ms ease;
}

.id-card a:not(.id-action):not(.id-manage-link):hover,
.id-card a:not(.id-action):not(.id-manage-link):focus-visible {
  color: var(--id-accent-hover);
}

.id-card hr {
  width: 100%;
  height: 1px;
  margin: 4px 0;
  border: 0;
  background: var(--id-border);
}

.id-card ul,
.id-card ol {
  margin: 0;
  padding-left: 18px;
  color: var(--id-text);
}

.id-card li {
  color: var(--id-text);
  margin: 4px 0;
}

.id-card .row {
  display: grid;
  gap: 16px;
  margin: 0;
}

.id-card [class*="col-"],
.id-card .col,
.id-card .col-md-4,
.id-card .col-md-6,
.id-card .col-md-8,
.id-card .col-md-12 {
  width: 100%;
  max-width: none;
  padding: 0;
}

.id-card .w-100 {
  width: 100%;
}

.id-card .mb-1 { margin-bottom: 4px; }
.id-card .mb-2 { margin-bottom: 8px; }
.id-card .mb-3 { margin-bottom: 16px; }
.id-card .mt-2 { margin-top: 8px; }
.id-card .mt-3 { margin-top: 16px; }
.id-card .pt-3 { padding-top: 16px; }

.id-card .form-group,
.id-card .form-floating,
.id-card .form-check {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.id-card .form-floating > label {
  order: -1;
  color: var(--id-text);
  font-size: 13px;
  font-weight: 500;
  transform: none;
}

.id-card .form-label,
.id-card label {
  color: var(--id-text);
  font-size: 13px;
  font-weight: 500;
}

.id-card .form-control,
.id-card .form-select,
.id-card input:not([type="checkbox"]):not([type="radio"]),
.id-card select,
.id-card textarea {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--id-border-strong);
  border-radius: 6px;
  background: #fff;
  color: var(--id-text);
  font: 14px/1.45 var(--font-body, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  padding: 4px 11px;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.id-card .form-control:hover,
.id-card .form-select:hover,
.id-card input:not([type="checkbox"]):not([type="radio"]):hover,
.id-card select:hover,
.id-card textarea:hover {
  border-color: var(--id-accent-hover);
}

.id-card .form-control:focus,
.id-card .form-select:focus,
.id-card input:not([type="checkbox"]):not([type="radio"]):focus,
.id-card select:focus,
.id-card textarea:focus {
  border-color: var(--id-accent);
  box-shadow: 0 0 0 2px rgba(5,145,255,0.1);
  outline: 0;
}

.id-card .form-control:disabled,
.id-card .form-select:disabled,
.id-card input:disabled,
.id-card select:disabled,
.id-card textarea:disabled {
  background: rgba(0,0,0,0.04);
  color: var(--id-text-muted);
  cursor: not-allowed;
}

.id-card .form-control::placeholder,
.id-card input::placeholder,
.id-card textarea::placeholder {
  color: rgba(0,0,0,0.32);
}

.id-card .form-check {
  flex-direction: row;
  align-items: center;
  gap: 8px;
  color: var(--id-text-muted);
}

.id-card .form-check-input,
.id-card input[type="checkbox"],
.id-card input[type="radio"] {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  accent-color: var(--id-accent);
}

.id-card .form-text,
.id-card .text-muted,
.id-card small {
  color: var(--id-text-dim) !important;
  font-size: 12px;
}

.id-card .btn {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--id-accent);
  border-radius: 6px;
  background: var(--id-accent);
  color: #fff;
  cursor: pointer;
  font: 500 14px/1 var(--font-body, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  letter-spacing: 0;
  padding: 4px 15px;
  text-decoration: none;
  text-transform: none;
  box-shadow: 0 2px 0 rgba(5,145,255,0.1);
  transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease, transform 160ms ease;
}

.id-card .btn:hover,
.id-card .btn:focus-visible {
  background: var(--id-accent-hover);
  border-color: var(--id-accent-hover);
  color: #fff;
  box-shadow: 0 3px 6px -4px rgba(0,0,0,.12), 0 6px 16px 0 rgba(0,0,0,.08);
  outline: 0;
}

.id-card .btn:active {
  transform: translateY(1px);
  box-shadow: none;
}

.id-card .btn:disabled {
  border-color: var(--id-border-strong);
  background: rgba(0,0,0,0.04);
  color: var(--id-text-dim);
  cursor: not-allowed;
  box-shadow: none;
}

.id-card .btn-secondary,
.id-card .btn-outline-primary,
.id-card .btn-outline-secondary {
  background: #fff;
  color: var(--id-accent);
}

.id-card .btn-secondary:hover,
.id-card .btn-secondary:focus-visible,
.id-card .btn-outline-primary:hover,
.id-card .btn-outline-primary:focus-visible,
.id-card .btn-outline-secondary:hover,
.id-card .btn-outline-secondary:focus-visible {
  background: var(--id-info-bg);
  border-color: var(--id-accent-hover);
  color: var(--id-accent-hover);
}

.id-card .btn-danger {
  border-color: var(--id-danger);
  background: var(--id-danger);
}

.id-card .btn-danger:hover,
.id-card .btn-danger:focus-visible {
  border-color: var(--id-danger-hover);
  background: var(--id-danger-hover);
}

.id-card .btn-link {
  min-height: 0;
  border: 0;
  background: transparent;
  color: var(--id-accent);
  padding: 0;
  box-shadow: none;
}

.id-card .btn-link:hover,
.id-card .btn-link:focus-visible {
  background: transparent;
  color: var(--id-accent-hover);
  box-shadow: none;
}

.id-card .alert {
  border-radius: 6px;
  padding: 10px 12px;
  color: var(--id-info);
  background: var(--id-info-bg);
  border: 1px solid var(--id-info-border);
  font-size: 13px;
}

.id-card .alert-success {
  color: var(--id-success);
  background: var(--id-success-bg);
  border-color: var(--id-success-border);
}

.id-card .alert-danger,
.id-card .alert-error,
.id-card .validation-summary-errors {
  color: var(--id-danger);
  background: var(--id-danger-bg);
  border-color: var(--id-danger-border);
}

.id-card .validation-summary-valid {
  display: none;
}

.id-card .nav,
.id-card .nav-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 6px;
  list-style: none;
  border: 1px solid var(--id-border);
  border-radius: 8px;
  background: var(--id-card-soft);
}

.id-card .nav-link {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--id-text-muted);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.25;
  text-decoration: none;
}

.id-card .nav-link:hover,
.id-card .nav-link:focus-visible {
  color: var(--id-accent);
  background: #fff;
  border-color: var(--id-info-border);
}

.id-card .nav-link.active {
  color: #fff;
  background: var(--id-accent);
  border-color: var(--id-accent);
}

.id-card table {
  width: 100%;
  border-collapse: collapse;
  color: var(--id-text);
  font-size: 13px;
}

.id-card th,
.id-card td {
  padding: 10px 8px;
  border-bottom: 1px solid var(--id-border);
  text-align: left;
  vertical-align: top;
}

.id-card th {
  color: var(--id-text-dim);
  font-weight: 600;
}

@media (max-width: 860px) {
  .id-topbar {
    padding: 0 18px;
  }

  .id-topbar-link {
    display: none;
  }

  .id-main,
  .id-main-manage {
    width: min(100% - 32px, 560px);
    grid-template-columns: 1fr;
    padding: 24px 0;
  }

  .id-brief {
    display: none;
  }

  .id-card {
    padding: 24px;
  }

  .id-card-header h1,
  .id-card h1 {
    font-size: 26px;
  }

  .id-profile-row {
    grid-template-columns: 1fr;
  }

  .id-manage-actions {
    grid-template-columns: 1fr;
  }

  .id-manage-nav,
  .id-card .nav,
  .id-card .nav-pills {
    display: grid;
    grid-template-columns: 1fr;
  }
}
