@import url('/vendor/mosp-design-system/styles.css');

body { padding-bottom: 4rem; }
.scm-hero { background: linear-gradient(135deg, rgba(13,110,253,.09), rgba(13,202,240,.08)); }
.scm-card-link { color: inherit; text-decoration: none; }
.scm-card-link .card { transition: transform .12s ease, box-shadow .12s ease; height: 100%; }
.scm-card-link:hover .card { transform: translateY(-2px); box-shadow: 0 .6rem 1.2rem rgba(0,0,0,.08); }
.scm-status-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: .75rem; }
.scm-status-cell { border: 1px solid var(--bs-border-color); border-radius: .5rem; padding: .75rem; }
.scm-pre { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .86rem; }
.scm-message { border-left: .25rem solid var(--bs-primary); padding: .65rem .85rem; background: var(--bs-tertiary-bg); border-radius: .25rem; }
.scm-message[data-source="taiga"], .scm-message[data-source="scmi"] { border-left-color: var(--bs-success); }
.scm-resource-url { overflow-wrap: anywhere; }
.scm-inline-form { display: grid; grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); gap: .75rem; align-items: end; }
.scm-table-actions { white-space: nowrap; }
[data-mode="scmi"] .subscriber-only, [data-mode="scme"] .operator-only { display: none !important; }

.scm-form-full { grid-column: 1 / -1; min-width: 0; }
.scm-form-section { border: 0; margin: .25rem 0 0; padding: 0; }
.scm-choice-grid,
.scm-use-case-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: .65rem;
  min-width: 0;
}
.scm-choice-card,
.scm-use-case-card {
  border: 1px solid var(--bs-border-color);
  border-radius: .5rem;
  background: var(--bs-body-bg);
  margin: 0;
  min-width: 0;
  padding: .65rem .75rem;
}
.scm-choice-card {
  align-items: flex-start;
  display: flex;
  gap: .55rem;
}
.scm-use-case-card .form-check {
  align-items: flex-start;
  display: flex;
  gap: .5rem;
  padding-left: 0;
}
.scm-choice-card .form-check-input,
.scm-use-case-card .form-check-input {
  flex: 0 0 auto;
  float: none;
  margin-left: 0;
  margin-top: .2rem;
}
.scm-choice-card .form-check-label,
.scm-use-case-card .form-check-label {
  flex: 1 1 auto;
  line-height: 1.35;
  min-width: 0;
  overflow-wrap: anywhere;
}
.scm-route-list { max-height: 26rem; overflow: auto; }
.scm-route-tree { display: grid; gap: .5rem; max-height: 32rem; overflow: auto; }
.scm-route-module {
  border: 1px solid var(--bs-border-color);
  border-radius: .75rem;
  overflow: hidden;
}
.scm-route-module > summary {
  cursor: pointer;
  padding: .7rem 1rem;
  background: var(--bs-tertiary-bg);
}
.scm-route-subsection > summary {
  cursor: pointer;
  padding: .5rem .75rem .5rem 1.5rem;
  font-weight: 600;
  border-bottom: 1px solid var(--bs-border-color);
}
.scm-route-subsection { padding-bottom: .5rem; }
.scm-route-feature > summary {
  cursor: pointer;
  padding: .4rem .75rem .4rem 2.25rem;
  font-size: .925rem;
}
.scm-route-methods { padding: .25rem 0 .5rem 2.75rem; }
.scm-route-method {
  display: flex;
  align-items: center;
  padding: .3rem .5rem;
  border-radius: .35rem;
  cursor: pointer;
}
.scm-route-method:hover { background: var(--bs-tertiary-bg); }
.scm-route-method code { overflow-wrap: anywhere; }
.scm-route-method[hidden] { display: none !important; }
.scm-route-detail-card { max-width: 420px; }
.scm-route-detail-card dl { font-size: .925rem; }
.scm-route-detail-card dt { white-space: nowrap; }
.scm-route-select-all {
  margin-right: .5rem;
  cursor: pointer;
}
.scm-route-module > summary label,
.scm-route-subsection > summary label,
.scm-route-feature > summary label {
  cursor: pointer;
  display: inline-flex;
  align-items: center;
}

.scm-login-shell { max-width: 720px; }
.scm-organisation-select { max-width: 24rem; }

.scm-client-form { display: grid; gap: 1.25rem; }
.scm-client-top-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 1rem;
  align-items: end;
}
.scm-client-section {
  border: 1px solid var(--bs-border-color);
  border-radius: .6rem;
  padding: 1rem;
  min-width: 0;
}
.scm-scope-groups { display: grid; gap: .75rem; }
.scm-scope-group {
  border: 1px solid var(--bs-border-color);
  border-radius: .5rem;
  padding: .65rem .75rem;
}
.scm-scope-group summary { cursor: pointer; font-weight: 600; }
.scm-scope-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: .65rem;
}
.scm-scope-option {
  align-items: flex-start;
  border: 1px solid var(--bs-border-color);
  border-radius: .5rem;
  display: flex;
  gap: .65rem;
  margin: 0;
  min-width: 0;
  padding: .75rem;
}
.scm-scope-option .form-check-input {
  flex: 0 0 auto;
  float: none;
  margin-left: 0;
  margin-top: .2rem;
}
.scm-scope-option > span { min-width: 0; overflow-wrap: anywhere; }
.scm-directory-table > :not(caption) > * > * { padding: .75rem 1rem; }

