/*
 * Sales Intellect Website Access - sign-in panel.
 *
 * Override any of these on :root (or a parent) from the theme:
 * --siwa-panel-width, --siwa-accent, --siwa-accent-text, --siwa-radius,
 * --siwa-font, --siwa-bg, --siwa-text, --siwa-muted, --siwa-border,
 * --siwa-backdrop, --siwa-shadow, --siwa-duration, --siwa-z.
 * Defaults live in the var() fallbacks so a value set on :root always wins.
 */

.siwa-scroll-lock,
.siwa-scroll-lock body {
	overflow: hidden !important;
}

.siwa-panel-root[hidden],
.siwa-panel-root [hidden] {
	display: none !important;
}

.siwa-panel-root {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: var(--siwa-z, 100000);
	font-family: var(--siwa-font, inherit);
}

.siwa-panel-backdrop {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: var(--siwa-backdrop, rgba(0, 0, 0, 0.45));
	opacity: 0;
	transition: opacity var(--siwa-duration, 0.3s) ease;
}

.siwa-panel {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	width: var(--siwa-panel-width, 400px);
	max-width: 100%;
	background: var(--siwa-bg, #fff);
	color: var(--siwa-text, #1d2327);
	box-shadow: var(--siwa-shadow, 0 0 24px rgba(0, 0, 0, 0.18));
	transform: translateX(100%);
	transition: transform var(--siwa-duration, 0.3s) ease;
	outline: none;
	line-height: 1.5;
}

.siwa-panel-left .siwa-panel {
	right: auto;
	left: 0;
	transform: translateX(-100%);
}

.siwa-panel-root.is-open .siwa-panel {
	transform: none;
}

.siwa-panel-root.is-open .siwa-panel-backdrop {
	opacity: 1;
}

.siwa-panel-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 20px;
	border-bottom: 1px solid var(--siwa-border, rgba(0, 0, 0, 0.1));
}

.siwa-panel .siwa-panel-title {
	margin: 0;
	font-family: inherit;
	font-size: 1.25rem;
	line-height: 1.3;
	color: inherit;
}

.siwa-panel-close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin: -8px -8px -8px 0;
	padding: 0;
	border: 0;
	border-radius: var(--siwa-radius, 6px);
	background: transparent;
	color: inherit;
	cursor: pointer;
}

.siwa-panel-close:hover {
	background: var(--siwa-border, rgba(0, 0, 0, 0.08));
}

.siwa-panel-body {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 20px;
	-webkit-overflow-scrolling: touch;
}

.siwa-panel p {
	margin: 0 0 16px;
}

.siwa-panel-message:empty {
	display: none;
}

.siwa-panel-message {
	margin: 0 0 16px;
	padding: 10px 12px;
	border-left: 4px solid var(--siwa-muted, #646970);
	border-radius: var(--siwa-radius, 6px);
	background: rgba(0, 0, 0, 0.04);
}

.siwa-panel-message-error {
	border-color: #b32d2e;
	background: #fcf0f1;
	color: #3c0d0e;
}

.siwa-panel-message-success {
	border-color: #008a20;
	background: #edfaef;
	color: #0b2e13;
}

.siwa-panel-field label {
	display: block;
	margin-bottom: 4px;
	font-weight: 600;
}

.siwa-panel-remember label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: normal;
}

.siwa-panel input[type="email"],
.siwa-panel input[type="text"],
.siwa-panel input[type="password"] {
	display: block;
	box-sizing: border-box;
	width: 100%;
	min-height: 44px;
	margin: 0;
	padding: 8px 12px;
	border: 1px solid var(--siwa-border, rgba(0, 0, 0, 0.25));
	border-radius: var(--siwa-radius, 6px);
	background: var(--siwa-bg, #fff);
	color: inherit;
	font: inherit;
}

.siwa-panel input:focus-visible,
.siwa-panel button:focus-visible,
.siwa-panel a:focus-visible,
.siwa-float:focus-visible,
.siwa-login-button:focus-visible {
	outline: 2px solid var(--siwa-accent, #2271b1);
	outline-offset: 2px;
}

.siwa-password-wrap {
	position: relative;
	display: block;
}

.siwa-panel .siwa-password-wrap input {
	padding-right: 48px;
}

.siwa-password-toggle {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--siwa-muted, #646970);
	cursor: pointer;
}

.siwa-password-toggle .siwa-icon-eye-off,
.siwa-password-toggle[aria-pressed="true"] .siwa-icon-eye {
	display: none;
}

.siwa-password-toggle[aria-pressed="true"] .siwa-icon-eye-off {
	display: inline;
}

.siwa-panel-submit,
.siwa-panel-secondary,
.siwa-float,
.siwa-gate-open .siwa-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	box-sizing: border-box;
	min-height: 44px;
	padding: 8px 18px;
	border: 1px solid var(--siwa-accent, #2271b1);
	border-radius: var(--siwa-radius, 6px);
	font: inherit;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
}

.siwa-panel-submit,
.siwa-float,
.siwa-gate-open .siwa-button {
	background: var(--siwa-accent, #2271b1);
	color: var(--siwa-accent-text, #fff);
}

.siwa-panel .siwa-panel-submit {
	width: 100%;
	color: var(--siwa-accent-text, #fff);
}

.siwa-panel-secondary {
	background: transparent;
	color: var(--siwa-accent, #2271b1);
}

.siwa-panel-submit[disabled],
.siwa-panel-submit[aria-disabled="true"] {
	opacity: 0.75;
	cursor: progress;
}

.siwa-panel .siwa-panel-links {
	margin: 16px 0 0;
}

.siwa-panel a,
.siwa-link-button {
	color: var(--siwa-accent, #2271b1);
}

.siwa-link-button {
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	text-decoration: underline;
	cursor: pointer;
}

.siwa-panel-roles ul {
	margin: 0 0 16px;
	padding-left: 20px;
}

.siwa-panel-confirm-actions {
	display: flex;
	gap: 8px;
}

.siwa-panel .siwa-panel-confirm-actions > * {
	flex: 1 1 0;
	width: auto;
}

.siwa-spinner {
	display: inline-block;
	width: 1em;
	height: 1em;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: siwa-spin 0.75s linear infinite;
	vertical-align: -0.125em;
}

@keyframes siwa-spin {
	to {
		transform: rotate(360deg);
	}
}

.siwa-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.siwa-float {
	position: fixed;
	bottom: 20px;
	z-index: calc(var(--siwa-z, 100000) - 1);
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

.siwa-float-bottom-right {
	right: 20px;
}

.siwa-float-bottom-left {
	left: 20px;
}

/* With the script running the gate offers the panel; the inline form is the no-JS fallback. */
.siwa-js .siwa-gate-has-panel .siwa-gate-form {
	display: none;
}

.siwa-gate-open[hidden] {
	display: none !important;
}

@media (max-width: 480px) {
	.siwa-panel {
		width: 100%;
	}

	.siwa-panel-body {
		padding: 16px;
	}

	.siwa-float {
		bottom: 12px;
	}

	.siwa-float-bottom-right {
		right: 12px;
	}

	.siwa-float-bottom-left {
		left: 12px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.siwa-panel,
	.siwa-panel-backdrop {
		transition: none;
	}

	.siwa-spinner {
		animation-duration: 2s;
	}
}
