/*
 * tema.css - Identidad visual de un proyecto con tema en BBDD (PRY_TEMA).
 * Se carga después de base.css y cgi.css, y en lugar de css/projects/{proyecto}.css. La página añade después un
 * <style> con --color-primary (y opcionalmente --color-secondary, tipografía, esquinas...); aquí se calculan a
 * partir de él el resto de tonos, así que un proyecto solo necesita un color.
 */

/*
 * Tipografías que puede elegir el tema ("fuente"), alojadas en el front: sin peticiones a Google Fonts (RGPD).
 * El navegador solo descarga la que usa --font-family. Subconjunto latino de Fontsource 5.3.0 (licencia OFL en
 * fonts/<familia>/OFL.txt): cubre es, eu, ca, gl, en, fr y de, y el símbolo del euro. Las fuentes del sistema
 * del tema (Arial, Georgia...) no necesitan @font-face.
 */
@font-face { font-family: "Nunito"; font-style: normal; font-weight: 400; font-display: swap;
    src: url("../fonts/nunito/nunito-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Nunito"; font-style: normal; font-weight: 700; font-display: swap;
    src: url("../fonts/nunito/nunito-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Roboto"; font-style: normal; font-weight: 400; font-display: swap;
    src: url("../fonts/roboto/roboto-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Roboto"; font-style: normal; font-weight: 700; font-display: swap;
    src: url("../fonts/roboto/roboto-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 400; font-display: swap;
    src: url("../fonts/open-sans/open-sans-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 700; font-display: swap;
    src: url("../fonts/open-sans/open-sans-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Lato"; font-style: normal; font-weight: 400; font-display: swap;
    src: url("../fonts/lato/lato-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Lato"; font-style: normal; font-weight: 700; font-display: swap;
    src: url("../fonts/lato/lato-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400; font-display: swap;
    src: url("../fonts/montserrat/montserrat-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 700; font-display: swap;
    src: url("../fonts/montserrat/montserrat-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 400; font-display: swap;
    src: url("../fonts/poppins/poppins-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 700; font-display: swap;
    src: url("../fonts/poppins/poppins-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Raleway"; font-style: normal; font-weight: 400; font-display: swap;
    src: url("../fonts/raleway/raleway-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Raleway"; font-style: normal; font-weight: 700; font-display: swap;
    src: url("../fonts/raleway/raleway-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-style: normal; font-weight: 400; font-display: swap;
    src: url("../fonts/source-sans-3/source-sans-3-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-style: normal; font-weight: 700; font-display: swap;
    src: url("../fonts/source-sans-3/source-sans-3-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap;
    src: url("../fonts/inter/inter-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap;
    src: url("../fonts/inter/inter-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Merriweather"; font-style: normal; font-weight: 400; font-display: swap;
    src: url("../fonts/merriweather/merriweather-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Merriweather"; font-style: normal; font-weight: 700; font-display: swap;
    src: url("../fonts/merriweather/merriweather-latin-700-normal.woff2") format("woff2"); }

:root {
    --color-primary-dark: color-mix(in srgb, var(--color-primary) 62%, black);
    --color-primary-light: color-mix(in srgb, var(--color-primary) 6%, white);
    --color-border: color-mix(in srgb, var(--color-primary) 30%, white);
    --color-on-primary: #ffffff;

    /* Final del degradado de la cabecera: el principal algo más claro, salvo que el tema dé uno */
    --color-secondary: color-mix(in oklch, var(--color-primary) 82%, white);

    --header-bg: linear-gradient(120deg, color-mix(in srgb, var(--color-primary) 66%, black) 0%, var(--color-secondary) 100%);
    --footer-bg: color-mix(in srgb, var(--color-primary) 80%, black);
}