.scm-wizard-progress {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .75rem;
  margin-bottom: 1.5rem;
}
.scm-wizard-step {
  display: flex;
  align-items: center;
  gap: .65rem;
  border: 1px solid var(--bs-border-color);
  border-radius: .75rem;
  background: var(--bs-body-bg);
  color: var(--bs-secondary-color);
  padding: .75rem;
  text-align: left;
}
.scm-wizard-step > span {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  flex: 0 0 auto;
  border-radius: 50%;
  border: 1px solid currentColor;
}
.scm-wizard-step.is-current {
  border-color: var(--bs-primary);
  color: var(--bs-primary);
  background: rgba(var(--bs-primary-rgb), .05);
}
.scm-wizard-step.is-complete { color: var(--bs-success); }
.scm-wizard-savebar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  border-top: 1px solid var(--bs-border-color);
  background: var(--bs-tertiary-bg);
}
.scm-route-sections { display: grid; gap: .75rem; }
.scm-route-section {
  border: 1px solid var(--bs-border-color);
  border-radius: .75rem;
  overflow: hidden;
}
.scm-route-section > summary {
  cursor: pointer;
  padding: .8rem 1rem;
  font-weight: 600;
  background: var(--bs-tertiary-bg);
}
.scm-feature-block-grid,
.scm-cluster-choice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: .75rem;
  padding: 1rem;
}
.scm-feature-block {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  border: 1px solid var(--bs-border-color);
  border-radius: .65rem;
  padding: .8rem;
  cursor: pointer;
  min-width: 0;
}
.scm-feature-block:hover { border-color: var(--bs-primary); }
.scm-feature-block code { overflow-wrap: anywhere; }
.scm-feature-block[hidden] { display: none !important; }
.scm-callback-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  border: 1px solid var(--bs-border-color);
  border-radius: .65rem;
  padding: .75rem 1rem;
}
.scm-scope-summary {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}
.scm-scope-summary code {
  border: 1px solid var(--bs-border-color);
  border-radius: .4rem;
  padding: .25rem .45rem;
  background: var(--bs-body-bg);
  overflow-wrap: anywhere;
}
.scm-review-tile {
  height: 100%;
  border: 1px solid var(--bs-border-color);
  border-radius: .75rem;
  padding: 1rem;
}
.scm-review-tile span,
.scm-review-tile small { display: block; color: var(--bs-secondary-color); }
.scm-review-tile strong { display: block; margin: .25rem 0; }
.scm-callout {
  border-left: .3rem solid var(--bs-primary);
  background: var(--bs-tertiary-bg);
  padding: 1rem;
  border-radius: .5rem;
}
@media (max-width: 767.98px) {
  .scm-wizard-progress { grid-template-columns: 1fr; }
  .scm-wizard-step { padding: .55rem .75rem; }
}
.scm-selected-thread { outline: 3px solid rgba(var(--bs-primary-rgb), .25); scroll-margin-top: 5rem; }

.scm-support-create,
.scm-support-reply {
  display: grid;
  gap: 1rem;
}
.scm-support-reply textarea { min-height: 7rem; }
.scm-attachments .btn { overflow-wrap: anywhere; }
[data-toggle-thread] { color: inherit; }
[data-toggle-thread]:hover,
[data-toggle-thread]:focus { color: var(--bs-primary); }

/* Shared MOSP collapse buttons contain both state labels; show only the active action. */
[data-bs-toggle="collapse"] .when-expanded { display: inline; }
[data-bs-toggle="collapse"] .when-collapsed { display: none; }
[data-bs-toggle="collapse"].collapsed .when-expanded,
[data-bs-toggle="collapse"][aria-expanded="false"] .when-expanded { display: none; }
[data-bs-toggle="collapse"].collapsed .when-collapsed,
[data-bs-toggle="collapse"][aria-expanded="false"] .when-collapsed { display: inline; }

.scm-secret-value,
.scm-secret-scopes {
  overflow-wrap: anywhere;
  word-break: break-word;
}


/* SCM application branding and long-running integration feedback. */
.navbar-keen .keen-brand-icon {
  width: 2rem;
  height: 2rem;
  object-fit: contain;
  filter: none;
  opacity: 1;
}
.scm-login-logo { width: 3.25rem; height: 3.25rem; object-fit: contain; }
.scm-progress-steps { display: grid; gap: .65rem; }
.scm-progress-step { display: flex; align-items: center; gap: .65rem; color: var(--bs-secondary-color); }
.scm-progress-step i,
.scm-progress-step .spinner-border { width: 1rem; min-width: 1rem; }
.scm-progress-step.is-active { color: var(--bs-body-color); font-weight: 600; }
.scm-progress-step.is-complete { color: var(--bs-success-text-emphasis); }
/* Synchronous progress overlay: avoids Bootstrap modal transition races on fast requests. */
.scm-progress-overlay {
  position: fixed;
  inset: 0;
  z-index: 1090;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgb(0 0 0 / 48%);
}
.scm-progress-overlay[hidden] { display: none !important; }
.scm-progress-dialog {
  width: min(100%, 31rem);
  max-height: calc(100vh - 2rem);
  overflow: auto;
  padding: 1.5rem;
  border: 1px solid var(--bs-border-color);
  border-radius: var(--bs-border-radius-lg);
  background: var(--bs-body-bg);
  box-shadow: var(--bs-box-shadow-lg);
}
html.scm-progress-open { overflow: hidden; }



