/*
    Theme Name:   EGA2026
    Author:       L'Espectacleria
    Template:     bricks
    Version:      1.0
    Text Domain:  ega2026
*/

    :root {

        --ample-contenidor: 1366px;
        
        /*  Colors */
        --color-primari: rgb(102,0,102);
        --color-primari-hover: rgb(181, 2, 181);
        --color-secundari: #000000;
        --color-accio: rgb(102,0,102);
        --color-accio-hover: rgb(181, 2, 181);
        --color-text: #404040;
        --color-clar: white;
        --color-fosc: black;
        --color-vora: hsla(0, 0%, 50%, 0.25);
        --color-ombra: hsla(0, 0%, 0%, 0.15);

        /* Textos */
        /* https://www.fluid-type-scale.com/calculate?minFontSize=16&minWidth=360&minRatio=1.125&maxFontSize=18&maxWidth=1366&maxRatio=1.2&steps=s%2Cbase%2Cm%2Cl%2Cxl&baseStep=base&prefix=text&useContainerWidth=false&includeFallbacks=false&useRems=true&remValue=10&decimals=2&previewFont=Manrope&previewText=Almost+before+we+knew+it%2C+we+had+left+the+ground&previewWidth=1366 */
        --text-s: clamp(1.42rem, 0.08vi + 1.39rem, 1.5rem);
        --text-base: clamp(1.6rem, 0.2vi + 1.53rem, 1.8rem);
        --text-m: clamp(1.8rem, 0.36vi + 1.67rem, 2.16rem);
        --text-l: clamp(2.02rem, 0.56vi + 1.82rem, 2.59rem);
        --text-xl: clamp(2.28rem, 0.83vi + 1.98rem, 3.11rem);
        /* https://www.fluid-type-scale.com/calculate?minFontSize=20&minWidth=360&minRatio=1.25&maxFontSize=22&maxWidth=1366&maxRatio=1.333&steps=6%2C5%2C4%2C3%2C2%2C1%2Ctitol&baseStep=4&prefix=h&useContainerWidth=false&includeFallbacks=false&useRems=true&remValue=10&decimals=2&previewFont=Manrope&previewText=Almost+before+we+knew+it%2C+we+had+left+the+ground&previewWidth=1366 */
        --h6: clamp(1.26rem, calc(-0.32vw + 1.37rem), 1.01rem);
        --h5: clamp(1.42rem, calc(-0.09vw + 1.45rem), 1.35rem);
        --h4: clamp(1.6rem, calc(0.26vw + 1.52rem), 1.8rem);
        --h3: clamp(1.8rem, calc(0.77vw + 1.55rem), 2.4rem);
        --h2: clamp(2.02rem, calc(1.5vw + 1.54rem), 3.2rem);
        --h1: clamp(2.28rem, calc(2.54vw + 1.46rem), 4.26rem);
        --h-titol: clamp(2.56rem, calc(4vw + 1.28rem), 5.68rem);

        /* Espais */
        --espai-xs: clamp(1.02rem, calc(0.36vw + 0.91rem), 1.4rem);
        --espai-s: clamp(1.28rem, calc(0.67vw + 1.07rem), 1.98rem);
        --espai-m: clamp(1.6rem, calc(1.15vw + 1.23rem), 2.8rem);
        --espai-l: clamp(2rem, calc(1.87vw + 1.4rem), 3.96rem);
        --espai-xl: clamp(2.5rem, calc(2.96vw + 1.55rem), 5.6rem);
        --espai-2xl: clamp(3.13rem, calc(4.58vw + 1.66rem), 7.92rem);
        --espai-3xl: clamp(3.91rem, calc(6.97vw + 1.68rem), 11.19rem);
        --espai-4xl: clamp(4.88rem, calc(10.46vw + 1.53rem), 15.83rem);

        --espai-seccio-x: var(--espai-m);
        --espai-seccio-y: var(--espai-xl);

        /* Radis */
        --radi-xs: clamp(0.4rem, calc(0vw + 0.4rem), 0.4rem);
        --radi-s: clamp(0.6rem, calc(-0.26vw + 0.88rem), 0.8rem);
        --radi-m: clamp(1rem, calc(-0.26vw + 1.28rem), 1.2rem);
        --radi-l: clamp(1.6rem, calc(-0.51vw + 2.16rem), 2rem);
        --radi-xl: clamp(2.6rem, calc(-0.77vw + 3.45rem), 3.2rem);
        --radi-tot: 999rem;

        /* Ombres */
        --ombra-xs: 0 1px 2px var(--color-ombra);
        --ombra-s: 0 1.5px 3px var(--color-ombra);
        --ombra-m: 0 2px 6px var(--color-ombra);
        --ombra-l: 0 3px 12px var(--color-ombra);
        --ombra-xl: 0 6px 48px var(--color-ombra);

        /* Botons */
        --text-boto: 1em;
        --padding-boto: .5em 1em;
        --vora-boto: 1px;
        --radi-boto: 100px;

        /* Gutenberg */
        --wp--preset--font-size--small: .85em;
        --wp--preset--font-size--medium: var(--text-m);
        --wp--preset--font-size--large: var(--text-l);
        --wp--preset--font-size--x-large: var(--text-xl);    

    }

    .color-primari {
        color: var(--color-primari);
    }

    .color-secundari {
        color: var(--color-secundari);
    }

    .fons-primari {
        background-color: var(--color-primari);
    }

    .fons-secundari {
        background-color: var(--color-secundari);
    }

    .ocult:not(:focus):not(:active) {
        clip: rect(0 0 0 0); 
        clip-path: inset(50%);
        height: 1px;
        overflow: hidden;
        position: absolute;
        white-space: nowrap; 
        width: 1px;
    }

    h1, h2, h3 {
        line-height: 1.2;
    }

    p {
        margin-bottom: 1em;
    }

    .espaiat-m > * + * {
        margin-top: var(--espai-m);
    }

    .espaiat-g > * + * {
        margin-top: var(--espai-g);
    }
    
    header .brx-submenu-toggle svg {
        max-width: 1em;
    }
    
    .text-light {
        font-weight: 300;
    }

    .multiplica::after {
        content: "";
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        position: absolute;
        display: block;
        mix-blend-mode: multiply;
    }


