* {
  scrollbar-color: #8C8C8C #4D4D4D; /* 336699 B0D6F1 ;*/
}

html, body {
  overflow-x: hidden; /* Oldalra görgetés tiltása mobil bug fix */
}

body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    margin: 0;
    padding: 0;
    color: #333;
    background-color: #f9f9f9;
    font-size: 1rem; /* Alapértelmezett betűméret */
}

.container {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}
/* Almasiweb fejléc kinézete, plusz gombok */
header {
    background: #005baa;
    color: #fff;
    padding: 20px 0;
    text-align: center;
    position: relative; 
}

header h1 {
    margin: 0;
    font-size: 2rem;
}

h1 a {
    text-decoration: none; 
    color: inherit; 
}

h1 a:hover {
    text-decoration: none; 
    color: inherit; 
}

.theme-toggle, .settings_button, .font-increase, .font-decrease, .font-normal {
    cursor: pointer;
    font-size: 24px;
    margin-left: 1px;
}

.theme-toggle {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}
.settings_button {
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
}
/* Lenyíló gombok menü */
.dropdown-menu {
    display: none;
    position: absolute;
    left: 20px;
    top: 70%;
    background-color: #336699;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 5.5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.dropdown-menu span,
.dropdown-menu button {
    display: block;
    margin: 5px 0;
    cursor: pointer;
    font-size: 16px;
} /* Lenyíló gombok menü vége */

main {
    background: #fff;
    padding: 20px;
    margin: 20px 0 0 0;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
/* Alap linkek */
a {
    text-decoration: none; /* Aláhúzás eltávolítása */
    color: #005baa; /* Jelenlegi link szín */
}

a:hover {
    text-decoration: underline; /* Hover állapotban aláhúzódik */
    color: #004b8a; 
}
.general-links,
.categories {
    list-style-type: none;
    padding: 0;
}

.general-links li,
.links li {
    margin: 5px 0;
}

.general-links a,
.links a {
    text-decoration: none;
    color: #005baa;
}

.general-links a:hover,
.links a:hover {
    text-decoration: underline;
}

.category-toggle {
    background: #005baa;
    color: #fff;
    border: none;
    padding: 10px;
    text-align: left;
    width: 100%;
    font-size: inherit; 
    cursor: pointer;
    margin-bottom: 5px;
}

.links {
    list-style-type: none;
    padding-left: 20px;
    margin: 0;
    display: block; /* Linkek alapból nyitva vannak */
}

footer {
    background: #333;
    color: #fff;
    text-align: center;
    padding: 10px 0;
    margin-top: 20px;
}
footer a{
    color: #fff;
    font-weight: bold;
}

footer a:hover{
    color: #fff;
    font-weight: bold;
}

footer p {
    margin: 0;
}

.controls {
    margin-bottom: 20px;
    display: flex;
    flex-wrap: wrap; 
    gap: 10px; 
}

.controls button {
    background: #005baa;
    color: #fff;
    border: none;
    padding: 10px;
    cursor: pointer;
    font-size: 1rem;
    flex: 1; 
    min-width: 150px; 
}

.controls button:hover {
    background: #004b8a;
}

button:disabled {
    cursor: not-allowed;
    background-color: #ccc; 
    color: #777; 
}

input {
    background: #005baa;
    color: #fff;
    border: none;
    padding: 6px;
    cursor: pointer;
    font-size: 1rem;
    flex: 1; 
    min-width: 100px;
    margin-bottom: 6px;
}

input[type="text"] {
    background: #4da6ff;
    cursor: default;

}
input[type="text"]:focus {

    background: #0073e6;
    color: #fff;
    outline: none; /* alapértelmezett kontúrt eltávolítása */
}

input::placeholder {
        color: #d9d9d9; 
        }

/* Ha az input mező aktív */
input:focus::placeholder {
        color: #555; /* aktív mező */
        }

/* Fixált fejléc */
.sticky-header {
    position: sticky;
    top: 0;
    background-color: #007bb5;
    z-index: 1000;
    padding: 1px 0;
    text-align: center;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.sticky-header h1 {
    font-size: 24px;
    font-weight: 500;
    color: #fff;
    margin: 0;
}
/* Névnapos oldal */
#nevnap-kereso-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

#nevnap-kereso-form label,
#nevnap-kereso-form input {
    flex: initial; /* ne legyen 100% szélesség PC-n */
}
#vissza {
    display: inline-block; /* maradjon sorban*/
    width: auto;
}
/* Névnapos oldal vége*/


/* Lábléc mindig kitölti a teret javítás */
html, body {
  height: 100%;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

main {
  flex: 1; /* Kitölti a helyet a lábléc felett */
}

/* Sötét mód stílusok */

body.dark-mode {
    color: #fff;
    background-color: #1e1e1e; 
}

body.dark-mode header {
    background-color: #333; 
}

body.dark-mode footer {
    background-color: #222; 
}

body.dark-mode .theme-toggle {
    color: #fff; 
}

body.dark-mode .category-toggle {
    background-color: #444; 
    color: #fff; 
}

body.dark-mode .links a {
    color: #ccc; 
}

body.dark-mode .links a:hover {
    color: #fff; 
}

body.dark-mode main {
    background-color: #2c2c2c; 
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* árnyék */
}

body.dark-mode .controls button {
    background-color: #444; 
    color: #fff; /* sötét gombok */
}

body.dark-mode .controls button:hover {
    background-color: #555; /* sötét gombok */
}

body.dark-mode a {
    color: #ccc; 
}

body.dark-mode a:hover {
    color: #fff; 
    text-decoration: underline;
}

body.dark-mode header a:hover{
text-decoration: none;
}

body.dark-mode .dropdown-menu {
    background-color: #444;
}

body.dark-mode input {
    background: #444;
}

body.dark-mode input[type="text"] {
    background: #777;

}
body.dark-mode input[type="text"]:focus {

    background: #666;
}

body.dark-mode input::placeholder {
     color: #d9d9d9; /* Szürke szín */
        }

/* Ha az input mező aktív */
body.dark-mode input:focus::placeholder {
    color: #222; /* Sötétebb szín aktív mezőnél */
}

/* Sötét mód vége*/

/* Média lekérdezés a mobil eszközökhöz */
@media (max-width: 768px) {
    .controls {
        flex-direction: column; /* Gombok mobilon egymás alatt */
    }

    .controls button {
        width: 100%; /* A gombok teljes szélességükben megjelennek */
        min-width: 100%; /* Mobilon teljes szélesség */
    }
    input {
        padding: 16px; /* Mobilon (768px-nál kisebb képernyők) */
	min-width: 150px;
	display: inline-block;

    }
/* Ha csak egy input van, azt középre teszi
    input:last-of-type { 
        display: block;
        margin: 0 auto;
        width: auto;
    } */

    input[type="text"] {
	min-width: 88%;
    }
/* Lenyíló beállítások menü */
  #settings-button + .dropdown-menu.custom-menu {
        display: none; /* Alapértelmezetten rejtve */
        position: fixed;
        left: 10px;
        top: 50px;
        width: 100%;
        z-index: 1000;
        border: 1px solid #ccc;
        border-radius: 5px;
        padding: 10px;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    }
/* Névnapos oldal */
 #nevnap-kereso-form {
        flex-direction: column;
        align-items: stretch;
    }

 #nevnap-kereso-form label,
 #nevnap-kereso-form input {
        width: 100%;
        box-sizing: border-box;
    }

  /* Opcionálisan: hogy a "Vagy válassz dátumot" is külön sorban legyen */
  #nevnap-kereso-form label[for="datum-kereso"] {
        margin-top: 1rem;
    }
  #vissza {
        display: block;
        width: 100%;
        box-sizing: border-box;
        margin-top: 1rem; /* hogy legyen kis térköz fölötte */
    }
   /* Névnapos oldal vége */

 #uploadForm input { /*Fájl feltöltés oldal */
        width: 100%;
        box-sizing: border-box;
    }
}

