body {
  font-family: "Noto Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-size: 0.912rem;
  font-style: normal;
  font-variation-settings:
    "wdth" 300;
}

.navbar-brand a.site-title {
  /*font-family: "Cinzel", serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  font-variation-settings:
    "wdth" 300;*/
  color: #A108D4 !important;
}

h2, h3, h4 {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "wdth" 400;
}

h3 {
  font-size: 1.1rem;
}
h4 {
  font-size: 0.95rem;
}

.view-portada .view-content {
    padding-right: 1rem;
}

.navbar-brand a.site-title {
    color: #212529;
    text-decoration: none;
}
.navbar-brand .site-title {
    font-size: 2.5rem;
    font-weight: bold;
    letter-spacing: 2px;
    text-transform: initial;
}

main a:link,
main a:visited {
  color: #000000;
  text-decoration: initial;
}

.table-striped > tbody > tr,
.table td, .table th, .table hr {
  background-color: transparent !important;
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
  --bs-table-color-type: #000000 !important;
  --bs-table-bg-type: transparent !important;
}

.js .dropbutton-widget {
  border: 1px solid #000 !important;
  background-color: transparent !important;
}

.block h2, .block .h2 {
    font-size: calc(0.325rem + 0.9vw);
    background-color: purple;
    color: white;
    padding: 5px;
    border-radius: 5px 5px 0px 0px;
    margin-bottom: 2px;
}

/*.col-lg-9 {
    border-right:1px dashed #CCC;
}

.col-lg-6, .col-md-6 {
    border-right: 1px dashed #CCC;
}

.col-lg-3 {
    border-right: 1px dashed #CCC;
}*/


/* Blocks */

.block .views-field-title {
    margin:10px 0;
    font-size: 1rem;
    font-weight: 400;
}

.block .views-field-uid {
    font-weight: 400;
    color: purple;
    font-size: 0.8rem;
    padding-right: 5px;
}

.block .views-field-created {
   font-size: 0.8rem;
   color: gray;
}

.block .views-field-field-imagen {
    border: 1px solid #EEE;
}

.block .views-field-body {
    margin-bottom: 10px;
}

.block .views-field-field-imagen .banner .img {
    border: 1px solid #EEE;
}

.block .more-link {
   margin-bottom: 10px;    
}

/* Footer */

footer.node__meta {
    padding: 0px;
}

.region-footer .block-system-branding-block .site-logo img {
	height: 35px;
}

.region-footer .block-system-branding-block .site-title {
	font-size: 1.4rem;
}


.cookiesjsr-banner {
    background-color: #FFFFFF;
    font-size: 0.95rem;
    width: 100%;
    font-weight: 400;
    box-shadow: none;
    border-top: 1px solid #A108D4;
    color: #000000;
    bottom: 0px;
    right: 0px;
}

.cookiesjsr-btn.cookiesjsr-settings {
    color: grey;
    background-color: #FFFFFF;
    border-color: none;
    font-size:1.1rem;
}

.cookiesjsr-banner button.allowAll {
    color: #FFFFFF;
    font-weight: 400;
    border-color: #A108D4;
    background-color: #A108D4;
    font-size:1.2rem;
}

.cookies-docs h2 {
   background-color: inherit;
   color: black;
   font-size: 1.6rem;
   padding: 15px 0 10px 0;
}

.cookies-docs h3 {
   font-size: 1.1rem;
}

.cookies-docs h4 {
   color: #CCCCCC;
}

/* Banners */

.view-banners {
    margin: 15px 0;
}

/* Node */

.paragraph,
.field--name-body {
    padding-top: 20px;
    color: #000;
    font-size: 1.1rem;    
}

.field--name-uid,
.field--name-uid a:link, .field--name-uid a:visited {
    float: left;
    margin-right: 5px;
    font-weight: 500;
}

.field--name-created {
    font-size:0.8rem;
    color: gray;
}

.block-field-blocknodevideotitle, 
.block-field-blocknodearticletitle {
    font-size: 2.6rem;
    font-weight: 400;
    font-family: 'Roboto';
    line-height: 45px;
    margin: 15px 0;
}

.block-field-blocknodevideofield-relacionado,
.block-field-blocknodearticlefield-relacionado {
    margin-left: 35px;
}
.block-field-blocknodevideofield-relacionado .field__items,
.block-field-blocknodearticlefield-relacionado .field__items {
  display: block;
  color: #CCCCCC;
  margin-bottom: 15px;
}

.block-field-blocknodevideofield-relacionado .field__item,
.block-field-blocknodevideofield-relacionado .field__item a:link,
.block-field-blocknodevideofield-relacionado .field__item a:visited,
.block-field-blocknodearticlefield-relacionado .field__item,
.block-field-blocknodearticlefield-relacionado .field__item a:link,
.block-field-blocknodearticlefield-relacionado .field__item a:visited {
  list-style-type: disc;
  font-size: 1rem;
  color: purple;
  font-weight: 400;
  display: list-item;
}


