/*
Theme Name: MultiplyParts Append
Theme URI: https://multiplyparts.com
Author: Multiply Parts
Author URI: https://multiplyparts.com
Description: WordPress conversion of the "Append" template by BootstrapMade (https://bootstrapmade.com/append-bootstrap-website-template/), adapted for the multiplyparts.com marketing site. Original template license: https://bootstrapmade.com/license/
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: mp-append
*/

/* ==========================================================================
   This file intentionally stays light. All of the Append template's visual
   design lives in assets/css/main.css (enqueued in functions.php) so the
   original template CSS is never forked. This stylesheet only adds the
   small set of rules WordPress itself needs: block editor output classes
   (alignment, captions, galleries) and menu-related resets that the theme
   generates via wp_nav_menu() / the Walker in inc/class-append-nav-walker.php.
   ========================================================================== */

/* --- MultiplyParts brand color ---------------------------------------
   The Append template drives every button/link/hover color off these CSS
   custom properties (see assets/css/main.css's :root block), so the whole
   site's accent color is changed in one place, without touching main.css.
   ------------------------------------------------------------------- */
:root {
  --accent-color: #10B894;
}

:root {
  --nav-hover-color: #10B894;
  --nav-dropdown-hover-color: #10B894;
}

/* --- Logo: swap to a white version while the header sits transparently
   over the homepage hero image, and back to full color once scrolled
   (body.scrolled) or on any other page (header is never transparent
   there). Mirrors the color-variable trick main.css already uses for
   the text-only logo. --- */
.header .logo-dark {
  display: inline-block;
}

.header .logo-light {
  display: none;
}

.index-page .header .logo-dark {
  display: none;
}

.index-page .header .logo-light {
  display: inline-block;
}

.index-page.scrolled .header .logo-dark {
  display: inline-block;
}

.index-page.scrolled .header .logo-light {
  display: none;
}

/* --- Standard WordPress alignment & caption classes (used by post/page content) --- */
.alignleft {
  float: left;
  margin: 0 1.5em 1.5em 0;
}

.alignright {
  float: right;
  margin: 0 0 1.5em 1.5em;
}

.aligncenter {
  clear: both;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.wp-caption {
  max-width: 100%;
}

.wp-caption-text {
  font-size: 0.85em;
  color: #6c757d;
  text-align: center;
  margin-top: 0.5em;
}

.wp-block-quote,
.entry-content blockquote {
  border-left: 3px solid var(--accent-color, #00c896);
  padding-left: 1.2em;
  margin-left: 0;
  font-style: italic;
}

.wp-block-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
  list-style: none;
  padding: 0;
  margin: 1.5em 0;
}

.wp-block-gallery .blocks-gallery-item {
  flex: 1 1 30%;
}

.wp-block-gallery img {
  width: 100%;
  height: auto;
  display: block;
}

.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}

/* --- Nav menu: keep dropdown submenus visually consistent with Append's markup --- */
.navmenu ul ul {
  margin: 0;
  padding: 0;
}

/* --- Pagination (posts list / archives) --- */
.mp-pagination {
  display: flex;
  justify-content: center;
  padding: 0;
  margin: 0;
  list-style: none;
  gap: 6px;
}

.mp-pagination li a,
.mp-pagination li span {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 4px;
  background: #fff;
  border: 1px solid #ececec;
}

.mp-pagination li span.current {
  background: var(--accent-color, #00c896);
  color: #fff;
  border-color: var(--accent-color, #00c896);
}

/* --- Skip link (accessibility) --- */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  background: #fff;
  color: #000;
  padding: 10px 16px;
  z-index: 100000;
}

.skip-link:focus {
  left: 10px;
  top: 10px;
}
