/*
Theme Name:   KDP Author Central Child
Theme URI:    https://kdpauthorcentral.com
Description:  Child theme for kdp-author-central. All custom front-end development happens here.
Author:       KDP Author Central
Template:     kdp-author-central
Version:      1.3.2
Text Domain:  kdp-author-central-child
*/

/* ============================================================
   KDPAC — Component & Layout Fixes
   Loads last in the queue; safely overrides assets/css/style.css
   and assets/css/responsive.css.
   ============================================================ */

/* ----------------------------------------------------------
   1. Global Buttons — box-model for <a class="primary-btn">
      The static site used <button> elements, which inherited
      padding/border-radius from the button{} rule.  WordPress
      block templates (field-helpers.php) render buttons as <a>
      tags; they need those properties declared explicitly.
   ---------------------------------------------------------- */
.primary-btn,
.secondary-btn {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    text-decoration: none;
    cursor: pointer;
    line-height: normal;
    box-sizing: border-box;
}

/* Re-affirm correct colours inside containers whose blanket "a"
   selector (e.g. .sec-6 a, .sec-5-btn a) would otherwise override
   the button appearance.  These selectors are more specific than
   the originals so they win without !important. */

.sec-5-btn a.primary-btn,
.sec-1-right-btn a.primary-btn,
.sec-6 a.primary-btn,
.hero-btn a.primary-btn {
    background: var(--gradient-color);
    color: #000;
    border: 1px solid #fec001;
    border-radius: 4px;
    padding: 8px 16px;
}

.sec-5-btn a.primary-btn:hover,
.sec-1-right-btn a.primary-btn:hover,
.sec-6 a.primary-btn:hover,
.hero-btn a.primary-btn:hover {
    background: none;
    color: #fa990a;
    border-color: #fec001;
}

.sec-5-btn a.secondary-btn,
.sec-1-right-btn a.secondary-btn,
.sec-6 a.secondary-btn,
.hero-btn a.secondary-btn {
    background: transparent;
    color: #0bc;
    border: 1px solid #0bc;
    border-radius: 4px;
    padding: 8px 16px;
}

.sec-5-btn a.secondary-btn:hover,
.sec-1-right-btn a.secondary-btn:hover,
.sec-6 a.secondary-btn:hover,
.hero-btn a.secondary-btn:hover {
    background-color: transparent;
    color: #fa990a;
    border-color: #F7AC4D;
}

/* ----------------------------------------------------------
   2. Footer — restore bottom padding.
      style.css changed "padding: 80px 0" to "padding-top: 80px"
      with no matching padding-bottom, leaving a white gap between
      the footer's inner content and the viewport bottom.
   ---------------------------------------------------------- */
footer {
    padding-bottom: 40px;
}

/* ----------------------------------------------------------
   3. Navigation — active / focus-within states.
      kdpac_child_nav_active_class() in setup.php maps
      current-menu-item → .active; also keep the parent item
      highlighted when a dropdown child is active, and add
      :focus-within so keyboard/touch users see the open state.
   ---------------------------------------------------------- */
.nav-bottom .service-nav:focus-within {
    border-bottom: 2px solid #008296;
}

.nav-bottom .service-nav:focus-within > a {
    color: #008296;
}

.nav-bottom .service-nav:focus-within ul {
    opacity: 1;
}

/* ----------------------------------------------------------
   4. Pre-footer CTA — pricing badge / tag
      Editors place <span class="pricing-badge"> inside the
      CTA Section block's description field.
   ---------------------------------------------------------- */
.pricing-badge {
    display: inline-block;
    background: var(--gradient-color);
    color: #000;
    font-family: var(--font-family-600);
    font-size: 0.95rem;
    font-weight: 700;
    padding: 5px 18px;
    border-radius: 50px;
    margin: 10px 0 20px;
    letter-spacing: 0.02em;
}

/* ----------------------------------------------------------
   5. Help sidebar — keep left panel ordered to the left.
      .help-main is display:flex; .help-left is first in markup
      so it is already on the left.  Explicit order properties
      guard against any Bootstrap utility class reordering it.
   ---------------------------------------------------------- */
.help-left {
    order: -1;
    flex-shrink: 0;
}

.help-right {
    flex: 1 1 0;
    min-width: 0;
}

/* ----------------------------------------------------------
   6. Sticky footer — pin footer to viewport bottom on
      short-content pages instead of leaving a body-background gap.
   ---------------------------------------------------------- */
html {
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    margin: 0;
}

footer {
    margin-top: auto;
}

/* ----------------------------------------------------------
   7. Global image constraint — match core HTML sizing for any
      content image missing an explicit sizing class.
   ---------------------------------------------------------- */
body img {
    max-width: 100%;
    height: auto;
}

body .nav-top a img,
body .footer-box-1 img {
    max-width: none; /* fixed-width logo rules already handle these */
}

/* .nav-mobile-logo img has no fixed width, only max-width: 160px
   (assets/css/style.css) — must NOT be reset to max-width: none here,
   or the logo renders at its native size (e.g. 3201x519) and blows out
   the mobile nav drawer. */

/* ----------------------------------------------------------
   8. Section background override — applied by adding "no-bg" in
      the block's "Additional CSS Class(es)" field on a specific
      Content Feature List / CTA Section instance.
   ---------------------------------------------------------- */
.sec-6.cream-bg {
    background: #FEFAF6 !important;
}

.sec-1.no-bg .sec-1-content-main,
.sec-6.no-bg {
    background: none !important;
}