/*
    Theme Name: My Child Theme
    Theme URI: http://example.com/my-child-theme/
    Description: A child theme for customizing the parent theme.
    Author: Your Name
    Author URI: http://example.com/
    Template: skin-care-products
    Version: 1.0.0
    */

/* Base body */
body {
  background-color: #FAF8F3; /* ivory background */
  color: #4B4B4B; /* charcoal text */
  margin: 20px 40px;
  max-width: 580px;
}

/* Typography */
h1 {
  font-size: 1.5rem;
  font-weight: 300;
  color: #6B8C5F; /* olive green for main headings */
}

h2 {
  font-size: 1.25rem;
  font-weight: 300;
  color: #A3B18A; /* sage green */
}

h3, h4, h6 {
  color: #4B4B4B; /* charcoal for body headings */
}

h5 {
  color: #D4AF37; /* gold for small caps/labels */
  font-size: 0.8125rem;
  font-weight: 800;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

blockquote {
  color: #6B8C5F; /* olive for emphasis quotes */
  border-left: 4px solid #D4AF37; /* gold accent */
  padding-left: 1em;
}

/* Links */
a {
  color: #6B8C5F; /* olive links */
  box-shadow: inset 0 -1px 0 #D4AF37; /* gold underline */
  transition: all 0.2s ease-in-out;
}

a:hover, a:focus {
  color: #D4AF37; /* gold on hover */
  box-shadow: inset 0 -2px 0 #6B8C5F; /* olive hover underline */
}

/* Horizontal rule */
hr {
  background-color: #EAD7C1; /* beige-rose divider */
  height: 2px;
  border: none;
}

/* Tables */
thead th {
  border-bottom: 2px solid #A3B18A; /* sage borders */
}

tr {
  border-bottom: 1px solid #EAD7C1; /* soft beige-rose row divider */
}

/* Buttons (generic) */
button,
input[type="submit"] {
  background-color: #D4AF37; /* gold button */
  color: #FAF8F3; /* ivory text */
  border: none;
  padding: 0.6em 1.2em;
  font-weight: 600;
  text-transform: uppercase;
  border-radius: 4px;
  cursor: pointer;
  transition: background 0.2s ease-in-out;
}

button:hover,
input[type="submit"]:hover {
  background-color: #6B8C5F; /* olive hover */
  color: #FAF8F3; /* ivory text */
}

/* Footer */
footer {
  background-color: #4B4B4B; /* charcoal footer */
  color: #FAF8F3; /* ivory text */
  padding: 2em;
}

footer a {
  color: #D4AF37; /* gold footer links */
}

footer a:hover {
  color: #A3B18A; /* sage hover */
}