/*
    Elements clicables
*/

    .bricks-is-frontend .clicable {
        position: relative; 
    }

    .bricks-is-frontend .clicable * {
        position: static;
    }

    .bricks-is-frontend a.clicable__link::after,
    .bricks-is-frontend .clicable .clicable__link a::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
    }

    .bricks-is-frontend .clicable .clicable__link--top {
        z-index: 2;
    }


/*
    Widgets
*/

    .brxe-wordpress {
        width: 100%;
        padding: 2rem 3rem 3rem;
        border: 1px solid #e6e6e6;
        border-radius: 4px;
    }

    .brxe-wordpress .bricks-widget-title {
        position: relative;
        margin-bottom: 1em;
        padding-bottom: 10px;
        border-bottom: 1px solid #e6e6e6;
    }

    .brxe-wordpress .bricks-widget-title::after {
        content: '';
        width: 45px;
        height: 2px;
        background-color: var(--color-primari);
        position: absolute;
        bottom: -1px;
        left: 0;
    }

        
/*
    Capçalera
*/


    #brx-header > :not(.ample-total) {
        padding-left: var(--espai-seccio-x);
        padding-right: var(--espai-seccio-x);
    }

    .cap-enganxosa {
        --fons-seccio-fixa: white;
        --altura-seccio-fixa: 10rem;
    }

    .cap-enganxosa.bricks-is-frontend.admin-bar #brx-header #seccio-fixa {
        top: 32px;
        top: var(--wp-admin--admin-bar--height);
    }

    .cap-enganxosa #brx-header #seccio-fixa,
    .cap-solapada #brx-header #seccio-fixa {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        transition: background-color .2s,transform .4s, top .5s;
        width: 100%;
        z-index: 998;
        padding-left: var(--espai-seccio-x);
        padding-right: var(--espai-seccio-x);
    }

    .cap-enganxosa #brx-header #seccio-fixa {
        position: fixed;
    }

    .cap-enganxosa #brx-header #seccio-fixa.scrolling,
    .cap-enganxosa:not(.cap-negativa) #seccio-fixa {
        background-color: var(--fons-seccio-fixa);
        box-shadow: 0 5px 15px -8px rgb(0 0 0 / 10%);
    }

    .cap-enganxosa #brx-header #seccio-fixa.slide-up {
        overflow-x: hidden;
        top: -100% !important;
    }

    .cap-enganxosa:not(.cap-solapada) {
        margin-top: var(--altura-seccio-fixa);
    }

    .cap-negativa #brx-header #seccio-fixa:not(.scrolling),
    .cap-negativa .bricks-mobile-menu-toggle { 
        color: white 
    } 


/*
    Caixes ample total alineades
*/

    .marge-esquerre-automatic {
        padding-left: max(var(--espai-seccio-x), calc( (100vw - var(--ample-contenidor) ) / 2 + var(--espai-seccio-x) ));
    }

    .marge-dret-automatic {
        padding-right: max(var(--espai-seccio-x),  calc( (100vw - var(--ample-contenidor) ) / 2 + var(--espai-seccio-x) ));
    }


/*
    Focus
*/

    body.bricks-is-frontend :focus {
        outline: none;
    }

    body.bricks-is-frontend :focus-visible {
        outline: 2px solid #7b7b7b;
    }