/* Searchable, sortable SCM data tables. */
.scm-table-toolbar {
  padding: .75rem 1rem;
  border-bottom: 1px solid var(--bs-border-color);
  background: var(--bs-tertiary-bg);
}
.scm-table-search-field { min-width: min(100%, 22rem); max-width: 42rem; }
.scm-table-toolbar + .table-responsive { border-top: 0; }
table[data-scm-table] tbody tr[hidden] { display: none !important; }

/* Keep large OAuth/OIDC inventories readable without forcing one giant Actions column. */
.scm-clients-table { min-width: 78rem; }
.scm-clients-table > :not(caption) > * > * { vertical-align: top; }
.scm-client-col-organisation { width: 11rem; min-width: 10rem; }
.scm-client-col-name { width: 18rem; min-width: 15rem; overflow-wrap: anywhere; }
.scm-client-col-target { width: 6.5rem; }
.scm-client-col-environment { width: 7.5rem; }
.scm-client-col-scopes { min-width: 18rem; width: 30%; }
.scm-client-col-status { width: 7rem; min-width: 6.5rem; }
.scm-client-col-actions { width: 22rem; min-width: 20rem; white-space: normal; }
.scm-client-scope-list,
.scm-action-list {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: .35rem;
}
.scm-action-list .btn { margin: 0; }
tr[data-dssa-panel] > td { background: var(--bs-tertiary-bg); border-top: 2px solid var(--bs-primary); }
@keyframes scm-dssa-flash {
  0%, 100% { background-color: transparent; box-shadow: none; }
  15%, 55% { background-color: rgba(var(--bs-warning-rgb), .35); box-shadow: 0 0 0 .2rem rgba(var(--bs-warning-rgb), .35); }
}
.scm-dssa-flash { animation: scm-dssa-flash 2.6s ease-out; }
@media (prefers-reduced-motion: reduce) {
  .scm-dssa-flash { animation: none; background-color: rgba(var(--bs-warning-rgb), .25); }
}

/* SSC Core API subscription landing panels. */
.scm-service-card {
  --scm-service-rgb: var(--bs-primary-rgb);
  border-top: .3rem solid rgb(var(--scm-service-rgb));
  overflow: hidden;
  position: relative;
  transition: transform .16s ease, box-shadow .16s ease;
}
.scm-service-card:hover {
  box-shadow: 0 .8rem 1.6rem rgb(0 0 0 / 10%);
  transform: translateY(-3px);
}
.scm-service-card-mrd { --scm-service-rgb: var(--bs-success-rgb); }
.scm-service-card-idaas { --scm-service-rgb: var(--bs-info-rgb); }
.scm-service-icon {
  align-items: center;
  animation: scm-service-highlight 9s ease-in-out infinite;
  background: rgba(var(--scm-service-rgb), .12);
  border: 1px solid rgba(var(--scm-service-rgb), .28);
  border-radius: 1rem;
  color: rgb(var(--scm-service-rgb));
  display: inline-flex;
  font-size: 1.55rem;
  height: 3.25rem;
  justify-content: center;
  width: 3.25rem;
}
.scm-service-grid > :nth-child(2) .scm-service-icon { animation-delay: 3s; }
.scm-service-grid > :nth-child(3) .scm-service-icon { animation-delay: 6s; }
.scm-service-subtitle {
  color: var(--bs-body-color);
  font-size: 1.05rem;
  font-weight: 600;
}
.scm-guided-action { animation: scm-guided-action 3.5s ease-in-out infinite; }
@keyframes scm-service-highlight {
  0%, 24%, 100% { box-shadow: 0 0 0 0 rgba(var(--scm-service-rgb), 0); transform: scale(1); }
  8% { box-shadow: 0 0 0 .55rem rgba(var(--scm-service-rgb), .12); transform: scale(1.04); }
}
@keyframes scm-guided-action {
  0%, 70%, 100% { box-shadow: 0 0 0 0 rgba(var(--bs-primary-rgb), 0); }
  82% { box-shadow: 0 0 0 .45rem rgba(var(--bs-primary-rgb), .14); }
}
@media (prefers-reduced-motion: reduce) {
  .scm-service-icon,
  .scm-guided-action { animation: none; }
}

.scm-invitation-page {
  max-width: 780px;
}

.scm-smds-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
  gap: .75rem;
  align-items: start;
}
.scm-form-half { min-width: 0; }