/* Variables CSS para colores y estilos personalizados */

:root {
    /* Fondo general de la página */
    --bg-general: #fff;
    /* --bg-general: url('../img/festival/background.png'); */

    /* Color principal para textos */
    --color-primary: #000;

    /* Color de la cabecera */
    --bg-header: #3ca8ed;

    /* Color para títulos */
    --color-title: #36a0e9;

    /* Color para bordes de botones */
    --border-button: #000;

    /* Color de fondo para botones */
    --bg-button: #f00ff0;

    /* Color de texto para botones */
    --text-button: #000000;

    /* Color para bordes de botones en hover */
    --border-button-hover: #000;

    /* Color de fondo para botones en hover */
    --bg-button-hover: #ffd20a;

    /* Color de texto para botones en hover */
    --text-button-hover: #ffffff;

    /* Fondo de las cajas de formulario de entradas */
    --bg-forms-box: #ffffff;

    /* Fondo del footer */
    --bg-footer: #3ca8ed;

    /* Fondo de popups */
    --bg-popup: #ffffff;

    /* Color de enlaces */
    --link-color: #ffffff;

    /* Color de enlaces en hover */
    --link-color-hover: #ffffff;

    /* Color de texto negro */
    --text-black: #000;

    /* Color de texto blanco */
    --text-white: #fff;

    /* Grosor del borde */
    --border-width: 3px;

    /* Estilo del borde */
    --border-style: solid;

    /* Radio del borde */
    --border-radius: 50px;

    /* Color para etiquetas (heredado del color principal) */
    --label-color: var(--color-primary);

    /* Color para títulos (heredado del color de título) */
    --title-color: var(--color-title);

    /* Fondo del header (heredado del color de cabecera) */
    --header-bg: var(--bg-header);

    /* Fondo de cajas de ticket */
    --ticket-box-bg: var(--bg-button);

    /* Borde de cajas de ticket */
    --ticket-box-border: var(--border-button);

    /* Texto de cajas de ticket */
    --ticket-box-text: var(--text-button);

    /* Color de texto del menú */
    --text-menu-color: #fff;

    /* Color de texto del menú en hover */
    --text-menu-color-hover: #fff;
}

/* Start Custom Fonts CSS*/
@font-face {
    font-family: 'festivalFont';
    font-style: normal;
    font-weight: bold;
    font-display: auto;
    src: url('../fonts/festival/Barlow-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'festivalFont';
    font-style: normal;
    font-weight: normal;
    font-display: auto;
    src: url('../fonts/festival/Barlow-Regular.ttf') format('truetype');
}

/* End Custom Fonts CSS */