/* ==========================================================================
   Flauschi — Neo-Brutalism Stylesheet
   Hard shadows, thick borders, mechanical interactions, raw energy.
   ========================================================================== */

/* --------------------------------------------------------------------------
   CSS Custom Properties
   -------------------------------------------------------------------------- */
:root {
	--neo-canvas: #FFFDF5;
	--neo-ink: #000000;
	--neo-accent: #FF6B6B;
	--neo-secondary: #FFD93D;
	--neo-muted: #C4B5FD;
	--neo-white: #FFFFFF;

	--neo-border-thin: 2px solid var(--neo-ink);
	--neo-border: 4px solid var(--neo-ink);
	--neo-border-thick: 8px solid var(--neo-ink);

	--neo-shadow-sm: 4px 4px 0px 0px var(--neo-ink);
	--neo-shadow-md: 8px 8px 0px 0px var(--neo-ink);
	--neo-shadow-lg: 12px 12px 0px 0px var(--neo-ink);
	--neo-shadow-xl: 16px 16px 0px 0px var(--neo-ink);
	--neo-shadow-white: 8px 8px 0px 0px var(--neo-white);

	--neo-speed-fast: 100ms;
	--neo-speed-normal: 200ms;
}

/* --------------------------------------------------------------------------
   Global & Body
   -------------------------------------------------------------------------- */
body {
	background-color: var(--neo-canvas);
	-webkit-font-smoothing: antialiased;
}

/* --------------------------------------------------------------------------
   Headings — Bebas Neue, tight, uppercase, heavy presence
   -------------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6,
.wp-block-post-title {
	font-family: 'Bebas Neue', Impact, sans-serif;
	text-transform: uppercase;
	letter-spacing: -0.02em;
	line-height: 0.95;
}

/* --------------------------------------------------------------------------
   Links — bold with snap hover
   -------------------------------------------------------------------------- */
a:not(.wp-block-button__link):not(.wp-block-navigation-item__content) {
	text-decoration: underline;
	text-decoration-thickness: 3px;
	text-underline-offset: 4px;
	transition: background var(--neo-speed-fast) linear,
	            color var(--neo-speed-fast) linear;
}

a:not(.wp-block-button__link):not(.wp-block-navigation-item__content):hover {
	background: var(--neo-secondary);
	text-decoration: none;
}

/* --------------------------------------------------------------------------
   Buttons — mechanical push-down interaction
   -------------------------------------------------------------------------- */
.wp-block-button__link,
.wp-element-button,
button[type="submit"],
input[type="submit"] {
	border: 4px solid var(--neo-ink) !important;
	border-radius: 0 !important;
	box-shadow: var(--neo-shadow-sm);
	font-family: 'Bebas Neue', Impact, sans-serif;
	font-size: 1.125rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	padding: 0.75rem 1.75rem;
	transition: transform var(--neo-speed-fast) linear,
	            box-shadow var(--neo-speed-fast) linear;
	cursor: pointer;
}

.wp-block-button__link:hover,
.wp-element-button:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
	transform: translate(-1px, -1px);
	box-shadow: 6px 6px 0px 0px var(--neo-ink);
}

.wp-block-button__link:active,
.wp-element-button:active,
button[type="submit"]:active,
input[type="submit"]:active {
	transform: translate(4px, 4px);
	box-shadow: none;
}

/* Outline button style */
.wp-block-button.is-style-outline .wp-block-button__link {
	background: var(--neo-white);
	color: var(--neo-ink);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: var(--neo-secondary);
}

/* --------------------------------------------------------------------------
   Cards / Groups with borders — lift on hover
   -------------------------------------------------------------------------- */
.neo-card,
.wp-block-group.has-border {
	border: 4px solid var(--neo-ink);
	border-radius: 0;
	box-shadow: var(--neo-shadow-md);
	background: var(--neo-white);
	transition: transform var(--neo-speed-normal) ease-out,
	            box-shadow var(--neo-speed-normal) ease-out;
}

.neo-card:hover,
.wp-block-group.has-border:hover {
	transform: translateY(-4px);
	box-shadow: var(--neo-shadow-lg);
}

/* --------------------------------------------------------------------------
   Images — bordered with hard shadow
   -------------------------------------------------------------------------- */
.wp-block-image img {
	border: 4px solid var(--neo-ink);
	box-shadow: var(--neo-shadow-md);
	border-radius: 0;
}

/* --------------------------------------------------------------------------
   Navigation — bold, uppercase, snappy hovers
   -------------------------------------------------------------------------- */
.wp-block-navigation-item__content {
	font-family: 'Bebas Neue', Impact, sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	padding: 0.25rem 0.5rem;
	border: 2px solid transparent;
	transition: all var(--neo-speed-fast) linear;
}

.wp-block-navigation-item__content:hover {
	background: var(--neo-accent);
	border-color: var(--neo-ink);
	box-shadow: var(--neo-shadow-sm);
}

