/* page-masonry-2-extended-v3.css
   Granular color control SOLO per Masonry-2 (scoped con .page-masonry-2)
   Include: header popup con bordi curvi corretti, colore testi "nascosti" on-hover,
   preloader con colore separato dal background pagina.
*/

/* =========================
   PALETTE E VARIABILI
   ========================= */
.page-masonry-2{
  /* Contenuto */
  --pm2-body-bg: #0000FF;
  --pm2-text: #ffffff;
  --pm2-heading: #ffffff;
  --pm2-link: #ffffff;
  --pm2-link-hover: #ffffff;
  --pm2-border: rgba(0,0,0,.25);

  /* Accento globale (hook al tema) */
  --pm2-accent: #000000;

  /* Header */
  --pm2-header-bg: #0000ff;
  --pm2-header-text: #FFFFFF;
  --pm2-header-link: #FFFFFF;
  --pm2-header-link-hover: #FFFFFF;
  --pm2-header-border: rgba(255,255,255,.12);

  /* Submenu popup (Work, ecc.) */
  --pm2-submenu-bg: #000000;
  --pm2-submenu-link: #ffffff;
  --pm2-submenu-link-hover: #ffffff;
  --pm2-submenu-radius: 14px;
  --pm2-submenu-shadow: rgba(0,0,0,.35);

  /* Footer */
  --pm2-footer-bg: #000000;
  --pm2-footer-text: #FFFFFF;
  --pm2-footer-link: #FFFFFF;
  --pm2-footer-link-hover: #FFFFFF;
  --pm2-footer-border: rgba(255,255,255,.15);

  /* Bottoni */
  --pm2-btn-primary-bg: #000000;
  --pm2-btn-primary-text: #ffffff;
  --pm2-btn-primary-border: #000000;
  --pm2-btn-primary-bg-hover: #111111;
  --pm2-btn-primary-text-hover: #FFFFFF;

  --pm2-btn-secondary-bg: #FFFFFF;
  --pm2-btn-secondary-text: #000000;
  --pm2-btn-secondary-border: #FFFFFF;
  --pm2-btn-secondary-bg-hover: #EDEDED;
  --pm2-btn-secondary-text-hover: #000000;

  /* Griglia / filtri */
  --pm2-card-bg: transparent;
  --pm2-card-overlay: rgba(0,0,0,0);
  --pm2-item-title: #000000;
  --pm2-item-meta: #000000;

  --pm2-filter-text: #000000;
  --pm2-filter-border: rgba(0,0,0,.25);
  --pm2-filter-hover: #000000;
  --pm2-filter-active-bg: #000000;
  --pm2-filter-active-text: #FFFFFF;

  /* Scroll-to-top */
  --pm2-scrolltop-stroke: #FFFFFF; /* traccia circolare */
  --pm2-scrolltop-ring: rgba(143,143,143,.40); /* anello esterno */
  --pm2-scrolltop-dot: #ffffff; /* pallino centrale */

  /* Magic cursor */
  --pm2-cursor-bg: rgba(255,0,0,0.0);
  --pm2-cursor-text: #FFFFFF;
  --pm2-cursor-border: rgb(255 255 255);
  --pm2-cursor-magnetic: #0019ff;
  --pm2-cursor-shadow: rgb(255 255 255 / 35%);
  --pm2-cursor-size: 26px;
  --pm2-cursor-border-width: 2px;

  /* Hover-reveal dei testi nascosti (titoli, link con data-hover) */
  --pm2-hover-reveal-color: #ffffff;

  /* PRELOADER / PAGE TRANSITION: colore separato dal body */
  --pm2-preloader-overlay: #161616;
  --pm2-preloader-bg: #161616;

  /* Utility slots */
  --pm2-color-1: #000000;
  --pm2-color-2: #FFFFFF;
  --pm2-color-3: #FF0000;
  --pm2-color-4: #00FF00;
  --pm2-color-5: #0000FF;
  --pm2-color-6: #FFD400;

  /* MAPPATURA SU VARIABILI DEL TEMA */
  --tt-main-color: var(--pm2-accent);
  --tt-link-color: var(--pm2-link);
  --tt-link-hover-color: var(--pm2-link-hover);
  --tt-sub-menu-bg-color: var(--pm2-submenu-bg);
  --tt-sub-menu-link-color: var(--pm2-submenu-link);
  --tt-sub-menu-link-hover-color: var(--pm2-submenu-link-hover);
  --tt-ball-border-color: var(--pm2-cursor-border);
  --tt-ball-magnetic-color: var(--pm2-cursor-magnetic);
  --tt-ball-bg-color: var(--pm2-cursor-bg);
  --tt-ball-color: var(--pm2-cursor-text);
  --tt-light-color: var(--pm2-scrolltop-stroke);
}

/* =========================
   BASE
   ========================= */
