/*
Theme Name: Dakris Tours
Theme URI: https://dakristours.com
Author: PixelDigitalLab
Author URI: https://pixeldigitallab.com
Description: A minimal, hand-built classic theme for Dakris Tours, a private transportation company in Los Cabos. Provides a lightweight header/footer shell and deliberately keeps content areas unopinionated so page-level custom markup is never fought by theme styles.
Requires at least: 6.7
Tested up to: 7.0
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dakris-tours
*/

/* -----------------------------------------------------------
   1. Design tokens
   Mint / green / turquoise conversion palette (site-wide, no
   dark backgrounds — contrast comes from a near-black text
   color, not a dark section background).
----------------------------------------------------------- */
:root {
	--color-mint-background: #E9FCF5;
	--color-sky-background: #DDF0FF;
	--color-tripadvisor-green: #008530;
	--color-accent-green: #34E0A1;
	--color-turquoise: #32BEA6;
	--color-verified-blue: #1687F8;
	--color-text-primary: #061018;
	--color-text-secondary: #3D4041;
	--color-text-muted: #7A8888;
	--color-control-gray: #7D8783;
	--color-white: #FFFFFF;

	--dt-bg: var(--color-white);
	--dt-text: var(--color-text-primary);
	--dt-header-bg: var(--color-white);
	--dt-header-text: var(--color-text-primary);
	--dt-footer-bg: var(--color-mint-background);
	--dt-footer-text: var(--color-text-primary);

	--dt-font-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--dt-font-heading: Georgia, "Times New Roman", serif;

	--dt-tap-target: 44px;
}

/* -----------------------------------------------------------
   2. Reset / base element styles
----------------------------------------------------------- */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	font-family: var(--dt-font-base);
	font-size: 16px;
	line-height: 1.6;
	color: var(--dt-text);
	background-color: var(--dt-bg);
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* Default link color is the near-black text color, not an accent hue:
   tripadvisor-green is reserved for review-star contexts only, and the
   brighter accents (accent-green/turquoise) fail text contrast on white
   at body-copy sizes. Accent-green appears as a brand touch on hover. */
a {
	color: var(--color-text-primary);
	text-decoration: underline;
}

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

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--dt-font-heading);
	line-height: 1.25;
	color: var(--color-text-primary);
	margin: 0 0 0.6em;
}

p {
	margin: 0 0 1em;
}

button,
input,
select,
textarea {
	font-family: inherit;
	font-size: 1rem;
}

/* -----------------------------------------------------------
   3. Site header
   Light header: white background, dark text, green/turquoise
   accents. No dark backgrounds anywhere in this palette.
----------------------------------------------------------- */
.site-header {
	background-color: var(--dt-header-bg);
	color: var(--dt-header-text);
	border-bottom: 1px solid var(--color-turquoise);
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 16px;
	flex-wrap: wrap;
}

.site-header__brand {
	display: flex;
	align-items: center;
	min-height: var(--dt-tap-target);
}

.site-header__logo {
	max-height: 48px;
	width: auto;
}

/* Phone / WhatsApp quick-contact CTA.
   Minimum 44px tap target on all viewports per mobile UX guidelines. */
.site-header__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: var(--dt-tap-target);
	min-width: var(--dt-tap-target);
	padding: 10px 18px;
	background-color: var(--color-accent-green);
	color: var(--color-text-primary);
	font-weight: 700;
	font-size: 0.95rem;
	border-radius: 6px;
	text-decoration: none;
	white-space: nowrap;
}

.site-header__cta:hover,
.site-header__cta:focus {
	background-color: var(--color-turquoise);
	color: var(--color-text-primary);
}

.site-header__cta-icon {
	font-size: 1.1rem;
	line-height: 1;
}

/* -----------------------------------------------------------
   4. Content wrapper
   Deliberately thin/unopinionated: no competing max-width or
   padding so page-level custom markup (e.g. the homepage's own
   self-contained CSS) is never fought by theme styles.
----------------------------------------------------------- */
#content {
	display: block;
}

/* -----------------------------------------------------------
   5. Site footer
----------------------------------------------------------- */
.site-footer {
	background-color: var(--dt-footer-bg);
	color: var(--dt-footer-text);
	padding: 32px 16px;
	font-size: 0.9rem;
}

/* Below 900px the homepage shows a fixed bottom CTA bar (see the homepage's
   own inline styles). Reserve extra bottom padding here so that bar never
   permanently covers the last few lines of the site footer once a visitor
   scrolls all the way down. */
@media (max-width: 899px) {
	.site-footer {
		padding-bottom: 96px;
	}
}

.site-footer a {
	color: var(--color-text-primary);
}

.site-footer a:hover,
.site-footer a:focus {
	color: var(--color-accent-green);
}

.site-footer__business {
	font-weight: 700;
	color: var(--dt-header-text);
	margin-bottom: 8px;
}

.site-footer__meta {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

/* -----------------------------------------------------------
   6. Small screens (mobile-first base above already applies)
----------------------------------------------------------- */
@media (min-width: 640px) {
	.site-header__inner {
		flex-wrap: nowrap;
	}
}
