/*
Theme Name: Dear April
Theme URI: https://shopdearapril.com
Author: Dear April
Description: The Dear April brand theme: Cherry Red, Bubblegum Pink, Butter Yellow and Vanilla, Playfair Display and Montserrat (self-hosted), the signature wavy line, gingham and flowers. Built to pair with the Race Day, Ready. toolkit.
Version: 1.0.3
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
License: Proprietary. Fonts: SIL Open Font License 1.1 (assets/fonts/OFL.txt).
Text Domain: dear-april
*/

/* ---------- Signature wavy line (Separator → Styles → Wavy line) ---------- */
.wp-block-separator.is-style-wavy {
  border: 0 !important;
  height: 22px !important;
  max-width: none !important;
  width: 100% !important; /* WordPress caps separators at 100px wide by default */
  opacity: 1;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='22' viewBox='0 0 64 22'%3E%3Cg fill='none' stroke-width='3.2' stroke-linecap='round'%3E%3Cpath stroke='%23DB3D43' d='M0 6 C16 1 16 1 32 6 S48 11 64 6'/%3E%3Cpath stroke='%23F5AFC4' d='M0 11 C16 6 16 6 32 11 S48 16 64 11'/%3E%3Cpath stroke='%23F7DF91' d='M0 16 C16 11 16 11 32 16 S48 21 64 16'/%3E%3C/g%3E%3C/svg%3E") repeat-x left center;
  background-size: 64px 22px;
}
/* Bigger, bolder waves (Separator → Styles → Wavy line, large) */
.wp-block-separator.is-style-wavy-large {
  border: 0 !important;
  height: 44px !important;
  max-width: none !important;
  width: 100% !important;
  opacity: 1;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='22' viewBox='0 0 64 22'%3E%3Cg fill='none' stroke-width='3.2' stroke-linecap='round'%3E%3Cpath stroke='%23DB3D43' d='M0 6 C16 1 16 1 32 6 S48 11 64 6'/%3E%3Cpath stroke='%23F5AFC4' d='M0 11 C16 6 16 6 32 11 S48 16 64 11'/%3E%3Cpath stroke='%23F7DF91' d='M0 16 C16 11 16 11 32 16 S48 21 64 16'/%3E%3C/g%3E%3C/svg%3E") repeat-x left center;
  background-size: 128px 44px;
}
/* The separator's width setting in the editor (Default / Wide / Full) still works */
.wp-block-separator.is-style-wavy.alignwide, .wp-block-separator.is-style-wavy-large.alignwide { max-width: var(--wp--style--global--wide-size) !important; }

/* ---------- Gingham frame (Group → Styles → Gingham) ---------- */
.wp-block-group.is-style-gingham {
  background-color: var(--wp--preset--color--vanilla);
  background-image:
    linear-gradient(90deg, rgba(245, 175, 196, .45) 50%, transparent 50%),
    linear-gradient(rgba(245, 175, 196, .45) 50%, transparent 50%);
  background-size: 26px 26px;
  border-radius: 28px;
  padding: clamp(12px, 2.4vw, 22px) !important;
}

/* ---------- Card (Group → Styles → Card) ---------- */
.wp-block-group.is-style-card,
.wp-block-column.is-style-card {
  background: var(--wp--preset--color--paper);
  border: 1.5px solid var(--wp--preset--color--line);
  border-radius: 20px;
  padding: clamp(1.25rem, 3vw, 2rem);
}

/* ---------- Eyebrow label (Paragraph → Styles → Label) ---------- */
p.is-style-eyebrow {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--wp--preset--color--cherry-ink);
  margin-bottom: 0.25rem;
}

/* ---------- Italic accent (Heading or Paragraph → Styles → Accent) ---------- */
.is-style-accent {
  font-family: var(--wp--preset--font-family--display) !important;
  font-style: italic !important;
  font-weight: 400 !important;
  color: var(--wp--preset--color--ink) !important;
}

/* ---------- Flower bullets (List → Styles → Flowers) ---------- */
ul.is-style-flowers { list-style: none; padding-left: 0; }
ul.is-style-flowers li {
  position: relative;
  padding-left: 2rem;
  margin-bottom: 0.6rem;
}
ul.is-style-flowers li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.3em;
  width: 1.15rem;
  height: 1.15rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%23F5AFC4'%3E%3Ccircle cx='12' cy='5.8' r='5.3'/%3E%3Ccircle cx='17.9' cy='10.1' r='5.3'/%3E%3Ccircle cx='15.6' cy='17' r='5.3'/%3E%3Ccircle cx='8.4' cy='17' r='5.3'/%3E%3Ccircle cx='6.1' cy='10.1' r='5.3'/%3E%3C/g%3E%3Ccircle cx='12' cy='12' r='3.6' fill='%23F7DF91'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* ---------- Scalloped badge (Group → Styles → Scalloped badge) ---------- */
.wp-block-group.is-style-scallop {
  aspect-ratio: 1;
  max-width: 100%;
  width: clamp(160px, 16vw, 196px);
  display: grid !important;
  place-items: center;
  text-align: center;
  padding: 1.5rem !important;
  transform: rotate(-8deg);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='%23F5AFC4' d='M50 4c4 0 6 3 9 4s7 0 10 2 3 6 6 8 7 2 8 5-1 7 0 10 4 5 4 9-3 6-4 9 0 7-2 10-6 3-8 6-2 7-5 8-7-1-10 0-5 4-9 4-6-3-9-4-7 0-10-2-3-6-6-8-7-2-8-5 1-7 0-10-4-5-4-9 3-6 4-9 0-7 2-10 6-3 8-6 2-7 5-8 7 1 10 0 5-4 9-4z'/%3E%3C/svg%3E") no-repeat center / contain;
  color: var(--wp--preset--color--ink);
}
.wp-block-group.is-style-scallop > * { margin: 0 !important; }
/* Badge text is sized to the badge, whatever size the paragraph is set to */
.wp-block-group.is-style-scallop p { font-size: clamp(1rem, 1.15vw, 1.15rem) !important; line-height: 1.15 !important; }
.wp-block-group.is-style-scallop .nowrap { white-space: nowrap; }

/* ---------- Header and footer ---------- */
.site-header .wp-block-navigation a { padding: 0.55rem 0.9rem; border-radius: 999px; }
.site-header .wp-block-navigation a:hover,
.site-header .wp-block-navigation .current-menu-item > a { background: var(--wp--preset--color--pink-soft); color: var(--wp--preset--color--cherry-ink); }
.site-logo-link { display: inline-block; line-height: 0; }
.site-logo-link img { width: clamp(88px, 11vw, 120px); height: auto; }
.footer-signoff { font-family: var(--wp--preset--font-family--display); font-style: italic; }

/* ---------- Comfortable defaults ---------- */
:where(.wp-block-button__link) { display: inline-flex; align-items: center; gap: 0.5rem; }
:where(.wp-block-button:not(.is-style-outline)) .wp-block-button__link::after { content: "\2192"; letter-spacing: 0; font-weight: 500; margin-left: 0.45em; }
.is-style-outline .wp-block-button__link:hover { background: var(--wp--preset--color--pink-soft) !important; color: var(--wp--preset--color--cherry-ink) !important; border-color: var(--wp--preset--color--cherry) !important; }
:focus-visible { outline: 3px solid var(--wp--preset--color--ink); outline-offset: 2px; }
details.wp-block-details summary { cursor: pointer; font-weight: 600; color: var(--wp--preset--color--ink); }
details.wp-block-details summary::marker { color: var(--wp--preset--color--cherry); }
.wp-block-post-content .rdr-host { margin-block: 1rem; }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }