/*******************************************************************************
 * NJSZT LÁBLÉC — crm.njszt.hu
 * Elhelyezés: themes/custom/crm_njszt_theme/css/njszt_crm_footer.css
 *
 * A blokkok nyersen, grid nélkül ülnek a region-footer-ben, ezért az
 * elrendezést itt építjük fel. A blokkok DOM-sorrendje: copyright, logó,
 * linkek, kapcsolat — ezt az `order` fordítja a helyes sorrendbe.
 ******************************************************************************/

/*--- 1. A footer elem ---*/

.footer-dark {
  background-color: #212529;
  color: #f8f9fa;
  padding-block: 3rem;
}


/*--- 2. Elrendezés — mobile-first, egy oszlop ---*/

.footer-dark .region-footer {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  align-items: start;
}

/* A blokkok helyes sorrendje (a DOM-ban a copyright az első) */
#block-crm-njszt-theme-footerlogo          { order: 1; }
#block-crm-njszt-theme-footerlinkek        { order: 2; }
#block-crm-njszt-theme-footercontact       { order: 3; }
#block-crm-njszt-theme-copyrighttextfooter { order: 4; }

/* Három oszlop 992px felett, a copyright teljes szélességben alul */
@media (min-width: 992px) {
  .footer-dark .region-footer {
    grid-template-columns: repeat(3, 1fr);
    column-gap: 2.5rem;
  }

  #block-crm-njszt-theme-copyrighttextfooter {
    grid-column: 1 / -1;
  }
}


/*--- 3. Közös tipográfia ---*/

/* display: block → az aláhúzás a teljes oszlopszélességet kiteszi */
.footer-dark .region-footer h5 {
  display: block;
  font-size: 1.3rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: .5px;
  margin-bottom: 1.3rem;
  padding-bottom: .3rem;
  border-bottom: 1px solid var(--njszt-color-cblue);
}

.footer-dark .region-footer p {
  margin-bottom: .5rem;
}

.footer-dark .region-footer p:last-child {
  margin-bottom: 0;
}

/* Üres bekezdések (CKEditor-maradványok) ne tartsanak helyet */
.footer-dark .region-footer p:empty {
  display: none;
  margin: 0;
}


/*--- 4. Linkek ---*/

.footer-dark .region-footer a {
  color: #f8f9fa;
  text-decoration: none;
  transition: color .2s ease;
}

.footer-dark .region-footer a:hover,
.footer-dark .region-footer a:focus-visible {
  color: #fff;
  text-decoration: underline;
}


/*--- 5. Logó blokk ---*/

#block-crm-njszt-theme-footerlogo img {
  display: block;
  width: auto;
  max-width: 100px;
  height: auto;
  margin-bottom: 1rem;
}


/*--- 6. Gyorslinkek blokk ---*/

#block-crm-njszt-theme-footerlinkek ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: .35rem;
}

#block-crm-njszt-theme-footerlinkek li {
  margin: 0;
}

/* Aláhúzás-effekt, mint a fejléc nav-linkjein */
#block-crm-njszt-theme-footerlinkek li a {
  position: relative;
  display: inline-block;
  padding-bottom: .4rem;
}

/* A sima text-decoration kikapcsolása, hogy ne legyen dupla vonal */
#block-crm-njszt-theme-footerlinkek li a:hover,
#block-crm-njszt-theme-footerlinkek li a:focus-visible {
  text-decoration: none;
}

#block-crm-njszt-theme-footerlinkek li a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: var(--njszt-color-cblue);

  transform: scaleX(0);
  transform-origin: right;
  transition: transform .25s ease;
}

#block-crm-njszt-theme-footerlinkek li a:hover::after,
#block-crm-njszt-theme-footerlinkek li a:focus-visible::after {
  transform: scaleX(1);
  transform-origin: center;
}


/*--- 7. Kapcsolat blokk + közösségi ikonok ---*/

/* A négy ikonlink közvetlenül a mező gyereke (nincs wrapper div),
   az email link viszont <p>-ben ül — ezért csak a közvetlen <a>-kra hat. */
