/*================================================
Custom Fonts Configuration - EntredDivas
=================================================*/

/* ============================================
   @font-face Declarations
   ============================================ */

/* Manrope - Sans-serif */
@font-face {
  font-family: 'Manrope';
  src: url('../fonts/Manrope-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Manrope';
  src: url('../fonts/Manrope-VariableFont_wght.ttf') format('truetype');
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

/* Arapey - Serif */
@font-face {
  font-family: 'Arapey';
  src: url('../fonts/Arapey-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Arapey';
  src: url('../fonts/Arapey-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

/* Geist - Sans-serif */
@font-face {
  font-family: 'Geist';
  src: url('../fonts/Geist-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Geist';
  src: url('../fonts/Geist-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Geist';
  src: url('../fonts/Geist-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Geist';
  src: url('../fonts/Geist-VariableFont_wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* ============================================
   CSS Variables (Custom Properties)
   ============================================ */

:root {
  /* Font Family Variables */
  --subheading-font-family: 'Manrope', sans-serif;
  --heading-font-family: 'Arapey', serif;
  --text-font-family: 'Geist', sans-serif;
  
  /* Font Sizes */
  --subheading-font-size: 0.6875rem; /* 11px */
  --body-font-size: 15px;
  
  /* Line Heights */
  --heading-line-height: 0.9;
  --body-line-height: 1.4;
  
  /* Letter Spacing */
  --subheading-letter-spacing: 0.0em;
  --heading-letter-spacing: -0.015em;
  --body-letter-spacing: 0.0em;
}

/* ============================================
   Base Styles Application
   ============================================ */

/* Body - Usando Geist para todo el texto del cuerpo */
body {
  font-family: var(--text-font-family) !important;
  font-size: var(--body-font-size);
  line-height: var(--body-line-height);
  letter-spacing: var(--body-letter-spacing);
}

/* Párrafos y texto general */
p,
.text,
.description,
li,
span:not(.badge):not(.label):not(.tag):not(.subheading) {
  font-family: var(--text-font-family);
  line-height: var(--body-line-height);
  letter-spacing: var(--body-letter-spacing);
}

/* Títulos y encabezados - Usando Arapey */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--heading-font-family) !important;
  text-transform: uppercase;
  line-height: var(--heading-line-height);
  letter-spacing: var(--heading-letter-spacing);
}

/* Títulos específicos */
.section-title h2,
.section-title h3,
.page-title-content h2,
.products-details-desc h3,
.blog-details-desc h3 {
  font-family: var(--heading-font-family) !important;
  text-transform: uppercase;
  line-height: var(--heading-line-height);
  letter-spacing: var(--heading-letter-spacing);
}

/* Subtítulos, badges, etiquetas - Usando Manrope */
.subheading,
.badge,
.label,
.tag,
.category-label,
.section-title span,
.sub-title,
.category,
.post-content .category,
.single-blog-post .category,
.products-category-name,
.breadcrumb,
.navbar-nav .nav-link,
.top-header,
.date span {
  font-family: var(--subheading-font-family) !important;
  font-size: var(--subheading-font-size);
  text-transform: uppercase;
  letter-spacing: var(--subheading-letter-spacing);
  font-weight: 400;
}

/* Botones - Usando Geist */
.default-btn,
.optional-btn,
button,
.btn,
input[type="submit"],
input[type="button"] {
  font-family: var(--text-font-family) !important;
  font-weight: 600;
}

/* Enlaces del navbar */
.navbar-nav .nav-item .nav-link {
  font-family: var(--subheading-font-family) !important;
  text-transform: uppercase;
  font-size: 0.875rem;
  letter-spacing: 0.05em;
}

/* Productos */
.products-content h3,
.products-content h3 a {
  font-family: var(--subheading-font-family) !important;
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 0.05em;
  font-weight: 600;
}

.products-content .price,
.products-details-desc .price {
  font-family: var(--text-font-family);
  font-weight: 600;
}

/* Blog */
.single-blog-post .blog-post-content h3,
.single-blog-post .blog-post-content h3 a {
  font-family: var(--heading-font-family) !important;
  text-transform: uppercase;
  line-height: var(--heading-line-height);
  letter-spacing: var(--heading-letter-spacing);
}

/* Footer */
.single-footer-widget h3 {
  font-family: var(--heading-font-family) !important;
  text-transform: uppercase;
  line-height: var(--heading-line-height);
  letter-spacing: var(--heading-letter-spacing);
}

.single-footer-widget p,
.single-footer-widget ul li a {
  font-family: var(--text-font-family);
}

/* Formularios */
input,
textarea,
select,
.form-control {
  font-family: var(--text-font-family) !important;
}

/* Tablas */
table {
  font-family: var(--text-font-family);
}

/* Categorías */
.single-categories-box .content h3,
.single-categories-box .content h3 a {
  font-family: var(--heading-font-family) !important;
  text-transform: uppercase;
  line-height: var(--heading-line-height);
  letter-spacing: var(--heading-letter-spacing);
}

.single-categories-box .content span,
.single-categories-box span {
  font-family: var(--subheading-font-family) !important;
  font-size: var(--subheading-font-size);
  text-transform: uppercase;
}

/* Botón de WhatsApp en productos */
.whatsapp-btn a {
  background: #25D366 !important;
}

.whatsapp-btn a:hover {
  background: #128C7E !important;
  transform: scale(1.1);
}

.category h4,
.category h3 {
  font-family: var(--heading-font-family) !important;
  text-transform: uppercase;
  line-height: var(--heading-line-height);
  letter-spacing: var(--heading-letter-spacing);
}

.category span {
  font-family: var(--text-font-family);
  font-size: 14px;
}

/* Testimonios */
.testimonials-item p {
  font-family: var(--text-font-family);
  line-height: var(--body-line-height);
}

.testimonials-item h3 {
  font-family: var(--heading-font-family) !important;
  text-transform: uppercase;
}

/* Banners */
.main-banner-content h1,
.main-banner-content h2 {
  font-family: var(--heading-font-family) !important;
  text-transform: uppercase;
  line-height: var(--heading-line-height);
  letter-spacing: var(--heading-letter-spacing);
}

.main-banner-content p {
  font-family: var(--text-font-family);
  line-height: var(--body-line-height);
}

.main-banner-content .sub-title,
.main-banner-content span.sub-title {
  font-family: var(--subheading-font-family) !important;
  font-size: var(--subheading-font-size);
  text-transform: uppercase;
  letter-spacing: var(--subheading-letter-spacing);
}

/* Ofertas y promociones */
.offer-content h3,
.offer-content h2 {
  font-family: var(--heading-font-family) !important;
  text-transform: uppercase;
  line-height: var(--heading-line-height);
  letter-spacing: var(--heading-letter-spacing);
}

.offer-content .sub-title,
.offer-content span {
  font-family: var(--subheading-font-family) !important;
  font-size: var(--subheading-font-size);
  text-transform: uppercase;
}

.offer-content p {
  font-family: var(--text-font-family);
  line-height: var(--body-line-height);
}

/* FAQs */
.accordion .accordion-title {
  font-family: var(--text-font-family);
  font-weight: 600;
}

/* Widget Sidebar */
.widget h3.widget-title {
  font-family: var(--heading-font-family) !important;
  text-transform: uppercase;
  line-height: var(--heading-line-height);
  letter-spacing: var(--heading-letter-spacing);
}

/* Breadcrumbs */
.page-title-content ul li,
.page-title-content ul li a {
  font-family: var(--subheading-font-family) !important;
  text-transform: uppercase;
  font-size: var(--subheading-font-size);
}

/* Tags pequeños y metadatos */
.products-meta span,
.blog-post-meta,
.date,
.date span,
.author,
.comments {
  font-family: var(--subheading-font-family) !important;
  font-size: var(--subheading-font-size);
  text-transform: uppercase;
}

/* Facility */
.single-facility-box h3 {
  font-family: var(--heading-font-family) !important;
  text-transform: uppercase;
  line-height: var(--heading-line-height);
  letter-spacing: var(--heading-letter-spacing);
}

/* About sidebar */
.sidebar-about-content h3,
.sidebar-new-in-store h3 {
  font-family: var(--heading-font-family) !important;
  text-transform: uppercase;
}

/* Instagram */
.instagram-title a {
  font-family: var(--subheading-font-family) !important;
  text-transform: uppercase;
}

/* ============================================
   Utilidades Adicionales
   ============================================ */

/* Clases de utilidad para aplicar fuentes específicas */
.font-manrope {
  font-family: var(--subheading-font-family) !important;
}

.font-arapey {
  font-family: var(--heading-font-family) !important;
}

.font-geist {
  font-family: var(--text-font-family) !important;
}

/* Clases para mayúsculas elegantes (para títulos) */
.elegant-heading {
  font-family: var(--heading-font-family) !important;
  text-transform: uppercase;
  line-height: var(--heading-line-height);
  letter-spacing: var(--heading-letter-spacing);
}

/* Clase para subtítulos pequeños */
.small-label {
  font-family: var(--subheading-font-family) !important;
  font-size: var(--subheading-font-size);
  text-transform: uppercase;
  letter-spacing: var(--subheading-letter-spacing);
}