/*
Theme Name: Conclave BDSM Do
Theme URI: https://wordpress.org/themes/twentytwentyfour/
Template: twentytwentyfour
Author: Señor Parker
Author URI: https://wordpress.org
Description: Twenty Twenty-Four is designed to be flexible, versatile and applicable to any website. Its collection of templates and patterns tailor to different needs, such as presenting a business, blogging and writing or showcasing work. A multitude of possibilities open up with just a few adjustments to color and typography. Twenty Twenty-Four comes with style variations and full page designs to help speed up the site building process, is fully compatible with the site editor, and takes advantage of new design tools introduced in WordPress 6.4.
Tags: one-column,custom-colors,custom-menu,custom-logo,editor-style,featured-images,full-site-editing,block-patterns,rtl-language-support,sticky-post,threaded-comments,translation-ready,wide-blocks,block-styles,style-variations,accessibility-ready,blog,portfolio,news
Version: 1.3.1764877579
Updated: 2025-12-04 20:46:19

*/
/* ==============================================
   Línea Gráfica Base: Colores y Fuentes
   ============================================== */
:root {
    /* Definición de Colores */
    --color-navy: #19203b; /* Fondo principal (Azul Oscuro) */
    --color-maroon: #5c1314; /* Acento Secundario (Rojo Vino / Badge) */
    --color-gold: #a87d12; /* Acento Primario (Dorado / Títulos, CTAs) */
    --color-text-light: #f5f5f5; /* Texto principal (Blanco/Gris) */

    /* Definición de Tipografía */
    --font-heading: 'Calisto MT', serif; /* Títulos */
    --font-body: 'Montserrat', sans-serif; /* Cuerpo */
}

/* Aplicar la tipografía y el fondo principal */
body {
    background-color: var(--color-navy);
    color: var(--color-text-light);
    font-family: var(--font-body);
}

/* Estilos de Encabezados */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    color: var(--color-gold);
    text-transform: uppercase;
}

/* ==============================================
   1. Estilos de la Cabecera Fija (Header Sticky)
   ============================================== */

/* Nota: La posición 'sticky' debe configurarse en el Editor de Sitio o theme.json */
.site-header {
    background-color: rgba(25, 32, 59, 0.95); /* Semi-transparente para el sticky */
    border-bottom: 1px solid var(--color-maroon);
    /* Asegurar que el z-index es alto para flotar sobre el contenido */
    z-index: 100;
}

/* Estilo del logo/título en el header */
.site-title a {
    color: var(--color-gold) !important;
}

/* ==============================================
   2. Estilos de Botones (CTAs Primario y Secundario)
   ============================================== */

/* Botón Dorado Sólido (Primario: Comprar Tickets) */
.wp-block-button__link.is-style-fill.is-style-gold {
    background-color: var(--color-gold) !important;
    color: var(--color-navy) !important; 
    border: 2px solid var(--color-gold);
    font-family: var(--font-body);
    font-weight: 700;
    transition: background-color 0.3s;
}
.wp-block-button__link.is-style-fill.is-style-gold:hover {
    background-color: #d1b464 !important;
}

/* Botón Rojo Delineado (Secundario: Ser Aliado) */
.wp-block-button__link.is-style-outline.is-style-maroon {
    background-color: transparent !important;
    color: var(--color-maroon) !important;
    border: 2px solid var(--color-maroon);
    font-family: var(--font-body);
    font-weight: 700;
    transition: background-color 0.3s;
}
.wp-block-button__link.is-style-outline.is-style-maroon:hover {
    background-color: var(--color-marmaroon);
    color: var(--color-text-light) !important;
}

/* ==============================================
   3. Estilos de Proyecciones Destacadas (Bloques de Tarjeta)
   ============================================== */

/* Contenedor de la Tarjeta (Bloque de Grupo) */
.repdom-proyeccion-card {
    background-color: var(--color-navy); 
    border: 1px solid var(--color-maroon);
    padding: 20px;
    margin-bottom: 30px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

/* Estilo del Badge (Metadatos: +21, Hora) */
.repdom-badge {
    display: inline-block;
    background-color: var(--color-maroon); 
    color: var(--color-text-light);
    padding: 3px 8px;
    margin-right: 8px;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 600;
}

/* ==============================================
   4. Estilo de Tooltip/Glosario (Mejora 2)
   ============================================== */

/* Estilo para la palabra clave subrayada */
.repdom-kink-term {
    border-bottom: 1px dotted var(--color-gold); 
    cursor: help;
    font-weight: bold;
    color: var(--color-text-light); /* Asegurar que el texto sea visible */
}

/* Estilo del Tooltip (Fondo del Glosario) */
.repdom-kink-term::before {
    background: var(--color-maroon); /* El color del tooltip debe contrastar */
}
/* Ajusta el ancho del formulario */
.wpcf7 form {
    max-width: 600px; /* Puedes cambiar el valor */
    margin: 0 auto; /* Centra el formulario */
}

/* Ajusta los campos */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* Botón */
.wpcf7 input[type="submit"] {
    background-color: #19203B; /* Cambia según tu diseño */
    color: #fff;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;