﻿/*
Theme Name:   YHuaHin Child
Theme URI:    https://yhuahin.com
Description:  Kadence child theme for YHuaHin. Holds the property templates and the site's
              visual identity. Kept deliberately thin — layout comes from Kadence, only
              property-specific markup and styling lives here.
Author:       YHuaHin
Template:     kadence
Version:      0.15.0
Text Domain:  yhuahin-child
*/

/*
 * Ocean and sand.
 *
 * Every colour on the site comes from these seven values, so changing the palette later is
 * a seven-line edit rather than a hunt through stylesheets. The discipline that matters:
 * --yhh-sun is reserved for ACTIONS ONLY — enquire, WhatsApp, search. An accent that
 * appears everywhere stops meaning anything, and this one has to pull the eye to the one
 * thing a visitor should do next.
 */
:root {
  --yhh-ground: #F4F8FA;
  --yhh-paper:  #FFFFFF;
  --yhh-tint:   #D8E9F2;
  --yhh-line:   #DCE7ED;
  --yhh-ink:    #22333F;
  --yhh-deep:   #0B3144;
  --yhh-ocean:  #0B5C8A;
  --yhh-sun:    #D98A3D;
  --yhh-sun-dk: #B06E2C;
  --yhh-muted:  #7C8E99;

  --yhh-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --yhh-body: 'Public Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

body {
  background: var(--yhh-ground);
  color: var(--yhh-ink);
  font-family: var(--yhh-body);
}

h1, h2, h3, h4,
.entry-title,
.site-title {
  font-family: var(--yhh-display);
  color: var(--yhh-deep);
  font-weight: 600;
  letter-spacing: -0.01em;
}

a { color: var(--yhh-ocean); }
a:hover { color: var(--yhh-deep); }

.site-title a { color: var(--yhh-ocean); }

/*
 * Kadence's default button becomes the sun accent everywhere, so the theme's own buttons
 * and the property templates cannot drift apart.
 */
.wp-block-button__link,
.button,
input[type="submit"] {
  background: var(--yhh-sun);
  border-color: var(--yhh-sun);
  color: #fff;
  font-family: var(--yhh-body);
  font-weight: 500;
}
.wp-block-button__link:hover,
.button:hover,
input[type="submit"]:hover {
  background: var(--yhh-sun-dk);
  border-color: var(--yhh-sun-dk);
  color: #fff;
}

/* The sticky mobile bar sits over the foot of the page; without this the last line of
   content hides behind it, which is a small thing that feels broken. */
@media (max-width: 860px) {
  body.single-property { padding-bottom: 68px; }
}
