/* Google font primenjen na čitav dokument */
body {
  font-family: 'Poppins', sans-serif;
  background: url('../images/wallpaper.jpg') no-repeat center center fixed;
  background-size: cover;
  padding: 1rem;
  color: #333;
}

/* Logo */
.logo {
  max-width: 180px;
  width: 100%;
  height: auto;
  margin-bottom: 1rem;
}

/* Kontejner menija */
.menu-container {
  background-color: rgba(255, 255, 255, 0.9);
  max-width: 800px;
  padding: 2rem;
  border-radius: 0.5rem;
  /* dodaj poziciju za apsolutno pozicioniranje ikonica */
  position: relative;
}

/* Naslovi */
.menu-container h1 {
  font-weight: 600;
  margin-bottom: 1rem;
}

.menu-container h2 {
  font-weight: 500;
  margin-top: 1.5rem;
  margin-bottom: 0.75rem;
}

/* Tabele bez ivica i providne pozadine */
.table-borderless,
.table-borderless td,
.table-borderless th {
  border: 0;
  background-color: transparent !important;
}

/* Struktura za naziv, opis i dot-leaders */
.product-cell {
  display: flex;
  flex-direction: column;
}

.product-wrap {
  display: flex;
  align-items: center;
  margin-bottom: 0.15rem;
}

.product-name {
  white-space: nowrap;
  margin-right: 0.5rem;
  font-weight: 500;
}

.dots {
  flex: 1;
  border-bottom: 1px dotted currentColor;
  height: 0;
}

.product-cell .desc {
  font-size: 0.85rem;
  color: #555;
  margin: 0;
}

/* Cena u boldu i bez prelamanja */
.text-end {
  white-space: nowrap;
}

/* Footer */
.footer {
  font-family: 'Poppins', sans-serif;
  font-size: 0.85rem;
  color: #666;
  margin-top: 2rem;
}

.footer a {
  color: inherit;
  text-decoration: none;
  font-weight: 500;
}

.footer a:hover {
  text-decoration: underline;
}

/* Postojeći stil za horizontalne ikonice (footer ili drugi deo) */
.social-icons a {
  color: #333;
  font-size: 1.5rem;
  margin: 0 0.75rem;
  transition: color 0.2s;
}

.social-icons a:hover {
  color: #555;
}

/* ==========================
   Novi blok: wrapper za logo + vertikalne društvene ikonice
   ========================== */

/* Omotač logotipa i ikonica */
.header-wrapper {
  position: relative;
  text-align: center;
  margin-bottom: 1rem;
}

/* Ako želiš da ukloniš default marginu loga unutar wrappera */
.header-wrapper .logo {
  margin-bottom: 0;
}

/* Inline social icons ispod loga */
.social-vertical {
  position: static;           /* više nije apsolutno pozicionirano */
  margin: 1rem auto;          /* razmak iznad/ispod i centriranje */
  display: flex;
  flex-direction: row;        /* sve u jednoj liniji */
  justify-content: center;    /* centrirano unutar wrappera */
  align-items: center;
  gap: 0.75rem;               /* razmak između stavki */
}


/* social-vertical: ukloni underline i smanji font za tekst */
.social-vertical a {
  display: flex;
  align-items: center;
  color: #333;
  font-size: 0.76rem;       /* manji tekst */
  text-decoration: none;   /* nema podvlačenja */
}

/* ikonica ostaje veća od teksta */
.social-vertical a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;        /* razmak između ikonice i teksta */
  font-size: 0.76rem;
  text-decoration: none;
}

.social-vertical a i {
  flex-shrink: 0;
  width: 1.5rem;      /* fiksna širina ikone */
  text-align: center; /* centriranje unutar tog prostora */
  font-size: 1.5rem;
}

/* Wi-Fi info ispod menija */
.wifi-info {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;        /* prostor između ikonice, labela i šifre */
  font-size: 1rem;    /* osnovna veličina teksta */
}

.wifi-info i {
  font-size: 1.6rem;  /* veličina ikonice */
}

.wifi-info .wifi-label {
  /* običan font, iste boje */
  color: #333;
}

.wifi-pass {
  font-weight: 600;   /* bold za šifru */
}



/* ==========================
   Media Queries (po potrebi)
   ========================== */
@media (max-width: 576px) {
  .social-vertical a {
    font-size: 0.8rem;       /* manji tekst */
  }
  .social-vertical a i {
    font-size: 1.2rem;       /* manje ikonice */
  }
  .social-vertical {
    gap: 0.5rem;             /* malo manji razmak */
    flex-wrap: wrap;         /* prelome u više redova po potrebi */
  }
}