#block-crm-njszt-theme-footercontact .field__item > a {
  display: inline-block;
  margin-right: .75rem;
  margin-top: .25rem;
  line-height: 0;
}

#block-crm-njszt-theme-footercontact .field__item > a:last-of-type {
  margin-right: 0;
}

#block-crm-njszt-theme-footercontact .field__item > a img {
  width: 50px;
  height: 50px;
  opacity: .85;
  transition: opacity .2s ease, transform .2s ease;
  margin-right: 1rem;
}

#block-crm-njszt-theme-footercontact .field__item > a:hover img,
#block-crm-njszt-theme-footercontact .field__item > a:focus-visible img {
  opacity: 1;
  transform: translateY(-2px);
}


/*--- 8. Copyright + jogi linkek ---*/

#block-crm-njszt-theme-copyrighttextfooter {
  font-size: .875rem;
  color: #6c757d;
  border-top: 1px solid rgba(255, 255, 255, .15);
  padding-top: 1.5rem;
}

/* A két bekezdés egy sorba: copyright balra, jogi linkek jobbra */
#block-crm-njszt-theme-copyrighttextfooter .field__item {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: .5rem 1.5rem;
}

#block-crm-njszt-theme-copyrighttextfooter .field__item > p {
  margin-bottom: 0;
}

/* A linkeket tartalmazó bekezdés mindig jobbra kerül */
#block-crm-njszt-theme-copyrighttextfooter .field__item > p:has(a) {
  margin-left: auto;
  text-align: right;
}

#block-crm-njszt-theme-copyrighttextfooter a {
  color: #6c757d;
}

#block-crm-njszt-theme-copyrighttextfooter a strong {
  font-weight: 600;
}

/* A két jogi link közé térköz */
#block-crm-njszt-theme-copyrighttextfooter a + a {
  margin-left: 1.25rem;
}

/* Mobilon egymás alatt, balra igazítva */
@media (max-width: 575.98px) {
  #block-crm-njszt-theme-copyrighttextfooter .field__item {
    flex-direction: column;
    align-items: flex-start;
  }

  #block-crm-njszt-theme-copyrighttextfooter .field__item > p:has(a) {
    margin-left: 0;
    text-align: left;
  }

  #block-crm-njszt-theme-copyrighttextfooter a + a {
    margin-left: 1rem;
  }
}


/*******************************************************************************
 * NAGY KONTRASZTÚ NÉZET
 * Ha külön fájlban tartod a kontrasztos szabályokat, ez a szakasz oda is
 * átmásolható — de itt is működik, mert a njszt_crm_high-contrast.css
 * korábban töltődik be, és ezek a szelektorok specifikusabbak.
 ******************************************************************************/

body.high-contrast .footer-dark {
  background-color: #000 !important;
  color: #FFD700 !important;
  border-top: 1px solid #FFD700 !important;
}

body.high-contrast .footer-dark .region-footer h5 {
  color: #FFD700 !important;
  border-bottom-color: #FFD700 !important;
}

body.high-contrast .footer-dark .region-footer a {
  color: #fff !important;
  text-decoration: underline !important;
  font-weight: bold !important;
}

body.high-contrast .footer-dark .region-footer a:hover {
  color: #000 !important;
  background-color: #FFD700 !important;
}

/* Az aláhúzás-effekt sávja aranyra */
body.high-contrast #block-crm-njszt-theme-footerlinkek li a::after {
  background: #FFD700 !important;
}

body.high-contrast #block-crm-njszt-theme-copyrighttextfooter,
body.high-contrast #block-crm-njszt-theme-copyrighttextfooter a {
  color: #FFD700 !important;
}

body.high-contrast #block-crm-njszt-theme-copyrighttextfooter {
  border-top-color: #FFD700 !important;
}

body.high-contrast #block-crm-njszt-theme-footercontact .field__item > a img,
body.high-contrast #block-crm-njszt-theme-footerlogo img {
  opacity: 1 !important;
}