/* Fixerwo Panel — design tokens & resets.
   Color / radius / spacing / font variables below are FALLBACKS;
   FXWP_Assets::build_dynamic_css() overrides them inline from the
   admin's saved settings, so this file works even if that fails to load. */

:root {
	--fxwp-primary: #5B5BF7;
	--fxwp-secondary: #8B5CF6;
	--fxwp-success: #16A34A;
	--fxwp-warning: #F59E0B;
	--fxwp-danger: #EF4444;
	--fxwp-radius: 16px;
	--fxwp-space-scale: 1;
	--fxwp-font: 'Vazirmatn', Tahoma, sans-serif;
	--fxwp-anim: .25s;

	--fxwp-bg: #F4F5FA;
	--fxwp-surface: #FFFFFF;
	--fxwp-surface-2: #F8F9FC;
	--fxwp-border: #E7E8F1;
	--fxwp-text: #1B1D28;
	--fxwp-text-muted: #6B6E85;
	--fxwp-shadow: 0 8px 24px rgba(30, 32, 60, .06);
	--fxwp-shadow-lg: 0 16px 40px rgba(30, 32, 60, .12);
}

[data-fxwp-theme="dark"] {
	--fxwp-bg: #12131C;
	--fxwp-surface: #1B1D2B;
	--fxwp-surface-2: #22243487;
	--fxwp-border: #2C2E42;
	--fxwp-text: #F1F1F8;
	--fxwp-text-muted: #9598B3;
	--fxwp-shadow: 0 8px 24px rgba(0, 0, 0, .3);
	--fxwp-shadow-lg: 0 16px 40px rgba(0, 0, 0, .45);
}

.fxwp-root, .fxwp-root * {
	box-sizing: border-box;
}
.fxwp-root {
	font-family: var(--fxwp-font);
	color: var(--fxwp-text);
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
}
.fxwp-root button, .fxwp-root input, .fxwp-root select, .fxwp-root textarea {
	font-family: inherit;
	color: inherit;
}
.fxwp-root a {
	color: var(--fxwp-primary);
	text-decoration: none;
}
.fxwp-root img { max-width: 100%; display: block; }

.fxwp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: calc(11px * var(--fxwp-space-scale)) calc(20px * var(--fxwp-space-scale));
	border-radius: calc(var(--fxwp-radius) * 0.7);
	border: none;
	cursor: pointer;
	font-weight: 600;
	font-size: 14px;
	transition: transform var(--fxwp-anim) ease, box-shadow var(--fxwp-anim) ease, opacity var(--fxwp-anim) ease;
	white-space: nowrap;
}
.fxwp-btn:active { transform: scale(.97); }
.fxwp-btn-primary {
	background: linear-gradient(135deg, var(--fxwp-primary), var(--fxwp-secondary));
	color: #fff;
	box-shadow: 0 6px 16px color-mix(in srgb, var(--fxwp-primary) 45%, transparent);
}
.fxwp-btn-primary:hover { box-shadow: 0 10px 22px color-mix(in srgb, var(--fxwp-primary) 55%, transparent); }
.fxwp-btn-ghost {
	background: var(--fxwp-surface-2);
	color: var(--fxwp-text);
	border: 1px solid var(--fxwp-border);
}
.fxwp-btn-sm { padding: 7px 14px; font-size: 13px; }
.fxwp-btn svg { width: 16px; height: 16px; }
.fxwp-btn[disabled] { opacity: .6; cursor: default; pointer-events: none; }

.fxwp-icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 1px solid var(--fxwp-border);
	background: var(--fxwp-surface);
	color: var(--fxwp-text);
	cursor: pointer;
	position: relative;
	transition: background var(--fxwp-anim) ease;
}
.fxwp-icon-btn:hover { background: var(--fxwp-surface-2); }
.fxwp-icon-btn svg { width: 19px; height: 19px; }

.fxwp-link-btn {
	background: none;
	border: none;
	color: var(--fxwp-primary);
	cursor: pointer;
	font-size: 13px;
	font-weight: 600;
}

.fxwp-nav-badge {
	background: var(--fxwp-danger);
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	min-width: 18px;
	height: 18px;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 4px;
}
.fxwp-bell-badge {
	position: absolute;
	top: -2px;
	inset-inline-end: -2px;
}

/* Shared form field styles (used both in dashboard forms and auth forms) */
.fxwp-field { display: flex; flex-direction: column; gap: 6px; margin-bottom: calc(14px * var(--fxwp-space-scale)); }
.fxwp-field > span { font-size: 13px; font-weight: 600; color: var(--fxwp-text-muted); }
.fxwp-input {
	width: 100%;
	padding: calc(11px * var(--fxwp-space-scale)) 14px;
	border-radius: calc(var(--fxwp-radius) * 0.55);
	border: 1.5px solid var(--fxwp-border);
	background: var(--fxwp-surface);
	color: var(--fxwp-text);
	font-size: 14px;
	transition: border-color var(--fxwp-anim) ease, box-shadow var(--fxwp-anim) ease;
}
.fxwp-input:focus {
	outline: none;
	border-color: var(--fxwp-primary);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--fxwp-primary) 15%, transparent);
}
.fxwp-field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.fxwp-field-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; font-size: 13px; }
.fxwp-checkbox { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--fxwp-text-muted); cursor: pointer; }
.fxwp-checkbox input { width: 16px; height: 16px; accent-color: var(--fxwp-primary); }
.fxwp-form-alert {
	background: color-mix(in srgb, var(--fxwp-danger) 12%, transparent);
	color: var(--fxwp-danger);
	border-radius: calc(var(--fxwp-radius) * 0.5);
	padding: 10px 14px;
	font-size: 13px;
	margin-bottom: 14px;
}
.fxwp-form-alert-success {
	background: color-mix(in srgb, var(--fxwp-success) 12%, transparent);
	color: var(--fxwp-success);
}
.fxwp-empty { color: var(--fxwp-text-muted); font-size: 14px; padding: 20px 0; text-align: center; }
.fxwp-empty-state { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 40px 20px; color: var(--fxwp-text-muted); text-align: center; }
.fxwp-empty-state svg { width: 40px; height: 40px; opacity: .5; }

@media (max-width: 640px) {
	.fxwp-field-grid { grid-template-columns: 1fr; }
}