/* KATEHEO OLIVERO – FINAL CSS (sa hamburger fixom i blockquote overrideom) */

/* Kapljice maknute */
body::before, .header-visual, .header-visual::before, .header-visual::after {
  display: none !important;
  background: none !important;
  content: none !important;
}

/* Sakrij site name */
.site-branding__text, .site-name, .site-branding__name {
  display: none !important;
}

/* Full-width + centrirani container */
#page-wrapper, #page, .layout-main-wrapper {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.container, .main-content__container, .site-footer__inner {
  max-width: 96.25rem !important;
  margin: 0 auto !important;
  padding: 0 3rem !important;
  box-sizing: border-box !important;
}

/* Niži header */
.site-header {
  padding: 0 !important;
  margin: 0 !important;
  min-height: 25px !important;
  background: #ffffff;
}

.site-header__inner__container {
  padding: 0.4rem 0 !important;
  min-height: 25px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.site-logo img {
  max-height: 23px !important;
  border-radius: 0 !important;
}

/* Horizontalna navigacija + hamburger fix */
#header-nav, .header-nav {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  padding: 0.15rem 0 !important;
  min-height: 24px !important;
  background: #ffffff;
  border-bottom: 1px solid #eee !important;
}

#header-nav .menu--main {
  display: flex !important;
  justify-content: center !important;
  gap: 2.2rem !important;
  flex-wrap: wrap !important;
}

#header-nav .menu-item a {
  display: block !important;
  font-size: 1.15rem !important;
  padding: 0.4rem 0.8rem !important;
  color: #333 !important;
}

/* Sticky header – logo + menu uvijek na vrhu prilikom skrolanja */
.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: #ffffff !important; /* bijela pozadina da ne bude prozirno */
  box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important; /* lagana sjena za ljepši izgled */
  transition: all 0.3s ease !important; /* glatki prijelaz */
}

/* Ako želiš da sticky header bude malo tanji kad se aktivira (opcionalno) */
.site-header.sticky-active {
  padding: 0.3rem 0 !important;
  min-height: 30px !important;
}

/* Osiguraj da Hero i ostali sadržaj ne budu prekriveni */
.region-hero,
#main-wrapper {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Na mobilnom – hamburger i dalje funkcionalan */
@media (max-width: 1024px) {
  .site-header {
    min-height: 40px !important;        /* malo više na mobitelu da ne bude preusko */
  }

  .site-logo img {
    max-height: 35px !important;
  }

  .mobile-buttons {
    top: 0.4rem !important;
  }
}

.site-header {
  transition: padding 0.3s ease, min-height 0.3s ease;
}

.site-header.sticky-active {
  padding: 0.2rem 0 !important;
  min-height: 40px !important;
}

.site-header.sticky-active {
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(10px) !important; /* cool efekt zamućenja */
}

/* Hamburger + dropdown linkovi vidljivi */
@media (max-width: 1024px) {
  .mobile-buttons {
    display: block !important;
    position: absolute !important;
    right: 1rem !important;
    top: 0.6rem !important;
  }

  #header-nav[aria-expanded="true"] .menu--main,
  .header-nav.expanded .menu--main {
    display: flex !important;
    flex-direction: column !important;
    position: absolute !important;
    top: 45px !important;
    left: 0 !important;
    width: 100% !important;
    background: white !important;
    padding: 1rem !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
  }

  #header-nav .menu-item,
  #header-nav .menu-item a {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    text-align: center !important;
    padding: 1rem 0 !important;
  }
}

/* Hero + Highlighted */
.region-hero, .region-highlighted {
  width: 100vw !important;
  margin-left: calc(-50vw + 50%) !important;
  margin-right: calc(-50vw + 50%) !important;
  padding: 0 !important;
  margin-top: 0 !important;
}

.region-highlighted {
  padding: 3rem 0 2rem 0 !important;
}

/* Manji razmak Highlighted → Content + promoviranih članaka */
.region-highlighted + #main-wrapper {
  margin-top: -1rem !important;
  padding-top: 1.5rem !important;
}

