/**
 * Basic design — Olena Food admin overrides.
 *
 * Loaded AFTER the plugin's default admin CSS and after tokens.css, so it
 * overrides the defaults purely by cascade order — the plugin's own SCSS is
 * never edited.
 *
 * Scope: every rule is nested under the Olena admin wrapper
 * (`.olena-food-ordering-wrapper`, the settings SPA root) so it can NEVER
 * restyle WordPress core admin, Gutenberg, WooCommerce or any other plugin's
 * screens.
 *
 * Technique: remap the plugin's intermediate palette variables
 * (`--olena-food-ordering-color-*`) onto the design tokens, redeclared ON the
 * wrapper. Because custom properties inherit down the DOM, every Olena admin
 * component that reads those variables picks up the Basic palette automatically.
 * A small number of scoped selector overrides then handle values the defaults
 * hard-code (card radius/elevation, control radius, focus rings, the exact
 * coral hover) and align the admin with the storefront's Basic look.
 *
 * This file must be plain CSS (no SCSS/preprocessing).
 */

/* ========================================================================
   Palette remap (scoped to the Olena admin subtree)
   ======================================================================== */
.olena-food-ordering-wrapper {
	--olena-food-ordering-color-base: var(--olena-food-design-surface);
	--olena-food-ordering-color-contrast: var(--olena-food-design-text);

	/* Primary / accent (the plugin's green) becomes Coral. */
	--olena-food-ordering-color-accent-1: var(--olena-food-design-primary);
	--olena-food-ordering-color-accent-1-50: var(--olena-food-design-primary-soft);

	/* Secondary text + borders. */
	--olena-food-ordering-color-gray-200: var(--olena-food-design-text-secondary);
	--olena-food-ordering-color-gray-100: var(--olena-food-design-border);

	/* Dedicated status colours. */
	--olena-food-ordering-color-success-200: var(--olena-food-design-success);
	--olena-food-ordering-color-warning-200: var(--olena-food-design-warning);
	--olena-food-ordering-color-error-200: var(--olena-food-design-error);
	--olena-food-ordering-color-error-100: var(--olena-food-design-error-soft);

	/* Warm off-white page background behind the cards (scoped to the wrapper). */
	background-color: var(--olena-food-design-background);
}

/* ========================================================================
   Cards / sections
   ======================================================================== */
.olena-food-ordering-wrapper .fo-base-card {
	border-radius: var(--olena-food-design-card-radius);
	border: 1px solid var(--olena-food-design-border);
	box-shadow: var(--olena-food-design-shadow-card);
}

/* ========================================================================
   Buttons
   ======================================================================== */
.olena-food-ordering-wrapper .fo-btn {
	border-radius: var(--olena-food-design-control-radius);
	font-weight: 600;
}

/* The default primary hover only dims the coral via brightness(); use the exact
   "Darker Coral" hover from the palette instead. */
.olena-food-ordering-wrapper .fo-btn_primary:hover {
	background-color: var(--olena-food-design-primary-hover);
	border-color: var(--olena-food-design-primary-hover);
	filter: none;
}

.olena-food-ordering-wrapper .fo-btn_secondary:hover {
	background-color: var(--olena-food-design-primary-soft);
	color: var(--olena-food-design-primary);
}

/* ========================================================================
   Form controls (inputs, selects, textareas)
   ======================================================================== */
.olena-food-ordering-wrapper .fo-field__input,
.olena-food-ordering-wrapper .fo-field__textarea,
.olena-food-ordering-wrapper .fo-field__select,
.olena-food-ordering-wrapper .fo-wh-time,
.olena-food-ordering-wrapper .fo-wh-date {
	border-radius: var(--olena-food-design-control-radius);
}

.olena-food-ordering-wrapper .fo-field__input:focus,
.olena-food-ordering-wrapper .fo-field__textarea:focus,
.olena-food-ordering-wrapper .fo-field__select:focus,
.olena-food-ordering-wrapper .fo-wh-time:focus,
.olena-food-ordering-wrapper .fo-wh-date:focus {
	border-color: var(--olena-food-design-primary);
	box-shadow: var(--olena-food-design-focus-ring);
}

/* Native radios / checkboxes pick up the coral accent (scoped to Olena only). */
.olena-food-ordering-wrapper input[type="checkbox"],
.olena-food-ordering-wrapper input[type="radio"] {
	accent-color: var(--olena-food-design-primary);
}

/* ========================================================================
   Tabs / navigation
   ======================================================================== */
.olena-food-ordering-wrapper .fo-tabs__item_active {
	color: var(--olena-food-design-primary);
	border-bottom-color: var(--olena-food-design-primary);
}

.olena-food-ordering-wrapper .fo-admin-header--sub .fo-tabs__item_active {
	background-color: var(--olena-food-design-primary-soft);
	color: var(--olena-food-design-primary);
}

/* ========================================================================
   Working-hours / setup accent surfaces
   ======================================================================== */
.olena-food-ordering-wrapper .fo-setup-banner {
	background-color: var(--olena-food-design-primary-soft);
	border-color: var(--olena-food-design-primary);
	border-radius: var(--olena-food-design-radius-md);
}

.olena-food-ordering-wrapper .fo-wh-day,
.olena-food-ordering-wrapper .fo-wh-rule {
	border-radius: var(--olena-food-design-radius-md);
}

.olena-food-ordering-wrapper .fo-wh-add-rule:hover {
	background-color: var(--olena-food-design-primary-soft);
}

/* ========================================================================
   Status badges / pills
   ======================================================================== */
.olena-food-ordering-wrapper .fo-stripe-badge_ok {
	background-color: var(--olena-food-design-success-soft);
	color: var(--olena-food-design-success);
	border-color: var(--olena-food-design-success);
}