/* Copyright (C) arrowthemes, Regular/Extended Licence */
/* ========================================================================
   Custom CSS - Limpio y optimizado
 ========================================================================== */

/* === IMPORTS === */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;900&display=swap');

/* === IMÁGENES ===
img {
  vertical-align: baseline;
  border-radius: 3% !important;
}

html.uk-notouch body#page.page.isblog.at-boxed div.sheet.uk-clearfix.bg_texture_12 div#at-container.wrapper div.uk-container.uk-container-center.grid-block div#main.grid-block div#maininner.grid-box section#content.grid-block div#system article.item div.content.clearfix div table tbody tr td a img{
  
  height: 191px;
  width: 191px;
}
*/

#system > article > div > div > table:nth-child(4) > tbody > tr:nth-child(2){
  line-height: 0.9;
}

/* === ESTRUCTURA GENERAL === */
.wrapper,
.uk-container,
#header,
#toolbar,
#logo,
#at-container,
#content,
.bg_texture_12,
.ed-section.ed-section-header,
html.uk-notouch body#page.page.isblog.at-boxed div.sheet.uk-clearfix.bg_texture_12 div#at-container.wrapper div#bottom-c div#copyright {
  background-color: transparent !important;
  background: none !important;
}

.at-boxed #at-container {
  margin: 0 auto 5px;
}

/* === TIPOGRAFÍA Y COLORES === */
body {
  font-family: 'Inter', sans-serif !important;
  color: #F7F5F5 !important;
  background: #000000 url('https://quimvila.com/images/moqueta-negra.jpg') repeat center center fixed !important;
  background-size: 50% !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
}

h1, .page-header h1, .item-title {
  font-family: 'Inter', sans-serif !important;
  font-weight: 400 !important;
  font-size: 2.4em !important;
  color: #F7F5F5 !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.6) !important;
}

h2, .content h2, .module-title h2 {
  font-family: 'Inter', sans-serif !important;
  font-weight: 400 !important;
  font-size: 1.9em !important;
  color: #F7F5F5 !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.5) !important;
}

h3 {
  font-family: 'Inter', sans-serif !important;
  font-weight: 400 !important;
  font-size: 1.5em !important;
  color: #F7F5F5 !important;
}

h4 {
  font-family: 'Inter', sans-serif !important;
  font-weight: 400 !important;
  font-size: 1.3em !important;
  color: #F7F5F5 !important;
}

p, .item p, .article-content p {
  color: #F7F5F5 !important;
}

a, a:link, a:visited,
.wk-slideshow .caption a,
.wk-slideshow-scroll .nav li.active span,
.loadmore-more, .loadmore-text,
.uk-tab > li > a,
.uk-button-link,
.k2CommentItem span.lcItemTitle a,
dl.tabs dt,
.sprocket-mosaic-loadmore {
  color: #F7F5F5 !important;
  text-decoration: none !important;
/*  display:none !important; */
}

a:hover {
  color: #FAF2CF !important;
  text-decoration: underline !important;
}

/* === BOTONES === */
.btn, .button, input[type="submit"] {
  font-family: 'Inter', sans-serif !important;
  font-weight: 400 !important;
  background: rgba(0, 212, 255, 0.15) !important;
  border: 1px solid #F7F5F5 !important;
  color: #F7F5F5 !important;
  border-radius: 6px !important;
  text-transform: uppercase !important;
}

.btn:hover, .button:hover, input[type="submit"]:hover {
  background: #FAF2CF !important;
  color: #000 !important;
}

/* === FORMULARIOS === */
form.box input, form.box select, form.box textarea,
form.short input, form.short select, form.short textarea,
.searchbox input,
input[type="text"], input[type="password"], input[type="email"],
input[type="url"], input[type="tel"], textarea,
.form-control {
  background: rgba(17, 17, 17, 0.8) !important;
  border: 1px solid #333 !important;
  color: #F7F5F5 !important;
  font-family: 'Inter', sans-serif !important;
}

/* === CONTENIDO ARTÍCULOS === */
html.uk-notouch body#page.page.isblog.at-boxed div.sheet.uk-clearfix.bg_texture_12 div#at-container.wrapper div.uk-container.uk-container-center.grid-block div#main.grid-block div#maininner.grid-box section#content.grid-block div#system {
  padding: 5%;
}

html.uk-notouch body#page.page.isblog.at-boxed div.sheet.uk-clearfix.bg_texture_12 div#at-container.wrapper div.uk-container.uk-container-center.grid-block div#main.grid-block div#maininner.grid-box section#content.grid-block div#system div.items.items-col-1.grid-block div.grid-box.width100 article.item p.links {
  float: right;
}

/* === FORMULARIO CONTACTO (noblog) === */
html.uk-notouch body#page.page.noblog.at-boxed div.sheet.uk-clearfix.bg_texture_12 div#at-container.wrapper div.uk-container.uk-container-center.grid-block div#main.grid-block div#maininner.grid-box section#content.grid-block div#system article.item div.content.clearfix div div.bfClearfix div#ff_formdiv1.bfFormDiv form#ff_form1.bfQuickMode div#bfPage1.bfPage {
  margin: 1% !important;
}



