@import url("../../ikapp_barrio/css/templates.css");

:root{   
    --fw-bold: 900;

    --clr-primary: #e62d63;
    --clr-secondary: #3d4495;
    --clr-berdea: rgba(30, 154, 81, 1);
    --clr-horia: rgba(210, 183, 21,1);
    --clr-more-argia: #9d7ab4;
    
    --clr-beltza: #000000;
    --clr-txuria: #ffffff;
    --clr-grixa: #f2f2f2;
  }

/*koloreak ------------- ckeditor5 egokituta*/
.text-primary{
	color: var(--clr-primary)!important;
}
.text-secondary{
	color: var(--clr-secondary)!important;
}
.text-tertiary{
	color: var(--clr-tertiary)!important;
}
.text-marker{
	background-color: var(--bg-marker);
}
/*botoiak*/
.btn.btn-primary, 
.btn.btn-secondary{    
    border: 0 !important;
    padding: 0 !important;
    width: fit-content;
    background-color: transparent !important;
}
.btn.btn-primary:hover,
.btn.btn-secondary:hover{
    /*box-shadow: 0px 0px 8px rgba(0,0,0,.75);*/
}
.btn.btn-primary a,  
.btn.btn-secondary a,
.ikapp9-bootstrap5-content .more-link a,
a.btn.btn-primary,  
a.btn.btn-secondary{
    color: #fff !important;
    border-radius: 2em;
    padding: .75rem 1.25rem !important;
}
a.btn.btn-primary,  
a.btn.btn-secondary{
    padding: .7rem 1.25rem !important;
}
.btn-secondary a,
a.btn.btn-secondary{
    background-color: var(--clr-primary) !important;
}
.btn-secondary a:hover,
a.btn-secondary:hover{
    background-color: var(--clr-beltza) !important;
}
.btn.btn-primary > a:after,
.btn.btn-secondary > a:after
a.btn.btn-primary:after,
a.btn.btn-secondary:after {
    display: inline-block;
    content: "";
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-arrow-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8z"/></svg>');
    background-repeat: no-repeat;
    background-size: 19px;
    background-position: 0px 1px;
    width: 24px;
    height: 17px;
    margin-left: .5em;
    transition: background-position ease .25s;
}
.btn.btn-primary > a:hover::after,
.btn.btn-secondary > a:hover::after,
a.btn.btn-primary:hover::after,
a.btn.btn-secondary:hover::after {  
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-arrow-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8z"/></svg>');
    background-position: 3px 1px;
}
div[id*="block-views-block-eduki-blokea"] .btn-primary{
    margin-top: 2em;
}
div[id*="block-views-block-eduki-blokea"] .btn-primary a,
div[id*="block-views-block-eduki-blokea"] a.btn-primary{
    background-color: var(--clr-txuria);    
}
div[id*="block-views-block-eduki-blokea"] .btn-primary a::after,
div[id*="block-views-block-eduki-blokea"] a.btn-primary::after{
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="black" class="bi bi-arrow-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8z"/></svg>');
}
div[id*="block-views-block-eduki-blokea"] .btn-primary:hover{
    background-color: var(--clr-beltza);
}
div[id*="block-views-block-eduki-blokea"] .btn-primary a,
div[id*="block-views-block-eduki-blokea"] a.btn-primary{
    color: var(--clr-beltza) !important;
}
div[id*="block-views-block-eduki-blokea"] .btn-primary:hover a,
div[id*="block-views-block-eduki-blokea"] a.btn-primary:hover{
    color: var(--clr-txuria) !important;
}
/*tertiary*/
div.btn.btn-tertiary,
a.btn.btn-tertiary {
    background-color: var(--clr-txuria);
    border-radius: 0;
    padding: .25rem .5rem .25rem .75rem !important;
    margin: 0;
    border: 0;
    border-radius: 100vw;
    border: 1px solid var(--clr-beltza);
    
}
#content div.btn.btn-tertiary a,
#content a.btn.btn-tertiary{
    color: var(--clr-beltza); 
    font-weight: 600;   
    font-size: 1rem;
    
}
#content div.btn.btn-tertiary a:hover,
#content a.btn.btn-tertiary:hover{
    color: var(--clr-beltza);
    background-color: var(--clr-txuria);
}
div.btn.btn-tertiary > a:after, 
a.btn.btn-tertiary:after {
    background-size: 18px;
    background-position: -2px 2px;    
}
div.btn.btn-tertiary > a:hover::after,
a.btn.btn-tertiary:hover::after{  
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="black" class="bi bi-arrow-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8z"/></svg>');    
    background-position: 2px 2px;    
}
/*irakurri gehiago botoia*/
.menu-deigarri,
.ikapp9-bootstrap5-content .more-link a{
    border-radius: 2em;
    padding: .95rem 1.75em;
    border: 0;
    background-color: var(--clr-primary);
    background: rgb(230,45,99);
    background: linear-gradient(90deg, rgba(230,45,99,1) 0%, rgba(61,68,149,1) 100%);
    transition: none !important;
}
.ikapp9-bootstrap5-content .more-link a:hover{  
    background: none;
    background-color: var(--clr-beltza) !important;
}
li:has(a.menu-deigarri)::before{
    all: unset !important;
}
.menu-deigarri{
    color: var(--clr-txuria) !important;
    padding: .5rem 1rem .3rem 1rem!important;
}
.menu-deigarri:hover{
    background: black !important;    
}
/*zabalera osoko txantiloiak*/
/*irudi luzea testua*/
.irudiLuzeaTestua,
.testuaIrudiLuzea,
.testuakHiruZutabe,
.zabalera-osoko-irudia .img-zabalera-osoa,
.irudiMultzoa{   
    left: 50%;
    right: 50%; 
}
/*txartelak*/
.txartelak > div {
   background-image: url('../images/txartelak.svg');
   background-repeat: no-repeat;
   background-position: left bottom;
   background-color: #f2f2f2;
   background-size: cover;
 
}
.txartelak h3{
    font-size: 1.15em;
    font-weight: var(--fw-bold);
}
.txartelak .btn{
    border-radius: 2em !important;
    padding: .5rem 1rem !important;
    border: 0 !important;
}
/*cta*/
.cta{
    border-radius: .5em;
}
.cta.iluna {
    background-color: var(--clr-grixa);
    color: var(--clr-txuria);
    background: linear-gradient(202deg, rgba(230,45,99,0.25) 0%, rgba(61,68,149,0.25) 100%);
}
.cta.argia{
    background-color: var(--clr-grixa);  
   /* background: linear-gradient(202deg,  rgba(61,68,149,0.25) 0%,rgba(230,45,99,0.25) 100%);*/
}
.cta.iluna .btn-primary a,
.cta.iluna a.btn-primary{
    background-color: var(--clr-txuria);
    border-color: var(--clr-txuria);
}
.cta.iluna .btn-primary a:hover,
.cta.iluna a.btn-primary:hover{
    color: var(--clr-txuria) !important;
}
.cta.iluna .btn-primary > a::after,
.cta.iluna .btn-primary > a:hover::after,
.ikapp9-bootstrap5-content .more-link a::after,
.cta.iluna a.btn-primary::after,
.cta.iluna a.btn-primary:hover::after {   
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="black" class="bi bi-arrow-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8z"/></svg>') !important;    
}
.ikapp9-bootstrap5-content .more-link a::after {
    display: inline-block;
    content: "";
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-arrow-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8z"/></svg>') !important;
    background-repeat: no-repeat;
    background-size: 19px;
    background-position: 0px 1px;
    width: 24px;
    height: 17px;
    margin-left: .5em;
    transition: background-position ease .15s;
}
.ikapp9-bootstrap5-content .more-link a:hover::after {
    background-position: 3px 1px; 
}
/*zabalera osoko irudia*/
.zabalera-osoko-irudia figcaption{
    background-color: var(--clr-grixa);
    color: var(--clr-beltza);
    padding: 0;
    font-size: .9em;
}
/*irudi luze testua*/
.irudiLuzeaTestua .testua,
.testuaIrudiLuzea .testua {
    background-color: var(--clr-grixa);
}
.irudiLuzeaTestua .testua *,
.testuaIrudiLuzea .testua *{
    color: var(--clr-beltza);
}
.irudiLuzeaTestua > div:first-child {
    flex-grow: 1;
    flex-basis: 55%;
}
.irudiLuzeaTestua > div:first-child *{
    width: 100%;
    margin: 0;
}
.irudiLuzeaTestua img {
    aspect-ratio: 16 / 12;
}
/*testu zutabeen tituluak*/