/*
    Plantilles per defecte del Bricks
*/

    .layout-default .brxe-container {
        padding-left: var(--espai-seccio-x);
        padding-right: var(--espai-seccio-x);
    }

    body > article#brx-content {
        padding: var(--espai-seccio-y) var(--espai-seccio-x);
    }


/*
    Gutenberg
*/

    .wp-block-heading {
        margin-bottom: .5em;
    }

    .wp-block-button .wp-block-button__link {
        font-size: 1em;
        background-color: var(--color-accio);
        padding: var(--padding-boto);
        border-width: var(--vora-boto);
    }
    .wp-block-button.is-style-outline .wp-block-button__link {
        background-color: var(--color-clar);
    }


    
/*
    Seccions
*/

    .avantitol-seccio + .titol-seccio {
        margin-top: var(--espai-s);
    }


/*
    Altres
*/

    .bullets-color {
        list-style: none;
        padding-left: 1.5em;
    }

    .bullets-color > li {
        position: relative
    }

    .bullets-color > li::before {
        content: "";
        display: inline-block;
        margin-right: var(--espai-bullet, .5em);
        width: var(--ample-bullet, 1rem);
        height: var(--ample-bullet, 1rem);
        background-color: var(--color-accio);
        border-radius: 100px;
        position: absolute;
        left: -1.5em;
        top: .5em
    }

    .bullets-color li ul {
        padding-left: 1em;
    }
    
    .bullets-color li ul li {
        list-style: none;
        position: relative;
    }

    .bullets-color li ul li::before {
        content: "-";
        position: absolute;
        left: -1em;

    }


.linia-tematica {
  padding-top: var(--espai-l);
  padding-bottom: var(--espai-l);
}

.linia-tematica h2 {
  font-size: var(--text-l);
}

.linia-tematica h3 {
  font-size: var(--text-m);
}

.linia-tematica h2 + p,
.linia-tematica h3 + p {
  margin-top: 1.5em;
}




.inscripcio {
    padding-top: var(--espai-seccio-y);
    padding-bottom: var(--espai-seccio-y);
}

.inscripcio h2 {
    font-size: var(--text-l);
}
.inscripcio h3 {
    font-size: var(--text-m);
}

.taula-inscripcions th,
.taula-inscripcions td  {
    border: 0;
}

.taula-inscripcions tr,
.taula-inscripcions thead {
    border-bottom: 1px solid var(--color-primari);
}



.taula-programa {
    --ample-medianil: 20px;
    --color-dia-1: hsl(45, 100%, 70%);
    --color-dia-1-l-1: hsl(45, 100%, 74%);
    --color-dia-1-l-2: hsl(45, 100%, 77%);
    --color-dia-1-l-3: hsl(45, 100%, 80%);
    --color-dia-1-l-4: hsl(45, 100%, 84%);
    --color-dia-1-l-5: hsl(45, 100%, 87%);
    --color-dia-1-l-6: hsl(45, 100%, 90%);
    --color-dia-1-l-7: hsl(44, 100%, 93%);
    --color-dia-1-l-8: hsl(44, 100%, 97%);
    --color-dia-2: hsl(151, 44%, 57%);
    --color-dia-2-l-1: hsl(150, 44%, 62%);
    --color-dia-2-l-2: hsl(149, 44%, 67%);
    --color-dia-2-l-3: hsl(148, 43%, 72%);
    --color-dia-2-l-4: hsl(147, 43%, 77%);
    --color-dia-2-l-5: hsl(147, 43%, 82%);
    --color-dia-2-l-6: hsl(146, 43%, 86%);
    --color-dia-2-l-7: hsl(146, 44%, 91%);
    --color-dia-2-l-8: hsl(145, 44%, 95%);
    --color-dia-3: hsl(24, 84%, 83%);
    --color-dia-3-l-1: hsl(24, 85%, 85%);
    --color-dia-3-l-2: hsl(24, 86%, 87%);
    --color-dia-3-l-3: hsl(23, 88%, 89%);
    --color-dia-3-l-4: hsl(23, 89%, 91%);
    --color-dia-3-l-5: hsl(23, 90%, 93%);
    --color-dia-3-l-6: hsl(23, 91%, 94%);
    --color-dia-3-l-7: hsl(23, 93%, 96%);
    --color-dia-3-l-8: hsl(23, 94%, 98%);


  font-size: .75em;
  font-weight: 400;
  line-height: 1.2;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--color-primari);
}

.taula-programa table {
  table-layout: auto;
}

.taula-programa tr {
  display: grid;
  grid-template-columns: 50px 1fr 20px 50px 1fr 20px 50px 1fr;
}