.page-masonry-2{ background: var(--pm2-body-bg) !important; color: var(--pm2-text) !important; }
.page-masonry-2 h1,.page-masonry-2 h2,.page-masonry-2 h3,.page-masonry-2 h4,.page-masonry-2 h5,.page-masonry-2 h6,
.page-masonry-2 .tt-heading-title,.page-masonry-2 .pgi-title{ color: var(--pm2-heading) !important; }
.page-masonry-2 #tt-content-wrap a,.page-masonry-2 #tt-content-wrap .tt-link{ color: var(--pm2-link) !important; }
.page-masonry-2 #tt-content-wrap a:hover,.page-masonry-2 #tt-content-wrap .tt-link:hover{ color: var(--pm2-link-hover) !important; }

/* =========================
   HEADER
   ========================= */
.page-masonry-2 #tt-header.tt-header-filled .tt-header-inner{
  background: var(--pm2-header-bg) !important;
  border-color: var(--pm2-header-border) !important;
}
.page-masonry-2 #tt-header,
.page-masonry-2 #tt-header .tt-logo,
.page-masonry-2 #tt-header .tt-link,
.page-masonry-2 #tt-header a{ color: var(--pm2-header-text) !important; }
.page-masonry-2 #tt-header a{ color: var(--pm2-header-link) !important; }
.page-masonry-2 #tt-header a:hover{ color: var(--pm2-header-link-hover) !important; }

/* Sottolineatura/linea sotto le voci menu */
.page-masonry-2 .tt-main-menu-list > li > a::before,
.page-masonry-2 .tt-main-menu-list > li > .tt-submenu-trigger > a::before{
  background-color: var(--pm2-accent) !important;
}

/* =========================
   SUBMENU POPUP FIX (bordo curvo, no bleeding)
   ========================= */
.page-masonry-2 .tt-main-menu .tt-submenu{
  background: var(--pm2-submenu-bg) !important;
  border-radius: var(--pm2-submenu-radius);
  background-clip: padding-box;
  overflow: hidden; /* evita colore nelle zone trasparenti degli angoli */
  box-shadow: 0 10px 24px -8px var(--pm2-submenu-shadow);
}
/* Disabilita eventuale freccetta/caret che “sporca” i bordi */
.page-masonry-2 .tt-main-menu .tt-submenu::before,
.page-masonry-2 .tt-main-menu .tt-submenu::after{ display: none !important; }

.page-masonry-2 .tt-main-menu .tt-submenu a{ color: var(--pm2-submenu-link) !important; }
.page-masonry-2 .tt-main-menu .tt-submenu a:hover{ color: var(--pm2-submenu-link-hover) !important; }

/* =========================
   HOVER-REVEAL TESTI NASCOSTI
   (span con data-hover, titoli, link, bottoni)
   ========================= */
/* Colora il testo “nascosto” generato via ::before {content: attr(data-hover)} */
.page-masonry-2 [data-hover]::before{
  color: var(--pm2-hover-reveal-color) !important;
}
/* Copri i casi comuni del tema */
.page-masonry-2 .tt-btn span::before,
.page-masonry-2 .tt-link span::before,
.page-masonry-2 .pgi-title a span::before,
.page-masonry-2 .tt-main-menu a span::before{
  color: var(--pm2-hover-reveal-color) !important;
}

/* =========================
   FOOTER
   ========================= */
.page-masonry-2 #tt-footer{
  background: var(--pm2-footer-bg) !important;
  color: var(--pm2-footer-text) !important;
  border-top: 1px solid var(--pm2-footer-border) !important;
}
.page-masonry-2 #tt-footer a{ color: var(--pm2-footer-link) !important; }
.page-masonry-2 #tt-footer a:hover{ color: var(--pm2-footer-link-hover) !important; }
.page-masonry-2 #tt-footer .tt-footer-widget-heading{ color: var(--pm2-footer-text) !important; }

/* =========================
   BORDI COMUNI
   ========================= */
.page-masonry-2 .border-top,
.page-masonry-2 .border-bottom,
.page-masonry-2 .tt-section.border-top{ border-color: var(--pm2-border) !important; }

/* =========================
   BOTTONI
   ========================= */
.page-masonry-2 .tt-btn{ border-width: 1px; transition: filter .2s, background-color .2s, color .2s, border-color .2s; }
/* Primary */
.page-masonry-2 .tt-btn:not(.tt-btn-secondary){
  background: var(--pm2-btn-primary-bg) !important;
  color: var(--pm2-btn-primary-text) !important;
  border-color: var(--pm2-btn-primary-border) !important;
}
.page-masonry-2 .tt-btn:not(.tt-btn-secondary):hover{
  background: var(--pm2-btn-primary-bg-hover) !important;
  color: var(--pm2-btn-primary-text-hover) !important;
  border-color: var(--pm2-btn-primary-bg-hover) !important;
}
/* Secondary */
.page-masonry-2 .tt-btn.tt-btn-secondary{
  background: var(--pm2-btn-secondary-bg) !important;
  color: var(--pm2-btn-secondary-text) !important;
  border-color: var(--pm2-btn-secondary-border) !important;
}
.page-masonry-2 .tt-btn.tt-btn-secondary:hover{
  background: var(--pm2-btn-secondary-bg-hover) !important;
  color: var(--pm2-btn-secondary-text-hover) !important;
  border-color: var(--pm2-btn-secondary-bg-hover) !important;
}

