/*
Theme Name:   SolarEnergyPanelsUSA Kadence
Theme URI:    https://solarenergypanelsusa.com
Description:  Solar Energy Panels USA Child Theme for Kadence
Author:       Solar Energy Panels USA
Author URI:   https://solarenergypanelsusa.com
Template:     kadence
Version:      1.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  solarenergypanelsusa-kadence
*/

/* ============================================================
   SOLAR ENERGY PANELS USA — CHILD THEME
   Palette:
     Deep Charcoal (header/footer): #14141f
     Dark BG:                       #1c1c2c
     Card BG:                       #252538
     Warm Gold (accents/CTAs):      #f5a623
     Gold Hover:                    #ffb733
     Cream (body text):             #faf6f0
   ============================================================ */

/* ------------------------------------------------------------
   1. GLOBAL BODY & BACKGROUND
   ------------------------------------------------------------ */
body {
  background-color: #1c1c2c !important;
  color: #faf6f0 !important;
}

/* ------------------------------------------------------------
   2. FULL-WIDTH OVERRIDES (Golf-tested Kadence fixes)
   ------------------------------------------------------------ */
.site,
.site-container,
#page,
.content-area,
.site-content,
.wp-site-blocks {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.kadence-inner-column-direction-horizontal,
.wp-block-kadence-rowlayout,
.kb-row-layout-wrap {
  max-width: 100% !important;
}

/* Fix Kadence container width on inner pages */
body.single-post .entry-content-wrap,
body.page .entry-content-wrap {
  max-width: 100% !important;
}

/* ------------------------------------------------------------
   3. HEADER & NAVIGATION
   ------------------------------------------------------------ */
#masthead,
.site-header,
.site-top-header,
header.site-header {
  background-color: #14141f !important;
  border-bottom: 3px solid #f5a623 !important;
}

.main-navigation,
#site-navigation {
  background-color: #14141f !important;
}

/* Nav links */
.main-navigation a,
.nav-drop-toggle,
.kadence-menu > li > a {
  color: #faf6f0 !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.05em !important;
}

.main-navigation a:hover,
.kadence-menu > li > a:hover {
  color: #f5a623 !important;
}

/* Dropdown menus */
.main-navigation ul ul,
.kadence-menu .sub-menu {
  background-color: #14141f !important;
  border-top: 2px solid #f5a623 !important;
}

.main-navigation ul ul a,
.kadence-menu .sub-menu a {
  color: #faf6f0 !important;
}

.main-navigation ul ul a:hover,
.kadence-menu .sub-menu a:hover {
  color: #f5a623 !important;
  background-color: #252538 !important;
}

/* Logo spacing */
.site-branding {
  margin-left: 20px !important;
}

.site-branding .site-title a,
.site-branding .site-title {
  color: #f5a623 !important;
  font-weight: 700 !important;
}

/* ------------------------------------------------------------
   4. HOME PAGE — FULL WIDTH SECTIONS
   ------------------------------------------------------------ */
