@layer ll-service-extension.components {
  .ll-service-extension .ll-se-access-gate {
    display: grid;
    gap: var(--ll-se-space-3);
    justify-items: start;
    padding: var(--ll-se-space-5);
    color: var(--ll-se-color-text-primary);
    background: var(--ll-se-color-warning-soft);
    border: 0.0625rem solid var(--ll-se-color-warning);
    border-radius: var(--ll-se-radius-md);
  }

  .ll-service-extension .ll-se-access-gate[hidden],
  .ll-service-extension .ll-se-access-gate__action[hidden] {
    display: none;
  }

  .ll-service-extension .ll-se-access-gate[data-outcome="UNAVAILABLE"] {
    background: var(--ll-se-color-danger-soft);
    border-color: var(--ll-se-color-danger);
  }

  .ll-service-extension .ll-se-access-gate__message {
    margin: 0;
    overflow-wrap: anywhere;
  }

  .ll-service-extension .ll-se-access-gate__action {
    min-block-size: 2.75rem;
    padding: var(--ll-se-space-2) var(--ll-se-space-4);
    color: var(--ll-se-color-text-primary);
    cursor: pointer;
    background: var(--ll-se-color-surface-raised);
    border: 0.0625rem solid var(--ll-se-color-border-strong);
    border-radius: var(--ll-se-radius-sm);
  }
}