/*
Theme Name: Teak Deck
Theme URI: https://www.teakdeck.hr/
Author: ATT Nautica
Description: Block theme za teakdeck.hr. Bez page buildera — tokeni u theme.json, template datoteke i patterni.
Version: 0.4.2
Requires at least: 6.7
Tested up to: 7.1
Requires PHP: 8.1
License: GPL-2.0-or-later
Text Domain: teakdeck
*/

/* --------------------------------------------------------------------------
   Osnove. Sve vrijednosti dolaze iz theme.json kao custom propertyji;
   ovdje se ne uvodi nijedna nova boja ni razmak.
   -------------------------------------------------------------------------- */

::selection {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--base);
}

:where(a):focus-visible,
:where(button):focus-visible,
:where(input, select, textarea):focus-visible,
.wp-block-navigation a:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

/* Mono labele — eyebrow, CTA, natpisi. */
.td-mono {
	font-family: var(--wp--preset--font-family--mono);
	font-weight: 400;
	text-transform: uppercase;
}

.td-eyebrow {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--eyebrow);
	letter-spacing: var(--wp--custom--tracking--eyebrow);
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */

.td-header {
	padding-block: clamp(18px, 2.4vw, 34px);
	padding-inline: var(--wp--preset--spacing--gutter);
}

.td-header .td-logo,
.td-header .td-logo a {
	display: inline-flex;
	align-items: center;
	margin: 0;
	line-height: 0;
}

.td-header .td-logo img {
	display: block;
	height: clamp(36px, 3.2vw, 52px);
	width: auto;
	object-fit: contain;
}

.td-header .wp-block-navigation {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	text-transform: uppercase;
}

.td-header .wp-block-navigation .wp-block-navigation-item__content {
	text-decoration: none;
	color: inherit;
}

.td-header .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content,
.td-header .wp-block-navigation .current_page_item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--accent);
}

/* Dropdown panel: kvadratna bijela kartica s crnim obrubom (README, Header). */
.td-header .wp-block-navigation__submenu-container {
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--ink);
	border-radius: 0;
	padding-block: 6px;
	min-width: 260px;
}

.td-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 10px 18px;
}

/* Zadnja stavka je gumb: ispuna akcentom, bijeli tekst, negativna vertikalna
   margina da ne poveća visinu reda. */
.td-header .td-nav-cta > .wp-block-navigation-item__content {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
	padding: 11px 20px;
	margin-block: -11px;
}

.td-header .td-nav-cta > .wp-block-navigation-item__content:hover,
.td-header .td-nav-cta > .wp-block-navigation-item__content:focus-visible {
	background: var(--wp--preset--color--accent-hover);
	color: var(--wp--preset--color--base);
}

/* Tamna varijanta — header leži preko tamnog heroja. */
.td-header--dark {
	position: absolute;
	inset-block-start: 0;
	inset-inline: 0;
	z-index: 5;
	color: var(--wp--preset--color--base);
}

.td-header--dark .wp-block-navigation .wp-block-navigation-item__content {
	color: var(--wp--preset--color--base);
}

/* Mobilni izbornik: 44 px ciljevi, tipkovnicom prohodan. */
@media (max-width: 781px) {

	.td-header .wp-block-navigation__responsive-container-open,
	.td-header .wp-block-navigation__responsive-container-close {
		min-width: 44px;
		min-height: 44px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	.td-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
		min-height: 44px;
		display: flex;
		align-items: center;
	}

	.td-header .td-nav-cta > .wp-block-navigation-item__content {
		margin-block: 0;
	}
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.td-footer {
	background: var(--wp--preset--color--surface-footer);
	color: var(--wp--preset--color--ink);
	border-top: 2px solid var(--wp--preset--color--ink);
	padding-block: clamp(34px, 5vw, 72px) clamp(20px, 2.4vw, 32px);
	padding-inline: var(--wp--preset--spacing--gutter);
}

.td-footer .td-footer-logo {
	margin: 0;
	line-height: 0;
}

.td-footer .td-footer-logo img {
	display: block;
	height: 58px;
	width: auto;
	object-fit: contain;
}

.td-footer p {
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.8;
	color: var(--wp--preset--color--text-body-2);
	text-wrap: pretty;
}

/* Naslovi stupaca su obični tekst, nikad heading — jedan od kvarova
   koje postojeći sajt ima i koji se ovdje ispravlja. */
.td-footer .td-col-label {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	text-transform: uppercase;
	color: var(--wp--preset--color--text-muted-2);
	margin: 0;
}

.td-footer ul {
	margin: 18px 0 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 11px;
	font-size: var(--wp--preset--font-size--small);
}

.td-footer ul a {
	color: var(--wp--preset--color--text-strong);
	text-decoration: underline;
	text-decoration-color: var(--wp--preset--color--accent);
	text-underline-offset: .28em;
}

.td-footer .td-address {
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.9;
	color: var(--wp--preset--color--text-strong);
}

.td-footer .td-social a {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	letter-spacing: .14em;
	/* Akcent na #E8E5DE daje samo 3,97:1 i nakon tamnjenja, pa ovdje ide
	   tamni tekst. Jedino mjesto gdje akcent ustupa boju. */
	color: var(--wp--preset--color--text-strong);
	text-decoration: none;
	text-transform: uppercase;
}

.td-footer .td-footer-bottom {
	margin-top: clamp(26px, 3vw, 44px);
	padding-top: clamp(18px, 2vw, 26px);
	border-top: 1px solid var(--wp--preset--color--line-footer);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	letter-spacing: .14em;
	color: var(--wp--preset--color--text-muted-2);
	text-transform: uppercase;
}

.td-footer .td-certs img {
	width: auto;
	object-fit: contain;
}

.td-footer .td-certs .td-cert-sgs img { height: 52px; }
.td-footer .td-certs .td-cert-fsc img { height: 60px; }