body.home .content-area,
body.home .site-main,
body.home article.page,
body.home .entry-content {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

body.home .entry-content > * {
  max-width: 100% !important;
}

/* Solar section styles */
.sep-section {
  background: #1c1c2c;
  padding: 60px 40px;
}

.sep-title-strip {
  background: #ffffff;
  width: 100%;
  padding: 18px 40px;
  text-align: center;
}

.sep-title-strip h2 {
  color: #14141f !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
  margin: 0 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

.sep-card {
  background: #252538;
  border-radius: 8px;
  padding: 24px;
  margin: 12px;
  flex: 1;
  min-width: 220px;
  border-top: 3px solid #f5a623;
}

.sep-card h3 {
  color: #f5a623 !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  margin-bottom: 10px !important;
}

.sep-card p {
  color: #faf6f0 !important;
  font-size: 0.95rem !important;
  line-height: 1.6 !important;
}

.sep-card a {
  color: #f5a623 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

.sep-card a:hover {
  color: #ffb733 !important;
}

.sep-cards-row {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 16px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 20px 0 !important;
}

/* CTA Button */
.sep-btn {
  display: inline-block !important;
  background: #f5a623 !important;
  color: #14141f !important;
  padding: 14px 32px !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  font-size: 0.95rem !important;
  margin-top: 12px !important;
  transition: background 0.2s !important;
}

.sep-btn:hover {
  background: #ffb733 !important;
  color: #14141f !important;
}

/* Trust bar */
.sep-trust-bar {
  background: #14141f !important;
  padding: 20px 40px !important;
  display: flex !important;
  justify-content: center !important;
  gap: 60px !important;
  flex-wrap: wrap !important;
  border-bottom: 3px solid #f5a623 !important;
}

.sep-trust-item {
  text-align: center !important;
  color: #faf6f0 !important;
}

.sep-trust-item strong {
  display: block !important;
  font-size: 1.8rem !important;
  color: #f5a623 !important;
  font-weight: 700 !important;
}

.sep-trust-item span {
  font-size: 0.85rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

/* ------------------------------------------------------------
   5. ARCHIVE / CATEGORY PAGES (Golf-tested Kadence fix)
   ------------------------------------------------------------ */
body.archive .entry-hero,
body.category .entry-hero,
body.archive .post-archive-hero-section,
body.category .post-archive-hero-section,
body.archive .entry-hero-container-inner,
body.category .entry-hero-container-inner,
body.archive .entry-hero .hero-container,
body.category .entry-hero .hero-container {
  background: #14141f !important;
  background-color: #14141f !important;
  background-image: none !important;
}

body.archive .post-archive-hero-section,
body.category .post-archive-hero-section {
  padding: 0 !important;
  border-bottom: 4px solid #f5a623 !important;
}

body.archive .entry-hero-container-inner,
body.category .entry-hero-container-inner {
  padding: 72px 24px 60px !important;
  text-align: center !important;
}

body.archive .entry-hero-container-inner h1,
body.category .entry-hero-container-inner h1,
body.archive .entry-title,
body.category .entry-title {
  color: #faf6f0 !important;
}

/* Archive post cards */
body.archive .content-bg,
body.category .content-bg,
body.archive article.post,
body.category article.post {
  background: #252538 !important;
  border-radius: 8px !important;
  border-top: 3px solid #f5a623 !important;
}

body.archive .entry-title a,
body.category .entry-title a {
  color: #faf6f0 !important;
}

body.archive .entry-title a:hover,
body.category .entry-title a:hover {
  color: #f5a623 !important;
}

/* ------------------------------------------------------------
   6. SINGLE POST PAGES (Golf-tested Kadence fixes)
   ------------------------------------------------------------ */

/* Dark full-width surround */
body.single-post {
  background-color: #1c1c2c !important;
}

body.single-post .content-area,
body.single-post .site-main {
  background-color: #1c1c2c !important;
  max-width: 100% !important;
  width: 100% !important;
}

/* Featured image — fix Kadence absolute positioning bug */
.single-post .article-post-thumbnail,
.single-post .post-thumbnail {
  position: static !important;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  overflow: hidden !important;
}

.single-post .post-top-featured,
.single-post .article-post-thumbnail img,
.single-post .post-thumbnail img {
  width: 100% !important;
  height: 460px !important;
  max-height: 460px !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: 0 !important;
}

/* Post title area */
.single-post .entry-header {
  background-color: #14141f !important;
  padding: 40px !important;
  border-bottom: 4px solid #f5a623 !important;
}

.single-post .entry-title {
  color: #faf6f0 !important;
  font-size: 2rem !important;
}

/* Reading card */
.single-post .entry-content.single-content {
  background: #ffffff !important;
  color: #1c1c2c !important;
  max-width: 840px !important;
  margin: 40px auto !important;
  padding: 60px 56px !important;
  box-shadow: 0 8px 40px rgba(0,0,0,0.30) !important;
  border-radius: 4px !important;
}

.single-post .entry-content.single-content h1,
.single-post .entry-content.single-content h2,
.single-post .entry-content.single-content h3 {
  color: #14141f !important;
}

.single-post .entry-content.single-content a {
  color: #f5a623 !important;
}

.single-post .entry-content.single-content a:hover {
  color: #ffb733 !important;
}

/* ------------------------------------------------------------
   7. STATIC PAGES
   ------------------------------------------------------------ */
body.page .entry-content {
  color: #faf6f0 !important;
}

body.page .entry-header {
  background-color: #14141f !important;
  padding: 60px 40px !important;
  border-bottom: 4px solid #f5a623 !important;
  text-align: center !important;
}

body.page .entry-title {
  color: #faf6f0 !important;
}

/* ------------------------------------------------------------
   8. FOOTER
   ------------------------------------------------------------ */
#colophon,
.site-footer,
footer.site-footer {
  background-color: #14141f !important;
  color: #faf6f0 !important;
  border-top: 3px solid #f5a623 !important;
  padding: 40px !important;
}

.site-footer a,
#colophon a {
  color: #f5a623 !important;
}

.site-footer a:hover,
#colophon a:hover {
  color: #ffb733 !important;
}

.site-footer .widget-title {
  color: #f5a623 !important;
  font-size: 1rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  border-bottom: 1px solid #252538 !important;
  padding-bottom: 8px !important;
  margin-bottom: 12px !important;
}

/* Copyright bar */
.site-info,
.footer-credit {
  background-color: #0d0d17 !important;
  color: #faf6f0 !important;
  text-align: center !important;
  padding: 16px !important;
  font-size: 0.85rem !important;
}

/* ------------------------------------------------------------
   9. BUTTONS & LINKS
   ------------------------------------------------------------ */
a {
  color: #f5a623 !important;
}

a:hover {
  color: #ffb733 !important;
}

.wp-block-button__link,
.button,
button[type="submit"] {
  background-color: #f5a623 !important;
  color: #14141f !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 12px 28px !important;
}

.wp-block-button__link:hover,
.button:hover,
button[type="submit"]:hover {
  background-color: #ffb733 !important;
  color: #14141f !important;
}

/* ------------------------------------------------------------
   10. RESPONSIVE
   ------------------------------------------------------------ */
@media (max-width: 768px) {
  .sep-cards-row {
    flex-direction: column !important;
    padding: 20px !important;
  }

  .sep-trust-bar {
    gap: 24px !important;
    padding: 20px !important;
  }

  .sep-title-strip h2 {
    font-size: 1.4rem !important;
  }

  .single-post .entry-content.single-content {
    padding: 32px 20px !important;
    margin: 20px !important;
  }

  .single-post .post-top-featured,
  .single-post .article-post-thumbnail img {
    height: 240px !important;
  }
}

/* ============================================================
   v1.1 FIXES — Full width, fonts, card grid
   ============================================================ */

/* ------------------------------------------------------------
   FONTS — Match Golf system stack + sizing
   ------------------------------------------------------------ */
body, input, select, textarea {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
  font-size: 17px !important;
  line-height: 1.7 !important;
  color: #faf6f0 !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}

h1 { font-size: 2.4rem !important; }
h2 { font-size: 2rem   !important; }
h3 { font-size: 1.5rem !important; }
h4 { font-size: 1.2rem !important; }

/* ------------------------------------------------------------
   FULL WIDTH — Home page aggressive overrides
   ------------------------------------------------------------ */
body.home .content-area,
body.home .site-main,
body.home article,
body.home article.page,
body.home .entry-content-wrap,
body.home .entry-content,
body.home .content-container {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Remove Kadence top/bottom margin on home */
body.home .content-area {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Override Kadence --global-content-width on home */
body.home {
  --global-content-width: 100% !important;
  --global-calc-content-width: 100% !important;
  --wp--style--global--content-size: 100% !important;
}

body.home .wp-block-group,
body.home .wp-block-group__inner-container {
  max-width: 100% !important;
  padding: 0 !important;
}

/* Fix content-area top margin on ALL pages */
.content-area {
  margin-top: 0 !important;
}

/* ------------------------------------------------------------
   CARDS — Fix 6 cards to 3 per row (3+3 grid)
   ------------------------------------------------------------ */
.sep-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
  max-width: 1100px !important;
  margin: 24px auto !important;
  padding: 0 40px !important;
}

.sep-card {
  max-width: 100% !important;
  min-width: unset !important;
  flex: unset !important;
}

@media (max-width: 900px) {
  .sep-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 580px) {
  .sep-grid {
    grid-template-columns: 1fr !important;
    padding: 0 20px !important;
  }
}