.block-field-blocknodearticleuid,
.block-field-blocknodearticlecreated {
  flex: 0 0 auto;
}

.block-extra-field-blocknodevideosharing-buttons .social-sharing-buttons,
.block-extra-field-blocknodearticlesharing-buttons .social-sharing-buttons {
  display: flex;
  justify-content: flex-end;
  gap: 0px;
  margin: 0;
}
.block-extra-field-blocknodevideosharing-buttons,
.block-extra-field-blocknodearticlesharing-buttons {
  flex: 1;
  display: flex;
  justify-content: flex-end;
  float: right;
}

.block-field-blocknodevideobody,
.block-field-blocknodearticlebody {
    border-top:1px solid #EEEEEE;
    margin-top:5px;
}

.block-extra-field-blocknodevideolinks,
.block-extra-field-blocknodearticlelinks {
    margin-bottom: 25px;
}

/* Mobile devices */

@media (max-width: 979px) {
  /*.col-lg-9 {
    border-right: none;
  }
  .col-lg-6, .col-md-6 {
    border-right: none;
  }
  .col-lg-3 {
    border-right: none;
  }*/
  .navbar-brand a.site-title {
    color: #212529;
    text-decoration: none;
    font-size: 1.1rem;
  }
}

/* Megamenu */

@media (max-width: 979px) {
  .tb-megamenu .nav-collapse,
  .tb-megamenu .nav-collapse.collapse {
    z-index: 999;
    display: block;
  }
}

.tb-megamenu .nav {
    margin-left: 0;
    margin-bottom: 0;
    list-style: none;
    background: purple;
}

.tb-megamenu .nav > .active > a,
.tb-megamenu .nav > .active > a:hover,
.tb-megamenu .nav > .active > a:focus,
.tb-megamenu .nav > .active > span.tb-megamenu-no-link,
.tb-megamenu .nav > .active > span.tb-megamenu-no-link:hover,
.tb-megamenu .nav > .active > span.tb-megamenu-no-link:focus {
    background-color: #5b085b;
}

.html5-video-container {
  max-width: 100%;
  aspect-ratio: 16 / 9;
}

.media-oembed-content {
  max-width: 100%;
  aspect-ratio: 16 / 9;
    border: none;
    background-color: transparent;
  width: 100%;
  height: 100%;

}

/*
.media-oembed-content video {
      max-width: 100%;
  aspect-ratio: 16 / 9;
}
*/

.view-search .view-row {
    border-bottom:1px solid #EEEEEE;
    padding: 15px 0;
}


/* Paragraph quote */

.paragraph--type--quote {
  background: #f7f3fa; /* Fondo suave liláceo */
  border-left: 5px solid #6a1b9a; /* Púrpura intenso */
  padding: 1.5rem 2rem;
  margin: 0;
  max-width: 100%;
  font-family: 'Georgia', serif; /* Estilo clásico */
  font-size: 1.5rem;
  line-height: 1.6;
  color: #3c2a4d; /* Púrpura grisáceo para el texto */
  position: relative;
}

.paragraph--type--quote::before {
  content: "“";
  font-size: 4rem;
  color: #8e24aa; /* Comillas púrpura más vibrante */
  position: absolute;
  top: -15px;
  left: 10px;
  font-family: 'Georgia', serif;
}
.paragraph--type--quote::after {
  content: "”";
  font-size: 4rem;
  color: #8e24aa;
  position: absolute;
  bottom: -35px;
  right: 15px;
  font-family: 'Georgia', serif;
}

.paragraph--type--quote p {
  margin: 0;
}

/* Opcional: para pantallas pequeñas */
@media (max-width: 600px) {
  .paragraph--type--quote {
    font-size: 1.2rem;
    padding: 1rem 1.5rem;
  }

  .paragraph--type--quote::before {
    font-size: 3rem;
    top: -10px;
    left: 8px;
  }
}

/* Paragraph type copla */

.paragraph--type--copla {
  background-color: #fefefe; /* Casi blanco */
  padding: 2rem;
  max-width: 800px;
  margin: 2rem auto;
  box-shadow: 0 0 15px rgba(0,0,0,0.05);
  font-family: "Times New Roman", Times, serif;
  font-size: 1.15rem;
  line-height: 1.8;
  color: #444;
  text-align: center;
  font-style: italic;
  position: relative; /* Para colocar el icono de fondo */
  overflow: hidden;
}

