/* --------------------------------------
Theme Custom Colors
----------------------------------------- */

:root {

  /* ===== CORE COLORS ===== */
  --color-primary: #B49E84;
  --color-dark: #1B1C20;
  --color-dark-secondary: #4B4338;
  --color-light: #FFFEFC;
  --color-light-soft: #F6F3EC;

  /* ===== RGB ===== */
  --primary-rgb: 180,158,132;
  --dark-rgb: 27,28,32;

  /* ===== DERIVED COLORS ===== */
  --primary-light: #c5b29c;
  --primary-dark: #8e7b66;

  --dark-light: #34363c;
  --dark-deep: #0f1012;

  --secondary-light: #6a6155;
  --secondary-dark: #2e2922;

  /* ===== THEME VARIABLES ===== */
  --theme-color1: var(--color-primary);
  --theme-color2: var(--color-dark);
  --theme-color3: var(--color-dark-secondary);
  --theme-color4: var(--color-light);

  --theme-color1-rgb: var(--primary-rgb);
  --theme-color2-rgb: var(--dark-rgb);

  --theme-color1-lighter: var(--primary-light);
  --theme-color1-darker: var(--primary-dark);

  --theme-color2-lighter: var(--dark-light);
  --theme-color2-darker: var(--dark-deep);

  --theme-color3-lighter: var(--secondary-light);
  --theme-color3-darker: var(--secondary-dark);

  --theme-color4-lighter: #ffffff;
  --theme-color4-darker: #e6e4df;

  /* ===== TEXT ===== */
  --theme-color1-text-color: var(--color-dark);
  --theme-color2-text-color: var(--color-light);
  --theme-color3-text-color: var(--color-light);
  --theme-color4-text-color: var(--color-dark);

  --hover-theme-color: var(--color-dark);

  /* ===== GRADIENTS ===== */
  --gradient-1: linear-gradient(to right, rgba(var(--primary-rgb),1) 0%, rgba(var(--primary-rgb),0.37) 100%);
  --gradient-2: linear-gradient(to left, rgba(var(--primary-rgb),1) 0%, rgba(var(--primary-rgb),0.7) 100%);
  --gradient-3: linear-gradient(180deg, var(--color-primary) 0%, rgba(0,0,0,0) 100%);
  --gradient-4: linear-gradient(180deg, rgba(180,158,132,0) 0%, rgba(180,158,132,0.5) 100%);
  --gradient-5: linear-gradient(180deg, var(--color-primary) 0%, rgba(75,67,56,0) 100%);
  --gradient-6: linear-gradient(180deg, var(--color-dark) 0%, rgba(27,28,32,0.3) 45%, var(--color-dark) 90%);
  --gradient-7: linear-gradient(180deg, rgba(180,158,132,0.7) 37.5%, rgba(255,254,252,0) 100%);

  --footer-default-theme-color: var(--color-primary);
  --footer-default-hover-theme-color: var(--color-primary);
  --footer-default-text-color-on-bg-theme-color: var(--color-dark);
}


/* --------------------------------------
Borders
----------------------------------------- */

.widget .line-bottom:after,
.pager.theme-colored a {
  border: 1px solid var(--theme-color1);
}

.hr-divider {
  border-top-color: rgba(180,158,132,0.2) !important;
}


/* --------------------------------------
Text Colors
----------------------------------------- */

.text-theme-colored1 { color: var(--theme-color1) !important; }
.text-theme-colored2 { color: var(--theme-color2) !important; }
.text-theme-colored3 { color: var(--theme-color3) !important; }
.text-theme-colored4 { color: var(--theme-color4) !important; }


/* --------------------------------------
Background Colors
----------------------------------------- */

.bg-theme-colored1 { background-color: var(--theme-color1) !important; }
.bg-theme-colored2 { background-color: var(--theme-color2) !important; }
.bg-theme-colored3 { background-color: var(--theme-color3) !important; }
.bg-theme-colored4 { background-color: var(--theme-color4) !important; }

.bg-soft-light { background-color: var(--color-light-soft) !important; }


/* --------------------------------------
Borders
----------------------------------------- */

.border-theme-colored1 { border-color: var(--theme-color1) !important; }
.border-theme-colored2 { border-color: var(--theme-color2) !important; }
.border-theme-colored3 { border-color: var(--theme-color3) !important; }
.border-theme-colored4 { border-color: var(--theme-color4) !important; }


/* --------------------------------------
Buttons
----------------------------------------- */

.btn-theme-colored1 {
  color: var(--theme-color1-text-color);
  background-color: var(--theme-color1);
  border-color: var(--theme-color1);
}

.btn-theme-colored1:hover {
  color: var(--theme-color2-text-color);
  background-color: var(--theme-color1-lighter);
  border-color: var(--theme-color1-lighter);
}

.btn-theme-colored2 {
  color: var(--theme-color2-text-color);
  background-color: var(--theme-color2);
  border-color: var(--theme-color2);
}

.btn-theme-colored2:hover {
  color: var(--theme-color2-text-color);
  background-color: var(--theme-color2-lighter);
}

.btn-theme-colored3 {
  color: var(--theme-color3-text-color);
  background-color: var(--theme-color3);
  border-color: var(--theme-color3);
}

.btn-theme-colored3:hover {
  background-color: var(--theme-color3-lighter);
}


/* --------------------------------------
WooCommerce Buttons
----------------------------------------- */

.woocommerce .button:not(.compare):not(.yith-wcqv-button):not([name=apply_coupon]) {
  --bs-btn-color: var(--color-dark);
  --bs-btn-bg: var(--color-primary);
  --bs-btn-border-color: var(--color-primary);

  --bs-btn-hover-color: var(--color-dark);
  --bs-btn-hover-bg: var(--primary-light);
  --bs-btn-hover-border-color: var(--primary-light);

  --bs-btn-focus-shadow-rgb: 180,158,132;

  --bs-btn-active-color: var(--color-dark);
  --bs-btn-active-bg: var(--primary-dark);
  --bs-btn-active-border-color: var(--primary-dark);

  --bs-btn-disabled-color: var(--color-dark);
  --bs-btn-disabled-bg: var(--color-primary);
  --bs-btn-disabled-border-color: var(--color-primary);
}


/* --------------------------------------
Blog Meta
----------------------------------------- */

.tm-sc-blog.blog-classic article .entry-header .post-single-meta,
.tm-sc-blog.blog-modern article .entry-header .post-single-meta {
  background: var(--theme-color1);
}


/* --------------------------------------
Scroll To Top
----------------------------------------- */

.scroll-to-top a {
  background-image: linear-gradient(to right, #B49E84 0%, #c5b29c 51%, #B49E84 100%);
}

.scroll-to-top a:hover {
  box-shadow: 0 10px 20px rgba(180,158,132,0.5);
  background-position: right center;
}