/* ============================================================
   HSC EXTRA CSS – Auth, Dashboard, Admin, Belső oldalak
   Illeszkedik a meglévő style.css-hez
   Színek: #ffc500 (arany), #A7864D (bronz), #1a1a2e (sötétkék)
   ============================================================ */

/* ============================================================
   NAV AUTH GOMBOK
   ============================================================ */

.nav-auth {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 12px;
    flex-wrap: wrap;
}

.nav-username {
    color: #ffc500;
    font-size: 0.85rem;
    padding: 6px 12px;
    border: 1px solid #A7864D;
    border-radius: 20px;
}

.nav-btn {
    display: inline-block;
    padding: 7px 16px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: bold;
    text-decoration: none;
    transition: all 0.3s ease;
    font-family: 'Oxanium', sans-serif;
}

.nav-btn-login {
    background: transparent;
    border: 1px solid #ffc500;
    color: #ffc500;
}
.nav-btn-login:hover {
    background: #ffc500;
    color: #000;
}

.nav-btn-register {
    background: #A7864D;
    border: 1px solid #A7864D;
    color: #fff;
}
.nav-btn-register:hover {
    background: #8d7040;
}

.nav-btn-logout {
    background: transparent;
    border: 1px solid #666;
    color: #ccc;
}
.nav-btn-logout:hover {
    border-color: #ff4444;
    color: #ff4444;
}

.nav-btn-admin {
    background: #ffc500;
    border: 1px solid #ffc500;
    color: #000;
}
.nav-btn-admin:hover {
    background: #e6b000;
}

/* ============================================================
   AUTH OLDALAK (login, register, elfelejtett jelszó)
   ============================================================ */

.auth-container {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 40px 20px;
}

.auth-box {
    background: rgba(20, 20, 40, 0.95);
    border: 1px solid #A7864D;
    border-radius: 16px;
    padding: 40px;
    width: 100%;
    max-width: 480px;
    box-shadow: 0 0 40px rgba(167, 134, 77, 0.2);
}

.auth-logo {
    text-align: center;
    margin-bottom: 30px;
}

.auth-logo img {
    width: 80px;
    margin-bottom: 10px;
}

.auth-logo h2 {
    color: #ffc500;
    font-size: 1.8rem;
    margin: 0;
}

.auth-subtitle {
    color: #888;
    font-size: 0.85rem;
    margin-top: 5px;
}

.auth-error {
    background: rgba(255, 50, 50, 0.15);
    border: 1px solid #ff4444;
    color: #ff8888;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 20px;
    font-size: 0.9rem;
}

.auth-success {
    background: rgba(50, 200, 50, 0.15);
    border: 1px solid #44bb44;
    color: #88dd88;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 20px;
    font-size: 0.9rem;
}

.auth-info {
    background: rgba(255, 197, 0, 0.1);
    border: 1px solid #ffc50066;
    color: #ffc500;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 20px;
    font-size: 0.85rem;
}

.form-group {
    margin-bottom: 18px;
    text-align: left;
}

.form-group label {
    display: block;
    color: #A7864D;
    font-size: 0.85rem;
    margin-bottom: 6px;
}

.form-group input,
.form-group textarea,
.form-group select {
    width: 100%;
    padding: 10px 14px;
    background: rgba(255,255,255,0.05);
    border: 1px solid #333;
    border-radius: 8px;
    color: #fff;
    font-family: 'Oxanium', sans-serif;
    font-size: 0.9rem;
    transition: border-color 0.3s ease;
}

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
    border-color: #A7864D;
    background: rgba(167, 134, 77, 0.08);
}

.form-group textarea {
    resize: vertical;
    min-height: 120px;
}