/* Mobile menu button */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	border: 4px solid var(--neo-ink) !important;
	background: var(--neo-secondary) !important;
	box-shadow: var(--neo-shadow-sm);
	border-radius: 0 !important;
}

/* --------------------------------------------------------------------------
   Inputs & Forms — thick borders, yellow focus
   -------------------------------------------------------------------------- */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="number"],
input[type="date"],
input[type="password"],
textarea,
select {
	border: 4px solid var(--neo-ink);
	border-radius: 0;
	background: var(--neo-white);
	font-family: 'Louis George Cafe', sans-serif;
	font-weight: 700;
	font-size: 1.125rem;
	padding: 0.75rem 1rem;
	transition: background var(--neo-speed-fast) linear,
	            box-shadow var(--neo-speed-fast) linear;
}

input:focus,
textarea:focus,
select:focus {
	outline: none;
	background: var(--neo-secondary);
	box-shadow: var(--neo-shadow-sm);
}

::placeholder {
	color: rgba(0, 0, 0, 0.35);
	font-weight: 700;
}

/* --------------------------------------------------------------------------
   Separator — thick black line
   -------------------------------------------------------------------------- */
.wp-block-separator,
hr {
	border: none;
	border-top: 4px solid var(--neo-ink);
}

.wp-block-separator.is-style-wide {
	border-top-width: 8px;
}

/* --------------------------------------------------------------------------
   Blockquote — accent left bar
   -------------------------------------------------------------------------- */
.wp-block-quote {
	border-left: 8px solid var(--neo-accent);
	padding-left: 1.5rem;
	font-family: 'Bebas Neue', Impact, sans-serif;
	font-size: 1.5rem;
	text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   Tables — black grid, bold text
   -------------------------------------------------------------------------- */
.wp-block-table table,
table {
	border-collapse: collapse;
	border: 4px solid var(--neo-ink);
	width: 100%;
}

.wp-block-table th,
.wp-block-table td,
table th,
table td {
	border: 2px solid var(--neo-ink);
	padding: 0.75rem 1rem;
	font-weight: 700;
}

.wp-block-table thead th,
table thead th {
	background: var(--neo-ink);
	color: var(--neo-white);
	font-family: 'Bebas Neue', Impact, sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-size: 1.125rem;
}

.wp-block-table tbody tr:nth-child(even),
table tbody tr:nth-child(even) {
	background: var(--neo-canvas);
}

.wp-block-table tbody tr:hover,
table tbody tr:hover {
	background: var(--neo-secondary);
}

/* --------------------------------------------------------------------------
   Events Manager — neo-brutalist event tables and listings
   -------------------------------------------------------------------------- */
.em-events-table,
.em-calendar,
table.em-calendar,
.em-search-form,
#em-wrapper table {
	border: 4px solid var(--neo-ink) !important;
	border-collapse: collapse;
	box-shadow: var(--neo-shadow-md);
}

.em-events-table th,
.em-calendar th,
#em-wrapper table th {
	background: var(--neo-ink) !important;
	color: var(--neo-white) !important;
	font-family: 'Bebas Neue', Impact, sans-serif !important;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-size: 1.125rem;
	padding: 0.75rem 1rem;
	border: 2px solid var(--neo-ink) !important;
}

.em-events-table td,
.em-calendar td,
#em-wrapper table td {
	border: 2px solid var(--neo-ink) !important;
	padding: 0.75rem 1rem;
	font-weight: 700;
}

.em-events-table tbody tr:nth-child(even),
#em-wrapper table tbody tr:nth-child(even) {
	background: var(--neo-canvas);
}

.em-events-table tbody tr:hover,
#em-wrapper table tbody tr:hover {
	background: var(--neo-secondary);
}

/* EM event list items */
.em-events-list .em-item,
.em-event {
	border: 4px solid var(--neo-ink);
	box-shadow: var(--neo-shadow-sm);
	margin-bottom: 1.5rem;
	padding: 1.5rem;
	background: var(--neo-white);
	transition: transform var(--neo-speed-normal) ease-out,
	            box-shadow var(--neo-speed-normal) ease-out;
}

.em-events-list .em-item:hover,
.em-event:hover {
	transform: translateY(-3px);
	box-shadow: var(--neo-shadow-md);
}

.em-event .em-event-title,
.em-item h2,
.em-item h3 {
	font-family: 'Bebas Neue', Impact, sans-serif !important;
	text-transform: uppercase;
}

/* EM calendar days */
.em-calendar td.eventful {
	background: var(--neo-accent) !important;
	font-weight: 700;
}

.em-calendar td.eventful:hover {
	background: var(--neo-secondary) !important;
}

.em-calendar td.eventless-today,
.em-calendar td.eventful-today {
	border: 4px solid var(--neo-accent) !important;
}

/* EM booking form */
.em-booking-form input[type="text"],
.em-booking-form input[type="email"],
.em-booking-form select,
.em-booking-form textarea {
	border: 4px solid var(--neo-ink) !important;
	border-radius: 0 !important;
	font-weight: 700;
}