/* === LOGO QUIM VILA === */
.logo-quimvila {
  display: flex !important;
  align-items: center !important;
  gap: 25px !important;
  padding: 20px 25px !important;
  background: transparent !important;
  margin: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  min-height: 100px !important;
  position: relative !important;
  z-index: 10 !important;
}

.logo-quimvila img {
  width: 90px !important;
  height: auto !important;
  flex-shrink: 0 !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
}

.titol-quimvila {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  line-height: 1.1 !important;
}

.titol-link, .logo-link {
  color: #fff !important;
  text-decoration: none !important;
}

.nom, .cognom {
  margin: 0 !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.2px !important;
  text-shadow: 1px 1px 3px rgba(0,0,0,0.6) !important;
}

.nom {
  font-size: 4rem !important;
  color: #fff !important;
}

.cognom {
  font-size: 1.7rem !important;
  color: #cccccc !important;
}




/* Amaga el menú horitzontal en pantalles petites (quan surt el botó responsive) */
@media (max-width: 992px) {
    div.module._menu.deepest {
        display: none !important;
    }
}

/* Manté logo i nom web*/
@media (max-width: 992px) {
    .headerbar {
        display: block !important;
    }
}

/* Esborra icona menú responsive duplicada*/

@media (max-width: 992px) {
.menu-dropdown a.level1, .menu-dropdown span.level1, .social-icons li a, #header-right p, #header-responsive p, #at-navbar {
  display: none !important;
    }
}


/* Esborra botó twitter per compartir*/
.twitter-share-button {
  display: none !important;
    }
}

/* Amagar franja negra a dalt en mode responsive*/

@media (max-width: 767px){
#header-responsive {
display: none !important;
  }
}


#logo, #header-responsive {
background-color: transparent !important;
}



/*Display de nadales*/


html.uk-notouch body#page.page.isblog.at-boxed div.sheet.uk-clearfix.bg_texture_12 div#at-container.wrapper div#bottom-block section#bottom-a div.wrapper.grid-block.at-parent div.grid-box.width50.grid-h div.module.mod-box.deepest div.jp-playlist-player div.jp-interface div.jp-controls table tbody tr td label{
  padding-left: 5px; 
  display: inline-block; 
  visibility: hidden;
  position: relative;
}
html.uk-notouch body#page.page.isblog.at-boxed div.sheet.uk-clearfix.bg_texture_12 div#at-container.wrapper div#bottom-block section#bottom-a div.wrapper.grid-block.at-parent div.grid-box.width50.grid-h div.module.mod-box.deepest div.jp-playlist-player div.jp-interface div.jp-controls table tbody tr td label::after{
  visibility: visible; 
  content:"Reproducció Aleatòria";
  line-height: 10px;
  font-size: 12px;
  position: absolute;
  left: 0;
  top: 10px;
  padding-left: 7px;
}

div.jp-interface {
  border-radius: 15px;
}

div.jp-playlist {
  border-radius: 15px;
}

/* Elimina text Open Window*/
html.uk-notouch body#page.page.isblog.at-boxed div.sheet.uk-clearfix.bg_texture_12 div#at-container.wrapper div#bottom-block section#bottom-a div.wrapper.grid-block.at-parent div.grid-box.width50.grid-h div.module.mod-box.deepest center a{
  display: none;
}

html.uk-notouch body#page.page.isblog.at-boxed div.sheet.uk-clearfix.bg_texture_12 div#at-container.wrapper div.uk-container.uk-container-center.grid-block div#main.grid-block div#maininner.grid-box section#content.grid-block div#system article.item div.content.clearfix div center a{
  display: none;
}

html.uk-notouch body#page.page.isblog.at-boxed div.sheet.uk-clearfix.bg_texture_12 div#at-container.wrapper div#bottom-block section#bottom-a div.wrapper.grid-block.at-parent div.grid-box.width100.grid-h div.module.mod-box.deepest center a{
  display: none;
}

html.uk-notouch body#page.page.isblog.at-boxed div.sheet.uk-clearfix.bg_texture_12 div#at-container.wrapper div#bottom-block section#bottom-a div.wrapper.grid-block.at-parent div.grid-box.width50.grid-h div.module.mod-box.deepest div a{
  display: none;
}


html.uk-notouch body#page.page.noblog.at-boxed div.sheet.uk-clearfix.bg_texture_12 div#at-container.wrapper div.uk-container.uk-container-center.grid-block div#main.grid-block div#maininner.grid-box section#content.grid-block div#system article.item div.content.clearfix div div.bfClearfix{
  text-align: center;
}



/*IMatges discos*/

.album-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 25px;
    justify-items: center;
    margin: 20px auto;
    max-width: 1000px;
}

/* CARD que conté imatge + títol */
.album-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* Imatges igualades */
.album-grid img {
    width: 200px;
    height: 200px;
    object-fit: cover;
    display: block;
    border-radius: 6px;
}

/* Text */
.album-title {
    font-size: 8pt;
    margin-top: 6px;
    line-height: 1.2em;
    max-width: 200px;
}

/* Responsive mòbil */
@media (max-width: 480px) {
    .album-grid img {
        width: 140px;
        height: 140px;
    }
    .album-title {
        max-width: 140px;
    }
}