/* Nota musical difuminada de fondo */
.paragraph--type--copla::before {
  content: "♪";
  position: absolute;
  font-size: 12rem; /* Muy grande */
  color: rgba(0, 0, 0, 0.03); /* Muy suave */
  right: 10%;
  top: 20%;
  transform: rotate(-20deg);
  pointer-events: none;
}

/* Párrafos principales */
.paragraph--type--copla p {
  margin: 0;
}

/* Autor más pequeño y centrado */
.paragraph--type--copla .field--name-field-autor {
  margin-top: 1rem;
  font-weight: bold;
  font-size: 0.9rem;
  color: #555;
  text-align: center;
  font-style: normal; /* Sin cursiva */
}




/* Versión móvil */
@media (max-width: 600px) {
  .paragraph--type--copla {
    font-size: 1.1rem;
    padding: 1.5rem;
  }

  .paragraph--type--copla::before,
  .paragraph--type--copla::after {
    font-size: 2.5rem;
  }
}


/* Lista de videos */
/* Contenedor de la lista */
#views-bootstrap-videos-block-3 {
    list-style: none;               /* Quita bullets */
    padding: 0;
    margin: 2rem 0;                 /* Separación del resto de bloques */
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* Dos columnas por defecto */
    gap: 0.5rem;                    /* Separación entre items */
    border-top: 3px solid purple;   /* Borde púrpura arriba */
    border-bottom: 3px solid purple;/* Borde púrpura abajo */
    font-family: 'Arial', sans-serif;
}

/* Items de la lista */

/* Contenedor de la lista */
#views-bootstrap-videos-block-3 {
    list-style: none;               /* Quita bullets */
    padding: 1rem 0;
    margin: 2rem 0;                 /* Separación del bloque del resto de la página */
    border-top: 1px solid purple;   /* Borde púrpura arriba */
    border-bottom: 2px solid purple;/* Borde púrpura abajo */
    font-family: 'Arial', sans-serif;
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* Dos columnas en desktop */
}

#views-bootstrap-videos-block-3 p {
    margin: 0;
    padding: 0;
    display: none; /* Oculta los p vacíos */
}

#views-bootstrap-videos-block-3 .list-group-item {
    padding: 0;                     /* Sin padding vertical entre items */
    border: none;
}

/* Enlaces dentro de los items */
#views-bootstrap-videos-block-3 .views-field-name a {
    text-decoration: none;
    color: #222;
    display: block;
    transition: color 0.2s ease, transform 0.2s ease;
}

#views-bootstrap-videos-block-3 .views-field-name a:hover {
    color: purple;                  /* Hover púrpura */
    transform: translateX(2px);     /* Efecto sutil */
}

/* Texto adicional si lo hay */
#views-bootstrap-videos-block-3 .list-group-item-text {
    display: none;                  /* Minimalista */
}

/* Responsive: una columna en móvil */
@media screen and (max-width: 768px) {
    #views-bootstrap-videos-block-3 {
        grid-template-columns: 1fr; /* Una columna */
    }
}

/* Paragraph image */

.paragraph--type--image {
  position: relative;
  width: 100%; /* ocupa todo el ancho disponible */
}

.paragraph--type--image img {
  width: 100%; /* se ajusta al ancho del contenedor */
  height: auto; /* mantiene la proporción */
  display: block;
}

.paragraph--type--image .field--name-field-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(0, 0, 0, 0.5); /* sombreado negro semitransparente */
  color: #fff;
  font-size: 0.8rem; /* letra pequeña */
  padding: 5px 10px;
  box-sizing: border-box;
  text-align: left;
}

nav ol > li.breadcrumb-item {
  margin-top: 10px;
  font-size: 0.8rem;
}

/* Colors */

.navbar {
    padding: 0px;
}
footer {
    padding: 0px;
}


body {
    background-color: #F2F0F0;
}

header[role="banner"] .container,
main[role="main"] > .container, 
footer .container {
    background-color: #FFFFFF;
}

footer[role="contentinfo"].mt-auto {
    margin-bottom: 0px;
}


/*
header[role="banner"],
main[role="main"]{
    background-color:  #F2F0F0;
}
footer[role="contentinfo"]{
    background-color:  #F2F0F0;
}



.region-content {
    padding-bottom: 15px;
}

footer .container {
    padding-top: 15px;
    border-top: 1px dashed #CCCCCC;

}
*/

@media (min-width: 992px) {
    .navbar-expand-lg .navbar-nav {
    font-size: 1rem;
    font-weight: bold;
    text-transform: uppercase;
    }
    .navbar-expand-lg .navbar-nav a {
        color: #BBB;
    }
    .navbar-expand-lg .navbar-nav a.active {
        color: purple;
    }
}

#drupal-off-canvas-wrapper {
    background-color: #FFF;
}
}