/* ============================================================
   LinkMC.de  –  Gemeinsames Design (Minecraft-Grün)
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');

:root{
    --bg-dark:#0a170a;
    --mc-green:#55ff55;
    --mc-dark-green:#00aa00;
    --mc-red:#ff5555;
    --mc-yellow:#ffff55;
    --text-light:#e0f2e0;
    --panel:rgba(0,0,0,.85);
}
*{ margin:0; padding:0; box-sizing:border-box; font-family:'Press Start 2P', monospace; }
html{ scroll-behavior:smooth; }
body{
    background-color:var(--bg-dark);
    color:var(--text-light);
    min-height:100vh;
    overflow-x:hidden;
    background-image:
        linear-gradient(rgba(10,23,10,.9), rgba(10,23,10,.9)),
        repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(0,170,0,.05) 10px, rgba(0,170,0,.05) 20px);
    position:relative;
    line-height:1.6;
}
a{ color:var(--mc-green); }

/* ---------- Hamburger + Sidebar ---------- */
.hamburger{
    position:fixed; top:16px; left:16px; z-index:500;
    width:52px; height:52px; background:var(--panel);
    border:4px solid var(--mc-dark-green); cursor:pointer;
    display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px;
    box-shadow:4px 4px 0 rgba(0,0,0,.5); transition:background .2s;
}
.hamburger:hover{ background:var(--mc-dark-green); }
.hamburger span{ display:block; width:24px; height:4px; background:var(--mc-green); transition:.2s; }
.hamburger:hover span{ background:#fff; }

.sidebar-overlay{
    position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:600;
    opacity:0; visibility:hidden; transition:.25s;
}
.sidebar-overlay.open{ opacity:1; visibility:visible; }

.sidebar{
    position:fixed; top:0; left:0; height:100%; width:300px; max-width:85vw;
    background:var(--panel); border-right:4px solid var(--mc-dark-green);
    z-index:700; transform:translateX(-105%); transition:transform .28s ease;
    display:flex; flex-direction:column; padding:20px; box-shadow:8px 0 0 rgba(0,0,0,.4);
}
.sidebar.open{ transform:translateX(0); }
.sidebar-head{
    display:flex; align-items:center; justify-content:space-between;
    border-bottom:3px solid var(--mc-dark-green); padding-bottom:14px; margin-bottom:14px;
}
.sidebar-head h2{ color:var(--mc-green); font-size:.85rem; text-shadow:2px 2px 0 rgba(0,0,0,.8); }
.sidebar-close{ background:none; border:none; color:var(--mc-red); font-size:1rem; cursor:pointer; }
.sidebar-user{ font-size:.55rem; color:var(--text-light); margin-bottom:14px; line-height:2; word-break:break-all; }
.sidebar-user .role{ color:var(--mc-yellow); }
.sidebar a.nav-item, .sidebar button.nav-item{
    display:block; width:100%; text-align:left; text-decoration:none;
    color:var(--text-light); background:#111; border:3px solid var(--mc-dark-green);
    padding:14px 12px; font-size:.62rem; margin-bottom:12px; cursor:pointer; transition:.15s;
}
.sidebar a.nav-item:hover, .sidebar button.nav-item:hover{
    background:var(--mc-dark-green); color:#fff; transform:translate(2px,2px);
}
.sidebar a.nav-item.danger{ border-color:#aa0000; color:var(--mc-red); }
.sidebar a.nav-item.danger:hover{ background:#aa0000; color:#fff; }
.sidebar a.nav-item.admin{ border-color:var(--mc-yellow); color:var(--mc-yellow); }
.sidebar a.nav-item.admin:hover{ background:var(--mc-yellow); color:#111; }
.sidebar-foot{ margin-top:auto; font-size:.5rem; color:#5f8f5f; text-align:center; padding-top:14px; }

/* ---------- Layout / Wrapper ---------- */
.wrap{ max-width:820px; margin:0 auto; padding:100px 20px 60px; position:relative; z-index:10; }
.page-title{ color:var(--mc-green); font-size:1.3rem; text-shadow:4px 4px 0 rgba(0,0,0,.8); margin-bottom:8px; }
.page-sub{ font-size:.62rem; color:#9fcf9f; margin-bottom:30px; line-height:1.9; }

/* ---------- Panels / Cards ---------- */
.panel{
    background:var(--panel); border:4px solid var(--mc-dark-green);
    box-shadow:6px 6px 0 rgba(0,0,0,.5); padding:22px; margin-bottom:24px;
}
.panel h3{ color:var(--mc-green); font-size:.8rem; margin-bottom:16px; text-shadow:2px 2px 0 rgba(0,0,0,.8); }
.panel h4{ color:var(--mc-green); font-size:.66rem; margin:16px 0 10px; }

/* ---------- Formulare ---------- */
.field{ margin-bottom:18px; }
.field label{ display:block; font-size:.58rem; color:var(--mc-green); margin-bottom:8px; }
.field .hint{ font-size:.5rem; color:#7fae7f; margin-top:6px; line-height:1.8; }
input[type=text], input[type=email], input[type=password], input[type=url],
input[type=color], input[type=file], select, textarea{
    width:100%; background:#111; border:3px solid var(--mc-dark-green); color:var(--mc-green);
    font-family:'Press Start 2P', monospace; font-size:.6rem; padding:12px; outline:none;
}
input[type=color]{ height:46px; padding:4px; cursor:pointer; }
textarea{ min-height:90px; resize:vertical; line-height:1.8; }
input::placeholder, textarea::placeholder{ color:#4f7f4f; }
input:focus, select:focus, textarea:focus{ border-color:var(--mc-green); }

/* ---------- Buttons ---------- */
.btn{
    display:inline-block; background:#111; color:var(--mc-green); text-decoration:none;
    border:4px solid; border-top-color:#77ff77; border-left-color:#77ff77;
    border-bottom-color:#005500; border-right-color:#005500;
    padding:14px 20px; font-size:.66rem; cursor:pointer; transition:transform .1s;
    text-shadow:2px 2px 0 rgba(0,0,0,.6);
}
.btn:hover{ background:var(--mc-dark-green); color:#fff; }
.btn:active{ transform:translate(2px,2px);
    border-top-color:#005500; border-left-color:#005500; border-bottom-color:#77ff77; border-right-color:#77ff77; }
.btn.full{ display:block; width:100%; text-align:center; }
.btn.red{ color:var(--mc-red); border-top-color:#ff8888; border-left-color:#ff8888; border-bottom-color:#660000; border-right-color:#660000; }
.btn.red:hover{ background:#aa0000; color:#fff; }
.btn.yellow{ color:var(--mc-yellow); border-top-color:#ffff99; border-left-color:#ffff99; border-bottom-color:#666600; border-right-color:#666600; }
.btn.yellow:hover{ background:var(--mc-yellow); color:#111; }
.btn.small{ padding:8px 12px; font-size:.55rem; border-width:3px; }

/* ---------- Flash-Meldungen ---------- */
.flashes{ margin-bottom:24px; }
.flash{ padding:14px; border:4px solid; font-size:.58rem; margin-bottom:12px; line-height:1.9; }
.flash.info{ border-color:var(--mc-dark-green); background:rgba(0,170,0,.12); color:var(--mc-green); }
.flash.success{ border-color:var(--mc-green); background:rgba(0,170,0,.2); color:var(--mc-green); }
.flash.error{ border-color:#aa0000; background:rgba(170,0,0,.15); color:var(--mc-red); }

/* ---------- Stats (Live-Zahlen) ---------- */
.stats{ display:flex; gap:20px; justify-content:center; flex-wrap:wrap; margin:10px 0 6px; }
.stat-box{
    background:var(--panel); border:4px solid var(--mc-dark-green); padding:18px 26px;
    text-align:center; box-shadow:5px 5px 0 rgba(0,0,0,.5); min-width:150px;
}
.stat-num{ color:var(--mc-green); font-size:1.5rem; text-shadow:3px 3px 0 rgba(0,0,0,.8); }
.stat-label{ font-size:.52rem; color:#9fcf9f; margin-top:10px; }

/* ---------- Tabellen (Admin) ---------- */
.table-scroll{ overflow-x:auto; }
table.mc{ width:100%; border-collapse:collapse; font-size:.52rem; }
table.mc th, table.mc td{ border:2px solid var(--mc-dark-green); padding:10px; text-align:left; vertical-align:middle; }
table.mc th{ background:rgba(0,170,0,.15); color:var(--mc-green); }
table.mc td{ color:var(--text-light); word-break:break-word; }
.tag{ display:inline-block; font-size:.5rem; padding:3px 7px; border-radius:4px; border:1px solid; }
.tag.owner{ color:var(--mc-yellow); border-color:var(--mc-yellow); }
.tag.admin{ color:#ffaa00; border-color:#ffaa00; }
.tag.user{ color:#9fcf9f; border-color:#3f6f3f; }
.tag.banned{ color:var(--mc-red); border-color:var(--mc-red); }
.tag.ok{ color:var(--mc-green); border-color:var(--mc-green); }

.inline-form{ display:inline; }
.muted{ color:#7fae7f; font-size:.55rem; }
.center{ text-align:center; }
hr.mc{ border:none; border-top:2px solid var(--mc-dark-green); margin:20px 0; }

/* ---------- Media Vorschau ---------- */
.preview-img{ width:64px; height:64px; object-fit:cover; border:3px solid var(--mc-dark-green); }
.link-row{ display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap;
    border-bottom:1px dashed rgba(0,170,0,.3); padding:12px 0; }
.link-row .field{ margin-bottom:0; flex:1; min-width:120px; }

@media(max-width:600px){
    .wrap{ padding-top:88px; }
    .page-title{ font-size:1rem; }
    .stat-num{ font-size:1.1rem; }
}

/* ============================================================
   ERWEITERUNGEN (Untermenues, Badges, Tickets, Partner, ...)
   – gleiches Minecraft-Design wie der Rest
   ============================================================ */

/* ----- Sidebar: Badges unter dem Namen ----- */
.sidebar-badges{ margin-top:10px; }
.sidebar-badges .badges{ display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-start; }
.sidebar-badges .b img{ width:22px; height:22px; }

/* ----- Sidebar: Untermenues ----- */
.nav-group{ margin-bottom:12px; }
.nav-parent{ display:flex; gap:6px; align-items:stretch; }
.nav-parent .nav-item.grow{ flex:1; margin-bottom:0; }
.nav-caret{
    width:46px; background:#111; border:3px solid var(--mc-dark-green); color:var(--mc-green);
    cursor:pointer; position:relative; transition:.15s;
}
.nav-caret:hover{ background:var(--mc-dark-green); }
.nav-caret.admin{ border-color:var(--mc-yellow); }
.nav-caret::before{
    content:''; position:absolute; top:50%; left:50%; width:8px; height:8px;
    border-right:3px solid var(--mc-green); border-top:3px solid var(--mc-green);
    transform:translate(-50%,-20%) rotate(-45deg); transition:transform .2s;
}
.nav-caret.admin::before{ border-color:var(--mc-yellow); }
.nav-group.open .nav-caret::before,
.nav-group:hover .nav-caret::before{ transform:translate(-50%,-60%) rotate(135deg); }
.nav-sub{ max-height:0; overflow:hidden; transition:max-height .25s ease; margin:0 0 0 10px; }
.nav-group:hover .nav-sub, .nav-group.open .nav-sub{ max-height:320px; margin-top:8px; }
.nav-sub a{
    display:block; color:var(--text-light); background:#0d0d0d; border:2px solid var(--mc-dark-green);
    border-left:5px solid var(--mc-dark-green); padding:11px 12px; font-size:.58rem; margin-bottom:8px;
    text-decoration:none; transition:.15s;
}
.nav-sub a:hover{ background:var(--mc-dark-green); color:#fff; transform:translate(2px,0); }
.nav-sub a.danger{ border-color:#aa0000; border-left-color:#aa0000; color:var(--mc-red); }
.nav-sub a.danger:hover{ background:#aa0000; color:#fff; }

/* ----- Badges als Logos (Panels/Sidebar/Admin) ----- */
.badges{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.badges .b{ position:relative; display:inline-flex; align-items:center; justify-content:center; }
.badges .b img{ object-fit:contain; filter:drop-shadow(0 2px 3px rgba(0,0,0,.6)); }
.badges .b .bt{ position:absolute; bottom:130%; left:50%; transform:translateX(-50%);
    background:rgba(0,0,0,.92); color:#fff; font-size:.5rem; padding:5px 8px; border:1px solid #555;
    border-radius:5px; white-space:nowrap; display:none; z-index:30; }
.badges .b:hover .bt, .badges .b:focus .bt{ display:block; }
.badge-chip{ display:inline-block; }

/* ----- Toggle-Switch ----- */
.switch{ display:inline-flex; align-items:center; gap:12px; cursor:pointer; font-size:.58rem; color:var(--mc-green); }
.switch input{ position:absolute; opacity:0; width:0; height:0; }
.switch .slider{ width:52px; height:26px; background:#111; border:3px solid var(--mc-dark-green); position:relative; transition:.2s; flex-shrink:0; }
.switch .slider::before{ content:''; position:absolute; top:2px; left:2px; width:16px; height:16px; background:var(--mc-red); transition:.2s; }
.switch input:checked + .slider{ border-color:var(--mc-green); }
.switch input:checked + .slider::before{ transform:translateX(26px); background:var(--mc-green); }

/* ----- Code-Editor (Own Web) ----- */
.code-editor{ font-family:'Courier New', monospace !important; font-size:.7rem !important; line-height:1.5;
    min-height:280px; background:#050505 !important; color:#9dffb0 !important; white-space:pre; }

/* ----- Ticket-Chat ----- */
.chat{ display:flex; flex-direction:column; gap:12px; padding:6px 2px; max-height:60vh; overflow-y:auto; }
.msg{ max-width:80%; padding:12px 14px; border:3px solid var(--mc-dark-green); background:#0d0d0d; }
.msg .msg-meta{ font-size:.48rem; color:#7fae7f; margin-bottom:6px; }
.msg .msg-text{ font-size:.6rem; line-height:1.7; white-space:pre-wrap; word-break:break-word; }
.msg img.msg-img{ max-width:100%; margin-top:8px; border:2px solid var(--mc-dark-green); display:block; }
.msg.me{ align-self:flex-end; border-color:var(--mc-green); background:rgba(0,170,0,.15); }
.msg.me .msg-meta{ text-align:right; color:var(--mc-green); }
.msg.them, .msg.staff{ align-self:flex-start; }
.msg.staff{ border-color:var(--mc-yellow); }
.msg.staff .msg-meta .who{ color:var(--mc-yellow); }
.chat-input{ margin-top:16px; }
.ticket-item{ display:flex; align-items:center; justify-content:space-between; gap:12px;
    background:#0d0d0d; border:3px solid var(--mc-dark-green); padding:14px; margin-bottom:12px; text-decoration:none; color:var(--text-light); }
.ticket-item:hover{ border-color:var(--mc-green); }
.ticket-item .t-sub{ color:var(--mc-green); font-size:.62rem; }
.ticket-item .t-meta{ font-size:.5rem; color:#7fae7f; margin-top:6px; }
.status-dot{ display:inline-block; width:9px; height:9px; margin-right:7px; }
.status-open .status-dot{ background:var(--mc-green); }
.status-closed .status-dot{ background:#666; }

/* ----- Partner-Grid ----- */
.partner-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:20px; }
.partner-card{ background:var(--panel); border:4px solid var(--mc-dark-green); box-shadow:6px 6px 0 rgba(0,0,0,.5); overflow:hidden; display:flex; flex-direction:column; }
.partner-card:hover{ border-color:var(--mc-green); }
.partner-banner{ height:120px; background:#0d0d0d; background-size:cover; background-position:center; border-bottom:3px solid var(--mc-dark-green); }
.partner-body{ padding:16px; display:flex; flex-direction:column; gap:10px; flex:1; }
.partner-top{ display:flex; align-items:center; gap:12px; }
.partner-logo{ width:54px; height:54px; object-fit:cover; border:3px solid var(--mc-dark-green); background:#0d0d0d; }
.partner-name{ color:var(--mc-green); font-size:.72rem; }
.partner-desc{ color:#c9c9c9; font-size:.55rem; line-height:1.7; flex:1; }

/* ----- Badge-Admin-Grid ----- */
.badge-admin-grid{ display:flex; flex-wrap:wrap; gap:16px; }
.badge-box{ width:130px; text-align:center; background:#0d0d0d; border:3px solid var(--mc-dark-green); padding:14px 10px; }
.badge-box img{ width:46px; height:46px; object-fit:contain; }
.badge-box .bn{ color:var(--mc-green); font-size:.55rem; margin-top:8px; word-break:break-word; }

/* Plus-Button */
.btn.plus{ padding:8px 14px; font-size:.9rem; line-height:1; }

/* ============================================================
   FEINSCHLIFF: Untermenue-Feld + Chevron, Partner, Chat
   ============================================================ */
.nav-sub{ background:#0d0d0d; border:3px solid var(--mc-dark-green); border-radius:2px;
    max-height:0; opacity:0; overflow:hidden; margin:0 0 0 4px; padding:0 10px;
    transition:max-height .3s ease, opacity .2s ease, padding .3s ease, margin-top .3s ease; }
.nav-group:hover .nav-sub, .nav-group.open .nav-sub{ max-height:360px; opacity:1; padding:10px; margin-top:8px; }
.nav-sub a{ margin-bottom:8px; }
.nav-sub a:last-child{ margin-bottom:0; }
.nav-caret::before{ transition:transform .3s ease; transform:translate(-50%,-30%) rotate(-135deg); }
.nav-group:hover .nav-caret::before,
.nav-group.open .nav-caret::before{ transform:translate(-50%,-70%) rotate(45deg); }

/* Partner-Uebersicht */
.cat-title{ color:var(--mc-green); font-size:.8rem; margin-bottom:20px; text-shadow:2px 2px 0 rgba(0,0,0,.8); }
.p-grid{ display:flex; flex-wrap:wrap; gap:28px; }
.p-item{ background:none; border:none; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:12px; width:112px; font-family:inherit; }
.p-logo{ width:92px; height:92px; border-radius:50%; overflow:hidden; background:#0d0d0d; border:2px solid rgba(120,120,120,.35);
    display:flex; align-items:center; justify-content:center; transition:transform .2s, box-shadow .2s, border-color .2s; box-shadow:0 4px 14px rgba(0,0,0,.5); }
.p-item:hover .p-logo{ transform:translateY(-5px) scale(1.04); border-color:var(--mc-green); box-shadow:0 0 20px color-mix(in srgb, var(--mc-green) 55%, transparent); }
.p-logo img{ width:100%; height:100%; object-fit:cover; }
.p-letter{ color:var(--mc-green); font-weight:900; font-size:2rem; }
.p-name{ color:var(--text-light); font-size:.62rem; text-align:center; line-height:1.5; }
.p-modal{ position:fixed; inset:0; background:rgba(0,0,0,.72); backdrop-filter:blur(3px); z-index:2000; display:none; align-items:flex-start; justify-content:center; padding:40px 16px; overflow-y:auto; }
.p-modal.open{ display:flex; }
.p-modal-box{ width:100%; max-width:840px; background:#0e0e0e; border:4px solid var(--mc-dark-green); box-shadow:0 0 44px rgba(0,0,0,.85); animation:pmIn .25s ease; }
@keyframes pmIn{ from{ opacity:0; transform:translateY(-16px);} to{ opacity:1; transform:none; } }
.p-modal-head{ display:flex; align-items:center; justify-content:space-between; padding:18px 22px; border-bottom:2px solid var(--mc-dark-green); }
.p-modal-head h3{ color:var(--mc-green); font-size:.9rem; }
.p-modal-close{ background:none; border:none; color:#aaa; font-size:1rem; cursor:pointer; }
.p-modal-close:hover{ color:var(--mc-red); }
.p-modal-body{ display:flex; gap:28px; padding:26px 22px; flex-wrap:wrap; }
.p-modal-left{ flex:0 0 190px; text-align:center; margin:0 auto; }
.pm-logo{ width:150px; height:150px; border-radius:50%; overflow:hidden; margin:0 auto; background:#0d0d0d; border:3px solid var(--mc-dark-green); display:flex; align-items:center; justify-content:center; }
.pm-logo img{ width:100%; height:100%; object-fit:cover; }
.pm-name{ color:#fff; font-size:1rem; margin-top:14px; }
.pm-cat{ color:var(--mc-green); font-size:.58rem; margin-top:8px; display:none; }
.p-modal-right{ flex:1; min-width:240px; }
.p-modal-right h4{ color:var(--mc-green); font-size:.72rem; margin-bottom:14px; }
.pm-desc{ color:#dcdcdc; font-family:Arial,Helvetica,sans-serif; font-size:15px; line-height:1.9; }
.pm-links{ margin-top:22px; font-family:Arial,Helvetica,sans-serif; font-size:14px; line-height:2.2; }
.pm-links strong{ color:var(--mc-green); }

/* Ticket-Chat (Sprechblasen) */
.chat{ display:flex; flex-direction:column; gap:22px; padding:18px; max-height:62vh; overflow-y:auto; background:#0d0d0d; border:3px solid var(--mc-dark-green); margin-top:14px; }
.cmsg{ display:flex; gap:12px; align-items:flex-end; max-width:88%; }
.cmsg.me{ align-self:flex-end; flex-direction:row-reverse; }
.cavatar{ width:40px; height:40px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; background:#1a1a1a; border:2px solid var(--mc-dark-green); color:var(--mc-green); font-size:.7rem; }
.cmsg.me .cavatar{ border-color:var(--mc-green); }
.cmsg.staff .cavatar{ border-color:var(--mc-yellow); color:var(--mc-yellow); }
.cbody{ display:flex; flex-direction:column; min-width:0; }
.cmsg.me .cbody{ align-items:flex-end; }
.cmeta{ font-size:11px; color:#8a8a8a; margin-bottom:6px; font-family:Arial,Helvetica,sans-serif; letter-spacing:.3px; }
.cmeta .cwho{ color:var(--mc-green); font-weight:bold; }
.cmsg.me .cmeta .cwho{ color:#fff; }
.cmsg.staff .cmeta .cwho{ color:var(--mc-yellow); }
.cbubble{ background:#1c1c1c; border:1px solid rgba(120,120,120,.4); border-radius:16px; padding:14px 16px; font-family:Arial,Helvetica,sans-serif; font-size:16px; line-height:1.7; color:#eee; white-space:pre-wrap; word-break:break-word; }
.cmsg.me .cbubble{ background:rgba(0,170,0,.18); border-color:var(--mc-green); border-bottom-right-radius:4px; }
.cmsg.staff .cbubble{ border-color:var(--mc-yellow); border-bottom-left-radius:4px; }
.cbubble img.cimg{ max-width:100%; border-radius:8px; margin-top:10px; display:block; border:1px solid rgba(255,255,255,.15); }