.taula-programa td {
  vertical-align: top;
  border: 0;
}

.wp-admin .taula-programa td {
  border: 1px dotted lightgray;
}

/* Primera fila */
.taula-programa tr:first-child td {
  border-bottom: 1px solid var(--color-primari);
  text-align: center;
  font-weight: 600;
}

.taula-programa tbody tr:nth-child(1) td:nth-child(2), 
.taula-programa tbody tr:nth-child(1) td:nth-child(5),
.taula-programa tbody tr:nth-child(1) td:nth-child(8){
  display: none;
}

.taula-programa tbody tr:nth-child(1) td:nth-child(1), 
.taula-programa tbody tr:nth-child(1) td:nth-child(4),
.taula-programa tbody tr:nth-child(1) td:nth-child(7){
  grid-column: span 2;
}

/* Columnes separadores */
.taula-programa tbody tr td:nth-child(3),
.taula-programa tbody tr td:nth-child(6) {
  border: 0;
}



/* Columna dia 1 */
.taula-programa tbody tr:nth-child(4) td:nth-child(2),
.taula-programa tbody tr:nth-child(8) td:nth-child(2),
.taula-programa tbody tr:nth-child(12) td:nth-child(2),
.taula-programa tbody tr:nth-child(15) td:nth-child(2),
.taula-programa tbody tr:nth-child(19) td:nth-child(2),
.taula-programa tbody tr:nth-child(19) td:nth-child(2),
.taula-programa tbody tr:nth-child(22) td:nth-child(2),
.taula-programa tbody tr:nth-child(23) td:nth-child(2),
.taula-programa tbody tr:nth-child(24) td:nth-child(2),
.taula-programa tbody tr:nth-child(25) td:nth-child(2)
{
  background-color: var(--color-dia-1-l-5); /* 50% */
}
.taula-programa tbody tr:nth-child(9) td:nth-child(2),
.taula-programa tbody tr:nth-child(10) td:nth-child(2),
.taula-programa tbody tr:nth-child(11) td:nth-child(2),
.taula-programa tbody tr:nth-child(16) td:nth-child(2),
.taula-programa tbody tr:nth-child(17) td:nth-child(2),
.taula-programa tbody tr:nth-child(18) td:nth-child(2)
{
  background-color: var(--color-dia-1-l-2); /* 70% */
}

.taula-programa tbody tr:nth-child(5) td:nth-child(2),
.taula-programa tbody tr:nth-child(6) td:nth-child(2)
{
  background-color: var(--color-dia-1); /* 100% */
}

/* Columna dia 2 */
.taula-programa tbody tr:nth-child(3) td:nth-child(5),
.taula-programa tbody tr:nth-child(10) td:nth-child(5),
.taula-programa tbody tr:nth-child(11) td:nth-child(5),
.taula-programa tbody tr:nth-child(15) td:nth-child(5),
.taula-programa tbody tr:nth-child(24) td:nth-child(5),
.taula-programa tbody tr:nth-child(25) td:nth-child(5),
.taula-programa tbody tr:nth-child(26) td:nth-child(5)
{
  background-color: var(--color-dia-2-l-5); /* 50% */
}
.taula-programa tbody tr:nth-child(4) td:nth-child(5),
.taula-programa tbody tr:nth-child(5) td:nth-child(5),
.taula-programa tbody tr:nth-child(6) td:nth-child(5),
.taula-programa tbody tr:nth-child(12) td:nth-child(5),
.taula-programa tbody tr:nth-child(19) td:nth-child(5),
.taula-programa tbody tr:nth-child(27) td:nth-child(5)
{
  background-color: var(--color-dia-2-l-3); /* 70% */
}
.taula-programa tbody tr:nth-child(8) td:nth-child(5),
.taula-programa tbody tr:nth-child(9) td:nth-child(5),
.taula-programa tbody tr:nth-child(16) td:nth-child(5),
.taula-programa tbody tr:nth-child(17) td:nth-child(5),
.taula-programa tbody tr:nth-child(18) td:nth-child(5)
{
  background-color: var(--color-dia-2); /* 100% */
}


/* Columna dia 3 */
.taula-programa tbody tr:nth-child(4) td:nth-child(8),
.taula-programa tbody tr:nth-child(11) td:nth-child(8)
{
  background-color: var(--color-dia-3-l-5); /* 50% */
}
.taula-programa tbody tr:nth-child(5) td:nth-child(8),
.taula-programa tbody tr:nth-child(6) td:nth-child(8),
.taula-programa tbody tr:nth-child(7) td:nth-child(8),
.taula-programa tbody tr:nth-child(9) td:nth-child(8),
.taula-programa tbody tr:nth-child(10) td:nth-child(8)
{
  background-color: var(--color-dia-3); /* 100% */
}