/**
 * OMIWAA Customer Experience — premium customer portal.
 *
 * The system is scoped to OMIWAA surfaces, inherits the theme typography, and
 * consumes theme/Elementor tokens before using neutral fallbacks.
 */

/* --------------------------------------------------------------------------
   Design tokens and scoped normalization
   -------------------------------------------------------------------------- */

.omiwaa-ce-auth,
.omiwaa-ce-my-account-layout,
.omiwaa-ce-order-tracking,
.omiwaa-ce-portal-module,
.omiwaa-ce-slot,
.omiwaa-ce-customer-support-account-slot {
	/*
	 * Contrast contract.
	 *
	 * Generic theme tokens such as --text, --heading, --surface, and --border
	 * are intentionally not consumed here. On many themes those variables are
	 * contextual (for example white text intended for a dark header). Reusing
	 * them inside the portal's light cards caused white-on-white content.
	 *
	 * Themes may opt in through the explicit --omiwaa-portal-* variables below.
	 */
	--omiwaa-ce-accent: var(--omiwaa-portal-accent, var(--e-global-color-accent, #f97316));
	--omiwaa-ce-accent-strong: var(--omiwaa-portal-accent-strong, #b54708);
	--omiwaa-ce-accent-hover: var(--omiwaa-portal-accent-hover, #93370d);
	--omiwaa-ce-accent-soft: var(--omiwaa-portal-accent-soft, rgb(249 115 22 / 10%));
	--omiwaa-ce-action-bg: var(--omiwaa-portal-action, #c2410c);
	--omiwaa-ce-action-hover: var(--omiwaa-portal-action-hover, #9a3412);
	--omiwaa-ce-action-soft: var(--omiwaa-portal-action-soft, #fff7ed);
	--omiwaa-ce-action-border: var(--omiwaa-portal-action-border, #c2410c);
	--omiwaa-ce-fg-primary: var(--omiwaa-portal-text, #1b2430);
	--omiwaa-ce-fg-heading: var(--omiwaa-portal-heading, #1b2430);
	--omiwaa-ce-fg-secondary: var(--omiwaa-portal-text-secondary, #4b5563);
	--omiwaa-ce-fg-muted: var(--omiwaa-portal-text-muted, #667085);
	--omiwaa-ce-fg-placeholder: var(--omiwaa-portal-placeholder, #7b8491);
	--omiwaa-ce-border: var(--omiwaa-portal-border, #d7dee7);
	--omiwaa-ce-border-strong: var(--omiwaa-portal-border-strong, #b7c1ce);
	--omiwaa-ce-control-border: var(--omiwaa-portal-control-border, #8b96a5);
	--omiwaa-ce-control-border-hover: var(--omiwaa-portal-control-border-hover, #687483);
	--omiwaa-ce-bg-canvas: var(--omiwaa-portal-canvas, #f5f7fa);
	--omiwaa-ce-bg-surface: var(--omiwaa-portal-surface, #fff);
	--omiwaa-ce-bg-subtle: var(--omiwaa-portal-surface-soft, #f7f9fb);
	--omiwaa-ce-bg-muted: var(--omiwaa-portal-surface-muted, #eef2f6);
	--omiwaa-ce-bg-dark: var(--omiwaa-portal-dark, #171b20);
	/* Backwards-compatible aliases used by existing component rules. */
	--omiwaa-ce-ink: var(--omiwaa-ce-fg-primary);
	--omiwaa-ce-heading: var(--omiwaa-ce-fg-heading);
	--omiwaa-ce-muted: var(--omiwaa-ce-fg-secondary);
	--omiwaa-ce-subtle: var(--omiwaa-ce-fg-muted);
	--omiwaa-ce-surface: var(--omiwaa-ce-bg-surface);
	--omiwaa-ce-surface-soft: var(--omiwaa-ce-bg-subtle);
	--omiwaa-ce-surface-muted: var(--omiwaa-ce-bg-muted);
	--omiwaa-ce-dark: var(--omiwaa-ce-bg-dark);
	--omiwaa-ce-success: #177a50;
	--omiwaa-ce-warning: #8a5700;
	--omiwaa-ce-danger: #b42318;
	--omiwaa-ce-info: #175cd3;
	--omiwaa-ce-radius-input: 14px;
	--omiwaa-ce-radius-button: 14px;
	--omiwaa-ce-radius-card: 22px;
	--omiwaa-ce-shadow-card: 0 1px 2px rgb(16 24 40 / 5%), 0 12px 32px rgb(16 24 40 / 5%);
	--omiwaa-ce-shadow-raised: 0 2px 4px rgb(16 24 40 / 6%), 0 16px 40px rgb(16 24 40 / 8%);
	--omiwaa-ce-transition: 200ms ease;
	--omiwaa-ce-focus-outline: var(--omiwaa-portal-focus-outline, #9a3412);
	--omiwaa-ce-focus-ring: 0 0 0 4px rgb(194 65 12 / 24%);
	--omiwaa-ce-disabled-bg: #eef2f6;
	--omiwaa-ce-disabled-fg: #7b8491;
	--omiwaa-ce-disabled-border: #d7dee7;
	--omiwaa-ce-space-1: 4px;
	--omiwaa-ce-space-2: 8px;
	--omiwaa-ce-space-3: 12px;
	--omiwaa-ce-space-4: 16px;
	--omiwaa-ce-space-5: 20px;
	--omiwaa-ce-space-6: 24px;
	--omiwaa-ce-space-8: 32px;
	--omiwaa-ce-space-10: 40px;
	--omiwaa-ce-space-12: 48px;
	--omiwaa-ce-space-16: 64px;
	--omiwaa-ce-radius-small: 8px;
	--omiwaa-ce-radius-medium: 12px;
	--omiwaa-ce-radius-large: 18px;
	--omiwaa-ce-motion-fast: 140ms ease;
	--omiwaa-ce-motion-standard: 200ms ease;
	box-sizing: border-box;
	color: var(--omiwaa-ce-fg-primary);
	color-scheme: light;
	font-family: inherit;
	font-size: 16px;
	line-height: 1.5;
}

@supports (color: color-mix(in srgb, #000 50%, #fff)) {
	.omiwaa-ce-auth,
	.omiwaa-ce-my-account-layout,
	.omiwaa-ce-order-tracking,
	.omiwaa-ce-portal-module,
	.omiwaa-ce-slot,
	.omiwaa-ce-customer-support-account-slot {
		--omiwaa-ce-accent-strong: var(--omiwaa-portal-accent-strong, color-mix(in srgb, var(--omiwaa-ce-accent) 75%, #000 25%));
		--omiwaa-ce-accent-hover: var(--omiwaa-portal-accent-hover, color-mix(in srgb, var(--omiwaa-ce-accent) 62%, #000 38%));
		--omiwaa-ce-accent-soft: var(--omiwaa-portal-accent-soft, color-mix(in srgb, var(--omiwaa-ce-accent) 10%, transparent));
	}
}
