/*
Theme Name: Steakhouse.ba
Theme URI: https://steakhouse.ba/
Author: NeoWeb d.o.o.
Author URI: https://neoweb.ba/
Description: Minimalna one-page WordPress tema za Steakhouse.ba sa Coming Soon newsletter sistemom.
Version: 1.2.5
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: steakhouse-ba
*/

:root {
	--steakhouse-overlay-opacity: 0.50;
	--steakhouse-background-fit: contain;
	--steakhouse-background-color: #94111d;

	--steakhouse-content-width: 760px;
	--steakhouse-content-top: 77%;
	--steakhouse-title-size: 56px;
	--steakhouse-title-size-mobile: 38px;
	--steakhouse-text-size: 20px;
	--steakhouse-text-size-mobile: 18px;
	--steakhouse-form-width: 620px;
	--steakhouse-input-height: 64px;
	--steakhouse-radius: 999px;
	--steakhouse-title-color: #ffffff;
	--steakhouse-text-color: #ffffff;
	--steakhouse-input-bg: #ffffff;
	--steakhouse-input-color: #111111;
	--steakhouse-input-border: #ffffff;
	--steakhouse-button-bg: #ffffff;
	--steakhouse-button-color: #111111;
	--steakhouse-glass-opacity: 0.16;
	--steakhouse-glass-blur: 18px;
}

html,
body {
	margin: 0;
	padding: 0;
	width: 100%;
	min-height: 100%;
}

body {
	overflow: hidden;
	background: #111;
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.steakhouse-page {
	position: relative;
	width: 100%;
	height: 100vh;
	height: 100dvh;
	min-height: 100vh;
	min-height: 100dvh;
	overflow: hidden;
	background-color: var(--steakhouse-background-color);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: var(--steakhouse-background-fit);
}

.steakhouse-page::before {
	content: "";
	position: absolute;
	inset: 0;
	background: #111;
	opacity: var(--steakhouse-overlay-opacity);
	z-index: 1;
	pointer-events: none;
}

.steakhouse-page__inner {
	position: relative;
	z-index: 2;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
}

.steakhouse-coming-soon {
	position: absolute;
	left: 50%;
	top: var(--steakhouse-content-top);
	width: min(calc(100% - 48px), var(--steakhouse-content-width));
	text-align: center;
	transform: translate(-50%, -50%);
}

.steakhouse-coming-soon__title {
	margin: 0 0 12px;
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	color: var(--steakhouse-title-color);
	font-size: var(--steakhouse-title-size);
	font-weight: 700;
	line-height: 1.02;
	letter-spacing: -0.035em;
	text-shadow: 0 2px 24px rgba(0,0,0,.22);
}

.steakhouse-coming-soon__text {
	max-width: 650px;
	margin: 0 auto 24px;
	color: var(--steakhouse-text-color);
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: var(--steakhouse-text-size);
	font-weight: 400;
	line-height: 1.55;
	text-shadow: 0 2px 18px rgba(0,0,0,.18);
}

.steakhouse-newsletter {
	width: min(100%, var(--steakhouse-form-width));
	margin: 0 auto;
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.steakhouse-newsletter__shell {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	height: var(--steakhouse-input-height);
	padding: 5px;
	box-sizing: border-box;
	border: 1px solid rgba(255,255,255,.34);
	border-radius: 999px;
	background: rgba(255,255,255,.14);
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.22),
		0 12px 34px rgba(0,0,0,.18);
	-webkit-backdrop-filter: blur(var(--steakhouse-glass-blur)) saturate(135%);
	backdrop-filter: blur(var(--steakhouse-glass-blur)) saturate(135%);
}

/* Namjerno bez transition/transform/animacija na focus ili klik. */
.steakhouse-newsletter__shell:focus-within {
	border-color: rgba(255,255,255,.54);
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.26),
		0 12px 34px rgba(0,0,0,.18);
}

.steakhouse-newsletter__input {
	flex: 1 1 auto;
	min-width: 0;
	height: 100%;
	padding: 0 16px 0 21px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: #ffffff;
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 18px;
	font-weight: 500;
	outline: none;
	box-sizing: border-box;
}

.steakhouse-newsletter__input::placeholder {
	color: rgba(255,255,255,.72);
	opacity: 1;
}

.steakhouse-newsletter__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 52px;
	height: 52px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: var(--steakhouse-button-bg);
	color: var(--steakhouse-button-color);
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.35),
		0 5px 18px rgba(0,0,0,.18);
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
}

.steakhouse-newsletter__button:hover,
.steakhouse-newsletter__button:focus,
.steakhouse-newsletter__button:active {
	transform: none;
	transition: none;
}

.steakhouse-newsletter__button:focus-visible {
	outline: 2px solid rgba(255,255,255,.85);
	outline-offset: 2px;
}

.steakhouse-newsletter__button:disabled {
	cursor: wait;
	opacity: .65;
}

.steakhouse-newsletter__button svg {
	display: block;
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
	pointer-events: none;
}

.steakhouse-newsletter__message {
	min-height: 20px;
	margin: 10px 0 0;
	color: var(--steakhouse-text-color);
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 16px;
	line-height: 1.5;
}

.steakhouse-newsletter__message.is-error {
	color: #ffd7d7;
}

.steakhouse-newsletter__message.is-success {
	color: #ffffff;
}

body.admin-bar .steakhouse-page {
	height: calc(100vh - 32px);
	height: calc(100dvh - 32px);
	min-height: calc(100vh - 32px);
	min-height: calc(100dvh - 32px);
}

@media screen and (max-width: 782px) {
	body.admin-bar .steakhouse-page {
		height: calc(100vh - 46px);
		height: calc(100dvh - 46px);
		min-height: calc(100vh - 46px);
		min-height: calc(100dvh - 46px);
	}
}

@media screen and (max-width: 640px) {
	.steakhouse-coming-soon {
		width: min(calc(100% - 28px), var(--steakhouse-content-width));
	}

	.steakhouse-coming-soon__title {
		font-size: var(--steakhouse-title-size-mobile);
		margin-bottom: 10px;
	}

	.steakhouse-coming-soon__text {
		font-size: var(--steakhouse-text-size-mobile);
		margin-bottom: 18px;
	}

	.steakhouse-newsletter__shell {
		height: 58px;
		padding: 4px;
	}

	.steakhouse-newsletter__input {
		padding-left: 17px;
		padding-right: 8px;
		font-size: 18px;
	}

	.steakhouse-newsletter__button {
		width: 48px;
		height: 48px;
	}
}