.view-frontpage .views-row,
.node-teaser,
.promoted-node {
  margin-bottom: 1.8rem !important;
}

/* Grid u Highlighted */
.region-highlighted .grid,
.region-highlighted .layout__region {
  max-width: 96.25rem !important;
  margin: 0 auto !important;
  padding: 0 3rem !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 4rem !important;
  justify-items: center !important;
}

/* Slike zaobljene, logo ne */
img {
  border-radius: 1.1rem !important;
  overflow: hidden !important;
}

.site-logo img {
  border-radius: 0 !important;
}

/* Male margine sa strane na mobilnom za prozračnost (vraćeno) */
@media (max-width: 1024px) {
  .container,
  .main-content__container,
  .site-footer__inner {
    padding-left: 2rem !important;
    padding-right: 2rem !important;
  }

  .region-hero,
  .region-highlighted {
    padding-left: 2rem !important;
    padding-right: 2rem !important;
  }

  .region-highlighted .grid,
  .region-highlighted .layout__region {
    padding: 0 1.5rem !important;
  }
}
/* Full width image + text region */
.region-fullwidth-image-text {
  width: 100%;
  background-color: #ffffff;
  padding: 0;
}

.fullwidth-image-text-block {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin: 0;
}

.fullwidth-image-text-block .image-side {
  flex: 0 0 50%;
  max-width: 50%;
  padding: 0;
}

.fullwidth-image-text-block .image-side img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.fullwidth-image-text-block .text-side {
  flex: 0 0 50%;
  max-width: 50%;
  padding: 60px 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: #f8f9fa;
}

.fullwidth-image-text-block .text-side h2 {
  color: #00bcd4;
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 20px;
}

.fullwidth-image-text-block .text-side .lead {
  font-size: 1.25rem;
  margin-bottom: 20px;
  color: #555;
}

.fullwidth-image-text-block .text-side ul {
  list-style: none;
  padding-left: 0;
  margin: 20px 0;
}

.fullwidth-image-text-block .text-side ul li {
  padding: 8px 0 8px 30px;
  position: relative;
  font-size: 1.1rem;
}

.fullwidth-image-text-block .text-side ul li:before {
  content: "✓";
  color: #00bcd4;
  font-weight: bold;
  font-size: 1.3rem;
  position: absolute;
  left: 0;
  top: 5px;
}
/* Tipografija */
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; line-height: 1.8 !important; color: #333 !important; }

a { line-height: 1.3 !important; text-decoration: none; !important; font-weight: 600 !important; }

p { font-size: 3.6rem !important; margin-bottom: 2rem !important; font-size: 1.1rem !important; }

h1 { font-size: 3.5rem !important; font-weight: 700 !important; margin: 4rem 0 2rem 0 !important; }
h2 { font-size: 2.8rem !important; font-weight: 600 !important; margin: 3.5rem 0 1.5rem 0 !important; }
h3 { font-size: 2.2rem !important; font-weight: 600 !important; margin: 3rem 0 1.2rem 0 !important; }

/* Blockquote – jači override */
blockquote,
blockquote p,
blockquote * {
  font-size: 1.6rem !important; /* mijenjaj ovdje – npr. 1.8rem ili 2rem */
  line-height: 1.7 !important;
}

blockquote {
  font-style: italic !important;
  border-left: 6px solid #a1a1a1 !important;
  padding: 2rem 3rem !important;
  margin: 4rem 0 !important;
  background: #f9f9f9 !important;
  border-radius: 0 1rem 1rem 0 !important;
}
/* Osiguraj da je Drupal Toolbar uvijek na vrhu */
body.toolbar-horizontal #toolbar-administration,
body.toolbar-horizontal .toolbar-tray {
  z-index: 1001 !important; /* Mora biti veći od tvog headera (1000) */
}

/* Ako koristiš Admin Toolbar modul s podizbornicima */
.toolbar-tray-horizontal ul.toolbar-menu {
  z-index: 1002 !important;
}
