/* --- Fixált Modern Dark Elegance --- */
:root {
    --bg-dark: #0f172a;
    --card-bg: rgba(30, 41, 59, 0.85);
    --accent-gold: #c2a35d;
    --text-main: #f8fafc;
    --text-muted: #94a3b8;
    --glass-border: rgba(194, 163, 93, 0.2);
    --transition: all 0.3s ease;
}

body {font-family: 'Inter', sans-serif; background-color: var(--bg-dark); color: var(--text-main); margin: 0; min-height: 100vh; display: block; /* Visszaállítva flex-ről a stabilabb elrendezésért */}

/* Háttér animáció */
body::before {content: ""; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: radial-gradient(circle at 80% 20%, #1e3a8a 0%, transparent 40%),
	radial-gradient(circle at 20% 80%, #1e1b4b 0%, transparent 40%); opacity: 0.6;}

.container {background: var(--card-bg); backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px); padding: 2rem; border-radius: 1.5rem; border: 1px solid var(--glass-border); max-width: 1200px;
	margin: 2rem auto; box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);}

/* Címek */
.main-title {font-size: 2.2rem; font-weight: 300; letter-spacing: 4px; background: linear-gradient(to bottom, #ffffff, #94a3b8); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
	text-align: center; margin-bottom: 2rem;}

/* Form elemek */
label {display: block; font-size: 0.85rem; font-weight: 600; color: var(--accent-gold); margin-bottom: 0.5rem; text-transform: uppercase; letter-spacing: 1px;}

input[type="text"], 
input[type="number"], 
select {background: rgba(15, 23, 42, 0.7) !important; border: 1px solid var(--glass-border) !important; border-radius: 0.75rem !important; padding: 0.75rem !important; color: white !important;
	width: 100%; box-sizing: border-box; height: 45px;}

input:focus {border-color: var(--accent-gold) !important; outline: none; box-shadow: 0 0 10px rgba(194, 163, 93, 0.2);}

/* Gombok */
.search-button {background: linear-gradient(135deg, var(--accent-gold), #8e7745); color: white !important; border: none; border-radius: 50px; padding: 0.8rem 2rem; font-weight: 600;
	text-transform: uppercase; letter-spacing: 1px; cursor: pointer; transition: var(--transition); display: inline-flex; align-items: center; justify-content: center;}
.search-button:hover {transform: translateY(-2px); box-shadow: 0 5px 15px rgba(194, 163, 93, 0.4);}

/* Eredmény kártyák rácsa - FIX */
#resultsContainer {display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 1.5rem; margin-top: 2rem;}

.result-card {background: rgba(15, 23, 42, 0.6); border: 1px solid var(--glass-border); border-radius: 1.25rem; padding: 1.5rem; transition: var(--transition); display: flex; flex-direction: column;}
.result-card:hover {border-color: var(--accent-gold); background: rgba(30, 41, 59, 0.9);}

.card-title {font-size: 1.2rem; font-weight: 600; color: var(--accent-gold); margin-bottom: 1rem; border-bottom: 1px solid var(--glass-border); padding-bottom: 0.5rem;}

.info-item {font-size: 0.9rem; margin-bottom: 0.4rem; color: var(--text-main);}
.info-item strong {color: var(--text-muted); font-weight: 400; margin-right: 5px;}

/* Gombok elrendezése egy sorban */
.card-actions {display: flex; gap: 8px; margin-top: auto; /* A kártya aljára tolja */ padding-top: 1rem; justify-content: space-between;}

.action-btn {flex: 1; /* Egyenlő szélesség */ display: flex; flex-direction: column; /* Ikon felül, szöveg alul */ align-items: center; justify-content: center; gap: 5px; padding: 8px 4px;
	background: rgba(194, 163, 93, 0.1); border: 1px solid var(--glass-border); border-radius: 10px; color: var(--accent-gold) !important; text-decoration: none; font-size: 0.75rem;
	font-weight: 600; text-transform: uppercase; transition: var(--transition);}

.action-btn i {width: 18px; height: 18px;}
.action-btn:hover {background: var(--accent-gold); color: white !important; transform: translateY(-2px);}

/* Ha nincs kép, a maradék két gomb osztozik a helyen */
.card-actions > .action-btn {
    min-width: 0; /* Megakadályozza a túlcsordulást */
}

/* Modal stílusok */
.modal {display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0, 0, 0, 0.7); animation: fadeIn 0.3s forwards;}
.modal-content {background-color: #fff; margin: 5% auto; padding: 2.5rem; border-radius: 1rem; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3); position: relative; width: 90%; max-width: 900px; animation: slideIn 0.3s forwards;}
.modal-title {font-size: 2rem; font-weight: 600; margin-bottom: 1.5rem; color: #3a577d; text-align: center;}
.close-button {color: #aaa; float: right; font-size: 2.5rem; font-weight: bold; position: absolute; top: 10px; right: 20px; cursor: pointer; transition: color 0.2s;}

.close-button:hover,
.close-button:focus {color: #333; text-decoration: none;}

/* Animációk a modalhoz */
@keyframes fadeIn {
	from {opacity: 0;}
	to {opacity: 1;}
}

@keyframes slideIn {
	from {transform: translateY(-50px); opacity: 0;}
	to {transform: translateY(0); opacity: 1;}
}


/* Lapozó */
.pagination-btn {background: rgba(255, 255, 255, 0.1); border: 1px solid var(--glass-border); color: var(--text-main); padding: 0.5rem 1rem; border-radius: 0.5rem; cursor: pointer;}
.pagination-btn:disabled {opacity: 0.3; cursor: not-allowed;}
.pagination-btn:hover:not(:disabled) {background: var(--accent-gold);}

/* Reszponzivitás */
@media (max-width: 768px) {
    .container {margin: 1rem; padding: 1rem;}
    #resultsContainer {grid-template-columns: 1fr;}
	.modal-content {padding: 1.5rem;}
}