.auth-btn {
    width: 100%;
    padding: 12px;
    background: linear-gradient(135deg, #ffc500, #A7864D);
    color: #000;
    font-family: 'Oxanium', sans-serif;
    font-size: 1rem;
    font-weight: bold;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    display: block;
    text-align: center;
}

.auth-btn:hover {
    background: linear-gradient(135deg, #e6b000, #8d7040);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(255, 197, 0, 0.3);
}

.auth-btn-danger {
    background: linear-gradient(135deg, #ff4444, #aa2222) !important;
    color: #fff !important;
}
.auth-btn-danger:hover {
    background: linear-gradient(135deg, #cc2222, #881111) !important;
}

.auth-links {
    text-align: center;
    margin-top: 20px;
    font-size: 0.85rem;
    color: #888;
}

.auth-links a {
    color: #A7864D;
    text-decoration: none;
}
.auth-links a:hover {
    color: #ffc500;
    text-decoration: underline;
}

.auth-links span {
    margin: 0 8px;
}

/* ============================================================
   DASHBOARD
   ============================================================ */

.dashboard-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    text-align: left;
}

.dashboard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 35px;
    padding-bottom: 20px;
    border-bottom: 1px solid #A7864D44;
}

.dashboard-header h1 {
    color: #ffc500;
    font-size: 1.8rem;
    margin: 0;
}

.dashboard-role {
    color: #888;
    font-size: 0.9rem;
    margin-top: 5px;
}

.role-badge {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: bold;
}

.role-admin       { background: rgba(255,197,0,0.2);   color: #ffc500; border: 1px solid #ffc500; }
.role-tisztviselo { background: rgba(59,130,246,0.2);  color: #60a5fa; border: 1px solid #3b82f6; }
.role-tag         { background: rgba(167,134,77,0.2);  color: #A7864D; border: 1px solid #A7864D; }

/* Dashboard kártya grid */
.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 20px;
}

.dashboard-card {
    background: rgba(20, 20, 40, 0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    padding: 28px 20px;
    text-align: center;
    text-decoration: none;
    color: #fff;
    transition: all 0.3s ease;
    display: block;
}

.dashboard-card:hover {
    border-color: #A7864D;
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(167, 134, 77, 0.25);
    color: #fff;
    text-decoration: none;
}

.dashboard-card i {
    font-size: 2.5rem;
    color: #ffc500;
    margin-bottom: 15px;
    display: block;
}

.dashboard-card h3 {
    color: #ffc500;
    font-size: 1.1rem;
    margin-bottom: 8px;
}

.dashboard-card p {
    color: #888;
    font-size: 0.85rem;
    margin: 0;
}

.dashboard-card-special {
    border-color: #3b82f644;
}
.dashboard-card-special i { color: #60a5fa; }
.dashboard-card-special h3 { color: #60a5fa; }
.dashboard-card-special:hover { border-color: #3b82f6; box-shadow: 0 8px 25px rgba(59,130,246,0.2); }

.dashboard-card-admin {
    border-color: #ffc50044;
}
.dashboard-card-admin:hover { border-color: #ffc500; box-shadow: 0 8px 25px rgba(255,197,0,0.2); }

/* ============================================================
   PROFIL OLDAL
   ============================================================ */

.profil-card {
    background: rgba(20, 20, 40, 0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    padding: 28px;
    margin-bottom: 25px;
}

.profil-card h2 {
    color: #ffc500;
    font-size: 1.2rem;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #A7864D33;
}

.profil-card-danger {
    border-color: #ff444433;
}
.profil-card-danger h2 { color: #ff6666; }

.profil-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem;
}

.profil-table th {
    text-align: left;
    color: #A7864D;
    padding: 10px 15px;
    width: 160px;
    border-bottom: 1px solid #222;
}

.profil-table td {
    color: #ddd;
    padding: 10px 15px;
    border-bottom: 1px solid #222;
}

/* ============================================================
   ADMIN PANEL
   ============================================================ */

.admin-section {
    background: rgba(20, 20, 40, 0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    padding: 28px;
    margin-bottom: 30px;
}

.admin-section h2 {
    color: #ffc500;
    font-size: 1.2rem;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.admin-table-wrap {
    overflow-x: auto;
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
    min-width: 600px;
}

.admin-table thead th {
    background: rgba(167, 134, 77, 0.15);
    color: #A7864D;
    padding: 10px 12px;
    text-align: left;
    border-bottom: 1px solid #A7864D44;
    white-space: nowrap;
}

.admin-table tbody td {
    padding: 10px 12px;
    border-bottom: 1px solid #1a1a1a;
    color: #ccc;
    vertical-align: middle;
}

.admin-table tbody tr:hover td {
    background: rgba(255,255,255,0.03);
}

.admin-table .row-banned td {
    opacity: 0.5;
}

.admin-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.admin-select {
    background: #1a1a2e;
    border: 1px solid #333;
    color: #fff;
    padding: 5px 8px;
    border-radius: 6px;
    font-family: 'Oxanium', sans-serif;
    font-size: 0.8rem;
}

/* Kis akció gombok */
.btn-zold, .btn-piros, .btn-kek {
    padding: 5px 12px;
    border: none;
    border-radius: 6px;
    font-family: 'Oxanium', sans-serif;
    font-size: 0.78rem;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.btn-zold  { background: #166534; color: #86efac; }
.btn-zold:hover  { background: #15803d; }

.btn-piros { background: #7f1d1d; color: #fca5a5; }
.btn-piros:hover { background: #991b1b; }

.btn-kek   { background: #1e3a5f; color: #93c5fd; }
.btn-kek:hover   { background: #1d4ed8; }

/* Badge-ek */
.badge-piros  { background: rgba(255,50,50,0.2);   color: #ff8888; border: 1px solid #ff4444; padding: 2px 10px; border-radius: 20px; font-size: 0.8rem; }
.badge-zold   { background: rgba(50,200,50,0.2);   color: #88dd88; border: 1px solid #44bb44; padding: 2px 10px; border-radius: 20px; font-size: 0.8rem; }
.badge-kek    { background: rgba(59,130,246,0.2);  color: #93c5fd; border: 1px solid #3b82f6; padding: 2px 10px; border-radius: 20px; font-size: 0.8rem; }
.badge-szurke { background: rgba(150,150,150,0.2); color: #aaa;    border: 1px solid #666;    padding: 2px 10px; border-radius: 20px; font-size: 0.8rem; }

/* Státusz badge */
.status-badge { padding: 3px 10px; border-radius: 20px; font-size: 0.8rem; }
.status-active   { background: rgba(50,200,50,0.2);   color: #88dd88; }
.status-pending  { background: rgba(255,197,0,0.2);   color: #ffc500; }
.status-rejected { background: rgba(255,50,50,0.2);   color: #ff8888; }
.status-banned   { background: rgba(150,0,0,0.3);     color: #ff6666; }
.status-deleted  { background: rgba(100,100,100,0.2); color: #888;    }

/* ============================================================
   BELSŐ HÍREK
   ============================================================ */

.hirek-lista {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.belso-hir-card {
    background: rgba(20, 20, 40, 0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    padding: 24px;
    position: relative;
    transition: all 0.3s ease;
    text-align: left;
}

.belso-hir-card:hover {
    border-color: #A7864D;
    box-shadow: 0 4px 20px rgba(167,134,77,0.15);
}

.belso-hir-card.pinned {
    border-color: #ffc50066;
    background: rgba(255,197,0,0.05);
}

.belso-hir-card h2 {
    color: #ffc500;
    font-size: 1.2rem;
    margin-bottom: 10px;
}

.belso-hir-card h2 a {
    color: #ffc500;
    text-decoration: none;
}
.belso-hir-card h2 a:hover {
    color: #A7864D;
    text-decoration: underline;
}

.hir-meta {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    color: #666;
    font-size: 0.82rem;
    margin-bottom: 12px;
}

.hir-meta span { display: flex; align-items: center; gap: 5px; }

.hir-preview {
    color: #aaa;
    font-size: 0.9rem;
    line-height: 1.6;
    margin-bottom: 15px;
}

.hir-admin-actions {
    margin-top: 12px;
    display: flex;
    gap: 10px;
}

.pin-badge {
    display: inline-block;
    background: rgba(255,197,0,0.15);
    color: #ffc500;
    border: 1px solid #ffc50044;
    padding: 2px 10px;
    border-radius: 20px;
    font-size: 0.78rem;
    margin-bottom: 10px;
}

/* Teljes hír oldal */
.belso-hir-full {
    background: rgba(20, 20, 40, 0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    padding: 36px;
    text-align: left;
}

.belso-hir-full h1 {
    color: #ffc500;
    font-size: 1.8rem;
    margin-bottom: 15px;
}

.hir-tartalom {
    font-size: 1rem;
    line-height: 1.8;
    margin-top: 25px;
    color: #ccc;
}

.back-link {
    display: inline-block;
    color: #A7864D;
    text-decoration: none;
    margin-bottom: 20px;
    font-size: 0.9rem;
}
.back-link:hover { color: #ffc500; }

/* ============================================================
   ESEMÉNYNAPTÁR
   ============================================================ */

.esemenyek-lista {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.esemeny-card {
    background: rgba(20, 20, 40, 0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    padding: 24px;
    text-align: left;
    transition: border-color 0.3s ease;
}

.esemeny-card:hover { border-color: #A7864D; }

.esemeny-mult {
    opacity: 0.55;
}

.esemeny-header h2 {
    color: #ffc500;
    font-size: 1.2rem;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.esemeny-meta {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    color: #666;
    font-size: 0.82rem;
    margin-bottom: 15px;
}

.esemeny-meta span { display: flex; align-items: center; gap: 5px; }

/* ============================================================
   FLOTTA TÁBLÁZAT
   ============================================================ */

.flotta-stats {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 30px;
}

.stat-box {
    background: rgba(20, 20, 40, 0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    padding: 20px 14px;
    text-align: center;
    flex: 1;
    min-width: 100px;
}

.stat-szam {
    display: block;
    font-size: clamp(0.7rem, 1.5vw, 1.5rem);
    color: #ffc500;
    font-weight: bold;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.stat-label {
    display: block;
    font-size: 0.82rem;
    color: #888;
    margin-top: 5px;
}

.flotta-tag-szekció {
    margin-bottom: 30px;
}

.flotta-tag-cim {
    color: #A7864D;
    font-size: 1.1rem;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
}

/* ============================================================
   TAGOK LISTA
   ============================================================ */

.tagok-szuro {
    margin-bottom: 25px;
}

.tagok-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 18px;
}

.tag-card {
    background: rgba(20, 20, 40, 0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    gap: 15px;
    align-items: flex-start;
    transition: all 0.3s ease;
    text-align: left;
}

.tag-card:hover {
    border-color: #A7864D;
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(167,134,77,0.15);
}

.tag-avatar {
    width: 50px;
    height: 50px;
    background: rgba(167,134,77,0.15);
    border: 1px solid #A7864D;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.tag-avatar i {
    font-size: 1.4rem;
    color: #A7864D;
}

.tag-info {
    flex: 1;
    min-width: 0;
}

.tag-info h3 {
    color: #ffc500;
    font-size: 1rem;
    margin-bottom: 4px;
}

.tag-rsi {
    color: #888;
    font-size: 0.82rem;
    margin-bottom: 8px;
}

.tag-stats {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 8px;
    font-size: 0.78rem;
    color: #666;
}

.tag-stats span { display: flex; align-items: center; gap: 4px; }

/* ============================================================
   BODY CLASS – AUTH ÉS DASHBOARD HEADER HÁTTÉR
   ============================================================ */

body.page-auth header {
    background-image: url('/images/space_background.jpg');
}

body.page-dashboard header {
    background-image: url('/images/space_background.jpg');
}

/* ============================================================
   RESZPONZÍV
   ============================================================ */

@media (max-width: 768px) {
    .auth-box { padding: 25px 18px; }
    .dashboard-grid { grid-template-columns: repeat(2, 1fr); }
    .dashboard-header { flex-direction: column; align-items: flex-start; }
    .admin-table { font-size: 0.8rem; }
    .flotta-stats { gap: 10px; }
    .tagok-grid { grid-template-columns: 1fr; }
    .profil-table th { width: 110px; }
    .hir-meta { gap: 10px; }
    .esemeny-meta { gap: 10px; }
    .nav-auth { gap: 6px; }
    .nav-btn { padding: 5px 10px; font-size: 0.78rem; }
}

@media (max-width: 480px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .auth-btn { font-size: 0.9rem; }
}

/* ============================================================
   NOTIFICATION BADGE-EK
   ============================================================ */

.notif-badge {
    position: absolute;
    top: -8px;
    right: -12px;
    background: #ff4444;
    color: #fff;
    font-size: 0.7rem;
    font-weight: bold;
    min-width: 18px;
    height: 18px;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    font-family: sans-serif;
}

.notif-badge.notif-zold {
    background: #22c55e;
}

.notif-label {
    display: block;
    font-size: 0.78rem;
    color: #ffc500;
    margin-top: 6px;
    font-family: sans-serif;
}

/* ============================================================
   PROFIL TÁBLA - EMAIL TÖRDELÉS
   ============================================================ */

.profil-table td {
    word-break: break-all;
    overflow-wrap: anywhere;
    max-width: 200px;
}

/* ============================================================
   DASHBOARD / BELSŐ OLDALAK HEADER SÖTÉTÍTÉS
   ============================================================ */

body.page-dashboard header,
body.page-auth header {
    background-image: url('/images/space_background.jpg');
    background-size: cover;
    background-position: center;
}

body.page-dashboard header::before,
body.page-auth header::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1;
}

/* ============================================================
   FLOTTA KÁRTYÁS NÉZET
   ============================================================ */

.flotta-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
    margin-top: 10px;
}

.hajo-kartya {
    background: rgba(20, 20, 40, 0.95);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
}

.hajo-kartya:hover {
    border-color: #A7864D;
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(167,134,77,0.2);
}

.hajo-nem-elerheto {
    opacity: 0.6;
    filter: grayscale(30%);
}

.hajo-kep-wrap {
    position: relative;
    width: 100%;
    height: 160px;
    background: #0a0a1a;
    overflow: hidden;
}

.hajo-kep {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.hajo-kartya:hover .hajo-kep {
    transform: scale(1.05);
}

.hajo-kep-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    background: linear-gradient(135deg, #0a0a1a, #1a1a2e);
}

.hajo-nem-elerheto-felirat {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(255,50,50,0.85);
    color: #fff;
    font-size: 0.75rem;
    padding: 3px 10px;
    border-radius: 20px;
    font-weight: bold;
}

.hajo-info {
    padding: 15px;
    flex: 1;
}

.hajo-nev {
    color: #ffc500;
    font-size: 1.05rem;
    margin: 0 0 4px;
}

.hajo-gyarto {
    color: #A7864D;
    font-size: 0.82rem;
    margin: 0 0 10px;
}

.hajo-badges {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.hajo-tag {
    color: #888;
    font-size: 0.82rem;
    margin-bottom: 6px;
}

.hajo-notes {
    color: #666;
    font-size: 0.8rem;
    font-style: italic;
    margin: 6px 0 0;
    border-top: 1px solid #222;
    padding-top: 6px;
}

.hajo-actions {
    padding: 10px 15px;
    border-top: 1px solid #1a1a1a;
    display: flex;
    justify-content: flex-end;
}

/* Hajó kereső suggestions */
.ship-suggestions {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #1a1a2e;
    border: 1px solid #A7864D;
    border-radius: 0 0 8px 8px;
    z-index: 100;
    max-height: 300px;
    overflow-y: auto;
    display: none;
}

.ship-suggestion-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    cursor: pointer;
    border-bottom: 1px solid #222;
    transition: background 0.2s;
}

.ship-suggestion-item:hover {
    background: rgba(167,134,77,0.15);
}

.ship-suggestion-item img {
    width: 60px;
    height: 35px;
    object-fit: cover;
    border-radius: 4px;
    flex-shrink: 0;
}

.ship-suggestion-item strong {
    display: block;
    color: #fff;
    font-size: 0.9rem;
}

.ship-suggestion-item small {
    color: #888;
    font-size: 0.78rem;
}

/* Előnézet kártya */
.ship-preview-card {
    display: flex;
    gap: 15px;
    align-items: center;
    background: rgba(167,134,77,0.08);
    border: 1px solid #A7864D44;
    border-radius: 8px;
    padding: 12px;
    margin-top: 10px;
}

.ship-preview-info {
    flex: 1;
}

@media (max-width: 600px) {
    .flotta-grid {
        grid-template-columns: 1fr;
    }
    .ship-preview-card {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ============================================================
   CRAFTING OLDAL
   ============================================================ */

.crafting-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 30px;
    flex-wrap: wrap;
}

.crafting-header h1 {
    color: #ffc500;
    font-size: 1.8rem;
    margin: 0 0 8px;
}

.crafting-subtitle {
    color: #888;
    font-size: 0.9rem;
    max-width: 600px;
    line-height: 1.6;
    margin: 0;
}

.crafting-stats-mini {
    display: flex;
    gap: 15px;
    flex-shrink: 0;
}

.craft-stat {
    background: rgba(20,20,40,0.9);
    border: 1px solid #A7864D44;
    border-radius: 10px;
    padding: 12px 18px;
    text-align: center;
}

.craft-stat strong {
    display: block;
    color: #ffc500;
    font-size: 1.5rem;
}

.craft-stat span {
    color: #888;
    font-size: 0.78rem;
}

/* Szűrők */
.crafting-filters {
    background: rgba(20,20,40,0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 25px;
}

.filter-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.filter-search {
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(255,255,255,0.05);
    border: 1px solid #333;
    border-radius: 8px;
    padding: 8px 14px;
    flex: 1;
    min-width: 200px;
}

.filter-search i { color: #A7864D; }

.filter-search input {
    background: transparent;
    border: none;
    color: #fff;
    font-family: 'Oxanium', sans-serif;
    font-size: 0.9rem;
    width: 100%;
    outline: none;
}

.filter-results {
    color: #666;
    font-size: 0.82rem;
    margin: 10px 0 0;
}

/* Recept grid */
.crafting-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 18px;
}

.recipe-card {
    background: rgba(20,20,40,0.95);
    border: 1px solid #A7864D33;
    border-radius: 12px;
    padding: 20px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.recipe-card:hover {
    border-color: #A7864D;
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(167,134,77,0.2);
}

.recipe-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.recipe-icon { font-size: 1.8rem; }

.recipe-tier {
    padding: 2px 10px;
    border-radius: 20px;
    border: 1px solid;
    font-size: 0.78rem;
    font-weight: bold;
}

.recipe-name {
    color: #ffc500;
    font-size: 1rem;
    margin: 0;
}

.recipe-cat {
    color: #A7864D;
    font-size: 0.78rem;
    margin: 0;
}

.recipe-desc {
    color: #888;
    font-size: 0.82rem;
    line-height: 1.5;
    margin: 0;
    flex: 1;
}

.recipe-meta {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    font-size: 0.78rem;
    color: #666;
    border-top: 1px solid #1a1a1a;
    padding-top: 8px;
}

.recipe-meta span { display: flex; align-items: center; gap: 4px; }

.recipe-ingredients-preview {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.ing-tag {
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 0.72rem;
    white-space: nowrap;
}

.ing-raw     { background: rgba(134,239,172,0.1); color: #86efac; border: 1px solid #22c55e33; }
.ing-crafted { background: rgba(147,197,253,0.1); color: #93c5fd; border: 1px solid #3b82f633; }
.ing-more    { background: rgba(255,255,255,0.05); color: #666; border: 1px solid #333; }

.recipe-source {
    font-size: 0.75rem;
    color: #555;
    margin-top: 2px;
}

.crafting-empty {
    text-align: center;
    padding: 60px 20px;
    color: #666;
}

/* Modal */
.recipe-modal-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.85);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.recipe-modal-box {
    background: #0d0d1a;
    border: 1px solid #A7864D;
    border-radius: 16px;
    padding: 30px;
    max-width: 650px;
    width: 100%;
    max-height: 85vh;
    overflow-y: auto;
    position: relative;
}

.modal-close {
    position: absolute;
    top: 15px;
    right: 15px;
    background: rgba(255,255,255,0.1);
    border: none;
    color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 0.9rem;
}

.modal-close:hover { background: rgba(255,50,50,0.3); }

.modal-info-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin: 15px 0;
}

.modal-info-box {
    background: rgba(255,255,255,0.03);
    border: 1px solid #222;
    border-radius: 8px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.modal-info-box i    { color: #A7864D; font-size: 1.1rem; }
.modal-info-box span { color: #666; font-size: 0.75rem; }
.modal-info-box strong { color: #fff; font-size: 0.95rem; }

.modal-ingredients { display: flex; flex-direction: column; gap: 10px; }

.modal-ingredient {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 14px;
    border-radius: 8px;
    gap: 10px;
}

.ing-crafted-row { background: rgba(147,197,253,0.07); border: 1px solid #3b82f622; }
.ing-raw-row     { background: rgba(134,239,172,0.07); border: 1px solid #22c55e22; }

.ing-left  { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ing-right { display: flex; align-items: center; gap: 8px; flex-direction: column; align-items: flex-end; }
.ing-right small { color: #666; font-size: 0.75rem; }

.ing-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.dot-crafted { background: #93c5fd; }
.dot-raw     { background: #86efac; }

.ing-name { color: #fff; font-size: 0.9rem; }

.ing-badge-crafted { background: rgba(147,197,253,0.15); color: #93c5fd; padding: 2px 8px; border-radius: 10px; font-size: 0.72rem; }
.ing-badge-raw     { background: rgba(134,239,172,0.15); color: #86efac; padding: 2px 8px; border-radius: 10px; font-size: 0.72rem; }

/* Kalkulátor */
.calc-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 14px;
    border-radius: 8px;
    margin-bottom: 6px;
}

.calc-crafted { background: rgba(147,197,253,0.07); border: 1px solid #3b82f622; color: #93c5fd; }
.calc-raw     { background: rgba(134,239,172,0.07); border: 1px solid #22c55e22; color: #86efac; }
.calc-row strong { font-size: 1.1rem; }

@media (max-width: 600px) {
    .crafting-header { flex-direction: column; }
    .crafting-stats-mini { width: 100%; }
    .modal-info-grid { grid-template-columns: 1fr; }
    .crafting-grid { grid-template-columns: 1fr; }
}

/* Crafting lapozás */
.crafting-pagination {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #A7864D33;
}

.page-btn {
    padding: 8px 14px;
    background: rgba(20,20,40,0.9);
    border: 1px solid #A7864D44;
    border-radius: 8px;
    color: #A7864D;
    text-decoration: none;
    font-size: 0.85rem;
    transition: all 0.2s;
}

.page-btn:hover { border-color: #A7864D; color: #ffc500; }
.page-active { background: rgba(167,134,77,0.2); border-color: #A7864D; color: #ffc500; }
.page-info { color: #666; font-size: 0.8rem; margin-left: 10px; }

/* ============================================================
   CRAFTING - TERVEZŐ ÉS MINŐSÉG SZIMULÁTOR
   ============================================================ */

.planner-section {
    margin-top: 40px;
    background: rgba(20,20,40,0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    padding: 25px;
}

.planner-section h2 {
    color: #ffc500;
    font-size: 1.3rem;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.planner-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.planner-list { display: flex; flex-direction: column; gap: 8px; }

.planner-item {
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(255,255,255,0.03);
    border: 1px solid #222;
    border-radius: 8px;
    padding: 10px 12px;
}

.planner-item-info { flex: 1; }
.planner-item-name { display: block; color: #fff; font-size: 0.9rem; }
.planner-item-cat  { display: block; color: #666; font-size: 0.75rem; }
.planner-item-qty  { color: #ffc500; font-weight: bold; min-width: 30px; text-align: center; }

.planner-totals { background: rgba(0,0,0,0.2); border-radius: 8px; padding: 15px; }

/* Minőség szimulátor */
.quality-sim {
    margin-top: 20px;
    padding: 15px;
    background: rgba(255,197,0,0.03);
    border: 1px solid #ffc50022;
    border-radius: 8px;
}

.quality-slider-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.quality-label {
    min-width: 120px;
    color: #aaa;
    font-size: 0.82rem;
    flex-shrink: 0;
}

.quality-range {
    flex: 1;
    accent-color: #ffc500;
    cursor: pointer;
}

.quality-value {
    min-width: 35px;
    text-align: right;
    color: #ffc500;
    font-size: 0.82rem;
    font-weight: bold;
}

.quality-result {
    margin-top: 12px;
    padding: 10px 14px;
    background: rgba(255,197,0,0.08);
    border: 1px solid #ffc50033;
    border-radius: 8px;
    color: #ffc500;
    font-size: 0.9rem;
}

@media (max-width: 600px) {
    .planner-grid { grid-template-columns: 1fr; }
    .quality-label { min-width: 80px; }
}

/* ============================================================
   SVG CATEGORY ICONS
   ============================================================ */

.cat-icon-wrap {
    width: 48px;
    height: 48px;
    background: rgba(167,134,77,0.08);
    border: 1px solid #A7864D33;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6px;
    transition: all 0.3s;
}

.recipe-card:hover .cat-icon-wrap {
    background: rgba(167,134,77,0.18);
    border-color: #A7864D;
}

.cat-icon-svg {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: drop-shadow(0 0 4px rgba(255,197,0,0.3));
}

.owned-star {
    font-size: 1rem;
    filter: drop-shadow(0 0 4px rgba(255,197,0,0.6));
}

.source-available { color: #86efac; font-size: 0.78rem; }
.source-mission   { color: #fbbf24; font-size: 0.78rem; }

.recipe-tier {
    padding: 2px 8px;
    border-radius: 20px;
    border: 1px solid #3b82f6;
    background: #3b82f622;
    color: #60a5fa;
    font-size: 0.75rem;
    font-weight: bold;
}

/* Ingredient helyszínek */
.ing-location {
    font-size: 0.75rem;
    color: #60a5fa;
    padding: 2px 8px 2px 4px;
    background: rgba(59,130,246,0.08);
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
}

.ing-location i { color: #3b82f6; font-size: 0.7rem; }

.ing-mode {
    color: #666;
    font-size: 0.7rem;
    margin-left: 4px;
}

/* ============================================================
   SZÜRKE GOMB (jelenlét jelöletlen állapot)
   ============================================================ */

.btn-szurke {
    padding: 5px 12px;
    border: none;
    border-radius: 6px;
    font-family: 'Oxanium', sans-serif;
    font-size: 0.78rem;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.2s ease;
    background: #2a2a3e;
    color: #888;
}
.btn-szurke:hover { background: #333; color: #ccc; }

/* ============================================================
   ESEMÉNY RÉSZTVEVŐK LISTA
   ============================================================ */

.resztvevok-lista {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid #2a2a2a;
}

.resztvevok-lista h4 {
    color: #A7864D;
    font-size: 0.85rem;
    margin: 0 0 10px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.resztvevo-grid {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.resztvevo-item {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 6px 10px;
    background: rgba(255,255,255,0.02);
    border: 1px solid #1e1e2e;
    border-radius: 6px;
    font-size: 0.82rem;
}

.resztvevo-nev {
    color: #ccc;
    font-weight: bold;
}

/* ============================================================
   ORG STATISZTIKÁK OLDAL
   ============================================================ */

.stats-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 16px;
    margin-bottom: 35px;
}

.stats-charts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
    gap: 24px;
}

.stats-card {
    background: rgba(20, 20, 40, 0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    padding: 24px;
}

.stats-card h2 {
    color: #ffc500;
    font-size: 1rem;
    margin: 0 0 18px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.stat-bar-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.stat-bar-label {
    color: #aaa;
    font-size: 0.8rem;
    min-width: 110px;
    max-width: 110px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex-shrink: 0;
}

.stat-bar-wrap {
    flex: 1;
    background: rgba(255,255,255,0.05);
    border-radius: 4px;
    height: 14px;
    overflow: hidden;
}

.stat-bar {
    height: 100%;
    background: linear-gradient(90deg, #ffc500, #A7864D);
    border-radius: 4px;
    transition: width 0.5s ease;
    min-width: 4px;
}

.stat-bar-blue   { background: linear-gradient(90deg, #3b82f6, #60a5fa); }
.stat-bar-green  { background: linear-gradient(90deg, #22c55e, #86efac); }
.stat-bar-gold   { background: linear-gradient(90deg, #ffc500, #fbbf24); }
.stat-bar-purple { background: linear-gradient(90deg, #8b5cf6, #a78bfa); }

.stat-bar-val {
    color: #ffc500;
    font-size: 0.82rem;
    font-weight: bold;
    min-width: 24px;
    text-align: right;
    flex-shrink: 0;
}

/* ============================================================
   MOBIL JAVÍTÁSOK (kibővített)
   ============================================================ */

@media (max-width: 768px) {
    .stats-charts-grid  { grid-template-columns: 1fr; }
    .stats-summary-grid { grid-template-columns: repeat(3, 1fr); }
    .stat-bar-label     { min-width: 80px; max-width: 80px; font-size: 0.72rem; }
    .resztvevo-item     { flex-wrap: wrap; }
    .hajo-edit-form     { padding: 10px !important; }
    .esemeny-card       { padding: 16px; }
    .esemenyek-lista    { gap: 14px; }
    .planner-grid       { grid-template-columns: 1fr; }
    .flotta-szurok form { flex-direction: column; }
}

@media (max-width: 480px) {
    .stats-summary-grid  { grid-template-columns: repeat(2, 1fr); }
    .stat-box            { padding: 14px 10px; }
    .dashboard-header h1 { font-size: 1.4rem; }
    .profil-table th,
    .profil-table td     { padding: 8px 10px; font-size: 0.85rem; }
    .hajo-kartya         { font-size: 0.9rem; }
    .nav-auth            { gap: 4px; }
    .nav-btn             { padding: 4px 8px; font-size: 0.72rem; }
}

/* ============================================================
   Trade Napló
   ============================================================ */
.trade-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 20px;
}
.trade-card {
    background: #0d0d1a;
    border: 1px solid #1a1a2e;
    border-radius: 12px;
    overflow: hidden;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.trade-card:hover {
    border-color: #ffc50033;
    box-shadow: 0 4px 20px rgba(255,197,0,0.06);
}
.trade-kep img {
    width: 100%;
    max-height: 180px;
    object-fit: cover;
    display: block;
}
.trade-body { padding: 16px; }
.trade-header-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
}
.trade-commodity {
    margin: 0;
    font-size: 1.05rem;
    color: #fff;
}
.trade-profit {
    font-size: 1.1rem;
    font-weight: bold;
    white-space: nowrap;
    padding: 3px 10px;
    border-radius: 20px;
    font-family: 'Oxanium', monospace;
}
.profit-pozitiv { color: #4ade80; background: rgba(74,222,128,0.1); border: 1px solid #4ade8033; }
.profit-negativ { color: #f87171; background: rgba(248,113,113,0.1); border: 1px solid #f8717133; }
.profit-nulla   { color: #aaa;    background: rgba(170,170,170,0.1); border: 1px solid #aaa3; }

.trade-route {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,0.02);
    border: 1px solid #1a1a2e;
    border-radius: 8px;
    padding: 10px 12px;
    margin-bottom: 10px;
}
.trade-point { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.trade-point-label { font-size: 0.72rem; color: #555; text-transform: uppercase; letter-spacing: 0.05em; }
.trade-buy  .trade-point-label { color: #4ade8077; }
.trade-sell .trade-point-label { color: #60a5fa77; }
.trade-point-loc   { font-size: 0.82rem; color: #ccc; font-weight: 500; }
.trade-point-price { font-size: 0.78rem; color: #888; }
.trade-arrow { color: #444; font-size: 1.2rem; flex-shrink: 0; }

.trade-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    font-size: 0.78rem;
    color: #777;
    margin-bottom: 8px;
}
.trade-notes {
    font-size: 0.82rem;
    color: #666;
    font-style: italic;
    margin: 6px 0 0;
    padding-top: 8px;
    border-top: 1px solid #1a1a2e;
}

/* ============================================================
   Prices & Route Calculator
   ============================================================ */
.prices-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}
.prices-table th {
    padding: 10px 12px;
    background: #0d0d1a;
    color: #ffc500;
    border-bottom: 1px solid #1a1a2e;
    text-align: left;
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 1;
}
.prices-table td {
    padding: 9px 12px;
    border-bottom: 1px solid #0f0f1e;
    vertical-align: middle;
}
.prices-table tr:hover td { background: rgba(255,197,0,0.03); }

.route-top td { border-left: 3px solid #4ade80; }
.route-mid td { border-left: 3px solid #fbbf24; }
.route-low td { border-left: 3px solid #f87171; }

.route-profit-cell {
    position: relative;
    min-width: 160px;
    padding: 0 12px !important;
    overflow: hidden;
    white-space: nowrap;
}
.route-profit-bar {
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: var(--pct, 0%);
    background: linear-gradient(90deg, rgba(74,222,128,0.18), rgba(74,222,128,0.04));
    transition: width 0.4s ease;
}

/* ============================================================
   Prices statusbar + commodity detail
   ============================================================ */
.prices-statusbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 14px;
    background: rgba(74,222,128,0.05);
    border: 1px solid #4ade8022;
    border-radius: 8px;
    font-size: 0.82rem;
    color: #888;
    margin-bottom: 20px;
    flex-wrap: wrap;
    gap: 8px;
}

.commodity-detail-card {
    background: rgba(255,255,255,0.02);
    border: 1px solid #1a1a2e;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 16px;
}

.commodity-price-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 5px 8px;
    border-radius: 6px;
    margin-bottom: 3px;
    font-size: 0.82rem;
}
.commodity-price-row.buy  { background: rgba(74,222,128,0.04); }
.commodity-price-row.sell { background: rgba(96,165,250,0.04); }
.commodity-loc   { flex: 1; color: #aaa; }
.commodity-price { font-weight: bold; white-space: nowrap; }

/* ============================================================
   UEX-stílusú füles felület (prices.php)
   ============================================================ */
.uex-tabs {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    border-bottom: 2px solid #1a1a2e;
    margin-bottom: 0;
}
.uex-tab {
    background: transparent;
    border: 1px solid transparent;
    border-bottom: none;
    color: #888;
    padding: 11px 20px;
    font-family: inherit;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    border-radius: 8px 8px 0 0;
    transition: all 0.18s ease;
    margin-bottom: -2px;
}
.uex-tab:hover { color: #ccc; background: rgba(255,255,255,0.02); }
.uex-tab.active {
    color: #ffc500;
    background: #11111f;
    border-color: #1a1a2e;
    border-bottom: 2px solid #11111f;
}
.uex-tab i { margin-right: 6px; }

.uex-panel {
    display: none;
    background: #11111f;
    border: 1px solid #1a1a2e;
    border-top: none;
    border-radius: 0 0 12px 12px;
    padding: 20px;
    animation: uexFade 0.25s ease;
}
.uex-panel.active { display: block; }
@keyframes uexFade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.uex-toolbar {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: flex-end;
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid #1a1a2e;
}
.uex-field { display: flex; flex-direction: column; gap: 4px; }
.uex-field label { font-size: 0.74rem; color: #888; text-transform: uppercase; letter-spacing: 0.4px; }
.uex-field input,
.uex-field select {
    padding: 8px 12px;
    background: #0d0d1a;
    border: 1px solid #333;
    border-radius: 6px;
    color: #fff;
    font-family: inherit;
    font-size: 0.86rem;
    min-width: 90px;
}
.uex-field input:focus,
.uex-field select:focus { outline: none; border-color: #ffc500; }

.uex-empty {
    text-align: center;
    color: #555;
    padding: 30px 20px;
    font-size: 0.9rem;
}

/* Rendezhető oszlopfejlécek */
.uex-sortable th[data-sort] { cursor: pointer; user-select: none; position: relative; }
.uex-sortable th[data-sort]:hover { color: #fff; }
.uex-sortable th.num { text-align: right; }
.uex-sortable td.num { text-align: right; font-variant-numeric: tabular-nums; }
.uex-sortable th[data-sort]::after { content: '\2195'; opacity: 0.25; margin-left: 5px; font-size: 0.8em; }
.uex-sortable th.sort-active.sort-asc::after  { content: '\2191'; opacity: 1; color: #ffc500; }
.uex-sortable th.sort-active.sort-desc::after { content: '\2193'; opacity: 1; color: #ffc500; }

/* Árukereső kibontható sor */
.comm-main { cursor: pointer; }
.comm-detail td { background: #0a0a14; padding: 14px 16px !important; }
.comm-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }

@media (max-width: 768px) {
    .trade-grid              { grid-template-columns: 1fr; }
    .prices-table th,
    .prices-table td         { padding: 7px 8px; font-size: 0.78rem; }
    .trade-route             { flex-direction: column; }
    .trade-arrow             { transform: rotate(90deg); }
    .commodity-detail-card > div { grid-template-columns: 1fr !important; }
    .uex-panel               { padding: 14px; }
    .uex-tab                 { padding: 9px 13px; font-size: 0.8rem; }
    .comm-detail-grid        { grid-template-columns: 1fr; gap: 14px; }
}

/* ============================================================
   Naptár (naptar.php)
   ============================================================ */
.naptar-layout {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 20px;
    align-items: start;
}

/* Sidebar – közelgő események */
.naptar-sidebar {
    background: #11111f;
    border: 1px solid #1a1a2e;
    border-radius: 12px;
    padding: 18px;
    position: sticky;
    top: 80px;
}
.naptar-sidebar-title {
    color: #ffc500;
    font-size: 0.88rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 14px;
}
.naptar-upcoming-item {
    padding: 10px 12px;
    border-left: 3px solid #ffc500;
    background: rgba(255,255,255,0.02);
    border-radius: 0 8px 8px 0;
    margin-bottom: 8px;
    cursor: pointer;
    transition: background 0.15s;
}
.naptar-upcoming-item:hover { background: rgba(255,255,255,0.05); }

/* Navigáció */
.naptar-nav {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
}
.naptar-nav-title {
    font-family: 'Oxanium', monospace;
    font-size: 1.1rem;
    color: #ffc500;
    font-weight: 700;
    flex: 1;
    text-align: center;
}
.naptar-nav-btn {
    background: #1a1a2e;
    border: 1px solid #2a2a3e;
    color: #aaa;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.15s;
    font-size: 0.85rem;
}
.naptar-nav-btn:hover { background: #2a2a3e; color: #ffc500; }

/* Grid */
.naptar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 3px;
}
.naptar-dayname {
    text-align: center;
    font-size: 0.72rem;
    font-weight: 700;
    color: #555;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 6px 2px;
}
.naptar-cell {
    min-height: 88px;
    background: #0d0d1a;
    border: 1px solid #12121f;
    border-radius: 6px;
    padding: 5px 5px 4px;
    position: relative;
    transition: border-color 0.15s;
    overflow: hidden;
}
.naptar-cell:hover { border-color: #2a2a3e; }
.naptar-cell-empty { background: transparent; border-color: transparent; }
.naptar-today { border-color: #ffc500 !important; background: rgba(255,197,0,0.04); }
.naptar-past  { opacity: 0.5; }
.naptar-day-num {
    display: block;
    font-size: 0.76rem;
    font-weight: 700;
    color: #555;
    margin-bottom: 4px;
    text-align: right;
    line-height: 1;
}
.naptar-today .naptar-day-num {
    color: #ffc500;
}

/* Esemény pill */
.naptar-event {
    display: block;
    background: var(--ev-bg);
    border-left: 2px solid var(--ev-color);
    border-radius: 0 4px 4px 0;
    padding: 2px 5px;
    margin-bottom: 2px;
    cursor: pointer;
    transition: opacity 0.15s;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.naptar-event:hover { opacity: 0.8; }
.naptar-event-signed { outline: 1px solid var(--ev-color); outline-offset: 0px; }
.naptar-event-time {
    font-size: 0.62rem;
    color: var(--ev-color);
    font-weight: 700;
    margin-right: 4px;
    font-family: 'Oxanium', monospace;
}
.naptar-event-title {
    font-size: 0.7rem;
    color: #ccc;
}

/* Detail panel */
.naptar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 1000;
    backdrop-filter: blur(2px);
}
.naptar-overlay.active { display: block; }
.naptar-detail-panel {
    position: fixed;
    top: 0;
    right: -420px;
    width: 400px;
    max-width: 100vw;
    height: 100vh;
    background: #0d0d1a;
    border-left: 1px solid #1a1a2e;
    z-index: 1001;
    padding: 28px 24px;
    overflow-y: auto;
    transition: right 0.3s ease;
}
.naptar-detail-panel.active { right: 0; }
.naptar-detail-close {
    position: absolute;
    top: 16px;
    right: 16px;
    background: transparent;
    border: 1px solid #2a2a3e;
    color: #888;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.85rem;
    transition: all 0.15s;
}
.naptar-detail-close:hover { background: #1a1a2e; color: #fff; }

@media (max-width: 900px) {
    .naptar-layout { grid-template-columns: 1fr; }
    .naptar-sidebar { position: static; }
    .naptar-cell    { min-height: 56px; }
    .naptar-event-time { display: none; }
    .naptar-detail-panel { width: 100vw; right: -100vw; }
}

/* ═══════════════════════════════════════════════════════════
   CSAPAT TEVÉKENYSÉG – YouTube lejátszó
═══════════════════════════════════════════════════════════ */
.ctev-yt-wrap {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 18px;
    margin-top: 20px;
}
.ctev-yt-frame-box {
    position: relative;
    padding-top: 56.25%;
    background: #000;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(0,0,0,.6);
}
.ctev-yt-frame-box iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
.ctev-yt-active-info { padding: 12px 2px 0; }
.ctev-yt-active-info h3 { color: #ffc500; margin: 0 0 5px; font-size: 1.05rem; }
.ctev-yt-active-info p  { color: #999; font-size: 0.88rem; margin: 0; line-height: 1.5; }

.ctev-yt-playlist {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 380px;
    overflow-y: auto;
    padding-right: 4px;
}
.ctev-yt-playlist::-webkit-scrollbar { width: 4px; }
.ctev-yt-playlist::-webkit-scrollbar-track { background: transparent; }
.ctev-yt-playlist::-webkit-scrollbar-thumb { background: #333; border-radius: 4px; }

.ctev-yt-item {
    display: flex;
    gap: 10px;
    padding: 8px;
    border-radius: 8px;
    cursor: pointer;
    border: 1px solid transparent;
    background: rgba(255,255,255,0.03);
    transition: background .2s, border-color .2s;
}
.ctev-yt-item:hover   { background: rgba(255,197,0,0.07); }
.ctev-yt-item.active  { border-color: #ffc500; background: rgba(255,197,0,0.1); }

.ctev-yt-thumb {
    position: relative;
    flex-shrink: 0;
    width: 108px;
    height: 61px;
    border-radius: 6px;
    overflow: hidden;
    background: #000;
}
.ctev-yt-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.ctev-yt-play {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    background: rgba(0,0,0,0.45);
    color: #fff;
    transition: background .2s;
}
.ctev-yt-item.active .ctev-yt-play,
.ctev-yt-item:hover  .ctev-yt-play { background: rgba(255,197,0,0.35); }

.ctev-yt-item-text { flex: 1; min-width: 0; padding-top: 2px; }
.ctev-yt-item-text strong {
    display: block;
    font-size: 0.83rem;
    color: #eee;
    margin-bottom: 4px;
    line-height: 1.3;
}
.ctev-yt-item-text span {
    font-size: 0.75rem;
    color: #777;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (max-width: 900px) {
    .ctev-yt-wrap { grid-template-columns: 1fr; }
    .ctev-yt-playlist {
        flex-direction: row;
        max-height: none;
        overflow-x: auto;
        overflow-y: visible;
        padding-bottom: 4px;
    }
    .ctev-yt-item { min-width: 220px; flex-direction: column; }
    .ctev-yt-thumb { width: 100%; height: 110px; }
}

/* ═══════════════════════════════════════════════════════════
   CSAPAT TEVÉKENYSÉG – Galéria + Lightbox
═══════════════════════════════════════════════════════════ */
.ctev-gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 220px;
    gap: 8px;
    margin-top: 18px;
}
.ctev-gallery .ctev-gal-item:first-child {
    grid-column: span 2;
    grid-row: span 2;
}
.ctev-gal-item {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    cursor: pointer;
    background: #0a0a14;
}
.ctev-gal-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .45s ease;
}
.ctev-gal-item:hover img { transform: scale(1.06); }

.ctev-gal-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,.8) 0%, transparent 55%);
    opacity: 0;
    transition: opacity .3s;
    display: flex;
    align-items: flex-end;
    padding: 14px;
}
.ctev-gal-item:hover .ctev-gal-overlay { opacity: 1; }
.ctev-gal-caption { color: #fff; font-size: 0.88rem; font-weight: 600; line-height: 1.3; }

.ctev-gal-zoom {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 34px;
    height: 34px;
    background: rgba(255,197,0,.9);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
    opacity: 0;
    transition: opacity .3s;
    color: #000;
}
.ctev-gal-item:hover .ctev-gal-zoom { opacity: 1; }

@media (max-width: 700px) {
    .ctev-gallery {
        grid-template-columns: 1fr 1fr;
        grid-auto-rows: 160px;
    }
    .ctev-gallery .ctev-gal-item:first-child {
        grid-column: span 2;
        grid-row: span 1;
    }
}

/* Lightbox */
.ctev-lb {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0,0,0,.95);
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.ctev-lb.open { display: flex; }

.ctev-lb-inner {
    max-width: min(92vw, 1100px);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.ctev-lb-inner img {
    max-width: 100%;
    max-height: 78vh;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 8px 40px rgba(0,0,0,.8);
}
#ctev-lb-caption {
    color: #eee;
    font-size: 0.92rem;
    margin: 14px 0 4px;
    text-align: center;
}
#ctev-lb-counter { color: #666; font-size: 0.78rem; }

.ctev-lb-close {
    position: fixed;
    top: 18px;
    right: 22px;
    font-size: 1.8rem;
    line-height: 1;
    color: #ccc;
    background: rgba(255,255,255,0.08);
    border: none;
    cursor: pointer;
    padding: 4px 12px;
    border-radius: 6px;
    transition: color .2s, background .2s;
}
.ctev-lb-close:hover { color: #ffc500; background: rgba(255,255,255,0.15); }

.ctev-lb-nav {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    font-size: 3rem;
    line-height: 1;
    color: rgba(255,255,255,0.6);
    background: rgba(255,255,255,0.05);
    border: none;
    cursor: pointer;
    padding: 8px 18px;
    border-radius: 8px;
    transition: color .2s, background .2s;
}
.ctev-lb-nav:hover { color: #ffc500; background: rgba(255,197,0,0.15); }
.ctev-lb-prev { left: 12px; }
.ctev-lb-next { right: 12px; }

@media (max-width: 600px) {
    .ctev-lb-nav { font-size: 2rem; padding: 6px 12px; }
}

/* ═══════════════════════════════════════════════════════════
   CSAPAT TEVÉKENYSÉG – Upload panel + galéria admin
═══════════════════════════════════════════════════════════ */
.ctev-upload-panel {
    background: rgba(255,197,0,0.05);
    border: 1px solid rgba(255,197,0,0.2);
    border-radius: 12px;
    padding: 22px 24px;
    margin-bottom: 20px;
}
.ctev-upload-panel h3 {
    color: #ffc500;
    margin: 0 0 16px;
    font-size: 1rem;
}

.ctev-gal-del-form {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 10;
    margin: 0;
}
.ctev-gal-del-btn {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(220,38,38,0.85);
    color: #fff;
    border: none;
    cursor: pointer;
    font-size: 0.8rem;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity .2s, background .2s;
    backdrop-filter: blur(4px);
}
.ctev-gal-item:hover .ctev-gal-del-btn { opacity: 1; }
.ctev-gal-del-btn:hover { background: rgb(220,38,38); }

/* ═══════════════════════════════════════════════════════════
   SCROLL ANIMÁCIÓK
═══════════════════════════════════════════════════════════ */
[data-anim] {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .65s ease, transform .65s ease;
}
[data-anim].anim-in {
    opacity: 1;
    transform: none;
}

/* ═══════════════════════════════════════════════════════════
   NETFLIX VIDEÓ SZEKCIÓ
═══════════════════════════════════════════════════════════ */
.nf-hero {
    position: relative;
    width: 100%;
    border-radius: 14px;
    overflow: hidden;
    background: #000;
    aspect-ratio: 16/9;
    max-height: 540px;
    margin-bottom: 12px;
    box-shadow: 0 8px 40px rgba(0,0,0,.7);
}

/* Thumbnail háttér */
.nf-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.nf-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.nf-bg-b {
    z-index: 1;
    pointer-events: none;
}
@keyframes nfFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.nf-fade-in { animation: nfFadeIn .5s ease forwards; }

/* Gradient overlay */
.nf-grad {
    position: absolute;
    inset: 0;
    z-index: 2;
    background:
        linear-gradient(to top,  rgba(4,4,15,.95) 0%, rgba(4,4,15,.3) 45%, transparent 70%),
        linear-gradient(to right, rgba(4,4,15,.6) 0%, transparent 55%);
}

/* Iframe */
.nf-iframe-wrap {
    position: absolute;
    inset: 0;
    z-index: 5;
    opacity: 0;
    pointer-events: none;
    transition: opacity .4s;
}
.nf-iframe-wrap.visible { opacity: 1; pointer-events: auto; }
.nf-iframe-wrap iframe  { width: 100%; height: 100%; border: 0; }

/* Lejátszás gomb */
.nf-play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 4;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: rgba(255,197,0,.18);
    border: 2px solid rgba(255,197,0,.7);
    backdrop-filter: blur(6px);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .25s, transform .25s, border-color .25s;
}
.nf-play-btn:hover {
    background: rgba(255,197,0,.38);
    border-color: #ffc500;
    transform: translate(-50%, -50%) scale(1.1);
}
.nf-play-icon {
    color: #fff;
    font-size: 1.8rem;
    margin-left: 5px;
    line-height: 1;
}

/* Infó szöveg */
.nf-hero-info {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 3;
    padding: 28px 28px 24px;
}
.nf-badge {
    display: inline-block;
    background: #ffc500;
    color: #000;
    font-size: .75rem;
    font-weight: 700;
    padding: 2px 9px;
    border-radius: 4px;
    margin-bottom: 8px;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.nf-hero-info h3 {
    color: #fff;
    font-size: 1.5rem;
    margin: 0 0 6px;
    text-shadow: 0 2px 8px rgba(0,0,0,.8);
}
.nf-hero-info p {
    color: rgba(255,255,255,.75);
    font-size: .88rem;
    margin: 0;
    max-width: 520px;
    line-height: 1.5;
    text-shadow: 0 1px 4px rgba(0,0,0,.8);
}

/* Kártya sor */
.nf-row-wrap {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
}
.nf-row {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 6px 2px 10px;
    -ms-overflow-style: none;
    scrollbar-width: none;
    flex: 1;
}
.nf-row::-webkit-scrollbar { display: none; }

.nf-card {
    flex-shrink: 0;
    width: 210px;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    scroll-snap-align: start;
    border: 2px solid transparent;
    transition: border-color .2s, transform .2s;
    background: #0a0a18;
}
.nf-card:hover   { transform: translateY(-4px); }
.nf-card.active  { border-color: #ffc500; }

.nf-card-thumb {
    position: relative;
    aspect-ratio: 16/9;
    overflow: hidden;
    background: #000;
}
.nf-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
}
.nf-card:hover .nf-card-thumb img { transform: scale(1.07); }

.nf-card-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.4);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity .25s;
}
.nf-card:hover .nf-card-overlay  { opacity: 1; }
.nf-card.active .nf-card-overlay { opacity: 1; background: rgba(255,197,0,.2); }

.nf-card-play {
    font-size: 1.6rem;
    color: #fff;
    filter: drop-shadow(0 2px 6px rgba(0,0,0,.8));
}

.nf-card-info {
    padding: 8px 10px 10px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.nf-card-info strong {
    font-size: .82rem;
    color: #eee;
    line-height: 1.3;
}

/* Nyilak */
.nf-arrow {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.12);
    color: #ccc;
    font-size: 1.6rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .2s, color .2s;
}
.nf-arrow:hover { background: rgba(255,197,0,.2); color: #ffc500; border-color: #ffc500; }

/* Mobil */
@media (max-width: 700px) {
    .nf-hero { aspect-ratio: 4/3; max-height: 320px; }
    .nf-hero-info h3 { font-size: 1.1rem; }
    .nf-play-btn { width: 54px; height: 54px; }
    .nf-play-icon { font-size: 1.3rem; }
    .nf-card { width: 160px; }
}

/* ═══════════════════════════════════════════════════════════
   VIDEÓ KÁRTYÁK
═══════════════════════════════════════════════════════════ */
.vid-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-top: 10px;
}

.vid-card {
    background: #0a0a18;
    border: 1px solid #1a1a2e;
    border-radius: 12px;
    overflow: hidden;
    cursor: pointer;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.vid-card:hover {
    transform: translateY(-5px);
    border-color: #A7864D;
    box-shadow: 0 10px 30px rgba(0,0,0,.5);
}

.vid-thumb {
    position: relative;
    aspect-ratio: 16/9;
    overflow: hidden;
    background: #000;
}
.vid-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .4s ease;
}
.vid-card:hover .vid-thumb img { transform: scale(1.06); }

.vid-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,.6) 0%, transparent 60%);
    transition: opacity .25s;
}

.vid-play-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(255,197,0,.2);
    border: 2px solid rgba(255,197,0,.7);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .25s, border-color .25s, transform .25s;
    font-size: 1.3rem;
    color: #fff;
    padding-left: 4px;
}
.vid-card:hover .vid-play-circle {
    background: rgba(255,197,0,.45);
    border-color: #ffc500;
    transform: translate(-50%, -50%) scale(1.1);
}

.vid-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background: #ffc500;
    color: #000;
    font-size: .72rem;
    font-weight: 700;
    padding: 3px 9px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.vid-info {
    padding: 14px 16px 16px;
}
.vid-info h3 {
    color: #ffc500;
    font-size: .95rem;
    margin: 0 0 6px;
}
.vid-info p {
    color: #888;
    font-size: .82rem;
    margin: 0;
    line-height: 1.5;
}

@media (max-width: 800px) {
    .vid-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px) {
    .vid-grid { grid-template-columns: 1fr; }
}

/* ── Videó modal ── */
.vid-modal-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9998;
    background: rgba(0,0,0,.92);
    align-items: center;
    justify-content: center;
    padding: 20px;
    backdrop-filter: blur(6px);
}
.vid-modal-backdrop.open { display: flex; }

.vid-modal-box {
    position: relative;
    width: 100%;
    max-width: 860px;
    background: #0d0d1a;
    border: 1px solid #A7864D;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,.9);
    animation: vidModalIn .25s ease;
}
@keyframes vidModalIn {
    from { opacity: 0; transform: scale(.95); }
    to   { opacity: 1; transform: none; }
}

.vid-modal-close {
    position: absolute;
    top: 12px;
    right: 14px;
    z-index: 2;
    background: rgba(0,0,0,.6);
    border: 1px solid rgba(255,255,255,.15);
    color: #ccc;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .2s, color .2s;
}
.vid-modal-close:hover { background: rgba(220,38,38,.6); color: #fff; border-color: transparent; }

.vid-modal-frame {
    position: relative;
    aspect-ratio: 16/9;
    background: #000;
}
.vid-modal-frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.vid-modal-info {
    padding: 16px 20px 20px;
}
.vid-modal-info .nf-badge {
    margin-bottom: 8px;
}
.vid-modal-info h3 {
    color: #fff;
    font-size: 1.1rem;
    margin: 0 0 6px;
}
.vid-modal-info p {
    color: #aaa;
    font-size: .88rem;
    margin: 0;
    line-height: 1.55;
}

@media (max-width: 600px) {
    .vid-modal-info { padding: 12px 14px 16px; }
    .vid-modal-info h3 { font-size: .95rem; }
}

/* ═══════════════════════════════════════════════════════════
   3D COVERFLOW GALÉRIA
═══════════════════════════════════════════════════════════ */
.cf-scene {
    perspective: 1400px;
    perspective-origin: 50% 40%;
    width: 100%;
    overflow: hidden;
    padding: 30px 0 20px;
    position: relative;
}

.cf-track {
    position: relative;
    height: 320px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cf-item {
    position: absolute;
    width: 52%;
    max-width: 520px;
    aspect-ratio: 16/10;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    will-change: transform, opacity;
    transition: transform .55s cubic-bezier(.25,.46,.45,.94),
                opacity  .55s ease;
    backface-visibility: hidden;
    box-shadow: 0 8px 30px rgba(0,0,0,.7);
    border: 2px solid transparent;
}
.cf-item.cf-active {
    border-color: rgba(255,197,0,.5);
    box-shadow: 0 12px 50px rgba(0,0,0,.8), 0 0 30px rgba(255,197,0,.1);
}
.cf-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    pointer-events: none;
    user-select: none;
}

/* Tükörfény hatás */
.cf-item-shine {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        135deg,
        rgba(255,255,255,.08) 0%,
        transparent 50%,
        rgba(0,0,0,.15) 100%
    );
    pointer-events: none;
    border-radius: inherit;
}
.cf-item.cf-active .cf-item-shine {
    background: linear-gradient(
        135deg,
        rgba(255,255,255,.14) 0%,
        transparent 45%,
        rgba(0,0,0,.1) 100%
    );
}

/* Alsó sáv – nyilak, caption, pontok */
.cf-bottom {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 12px;
    padding: 0 10px;
}

.cf-center {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.cf-caption {
    color: #ccc;
    font-size: .88rem;
    text-align: center;
    min-height: 1.4em;
    margin: 0;
    line-height: 1.4;
    transition: opacity .3s;
}

.cf-nav-btn {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.12);
    color: #ccc;
    font-size: 2rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .2s, color .2s, border-color .2s;
    padding-bottom: 2px;
}
.cf-nav-btn:hover {
    background: rgba(255,197,0,.2);
    color: #ffc500;
    border-color: rgba(255,197,0,.5);
}

.cf-dots {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: center;
}

.cf-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    border: none;
    background: rgba(255,255,255,.2);
    cursor: pointer;
    padding: 0;
    transition: background .25s, transform .25s;
}
.cf-dot.active {
    background: #ffc500;
    transform: scale(1.35);
}
.cf-dot:hover:not(.active) { background: rgba(255,255,255,.45); }

/* Delete gomb a cf-item-en belül */
.cf-item .ctev-gal-del-form { z-index: 20; }

@media (max-width: 768px) {
    .cf-track    { height: 220px; }
    .cf-item     { width: 72%; }
    .cf-nav-btn  { width: 36px; height: 36px; font-size: 1.6rem; }
}
@media (max-width: 480px) {
    .cf-track { height: 180px; }
    .cf-item  { width: 85%; }
}

/* ============================================================
   MARKET
   ============================================================ */

.market-layout {
    display: flex;
    gap: 24px;
    align-items: flex-start;
}

.market-filters {
    width: 230px;
    flex-shrink: 0;
    background: rgba(20, 20, 40, 0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    padding: 18px;
    position: sticky;
    top: 20px;
}

.market-filters h3 {
    color: #A7864D;
    font-size: 0.8rem;
    margin-bottom: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.market-filters .form-group { margin-bottom: 12px; }

.market-filters label {
    color: #888;
    font-size: 0.76rem;
    margin-bottom: 4px;
    display: block;
}

.market-filters select,
.market-filters input[type="text"],
.market-filters input[type="number"] {
    width: 100%;
    padding: 6px 9px;
    background: rgba(255,255,255,0.05);
    border: 1px solid #333;
    border-radius: 6px;
    color: #fff;
    font-family: 'Oxanium', sans-serif;
    font-size: 0.78rem;
    box-sizing: border-box;
}

.market-main { flex: 1; min-width: 0; }

.market-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
    gap: 16px;
}

.market-card {
    background: rgba(20, 20, 40, 0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    overflow: hidden;
    text-decoration: none;
    color: #fff;
    display: flex;
    flex-direction: column;
    transition: all 0.3s ease;
    position: relative;
}

.market-card:hover {
    border-color: #A7864D;
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(167,134,77,0.2);
    color: #fff;
    text-decoration: none;
}

.market-card-kuldetes { border-color: #3b82f644; }
.market-card-kuldetes:hover { border-color: #3b82f6; box-shadow: 0 6px 20px rgba(59,130,246,0.2); }
.market-card-vetel { border-color: #10b98144; }
.market-card-vetel:hover { border-color: #10b981; box-shadow: 0 6px 20px rgba(16,185,129,0.2); }

.market-card-img {
    width: 100%;
    height: 140px;
    object-fit: cover;
}

.market-card-body {
    padding: 14px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.market-card-title {
    color: #ffc500;
    font-size: 0.9rem;
    font-weight: bold;
    line-height: 1.4;
    margin: 0;
}

.market-card-kuldetes .market-card-title { color: #93c5fd; }
.market-card-vetel    .market-card-title { color: #6ee7b7; }

.market-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 0.75rem;
    color: #888;
}

.market-card-meta span { display: flex; align-items: center; gap: 4px; }

.market-card-price {
    font-size: 0.95rem;
    font-weight: bold;
    color: #ffc500;
    margin-top: auto;
    padding-top: 6px;
}

.market-card-kuldetes .market-card-price { color: #93c5fd; }
.market-card-vetel    .market-card-price { color: #6ee7b7; }

.market-type-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 3px 9px;
    border-radius: 20px;
    font-size: 0.7rem;
    font-weight: bold;
}

.type-eladas   { background: rgba(255,197,0,0.2);   color: #ffc500; border: 1px solid #ffc50066; }
.type-vetel    { background: rgba(16,185,129,0.2);  color: #6ee7b7; border: 1px solid #10b98166; }
.type-kuldetes { background: rgba(59,130,246,0.2);  color: #93c5fd; border: 1px solid #3b82f666; }

.market-status-closed    { opacity: 0.55; }
.market-status-completed { opacity: 0.65; }

/* Reputáció badge */
.market-rep-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 2px 8px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: bold;
}
.market-rep-badge.rep-pos { background: rgba(34,197,94,.15);  color: #86efac; border: 1px solid #22c55e44; }
.market-rep-badge.rep-neg { background: rgba(239,68,68,.15);  color: #fca5a5; border: 1px solid #ef444444; }

/* Reputáció ikon (értékelés kártyán) */
.market-rep-icon { font-size: 1.2rem; flex-shrink: 0; }

/* Értékelés kártya */
.market-review-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 10px 14px;
    background: rgba(255,255,255,.03);
    border-radius: 8px;
    border: 1px solid #1a1a2e;
}

/* Érdekel gomb */
.market-interest-btn {
    width: 100%;
    padding: 12px;
    background: linear-gradient(135deg, #3b82f6, #1d4ed8);
    color: #fff;
    font-family: 'Oxanium', sans-serif;
    font-size: .9rem;
    font-weight: bold;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: all .3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.market-interest-btn:hover {
    background: linear-gradient(135deg, #2563eb, #1e40af);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(59,130,246,.4);
}

/* Értékelés rádiógombok */
.market-rep-radio {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex: 1;
    padding: 8px;
    border: 1px solid #333;
    border-radius: 8px;
    cursor: pointer;
    font-size: .85rem;
    transition: all .2s;
    color: #aaa;
}
.market-rep-radio:hover  { border-color: #555; color: #fff; }
.market-rep-radio.selected { color: #fff; }

/* Detail oldal */
.market-detail-layout {
    display: flex;
    gap: 24px;
    align-items: flex-start;
}

.market-detail-main  { flex: 1; min-width: 0; }

.market-detail-side {
    width: 270px;
    flex-shrink: 0;
}

.market-detail-img {
    width: 100%;
    border-radius: 10px;
    margin-bottom: 20px;
    border: 1px solid #A7864D44;
    max-height: 360px;
    object-fit: cover;
}

.market-detail-fields {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.market-detail-field {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 9px 12px;
    background: rgba(255,255,255,0.03);
    border-radius: 8px;
    border: 1px solid #1a1a2e;
}

.market-detail-label {
    color: #A7864D;
    font-size: 0.76rem;
    min-width: 110px;
    flex-shrink: 0;
    padding-top: 1px;
}

.market-detail-value {
    color: #ddd;
    font-size: 0.86rem;
    word-break: break-word;
}

.market-contact-box {
    background: rgba(20, 20, 40, 0.9);
    border: 1px solid #A7864D44;
    border-radius: 12px;
    padding: 18px;
    position: sticky;
    top: 20px;
}

.market-contact-box h3 {
    color: #ffc500;
    font-size: 0.95rem;
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid #A7864D33;
}

.type-radio-label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    padding: 10px 14px;
    border: 1px solid #333;
    border-radius: 8px;
    flex: 1;
    min-width: 120px;
    transition: all 0.2s;
}

@media (max-width: 900px) {
    .market-layout       { flex-direction: column; }
    .market-filters      { width: 100%; position: static; }
    .market-detail-layout{ flex-direction: column; }
    .market-detail-side  { width: 100%; }
    .market-contact-box  { position: static; }
}

@media (max-width: 600px) {
    .market-grid { grid-template-columns: 1fr; }
}

/* ===== HAJÓBÉRLÉS ===== */
.berleses-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:20px; margin-top:20px; }
.berleses-kartya { background:#0a0a1a; border:1px solid #1a1a2e; border-radius:12px; overflow:hidden; display:flex; flex-direction:column; transition:border-color .2s; }
.berleses-kartya:hover { border-color:#A7864D; }
.berleses-kep-wrap { position:relative; height:160px; background:#050510; overflow:hidden; }
.berleses-kep { width:100%; height:100%; object-fit:cover; }
.berleses-kep-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:3rem; color:#333; }
.berleses-status-badge { position:absolute; top:8px; right:8px; padding:3px 8px; border-radius:20px; font-size:0.72rem; font-weight:600; color:#fff; }
.berleses-info { padding:14px 16px; flex:1; display:flex; flex-direction:column; gap:8px; }
.berleses-hajonev { color:#ffc500; font-size:1.05rem; font-weight:700; margin:0; }
.berleses-gyarto { color:#A7864D; font-size:0.82rem; margin:0; }
.berleses-badges { display:flex; gap:6px; flex-wrap:wrap; }
.berleses-arak { display:flex; gap:8px; flex-wrap:wrap; margin-top:4px; }
.berleses-ar-pill { background:#0d1a2e; border:1px solid #1a2a4e; border-radius:8px; padding:5px 10px; display:flex; flex-direction:column; align-items:center; }
.berleses-ar-ertek { color:#ffc500; font-weight:700; font-size:0.88rem; }
.berleses-ar-label { color:#888; font-size:0.72rem; }
.berleses-tulajdonos { color:#888; font-size:0.8rem; margin-top:auto; }
.berleses-kartya-footer { padding:10px 16px; border-top:1px solid #1a1a2e; display:flex; gap:8px; align-items:center; }
.berleses-btn-reszlet { flex:1; background:linear-gradient(135deg,#1a1a3e,#2a2a5e); color:#fff; border:none; padding:8px 14px; border-radius:6px; text-align:center; text-decoration:none; font-size:0.85rem; cursor:pointer; }
.berleses-btn-reszlet:hover { background:linear-gradient(135deg,#2a2a5e,#3a3a7e); color:#fff; }
/* Detail */
.berleses-detail-layout { display:grid; grid-template-columns:1fr 340px; gap:24px; margin-top:20px; }
@media(max-width:900px){.berleses-detail-layout{grid-template-columns:1fr;}}
.berleses-detail-kep { width:100%; border-radius:10px; object-fit:cover; max-height:300px; }
.berleses-detail-kep-placeholder { width:100%; height:200px; display:flex; align-items:center; justify-content:center; font-size:5rem; background:#050510; border-radius:10px; }
.berleses-felszereltseg { background:#0a0a1a; border:1px solid #1a1a2e; border-radius:10px; padding:16px; margin-top:16px; }
.berleses-felszereltseg h3 { color:#ffc500; margin:0 0 12px; font-size:0.95rem; }
.berleses-felszereltseg-sor { display:flex; gap:10px; padding:8px 0; border-bottom:1px solid #0d0d1d; }
.berleses-felszereltseg-sor:last-child { border-bottom:none; }
.berleses-felszereltseg-cimke { color:#A7864D; font-size:0.82rem; min-width:100px; flex-shrink:0; }
.berleses-felszereltseg-ertek { color:#e0e0e0; font-size:0.88rem; }
.berleses-ar-tabla { background:#0a0a1a; border:1px solid #1a1a2e; border-radius:10px; padding:16px; }
.berleses-ar-tabla h3 { color:#ffc500; margin:0 0 12px; font-size:0.95rem; }
.berleses-ar-sor { display:flex; justify-content:space-between; align-items:center; padding:8px 0; border-bottom:1px solid #0d0d1d; }
.berleses-ar-sor:last-child { border-bottom:none; }
.berleses-ar-sor-label { color:#aaa; font-size:0.88rem; }
.berleses-ar-sor-ertek { color:#ffc500; font-weight:700; font-size:1rem; }
.berleses-sidebar { display:flex; flex-direction:column; gap:16px; }
.berleses-contact-box { background:#0a0a1a; border:1px solid #1a1a2e; border-radius:10px; padding:20px; }
.berleses-contact-box h3 { color:#ffc500; margin:0 0 12px; }
.berleses-erdeklodik-btn { width:100%; padding:12px; background:linear-gradient(135deg,#1a3a1a,#2a5a2a); border:none; color:#4ade80; border-radius:8px; font-size:1rem; font-weight:600; cursor:pointer; transition:background .2s; }
.berleses-erdeklodik-btn:hover { background:linear-gradient(135deg,#2a5a2a,#3a7a3a); }
.berleses-visszavon-btn { width:100%; padding:10px; background:#1a0a0a; border:1px solid #5a1a1a; color:#f87171; border-radius:8px; font-size:0.88rem; cursor:pointer; margin-top:8px; }
/* Form */
.berleses-form-section { background:#0a0a1a; border:1px solid #1a1a2e; border-radius:10px; padding:20px; margin-bottom:20px; }
.berleses-form-section h3 { color:#ffc500; margin:0 0 16px; font-size:0.95rem; border-bottom:1px solid #1a1a2e; padding-bottom:8px; }
.berleses-ar-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
@media(max-width:600px){.berleses-ar-grid{grid-template-columns:1fr;}}

/* ============================================================
   HSC UI – megerősítő modal + toast (hsc-ui.js)
   ============================================================ */
.hsc-modal-overlay{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(2,2,8,.72);backdrop-filter:blur(3px);opacity:0;transition:opacity .2s ease}
.hsc-modal-overlay.open{opacity:1}
.hsc-modal{width:100%;max-width:420px;background:linear-gradient(160deg,#0d0d1a,#0a0a14);border:1px solid #2a2a44;border-radius:16px;padding:28px 26px 22px;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.7);transform:translateY(14px) scale(.97);transition:transform .22s cubic-bezier(.2,.9,.3,1.2)}
.hsc-modal-overlay.open .hsc-modal{transform:none}
.hsc-modal-icon{width:56px;height:56px;margin:0 auto 16px;border-radius:50%;background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.3);display:flex;align-items:center;justify-content:center;color:#f87171;font-size:1.4rem}
.hsc-modal-msg{color:#dde;font-size:.95rem;line-height:1.6;margin-bottom:22px}
.hsc-modal-actions{display:flex;gap:10px;justify-content:center}
.hsc-mbtn{flex:1;max-width:170px;padding:11px 16px;border-radius:10px;font-size:.86rem;font-family:'Oxanium',sans-serif;letter-spacing:.02em;cursor:pointer;border:1px solid;transition:all .15s}
.hsc-mbtn-cancel{background:rgba(255,255,255,.04);border-color:#2a2a44;color:#99a}
.hsc-mbtn-cancel:hover{background:rgba(255,255,255,.08);color:#cce}
.hsc-mbtn-confirm{background:linear-gradient(135deg,#dc2626,#b91c1c);border-color:#ef444455;color:#fff}
.hsc-mbtn-confirm:hover{filter:brightness(1.12);box-shadow:0 6px 20px rgba(239,68,68,.35)}

#hsc-toast-wrap{position:fixed;top:18px;right:18px;z-index:10001;display:flex;flex-direction:column;gap:10px;pointer-events:none;max-width:calc(100vw - 36px)}
.hsc-toast{display:flex;align-items:center;gap:11px;min-width:240px;max-width:380px;padding:13px 16px;border-radius:11px;background:#0d0d1a;border:1px solid #2a2a44;color:#dde;font-size:.86rem;line-height:1.45;box-shadow:0 12px 40px rgba(0,0,0,.55);pointer-events:auto;cursor:pointer;transform:translateX(120%);opacity:0;transition:transform .28s cubic-bezier(.2,.9,.3,1.1),opacity .28s}
.hsc-toast.show{transform:none;opacity:1}
.hsc-toast i{font-size:1.05rem;flex-shrink:0}
.hsc-toast-success{border-color:rgba(34,197,94,.35)}
.hsc-toast-success i{color:#4ade80}
.hsc-toast-error{border-color:rgba(239,68,68,.35)}
.hsc-toast-error i{color:#f87171}
.hsc-toast-info{border-color:rgba(59,130,246,.35)}
.hsc-toast-info i{color:#60a5fa}
@media(max-width:520px){
    #hsc-toast-wrap{top:10px;right:10px;left:10px}
    .hsc-toast{min-width:0;max-width:none}
    .hsc-modal{max-width:none}
}

/* Belső (page-dashboard) oldalakon a siker-üzenet toast formában jelenik meg
   (hsc-ui.js / footer.php) → az inline zöld bannert elrejtjük a duplikáció ellen.
   A hibaüzenet (.auth-error) marad inline, mert űrlap-javításnál jobb ha látszik. */
body.page-dashboard .auth-success{display:none}

/* ============================================================
   HSC egyedi dropdown (hsc-ui.js) – natív <select> kiváltása
   ============================================================ */
.hsc-select{position:relative;display:inline-block;vertical-align:middle;font-family:'Oxanium',sans-serif}
.hsc-select > select{display:none !important}
.hsc-select-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;background:rgba(255,255,255,.05);border:1px solid #333;border-radius:8px;color:#fff;font-family:inherit;font-size:.88rem;padding:10px 14px;cursor:pointer;text-align:left;transition:border-color .2s,background .2s}
.hsc-select-btn:hover{border-color:#A7864D}
.hsc-select.open .hsc-select-btn{border-color:#A7864D;background:rgba(255,255,255,.07)}
.hsc-select-btn > i{font-size:.68rem;color:#A7864D;transition:transform .2s;flex-shrink:0}
.hsc-select.open .hsc-select-btn > i{transform:rotate(180deg)}
.hsc-select-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hsc-select-list{position:absolute;top:calc(100% + 5px);left:0;right:0;z-index:9000;background:#0d0d1a;border:1px solid #2a2a44;border-radius:8px;box-shadow:0 14px 38px rgba(0,0,0,.6);max-height:280px;overflow-y:auto;padding:4px;display:none}
.hsc-select.open .hsc-select-list{display:block;animation:hscSelFade .15s ease}
@keyframes hscSelFade{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.hsc-select-opt{padding:9px 12px;border-radius:6px;color:#bbc;font-size:.85rem;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .12s}
.hsc-select-opt:hover{background:rgba(167,134,77,.12);color:#fff}
.hsc-select-opt.sel{background:rgba(167,134,77,.18);color:#ffce7a}
.hsc-select-opt.disabled{color:#555;cursor:not-allowed}
.hsc-select-list::-webkit-scrollbar{width:8px}
.hsc-select-list::-webkit-scrollbar-track{background:transparent}
.hsc-select-list::-webkit-scrollbar-thumb{background:#2a2a44;border-radius:4px}

/* ============================================================
   ROUND 3 – Egységes elrendezés (max-width 1200px + belső kártya-box)
   A hsc_extra.css a style.css UTÁN tölt → ezek az értékek nyernek.
   ============================================================ */

/* Egységes tartalmi szélesség mindenhol (mint a hírek / belső terület) */
#intro,.new-features-grid,.iae-section{max-width:1200px;margin-left:auto;margin-right:auto}

/* #intro → NEM szürke section, hanem belső kártya-box (rgba(20,20,40,.9)).
   A globális section{background:#1e1e1e} felülírva. */
#intro{background:rgba(20,20,40,.9);border:1px solid #A7864D44;border-radius:12px;padding:32px 34px;box-shadow:none;margin-top:30px;margin-bottom:30px}

/* Feature-boxok MÖGÖTTI szürke section-panel eltávolítása (a boxok adják a hátteret) */
.new-features-grid{background:transparent;box-shadow:none}

/* Hírek: konténer + section szürke eltávolítása, a hír-boxok belső kártya-stílust kapnak */
#hirek-container{background:transparent}
#hirek{background:transparent;box-shadow:none}
#hirek .nagy-hir,#hirek .hir{background:rgba(20,20,40,.9);border:1px solid #A7864D44}

/* Egységes box-stílus (a belső .dashboard-card) a főoldali feature-boxokra */
.feature-box{background:rgba(20,20,40,.9);border:1px solid #A7864D44;border-radius:12px;box-shadow:none}
.feature-box:hover{border-color:#A7864D;box-shadow:0 8px 25px rgba(167,134,77,.25)}

/* Újrahasznosítható segéd-osztályok a többi oldalhoz */
.hsc-container{max-width:1200px;margin:0 auto;padding:0 20px;box-sizing:border-box}
.hsc-box{background:rgba(20,20,40,.9);border:1px solid #A7864D44;border-radius:12px;padding:28px 24px}

/* ── Round 3: a TÖBBI publikus oldal sima <section>-jei → belső navy kártya-box, 1200px ──
   Body-class alapján célozva, hogy a belső (page-dashboard) oldalakat NE érintse. */
body.page-jatekrol main section,
body.page-patch main section,
body.page-csapattev main section,
body.page-iae main section,
body.page-engineering main section,
body.page-regisztracio main section{
    background:rgba(20,20,40,.9);
    border:1px solid #A7864D44;
    border-radius:12px;
    max-width:1200px;
    margin-left:auto;margin-right:auto;
    margin-bottom:40px;
    box-shadow:none;
}
/* CTA / gomb-szekciók maradjanak átlátszók (nem tartalmi box) */
body.page-jatekrol .join-section,
body.page-engineering .join-section{background:transparent;border:none;box-shadow:none}

/* ── Fix: a .form-group checkboxok ne feszüljenek szét (globális width:100% felülírva) ── */
.form-group input[type="checkbox"]{width:auto;flex:0 0 auto;margin:0;padding:0}

/* ── Fix: Trade napló stat-szám ne lógjon ki / ne vágódjon le (kisebb max font) ── */
.stat-szam{font-size:clamp(.9rem,1.2vw,1.2rem);letter-spacing:-.01em}

/* Menüpontok betűmérete PC-n +25% (16px → 20px). CSAK a menü linkjei
   (nav ul li a) — a belépés/profil (.nav-auth) NEM. Mobil érintetlen. */
@media (min-width: 769px) {
    nav ul li a { font-size: 20px; }
}