/* Lacoura Builder: base styles for builder elements on the page.
   Brand-neutral: colours come from the theme's palette variables, with plain
   fallbacks for themes that don't define them. Per-element settings are
   generated CSS (.lcb-e-ID.lcb-el) and outrank everything here. */

/* --- Layout ---------------------------------------------------------- */

.lcb-section.lcb-el { margin-block: 0; }
.lcb-section {
  position: relative;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  background-size: cover;
  background-repeat: no-repeat;
}
.lcb-section.lcb-has-bg::before {
  content: ""; position: absolute; inset: 0; background: #000; opacity: 0; pointer-events: none;
}
.lcb-section > .lcb-section__inner {
  position: relative;
  width: 100%;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.lcb-row { display: grid; box-sizing: border-box; }
.lcb-col { display: flex; flex-direction: column; min-width: 0; box-sizing: border-box; }
.lcb-container { display: flex; flex-direction: column; box-sizing: border-box; }

/* Inside builder layout, spacing comes from the gap setting, not margins. */
.lcb-section__inner > .lcb-el,
.lcb-col > .lcb-el,
.lcb-container > .lcb-el,
.lcb-row > .lcb-col.lcb-el { margin-block: 0; }

/* --- Text ------------------------------------------------------------ */

.lcb-text > :first-child { margin-top: 0; }
.lcb-text > :last-child { margin-bottom: 0; }

.lcb-label {
  margin: 0;
  font-size: 0.72rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
}
.lcb-label--accent { color: var(--wp--preset--color--accent-1, currentColor); }
.lcb-label--muted { color: var(--wp--preset--color--accent-4, currentColor); }

.lcb-list { margin: 0; padding: 0; list-style: none; }
.lcb-list li { margin: 0; }
.lcb-list--rules li { padding: 0.7rem 0; border-top: 1px solid var(--wp--preset--color--accent-6, rgba(0, 0, 0, 0.12)); }
.lcb-list--rules li:last-child { border-bottom: 1px solid var(--wp--preset--color--accent-6, rgba(0, 0, 0, 0.12)); }
.lcb-list--dots li { position: relative; padding: 0.35rem 0 0.35rem 1.4rem; }
.lcb-list--dots li::before {
  content: ""; position: absolute; left: 0; top: 0.95em;
  width: 0.45rem; height: 0.45rem; border-radius: 50%; background: currentColor;
}
.lcb-list--numbers { list-style: decimal; padding-left: 1.3em; }
.lcb-list--numbers li { padding: 0.25rem 0; }
.lcb-list--plain li { padding: 0.25rem 0; }

/* --- Buttons --------------------------------------------------------- */

.lcb-button { margin: 0; }
.lcb-btn {
  display: inline-flex; align-items: center; gap: 0.5em;
  padding: 1em 1.75em;
  font-size: 0.75rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; line-height: 1.2;
  text-decoration: none;
  transition: opacity 0.2s ease, background-color 0.2s ease;
}
.lcb-btn--solid { background: var(--wp--preset--color--contrast, #111); color: var(--wp--preset--color--base, #fff); }
.lcb-btn--light { background: var(--wp--preset--color--base, #fff); color: var(--wp--preset--color--contrast, #111); }
.lcb-btn--outline { background: transparent; color: inherit; box-shadow: inset 0 0 0 1px currentColor; }
.lcb-btn--link { padding: 0 0 0.2em; color: inherit; border-bottom: 1px solid currentColor; letter-spacing: 0.08em; }
.lcb-btn:hover, .lcb-btn:focus-visible { opacity: 0.85; }
.lcb-btn--solid:hover, .lcb-btn--solid:focus-visible { color: var(--wp--preset--color--base, #fff); }

/* --- Media ----------------------------------------------------------- */

.lcb-image { margin: 0; }
.lcb-image img { display: block; width: 100%; height: auto; }
.lcb-image figcaption {
  margin-top: 0.6em; font-size: var(--wp--preset--font-size--small, 0.85rem);
  color: var(--wp--preset--color--accent-4, inherit);
}
.lcb-gallery { display: grid; }
.lcb-gallery figure { margin: 0; }
.lcb-gallery img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lcb-video { margin: 0; }
.lcb-video > video, .lcb-video > iframe { display: block; width: 100%; height: auto; border: 0; aspect-ratio: 16 / 9; }

/* --- Rules ----------------------------------------------------------- */

.lcb-divider { width: 100%; margin: 0; border: 0; border-top: 1px solid currentColor; }
.lcb-divider--short { width: 4rem; }
.lcb-spacer { margin: 0; }

/* --- Hide per device (same breakpoints as WordPress columns) ---------- */

@media (min-width: 1025px) { .lcb-hide-desktop { display: none !important; } }
@media (min-width: 782px) and (max-width: 1024px) { .lcb-hide-tablet { display: none !important; } }
@media (max-width: 781px) { .lcb-hide-mobile { display: none !important; } }
