/* * MC Gallery PRO — Forum Bridge Styles * Pfad: assets/css/mc-gallery-forum-bridge.css */ /* ── Verify-Panel unter der Gallery ──────────────────────────────────────── */ .mc-bridge-verify-wrap { margin-top: 16px; } .mc-bridge-divider { display: flex; align-items: center; gap: 10px; margin: 14px 0; color: var(--wbf-text-muted, #94a3b8); font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; } .mc-bridge-divider::before, .mc-bridge-divider::after { content: ''; flex: 1; height: 1px; background: var(--wbf-border, rgba(100,116,139,.25)); } /* ── Forum-Card — gemeinsame Hülle ───────────────────────────────────────── */ .mc-bridge-card { border-radius: 12px; border: 1px solid rgba(56,189,248,.15); background: rgba(15,23,42,.55); overflow: hidden; } .mc-bridge-card--warn { border-color: rgba(245,158,11,.22); } .mc-bridge-card--ok { border-color: rgba(34,197,94,.22); } .mc-bridge-card-inner { display: flex; align-items: center; gap: 16px; padding: 16px 20px; flex-wrap: wrap; } /* Quadratisches Icon-Kästchen */ .mc-bridge-card-icon { width: 44px; height: 44px; border-radius: 10px; background: rgba(56,189,248,.09); border: 1px solid rgba(56,189,248,.18); display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .mc-bridge-card-icon i { font-size: 1.15rem; color: #38bdf8; } /* Text-Block */ .mc-bridge-card-text { flex: 1; min-width: 0; } .mc-bridge-card-label { font-size: .7rem; text-transform: uppercase; letter-spacing: .07em; color: #475569; margin-bottom: 3px; } .mc-bridge-card-desc { font-size: .84rem; color: #94a3b8; line-height: 1.4; } .mc-bridge-card-desc strong { color: #cbd5e1; font-weight: 500; } /* Action-Spalte */ .mc-bridge-card-actions { display: flex; flex-direction: column; gap: 7px; flex-shrink: 0; } /* Haupt-Button */ .mc-bridge-action-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 8px 16px; border-radius: 8px; border: none; cursor: pointer; background: #38bdf8; color: #0c1222; font-size: .82rem; font-weight: 700; letter-spacing: .01em; white-space: nowrap; text-decoration: none; transition: opacity .15s; } .mc-bridge-action-btn:hover { opacity: .85; text-decoration: none; color: #0c1222; } .mc-bridge-action-btn--warn { background: #f59e0b; color: #1c1008; } /* Sekundär-Button */ .mc-bridge-action-btn-ghost { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 7px 16px; border-radius: 8px; cursor: pointer; background: transparent; border: 1px solid rgba(100,116,139,.3); color: #64748b; font-size: .78rem; font-weight: 500; white-space: nowrap; text-decoration: none; transition: border-color .15s, color .15s; } .mc-bridge-action-btn-ghost:hover { border-color: rgba(100,116,139,.5); color: #94a3b8; text-decoration: none; } .mc-bridge-action-btn-ghost i { font-size: .82rem; } /* Verifiziert-Badge */ .mc-bridge-verified-badge { display: inline-flex; align-items: center; gap: 6px; padding: 7px 16px; border-radius: 20px; background: rgba(34,197,94,.1); border: 1px solid rgba(34,197,94,.25); color: #22c55e; font-size: .8rem; font-weight: 600; flex-shrink: 0; } /* Nicht eingeloggt / nicht verknüpft — jetzt via .mc-bridge-card */ .mc-bridge-not-logged, .mc-bridge-not-linked { display: none; /* HTML-Ersatz durch mc-bridge-card */ } .mc-bridge-btn-inline { color: #38bdf8; text-decoration: none; font-weight: 600; } .mc-bridge-btn-inline:hover { text-decoration: underline; } /* Eingeloggt & verknüpft — jetzt via .mc-bridge-card */ .mc-bridge-forum-linked { display: none; } .mc-bridge-head-sm { width: 44px; height: 44px; border-radius: 8px; flex-shrink: 0; image-rendering: pixelated; } .mc-bridge-forum-name { font-weight: 500; color: #e2e8f0; } .mc-bridge-arrow { color: #475569; margin: 0 2px; } .mc-bridge-mc-name-sm { font-weight: 600; color: #38bdf8; } .mc-bridge-unverified-hint { display: block; font-size: .75rem; color: #f59e0b; margin-top: 2px; } .mc-bridge-verify-trigger { display: inline-flex; align-items: center; gap: 7px; padding: 8px 16px; background: #f59e0b; color: #1c1008; border: none; border-radius: 8px; font-size: .82rem; font-weight: 700; cursor: pointer; transition: opacity .15s; white-space: nowrap; flex-shrink: 0; } .mc-bridge-verify-trigger:hover { opacity: .85; } .mc-bridge-verify-trigger:disabled { opacity: .5; cursor: wait; } .mc-bridge-success { display: flex; align-items: center; gap: 10px; padding: 14px 18px; background: rgba(34,197,94,.08); border: 1px solid rgba(34,197,94,.22); border-radius: 12px; color: #22c55e; font-size: .88rem; font-weight: 500; } .mc-bridge-success i { font-size: 1.1rem; flex-shrink: 0; } .mc-bridge-error { margin-top: 8px; padding: 10px 14px; background: rgba(239,68,68,.08); border: 1px solid rgba(239,68,68,.2); border-radius: 8px; color: #f87171; font-size: .83rem; } .mc-bridge-error i { margin-right: 5px; } /* ── Profil-Tab: Minecraft ────────────────────────────────────────────────── */ .mc-bridge-profile-tab { padding: 4px 0; } .mc-bridge-intro { color: var(--wbf-text-muted, #94a3b8); margin-bottom: 14px; font-size: .9rem; } /* Verknüpfte Karte */ .mc-bridge-linked-card { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 10px; border: 1px solid rgba(100,116,139,.2); background: rgba(30,41,59,.5); flex-wrap: wrap; } .mc-bridge-linked-card.is-verified { border-color: rgba(34,197,94,.3); background: rgba(34,197,94,.05); } .mc-bridge-linked-card.is-pending { border-color: rgba(245,158,11,.25); background: rgba(245,158,11,.04); } .mc-bridge-head { width: 48px; height: 48px; border-radius: 6px; image-rendering: pixelated; flex-shrink: 0; } .mc-bridge-linked-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; } .mc-bridge-mc-name { font-size: 1.05rem; font-weight: 700; color: var(--wbf-text, #e2e8f0); } .mc-bridge-server-hint { font-size: .78rem; color: var(--wbf-text-muted, #64748b); } .mc-bridge-server-hint i { margin-right: 3px; } /* Badges */ .mc-bridge-badge { display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: 20px; font-size: .78rem; font-weight: 600; } .mc-bridge-badge--ok { background: rgba(34,197,94,.15); color: #22c55e; } .mc-bridge-badge--wait { background: rgba(245,158,11,.15); color: #f59e0b; } /* Buttons */ .mc-bridge-actions { display: flex; gap: 8px; margin-left: auto; } .mc-bridge-btn { padding: 6px 12px; border: none; border-radius: 6px; font-size: .82rem; font-weight: 600; cursor: pointer; transition: opacity .15s; } .mc-bridge-btn:disabled { opacity: .5; cursor: wait; } .mc-bridge-btn--link { background: var(--wbf-accent, #38bdf8); color: #0f172a; } .mc-bridge-btn--link:hover { opacity: .85; } .mc-bridge-btn--approve { background: rgba(34,197,94,.2); color: #22c55e; } .mc-bridge-btn--approve:hover { background: rgba(34,197,94,.35); } .mc-bridge-btn--unlink { background: rgba(239,68,68,.15); color: #f87171; } .mc-bridge-btn--unlink:hover { background: rgba(239,68,68,.28); } /* Pending-Hinweis */ .mc-bridge-pending-hint { margin-top: 10px; padding: 9px 13px; background: rgba(245,158,11,.07); border-left: 3px solid #f59e0b; border-radius: 0 6px 6px 0; font-size: .85rem; color: #fcd34d; line-height: 1.5; } .mc-bridge-pending-hint i { margin-right: 5px; } /* Verknüpfungs-Formular */ .mc-bridge-link-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin-bottom: 10px; } .mc-bridge-link-form label { display: flex; flex-direction: column; gap: 4px; font-size: .82rem; color: var(--wbf-text-muted, #94a3b8); } .mc-bridge-link-form input, .mc-bridge-link-form select { padding: 7px 11px; background: rgba(15,23,42,.6); border: 1px solid rgba(100,116,139,.3); border-radius: 6px; color: var(--wbf-text, #e2e8f0); font-size: .9rem; min-width: 180px; } .mc-bridge-link-form input:focus, .mc-bridge-link-form select:focus { outline: none; border-color: var(--wbf-accent, #38bdf8); } /* ── Admin-Badge in User-Tabelle ──────────────────────────────────────────── */ .mc-bridge-admin-mc-badge { display: inline-flex; align-items: center; gap: 5px; padding: 2px 7px; background: rgba(56,189,248,.1); border: 1px solid rgba(56,189,248,.25); border-radius: 20px; font-size: .78rem; color: #38bdf8; vertical-align: middle; } .mc-bridge-admin-mc-badge img { width: 20px; height: 20px; border-radius: 3px; image-rendering: pixelated; }