/*
ds-exempt: client brand theme on WordPress - plan section 4 keeps client screens on the locked brand palette (as mock-themes/theme.css); sigma-ds is for our own tools.

Theme Name:        Eilat-eat Child
Theme URI:         https://github.com/ytrofr/eilat-eat
Description:       Hello Elementor child theme for Eilat-eat: brand tokens, Hebrew fonts (Heebo, Assistant, Rubik), white background, RTL-friendly.
Author:            ytrofr
Author URI:        https://github.com/ytrofr
Template:          hello-elementor
Version:           0.4.0
Requires at least: 6.9
Tested up to:      7.1
Requires PHP:      8.1
License:           GNU General Public License v2 or later
License URI:       https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:       eilat-eat-child
*/

/*
 * Brand tokens from the logo. Accents, type, icons and photo bands only:
 * the page background is always white.
 *
 * FALLBACK only: brand.css (generated from the brand file by
 * scripts/brand/apply.py, loaded right after this file) sets the same tokens
 * and wins. These stay so the site keeps its look if brand.css is missing.
 */
:root {
	--ee-teal: #7499a1;
	--ee-teal-d: #5b7e86;
	--ee-teal-l: #9bb6bc;
	--ee-desert: #b99065;
	--ee-desert-d: #9a744b;
	--ee-desert-l: #d4b289;
	--ee-slate: #484b4e;
	--ee-ink: #2f3133;
	--ee-cream: #f8efe6;
	--ee-bg: #fff;
	--ee-line: rgba(72, 75, 78, 0.16);

	/* Text inks, measured on #fff: teal-d (4.40) and desert-d (4.22) miss the 4.5 body-text floor. */
	--ee-teal-ink: #577981; /* 4.71 : 1 */
	--ee-desert-ink: #946c43; /* 4.68 : 1 */

	--ee-accent: var(--ee-teal-ink);
	--ee-accent-2: var(--ee-desert-ink);

	--ee-font-display: "Rubik", "Heebo", sans-serif;
	--ee-font-body: "Assistant", "Heebo", sans-serif;
}

html {
	overflow-x: clip;
}

body {
	background: var(--ee-bg);
	color: var(--ee-ink);
	font-family: var(--ee-font-body);
	line-height: 1.6;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--ee-font-display);
	color: var(--ee-slate);
}

a {
	color: var(--ee-accent);
}

/*
 * Brand fonts by role. The page generator tags widgets with these classes
 * instead of naming a font, so a new brand changes every tagged widget.
 */
.ee-font-display,
.ee-font-display * {
	font-family: var(--ee-font-display);
}

.ee-font-body,
.ee-font-body * {
	font-family: var(--ee-font-body);
}

/*
 * Elementor widgets with no font of their own take the theme fonts: titles the
 * display font, text and buttons the body font. :where() keeps these at zero
 * specificity, so a font set in Elementor (the widget's own typography, a kit
 * global, or an .ee-font-* class) always wins.
 */
:where(.elementor-widget-heading .elementor-heading-title, .elementor-icon-box-title, .elementor-image-box-title) {
	font-family: var(--ee-font-display);
}

:where(.elementor-widget-text-editor, .elementor-button, .elementor-icon-list-text, .elementor-icon-box-description, .elementor-image-box-description, .elementor-field-group input, .elementor-field-group select, .elementor-field-group textarea) {
	font-family: var(--ee-font-body);
}

a:hover,
a:focus {
	color: var(--ee-accent-2);
}

/* Logical properties keep spacing right in RTL (Hebrew) and LTR alike. */
blockquote {
	border-inline-start: 3px solid var(--ee-desert);
	padding-inline-start: 1em;
	margin-inline: 0;
}

/*
 * Site header and footer: Elementor templates printed by template-parts/header.php
 * and footer.php. The header stays on top while scrolling (free Elementor has no
 * sticky option), below the admin bar when one shows.
 */
.ee-site-header {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 30;
}

/*
 * Demo actions (assets/ee-demo.js). A pick with no address is a button: show the
 * pointer. The confirmation a demo form shows in place of sending anything.
 */
.ee-pick .elementor-button,
.ee-reveal a,
.ee-go {
	cursor: pointer;
}

/* A card's title link (the card opens that page) keeps the title's own look. */
.ee-go-link a {
	color: inherit;
	text-decoration: none;
}

.ee-toast {
	position: fixed;
	inset-block-start: 84px;
	inset-inline: 0;
	z-index: 90;
	display: flex;
	align-items: center;
	gap: 10px;
	width: max-content;
	max-width: min(560px, calc(100vw - 32px));
	margin-inline: auto;
	padding: 12px 14px;
	background: var(--ee-bg);
	color: var(--ee-ink);
	border: 1px solid var(--ee-line);
	border-inline-start: 4px solid var(--ee-accent);
	border-radius: 14px;
	box-shadow: 0 14px 34px rgba(51, 64, 62, 0.18);
	font-family: var(--ee-font-body);
	font-size: 0.95rem;
	opacity: 0;
	transform: translateY(-8px);
	pointer-events: none;
	transition: opacity 0.2s, transform 0.2s;
}

.ee-toast.show {
	opacity: 1;
	transform: none;
	pointer-events: auto;
}

.ee-toast-msg {
	min-width: 0;
}

.ee-toast-x {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	padding: 4px;
	background: none;
	border: 0;
	color: var(--ee-slate);
	cursor: pointer;
}