.em-booking-form input[type="submit"],
.em-booking-form button {
	background: var(--neo-accent) !important;
	border: 4px solid var(--neo-ink) !important;
	border-radius: 0 !important;
	box-shadow: var(--neo-shadow-sm);
	font-family: 'Bebas Neue', Impact, sans-serif !important;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	cursor: pointer;
	transition: transform var(--neo-speed-fast) linear,
	            box-shadow var(--neo-speed-fast) linear;
}

.em-booking-form input[type="submit"]:active,
.em-booking-form button:active {
	transform: translate(4px, 4px);
	box-shadow: none;
}

/* EM search form */
.em-search-form input,
.em-search-form select {
	border: 4px solid var(--neo-ink) !important;
	border-radius: 0 !important;
}

.em-search-form input[type="submit"] {
	background: var(--neo-secondary) !important;
	border: 4px solid var(--neo-ink) !important;
	border-radius: 0 !important;
	font-family: 'Bebas Neue', Impact, sans-serif !important;
	text-transform: uppercase;
	box-shadow: var(--neo-shadow-sm);
}

/* EM pagination */
.em-pagination a,
.em-pagination span {
	border: 2px solid var(--neo-ink) !important;
	padding: 0.5rem 0.75rem;
	font-weight: 700;
	background: var(--neo-white);
}

.em-pagination .page-numbers.current,
.em-pagination a:hover {
	background: var(--neo-accent) !important;
	color: var(--neo-ink) !important;
}

/* --------------------------------------------------------------------------
   Utility classes — for use in block editor
   -------------------------------------------------------------------------- */

/* Hard-bordered container */
.neo-bordered {
	border: 4px solid var(--neo-ink);
	box-shadow: var(--neo-shadow-md);
}

/* Sticker rotation effects */
.neo-rotate-1 { transform: rotate(1deg); }
.neo-rotate-2 { transform: rotate(2deg); }
.neo-rotate-3 { transform: rotate(3deg); }
.neo-rotate-neg1 { transform: rotate(-1deg); }
.neo-rotate-neg2 { transform: rotate(-2deg); }
.neo-rotate-neg3 { transform: rotate(-3deg); }

/* Badge style */
.neo-badge {
	display: inline-block;
	border: 4px solid var(--neo-ink);
	box-shadow: var(--neo-shadow-sm);
	padding: 0.25rem 1rem;
	font-family: 'Bebas Neue', Impact, sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.15em;
	font-size: 0.875rem;
}

.neo-badge-pill {
	border-radius: 9999px;
}

/* Text stroke for display headings */
.neo-text-stroke {
	-webkit-text-stroke: 3px var(--neo-ink);
	color: transparent;
}

/* Color-blocked sections */
.neo-section-accent {
	background-color: var(--neo-accent);
}

.neo-section-secondary {
	background-color: var(--neo-secondary);
}

.neo-section-muted {
	background-color: var(--neo-muted);
}

.neo-section-ink {
	background-color: var(--neo-ink);
	color: var(--neo-white);
}

/* Background textures */
.neo-halftone {
	background-image: radial-gradient(var(--neo-ink) 1.5px, transparent 1.5px);
	background-size: 20px 20px;
}

.neo-grid-pattern {
	background-image:
		linear-gradient(to right, rgba(0, 0, 0, 0.08) 1px, transparent 1px),
		linear-gradient(to bottom, rgba(0, 0, 0, 0.08) 1px, transparent 1px);
	background-size: 40px 40px;
}

.neo-dots {
	background-image: radial-gradient(circle, var(--neo-ink) 2px, transparent 2.5px);
	background-size: 30px 30px;
}

/* Decorative star spin */
.neo-spin-slow {
	animation: neo-spin-slow 10s linear infinite;
}

@keyframes neo-spin-slow {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

/* --------------------------------------------------------------------------
   Header & Footer structural styles
   -------------------------------------------------------------------------- */
.site-header {
	border-bottom: var(--neo-border-thick);
}

.site-footer {
	border-top: var(--neo-border-thick);
}

/* Logo container */
.neo-logo {
	border: 4px solid var(--neo-ink);
	background: var(--neo-secondary);
	box-shadow: var(--neo-shadow-sm);
	display: inline-flex;
	align-items: center;
	padding: 0.25rem 0.75rem;
}

/* --------------------------------------------------------------------------
   Responsive adjustments
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
	:root {
		--neo-shadow-md: 6px 6px 0px 0px var(--neo-ink);
		--neo-shadow-lg: 8px 8px 0px 0px var(--neo-ink);
		--neo-shadow-xl: 12px 12px 0px 0px var(--neo-ink);
	}

	.wp-block-button__link,
	.wp-element-button {
		width: 100%;
		text-align: center;
	}

	h1, .wp-block-post-title {
		font-size: clamp(2.5rem, 8vw, 4rem);
	}
}

/* --------------------------------------------------------------------------
   Reduced motion
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}
