/*
Theme Name: Listify Child
Template: listify
Text Domain: listify-child
Description: Custom child theme for Listify with responsive sections, gold accents, and Playfair typography.
Author: Your Name
Version: 1.0
*/

/* ---------------------------------
   1. Brand Variables
----------------------------------- */
  /* Colors */
  --brand-gold:#ffb400;   /* headers, brand */
  --sage:#9ba17b;          /* accents, soft fills */
  --soft-gold:#d6ba73;     /* buttons, highlights */
  --warm-white:#faf8f5;    /* page background */
  --charcoal:#fcf2c2;      /* body text */


/* ---------------------------------
   2. Global HTML & Body
----------------------------------- */
html, body {
  border: none !important;
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 14px;
  color: var(--soft-gold);
  line-height: 1.6;
  margin: 0;
  padding: 0;
}

/* Responsive sections */
.elementor-section,
.elementor-column {
  background: #ffffff00 !important;
  border: none !important;
  box-shadow: none !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}

/* Section default text */
.elementor-section {
  color: #d6ba73 !important;
  font-size: 20px !important;
  font-style: italic !important;
}

/* Section Headings (H2 default) */
.elementor-section h2,
.elementor-heading-title {
  color: #d6ba73 !important;
  font-family: "Playfair Display", serif !important;
  font-size: 36px !important;
  font-style: italic !important;
  font-weight: 600 !important; /* semi-bold */
}

/* ---------------------------------
   3. Typography
----------------------------------- */
h1 {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 36px;
  color: var(--soft-gold);
}
h2 {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 34px;
  color: var(--soft-gold);
}
h3 {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 30px;
  color: var(--soft-gold);
}
h4 {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 26px;
  color: var(--soft-gold);
}
h5 {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 20px;
  color: var(--soft-gold);
}
h6 {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 16px;
  color: var(--soft-gold);
}
p {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 14px;
  color: var(--soft-gold);
}

/* ---------------------------------
   4. Icon Boxes
----------------------------------- */
.elementor-icon-box-title,
.elementor-icon-box-title a {
  font-family: "Playfair Display", serif !important;
  font-size: 18px !important;
  font-weight: 600 !important; /* semi-bold */
  font-style: italic !important;
  color: #d6ba73 !important;
}
.elementor-icon-box-description {
  font-family: "Playfair", serif !important;
  font-size: 16px !important;
  font-style: italic !important;
  color: #d6ba73 !important;
}

/* ---------------------------------
   5. Header & Navigation
----------------------------------- */
.site-header {
  background-color: #000000 !important;
}
.site-header,
.site-title,
.site-title a {
  color: #ffb400 !important;
}
.main-navigation a {
  color: #ffb400 !important;
}
.main-navigation ul ul a {
  color: #484848 !important;
}
.secondary-navigation {
  background: #000000 !important;
}
.secondary-navigation a {
  color: #484848 !important;
}
.tertiary-navigation {
  background: #b18f6a !important;
}
.tertiary-navigation a {
  color: #faf8f5 !important;
}

/* Current cart */
.current-cart {
  background: #484848 !important;
  color: #faf8f5 !important;
}

/* ---------------------------------
   6. Footer
----------------------------------- */
.site-footer {
  background-color: #1e1813 !important;
  color: #d69900 !important;
}
.site-footer .widget {
  background-color: #241f1b !important;
  color: #faf8f5 !important;
}
.site-footer a {
  color: #d69900 !important;
}

/* ---------------------------------
   7. Inputs & Content Boxes
----------------------------------- */
input,
textarea,
select {
  background-color: #000000 !important;
  border: 1px solid #ffffff !important;
  color: #484848 !important;
}
.content-box {
  background: #000000 !important;
  border: 1px solid #000000 !important;
  accent-color: #000000 !important;
}

/* ---------------------------------
   8. Listings (Listify specific)
----------------------------------- */
.job_listing {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid #000000;
}
.job_listing .rating .star {
  color: #ffb400 !important; /* gold stars */
}
.job_listing .verified-badge {
  background: #9ba17B !important;
}

/* ---------------------------------
   9. Links
----------------------------------- */
/* ================================
   LINKS (global)
================================ */
a,
a:link { color: #ffb400; text-decoration: none; }
a:visited { color: #9ba17b; }
a:hover,
a:focus { color: #d6ba73; }
a:active { color: #9ba17b; }

/* ================================
   BUTTONS (primary)
   Targets WP + Elementor buttons
================================ */
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.button,
.elementor-button,
.elementor-button-link .elementor-button {
  background-color: #d6ba73;          /* primary default */
  color: #faf8f5;                      /* warm white text */
  border: 2px solid transparent;
  border-radius: 6px;
  padding: 10px 20px;
  font-weight: 600;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease;
}

button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
.button:hover,
.elementor-button:hover,
.elementor-button:focus-visible {
  background-color: #ffb400;          /* primary hover */
  color: #faf8f5;                      /* keep warm white text */
  border-color: #d6ba73;               /* focus/hover border = soft gold */
}

button:focus,
input[type="submit"]:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
.button:focus,
.elementor-button:focus {
  outline: none;
  border-color: #d6ba73;               /* primary focus border */
  box-shadow: 0 0 0 3px rgba(214,186,115,0.35);
}

/* ================================
   INPUTS (textual fields)
================================ */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="number"],
textarea,
select {
  background: #ffffff;
  color: #484848;
  border: 1.5px solid #9ba17b;         /* default = sage/soft olive */
  border-radius: 6px;
  padding: 10px 12px;
  transition: border-color .2s ease, box-shadow .2s ease;
}

input:hover,
textarea:hover,
sel
}

/* 9) Page-scoped helpers (replace IDs as needed) */
/* Example: make everything in page "How It Works" use white cards on warm-white page */
.page-id-How It Works .elementor-widget-container{background:#fff;}

/* Example: transparent hero just on page 123 if you give it ID 'transparent-hero' */
.page-id-888 #transparent-hero{background:transparent!important; box-shadow:none!important;}
.page-id-999 #transparent-hero .elementor-background-overlay{opacity:0!important;}



/* ================================
   LINKS — FINAL OVERRIDE (high specificity + correct order)
   Order matters: link → visited → hover/focus → active
================================ */
body a:link {
  color: #ffb400 !important;   /* default bright gold */
  text-decoration: none;
}

body a:visited {
  color: #9ba17b !important;   /* sage/soft olive */
}

body a:hover,
body a:focus {
  color: #d6ba73 !important;   /* soft gold */
}

body a:active {
  color: #9ba17b !important;   /* active = sage/soft olive */
}

/* Footer links (same palette, footer-specific in case footer styles are stronger) */
.site-footer a:link,
.site-footer a {
  color: #ffb400 !important;
  text-decoration: none;
}
.site-footer a:visited {
  color: #9ba17b !important;
}
.site-footer a:hover,
.site-footer a:focus {
  color: #d6ba73 !important;
}
.site-footer a:active {
  color: #9ba17b !important;
}