/*
Theme Name: Kidris Rentals
Theme URI: https://example.com/
Author: Baby Travel China
Description: Custom WordPress theme converted from the Kidris Webflow template. Lists baby-gear rental items with WhatsApp/WeChat contact instead of checkout.
Version: 0.1.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: kidris-rentals
*/

/* ---- Theme additions (elements not in the original Webflow CSS) ---- */

/* Text wordmark logo (replaces the Kidris logo image) */
.brand-wordmark {
	font-family: "Bebas Neue", "Geist", sans-serif;
	font-size: clamp(20px, 4.5vw, 30px);
	letter-spacing: 1px;
	line-height: 1;
	white-space: nowrap;
	display: inline-block;
	color: var(--_colors---fonts--title, #1a1a1a);
}
.footer-wordmark {
	color: #fff;
}
/* The logo block is clamped to 110px on mobile for the old image logo; let the
   text wordmark size to its content so it isn't clipped or forced to overflow. */
.logo-block {
	width: auto;
	max-width: none;
}

.kidris-card-title {
	font-weight: 600;
	margin-top: 6px;
	line-height: 1.3;
}
.kidris-card-price { opacity: 0.7; font-weight: 500; }

/* Contact buttons (replace Add to cart) */
.kidris-contact {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
	margin-bottom: 24px;
}
.kidris-contact .primary-button { cursor: pointer; border: none; }
.kidris-wc-btn { background: #07c160; }
.kidris-wechat-id,
.kidris-wechat-line {
	width: 100%;
	padding: 10px 14px;
	background: rgba(0,0,0,0.05);
	border-radius: 10px;
	font-size: 0.95rem;
}
.kidris-contact-page { margin-top: 24px; flex-direction: column; align-items: flex-start; }

/* Rich text / page content spacing */
.kidris-page-content { max-width: 760px; line-height: 1.7; }
.kidris-page-content h2 { margin: 1.2em 0 0.5em; }
.kidris-page-content p { margin-bottom: 1em; }

/* Fix mobile horizontal overflow: long footer links (e.g. email addresses)
   were forcing grid tracks wider than the screen because grid/flex items
   default to min-width:auto. Allow them to shrink and wrap. */
.footer-wrapper,
.footer-wrap,
.footer-outter,
.ft-link-wrap,
.footer-block {
	min-width: 0;
}
.footer-block,
.footer-block div,
.footer-block a {
	overflow-wrap: anywhere;
	word-break: break-word;
}

/* Pagination */
.kidris-pagination { margin-top: 48px; }
.kidris-pagination ul {
	list-style: none;
	display: flex;
	gap: 8px;
	padding: 0;
	flex-wrap: wrap;
	justify-content: center;
}
.kidris-pagination a,
.kidris-pagination span {
	display: inline-block;
	padding: 8px 14px;
	border-radius: 10px;
	background: rgba(0,0,0,0.05);
	text-decoration: none;
}
.kidris-pagination .current { background: #111; color: #fff; }

/* Mobile burger menu: collapse the desktop two-column nav into a single
   top-aligned list and surface Categories first. Desktop (>991px) keeps its
   split-around-the-logo layout untouched.

   Webflow forces the OPEN menu to `display: block !important`
   ([data-nav-menu-open] in webflow.css), which disables flexbox ordering. We
   restore `display: flex` (higher specificity + !important wins) so `order`
   works, then `display: contents` promotes the two .nav-wrap groups' links to
   direct flex children so `order` can lift Categories above the rest. */
@media screen and (max-width: 991px) {
	.nav-menu.w-nav-menu[data-nav-menu-open] {
		display: flex !important;
		flex-direction: column;
		justify-content: flex-start;
		align-items: stretch;
	}
	.nav-wrap {
		display: contents;
	}
	.nav-link-wrap.is-categories {
		order: -1;
	}
}