/* Töltsd le az Azonixot, tedd a szerverre, és hivatkozz rá */
@font-face {
    font-family: 'Azonix';
    src: url('/fonts/azonix.otf') format('opentype'); /* vagy .ttf/.woff a fájltól függően */
}

/* --- ALAPOK ÉS HÁTTÉR (Modern Mélykék) --- */
body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-color: #0b1121; color: #e2e8f0; margin: 0; padding: 10px 20px; display: flex; flex-direction: column; min-height: 100vh; box-sizing: border-box; }
.content-wrapper { flex: 1; display: flex; flex-direction: column; }

/* --- CÍMSOR ÉS FŐOLDAL LINK --- */
h1 { text-align: center; margin: 10px 0 5px 0; font-size: 1.8em; letter-spacing: 1px; }

.main-title-link {
    color: #f8fafc; /* Alapszín marad fehér */
    text-decoration: none; /* Nincs aláhúzás */
    transition: all 0.3s ease; /* Lágy átmenet a hoverhez */
    display: inline-block; /* Fontos a transformhoz */
}

/* A különleges nagybetűk stílusa */
.logo-a {
    font-family: 'Azonix', sans-serif;
    color: #3b82f6; /* A gombjaid kék színe */
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.4); 
}

.logo-v {
    font-family: 'Azonix', sans-serif;
    color: #000000; /* Fekete */
    /* FIGYELEM: A sötétkék/fekete háttered miatt a fekete 'V' betű szinte láthatatlan lesz. 
       Érdemes adni neki egy finom világos körvonalat (text-shadow) a kiemeléshez: */
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.4); 
}

.main-title-link:hover {
    color: #ffffff;
    text-shadow: 0 0 15px rgba(255, 255, 255, 0.6); /* Lágy, fehér ragyogás */
    transform: scale(1.03); /* Diszkrét, 3%-os nagyítás */
}