/* =========================
   PORTFOLIO / FILTRI
   ========================= */
.page-masonry-2 .portfolio-grid .tt-grid-item{ background: var(--pm2-card-bg) !important; }
.page-masonry-2 .portfolio-grid .pgi-title{ color: var(--pm2-item-title) !important; }
.page-masonry-2 .portfolio-grid .pgi-categories a{ color: var(--pm2-item-meta) !important; }
.page-masonry-2 .pgi-image-holder:before{ background: var(--pm2-card-overlay) !important; }

.page-masonry-2 .tt-portfolio-categories a{
  color: var(--pm2-filter-text) !important;
  border-color: var(--pm2-filter-border) !important;
}
.page-masonry-2 .tt-portfolio-categories a:hover{ color: var(--pm2-filter-hover) !important; }
.page-masonry-2 .tt-portfolio-categories a.is-active{
  background: var(--pm2-filter-active-bg) !important;
  color: var(--pm2-filter-active-text) !important;
  border-color: var(--pm2-filter-active-bg) !important;
}

/* =========================
   SCROLL-TO-TOP
   ========================= */
.page-masonry-2 .tt-stt-progress{ box-shadow: inset 0 0 0 2px var(--pm2-scrolltop-ring) !important; }
.page-masonry-2 .tt-stt-progress .tt-stt-progress-circle path{ stroke: var(--pm2-scrolltop-stroke) !important; }
.page-masonry-2 .tt-stt-progress::after{ color: var(--pm2-scrolltop-dot) !important; }

/* =========================
   PAGE TRANSITION / PRELOADER
   (colore separato dal body)
   ========================= */
.page-masonry-2 #tt-page-transition .tt-ptr-overlay-top,
.page-masonry-2 #tt-page-transition .tt-ptr-overlay-bottom{
  background: var(--pm2-preloader-overlay) !important;
}
.page-masonry-2 #tt-page-transition .tt-ptr-preloader{
  background: var(--pm2-preloader-bg) !important;
}

/* =========================
   MAGIC CURSOR
   ========================= */
.page-masonry-2 #magic-cursor #ball{
  width: var(--pm2-cursor-size) !important;
  height: var(--pm2-cursor-size) !important;
  background: var(--pm2-cursor-bg) !important;
  border: var(--pm2-cursor-border-width) solid var(--pm2-cursor-border) !important;
  box-shadow: 0 0 18px 0 var(--pm2-cursor-shadow) !important;
  color: var(--pm2-cursor-text) !important;
  mix-blend-mode: normal !important;
}

/* =========================
   UTILITY COLORI A BLOCCHI
   ========================= */
.page-masonry-2 .pm2-text-1{ color: var(--pm2-color-1) !important; }
.page-masonry-2 .pm2-text-2{ color: var(--pm2-color-2) !important; }
.page-masonry-2 .pm2-text-3{ color: var(--pm2-color-3) !important; }
.page-masonry-2 .pm2-text-4{ color: var(--pm2-color-4) !important; }
.page-masonry-2 .pm2-text-5{ color: var(--pm2-color-5) !important; }
.page-masonry-2 .pm2-text-6{ color: var(--pm2-color-6) !important; }

.page-masonry-2 .pm2-bg-1{ background: var(--pm2-color-1) !important; color: var(--pm2-color-2) !important; }
.page-masonry-2 .pm2-bg-2{ background: var(--pm2-color-2) !important; color: var(--pm2-color-1) !important; }
.page-masonry-2 .pm2-bg-3{ background: var(--pm2-color-3) !important; color: var(--pm2-color-2) !important; }
.page-masonry-2 .pm2-bg-4{ background: var(--pm2-color-4) !important; color: var(--pm2-color-1) !important; }
.page-masonry-2 .pm2-bg-5{ background: var(--pm2-color-5) !important; color: var(--pm2-color-2) !important; }
.page-masonry-2 .pm2-bg-6{ background: var(--pm2-color-6) !important; color: var(--pm2-color-1) !important; }

.page-masonry-2 .pm2-border-1{ border-color: var(--pm2-color-1) !important; }
.page-masonry-2 .pm2-border-2{ border-color: var(--pm2-color-2) !important; }
.page-masonry-2 .pm2-border-3{ border-color: var(--pm2-color-3) !important; }
.page-masonry-2 .pm2-border-4{ border-color: var(--pm2-color-4) !important; }
.page-masonry-2 .pm2-border-5{ border-color: var(--pm2-color-5) !important; }
.page-masonry-2 .pm2-border-6{ border-color: var(--pm2-color-6) !important; }
