/* Shared styles for OnlineSaleOrchestrator Razor Pages.
   Visual conventions are aligned with Identity Server's SSO login UI so that
   the user experience is consistent end-to-end (fonts, colors, container chrome).
   Bootstrap 4.6 (loaded separately) provides the underlying grid + button styles. */

body {
    margin: 0;
    font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    color: black;
}

/* Header logo sized to match the IS login page. */
body header img {
    width: 6em;
}

/* Page background: light grey behind the white content card (same as IS login page). */
.body-bg {
    background-color: #F0F0F0;
    min-height: 100vh;
    padding: 0;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    line-height: 1.2;
    margin-top: 0;
    margin-bottom: 2em;
}

h1 {
    font-size: 1.38rem;
}

/* Card container — white card with full rounded corners and drop shadow. */
.sso-container-top {
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
    font-family: "Open Sans", sans-serif;
}

/* Card-body padding matches IS: more vertical breathing room than horizontal. */
body main .card-title {
    margin-bottom: 1em;
}

body main .card-body {
    padding: 2.25em 1.5em 3em 1.5em;
}

/* Primary action button — brand blue with hover state matching IS. */
.sso-primary {
    background-color: #0066FF;
    border-color: #0066FF;
    color: #fff;
    padding: 14px 40px;
}

.sso-primary:not(:disabled):not(.disabled):hover,
.sso-primary:not(:disabled):not(.disabled):active,
.btn-primary.sso-primary:not(:disabled):not(.disabled):active {
    background-color: #3284FF;
    border-color: #3284FF;
    color: #fff;
}

.sso-primary:disabled,
.sso-primary.disabled {
    background-color: #99c2ff;
    border-color: #99c2ff;
    cursor: not-allowed;
}

/* Inline link variant — brand blue, semi-bold. */
.sso-link {
    font-weight: 600;
    color: #0066FF;
}

.sso-link:hover {
    color: #0066FF;
}

/* Form controls. */
.sso-input {
    border: 1px solid #CCCCCC;
    border-radius: .25rem;
    padding-top: 10px;
    padding-bottom: 10px;
    max-height: 45px;
    height: auto;
}

/* Checkbox — sized to match IS (18×18) with focus outline. */
.form-check-input {
    height: 18px;
    width: 18px;
    margin-top: 0.125rem;
}

.form-check-input:focus {
    outline: 2px solid #0066FF;
}

.sso-checkbox-container {
    height: 18px;
}

.sso-checkbox,
.sso-checkbox-label {
    vertical-align: middle;
}

.sso-shadow {
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
}

/* Trace ID / contact-support boxes used by the error pages. */
.support-box {
    background: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 0.75rem 1rem;
    margin-top: 1.5rem;
    font-size: 0.9rem;
    color: #6b6b6b;
}

.support-box code {
    font-family: monospace;
    font-size: 0.85rem;
    color: #333;
}

/* Action row used by error pages and any page placing a single CTA at the bottom. */
.actions {
    margin-top: 1.5rem;
    text-align: center;
}