h2 { text-align: center; color: #f8fafc; }
p { text-align: center; margin-top: 0; }

.controls-container { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-bottom: 10px; }

/* --- PROFIL ÉS CHECKBOX --- */
.profile-row { position: relative; display: flex; justify-content: center; align-items: center; margin-bottom: 5px; min-height: 24px; }
.profile-row p { margin: 0; color: #94a3b8; }
.profile-row strong { color: #f8fafc; }

.dub-toggle-container { position: absolute; right: 10px; display: flex; align-items: center; gap: 8px; font-size: 0.85em; color: #94a3b8; cursor: pointer; transition: color 0.2s; user-select: none; }
.dub-toggle-container:hover { color: #38bdf8; }
.dub-toggle-container input[type="checkbox"] { cursor: pointer; width: 15px; height: 15px; margin: 0; accent-color: #3b82f6; }

/* --- GOMBOK --- */
.nav-group { display: flex; justify-content: center; align-items: center; gap: 15px; flex-wrap: wrap; }
.btn { padding: 10px 20px; text-decoration: none; border-radius: 6px; font-weight: bold; font-size: 0.9em; transition: all 0.2s ease; display: inline-block; border: none; cursor: pointer; }

.btn-nav { background-color: #3b82f6; color: #fff; box-shadow: 0 4px 6px rgba(0,0,0,0.2); }
.btn-nav:hover { background-color: #2563eb; transform: translateY(-1px); box-shadow: 0 6px 10px rgba(0,0,0,0.3); }
.btn-disabled { opacity: 0.4; pointer-events: none; cursor: default; box-shadow: none; }

.btn-tool { background-color: #1e293b; color: #cbd5e1; border: 1px solid #334155; }
.btn-tool:hover { background-color: #334155; color: #fff; transform: translateY(-1px); }

.week-display { font-size: 1.1em; font-weight: bold; padding: 0 10px; color: #f8fafc; }

/* --- NAPTÁR ÉS OSZLOPOK --- */
.calendar-container { flex: 1; display: flex; gap: 10px; overflow-x: auto; padding-top: 0px; margin-bottom: 10px; }
.day-column { flex: 1; min-width: 150px; background-color: #172033; border-radius: 8px; border-top: 4px solid #3b82f6; display: flex; flex-direction: column; box-shadow: 0 4px 6px rgba(0,0,0,0.3); }
.today-column { background-color: #1e293b !important; border-top: 4px solid #f43f5e !important; border-left: 1px solid #334155; border-right: 1px solid #334155; border-bottom: 1px solid #334155; }
.day-header { text-align: center; padding: 6px; font-weight: bold; background-color: rgba(0,0,0,0.25); border-bottom: 1px solid #23314a; line-height: 1.2; color: #e2e8f0; }

/* --- ANIME KÁRTYÁK --- */
.anime-card { background-color: #23314a; margin: 8px; border-radius: 6px; overflow: hidden; text-align: center; box-shadow: 0 4px 6px rgba(0,0,0,0.4); display: flex; flex-direction: column; height: 31.5vh; min-height: 250px; transition: transform 0.2s ease; border: 1px solid #2e405e; }
.anime-card:hover { transform: translateY(-2px); box-shadow: 0 6px 12px rgba(0,0,0,0.5); border-color: #475f85; }

.anime-card img { width: 100%; flex: 1; min-height: 0; object-fit: contain; background-color: #0c121e; }

/* Cím konténer: 12px oldalsó padding a szebb tördelésért */
.anime-title { font-size: 0.85em; font-weight: bold; padding: 0.5vh 25px; margin: 0; height: 4.5vh; min-height: 35px; display: flex; align-items: center; justify-content: center; line-height: 1.2; overflow: hidden; color: #f8fafc; text-align: center; }

/* Epizód konténer */
.ep-container { height: 6vh; min-height: 45px; display: flex; flex-direction: column; justify-content: center; gap: 4px; padding: 0; background-color: #1a2436; border-top: 1px solid #2e405e; }
.release-row { padding: 0; display: flex; justify-content: center; align-items: center; gap: 6px; }

.ep-text { font-size: 0.85em; font-weight: bold; color: #cbd5e1; }
.ep-finale { color: #f43f5e; }

/* Badges (SUB/DUB/EST/MAL/ONA) - Egységesített méretekkel */
.sub-badge, .dub-badge, .est-badge, .mal-badge, .ona-badge { font-size: 0.7em; padding: 2px 0; border-radius: 4px; font-weight: bold; letter-spacing: 0.5px; display: inline-block; min-width: 38px; text-align: center; }
.sub-badge { background-color: #f43f5e; color: #fff; }
.dub-badge { background-color: #38bdf8; color: #000; }
.est-badge { background-color: #8b5cf6; color: #fff; }
.mal-badge { background-color: #475f85; color: #fff; }
.ona-badge { background-color: #8b5cf6; color: #fff; }
.time-text { font-size: 0.9em; font-weight: bold; color: #f8fafc; }

.delayed-banner { background-color: #eab308; color: #000; font-size: 0.8em; font-weight: bold; text-align: center; text-transform: uppercase; padding: 4px 0; border-bottom: 2px solid #ca8a04; letter-spacing: 1px; }

/* --- FOOTER (Letisztult szöveg, sötétebb háttérszínnel) --- */
.site-footer { background-color: #0f172a; color: #94a3b8; padding: 12px 20px; display: flex; justify-content: space-between; align-items: center; font-size: 0.85em; flex-wrap: wrap; border-radius: 6px; margin-top: auto; border: 1px solid #23314a; font-weight: normal; }
.site-footer a { color: #94a3b8; text-decoration: none; margin-left: 15px; transition: color 0.2s; font-weight: normal; }
.site-footer a:hover { color: #38bdf8; text-decoration: underline; }
.footer-left { display: flex; flex-direction: column; gap: 5px; }
.footer-left span { color: #94a3b8; font-weight: normal; }

/* --- LINKEK ÉS MODÁLIS ABLAK --- */
.mal-link { color: #38bdf8; text-decoration: none; font-weight: bold; transition: color 0.2s ease; }
.mal-link:hover { color: #7dd3fc; text-decoration: underline; }

.version-link { cursor: pointer; transition: color 0.2s; color: #94a3b8; font-weight: bold !important; }
.version-link:hover { color: #38bdf8; }

.modal-overlay { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(11, 17, 33, 0.8); justify-content: center; align-items: center; backdrop-filter: blur(4px); }
.modal-content { background-color: #172033; color: #e2e8f0; width: 90%; max-width: 700px; max-height: 80vh; border-radius: 8px; position: relative; box-shadow: 0 10px 25px rgba(0,0,0,0.5); display: flex; flex-direction: column; overflow: hidden; border: 1px solid #23314a; }
.modal-header { display: flex; justify-content: space-between; align-items: center; padding: 15px 20px; background-color: #0b1121; border-bottom: 1px solid #23314a; }
.modal-header h2 { margin: 0; font-size: 1.4em; border: none; padding: 0; text-align: left; }
.close-btn { color: #94a3b8; font-size: 28px; font-weight: bold; cursor: pointer; transition: color 0.2s; line-height: 1; }
.close-btn:hover { color: #f43f5e; }
.modal-body { padding: 20px; overflow-y: auto; }
.modal-body h2 { text-align: left; border-bottom: 1px solid #23314a; padding-bottom: 10px; margin-top: 20px; font-size: 1.3em; color: #38bdf8; }
.modal-body h2:first-child { margin-top: 0; }
.modal-body ul { line-height: 1.7; font-size: 0.95em; padding-left: 20px; color: #cbd5e1; }

/* --- JOGI OLDALAK & SÜTI --- */
.policy-container { background-color: #172033; padding: 30px; border-radius: 8px; max-width: 800px; margin: 0 auto 40px auto; border-top: 4px solid #3b82f6; box-shadow: 0 4px 12px rgba(0,0,0,0.4); border-left: 1px solid #23314a; border-right: 1px solid #23314a; border-bottom: 1px solid #23314a; }
.policy-container h2 { text-align: left; border-bottom: 1px solid #23314a; padding-bottom: 10px; color: #38bdf8; margin-top: 30px; }
.policy-container p, .policy-container li { line-height: 1.7; color: #cbd5e1; text-align: left; font-size: 0.95em; }
.policy-container a { color: #38bdf8; text-decoration: none; }
.policy-container a:hover { text-decoration: underline; }

.cookie-banner { position: fixed; bottom: 0; left: 0; width: 100%; background-color: #0b1121; color: #cbd5e1; padding: 15px 20px; display: flex; justify-content: center; align-items: center; gap: 20px; box-shadow: 0 -4px 15px rgba(0,0,0,0.6); z-index: 2000; box-sizing: border-box; transform: translateY(100%); transition: transform 0.4s ease-in-out; flex-wrap: wrap; border-top: 1px solid #23314a; }
.cookie-banner.show { transform: translateY(0); }
.cookie-text a { color: #38bdf8; text-decoration: none; }
.cookie-text a:hover { text-decoration: underline; }
.cookie-btn { background-color: #1e293b; color: #f8fafc; border: 1px solid #334155; padding: 8px 20px; border-radius: 5px; cursor: pointer; font-weight: bold; font-size: 0.9em; transition: all 0.2s; }
.cookie-btn:hover { border-color: #38bdf8; color: #38bdf8; }