/* Nyomtatásra vonatkozó stílusok */
@media print {
    body {
        font-size: 12pt;
        text-align: left;
        margin: 0;
    }

    .controls {
        display: none; /* A vezérlő gombok elrejtése */
    }

    #imSite {
        width: 100%; 
        margin: 0;
    }

    #imHeader, #imFooter {
        border: none; 
    }

    #imMenuMain, #imFooterSiteMap {
        visibility: hidden; /* Menüt és a lábléc rejtése */
    }

    #imContent {
        margin: 0;
    }

    
    h1 {
        display: none; /* Elrejti az h1-t */
    }

    .container {
        width: 100%; 
        padding: 0;
        overflow: visible; /* Ne vágja le a tartalmat */
    }

    
    .sticky-header {
        display: none; /* A fix fejléc elrejtése nyomtatáskor */
    }
    
    #imFooter a {
        color: #000;
        text-decoration: none;
    }
}

#print-button {
    background-color: transparent;
    border: none; 
    cursor: pointer; 
}
/* nyomtatás vége */

/* Év honlapja szövegek (p.evhonlapja) stílusa */
.evhonlapja {
  text-align: justify;
  hyphens: auto;
  font-weight: bold;
  font-size: 1.1rem;  
  margin-bottom: 20px;
  padding: 10px;
  background-color: #f0f0f0; 
  border-left: 5px solid #005baa; /* Bal oldali díszítés */
}

/* Sötét mód esetén */
body.dark-mode .evhonlapja {
  background-color: #333; 
  color: #ccc; 
  border-left: 5px solid #007bb5; 
}

/* H2 címek kiemelése */
h2 {
  font-size: 1.5rem;
  font-weight: bold;
  color: #005baa; 
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2); /* árnyék */
  margin-top: 20px;
  margin-bottom: 15px;
  padding: 5px;
}

/* Sötét mód esetén h2 címek */
body.dark-mode h2 {
  color: #87ceeb; 
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); /* árnyék */
}

/* Év honlapja szövegek linkjei */
.evhonlapja a {
  color: #005baa; 
  text-decoration: underline;
}

body.dark-mode .evhonlapja a {
  color: #87ceeb; 
  text-decoration: underline;
}

body.dark-mode .evhonlapja a:hover {
  color: #fff; 
}

/* H2 hover effektek */
h2:hover {
  color: #004b8a; 
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); 
}

body.dark-mode h2:hover {
  color: #b0e0e6; 
}
/* Kép kiemelése szövegekben */
.evhonlapja img {
  max-width: 100%; 
  height: auto; 
  margin: 20px 0; 
  transition: all 0.3s ease; 
  margin: 20px auto; 
  display: block; 
}

.evhonlapja2013 img {
 background-color: rgba(0, 0, 0, 0.8); /* Háttérként FEKETE átlátszó réteg */
}

body.dark-mode .evhonlapja2010 img {
 background-color: rgba(255, 255, 255, 0.9); /* Háttérként FEHÉR átlátszó réteg */
}

.evhonlapja img:hover {
  transform: scale(1.05); 
}

body.dark-mode .evhonlapja2013 img {
	background-color: transparent; /* Sötét módban eltűnik a háttér */
}

.evhonlapja2010 img {
	background-color: transparent; /* VILÁGOS módban eltűnik a háttér */
}