/*testuak zutabetan*/
.testuakHiruZutabe {
    row-gap: 4em; 
    padding: 5%;
    margin-top: 5em;
    margin-bottom: 5em;
}
.testuakHiruZutabe > div {
    display: flex;
    flex-direction: column;
    flex-basis: 350px;
}
.testuakHiruZutabe h3{
    text-transform: uppercase;
    font-size: 1em;
    font-weight: 700;
    width: fit-content;
}
#content .testuakHiruZutabe div[data-quickedit-entity-id]{
    text-align: center;
}
#content .testuakHiruZutabe img{
    max-width: 250px;    
    margin-bottom: 1.5em !important;
}
#content .testuakHiruZutabe:has(img) *{
    margin-inline: auto;
}
/*irudi testuak*/
.irudiTestua{
    margin: 2.5em auto;
}
.irudiTestua .lerroa > div{
    flex-basis: 600px;
}
.irudiTestua img {
    max-height: unset; 
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3.25;
    object-fit: cover;
   
    -webkit-clip-path: polygon(5% 0, 100% 0%, 95% 100%, 0% 100%);
    clip-path: polygon(5% 0, 100% 0%, 95% 100%, 0% 100%);
    border-top-right-radius: 2em;
    border-bottom-left-radius: 2em;
    border: 5px solid var(--clr-primary);
    border-bottom-color: var(--clr-secondary);
    border-left-color: var(--clr-secondary);
}
/*zabalera osoa*/
#content .img-zabalera-osoa img{
    aspect-ratio: 18/6;
    object-fit: cover;
}
/*media sartu ondorengo css aldaketak*/
.testuaIrudiLuzea div[data-quickedit-entity-id] *,
.testuaIrudiLuzea div[data-quickedit-entity-id] *,
.irudiLuzeaTestua div[data-quickedit-entity-id] *,
.irudiLuzeaTestua div[data-quickedit-entity-id] *,
.irudiMultzoa div[data-quickedit-entity-id] *,
.img-zabalera-osoa div[data-quickedit-entity-id] *,
.img-zabalera-osoa div[data-quickedit-entity-id] *,
.irudiTestua div[data-quickedit-entity-id] *{
    width: 100%;
    margin: 0;
}