/* ELDERCS.RO – bloc Discord (date din discord.php) */
.ec-dc { position: relative; border-radius: 10px; overflow: hidden; background: rgba(10, 10, 12, .7); backdrop-filter: blur(8px); border: 1px solid rgba(88, 101, 242, .35); }
.ec-dc .dc-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 22px 26px; border-bottom: 1px solid rgba(255, 255, 255, .07);
    background: radial-gradient(120% 160% at 0% 0%, rgba(88, 101, 242, .28), transparent 60%), linear-gradient(90deg, rgba(229, 141, 39, .08), transparent); }
.ec-dc .dc-id { display: flex; align-items: center; gap: 16px; min-width: 0; }
.ec-dc .dc-ic { position: relative; flex: 0 0 64px; width: 64px; height: 64px; border-radius: 50%; background: #5865f2 center/cover no-repeat; display: flex; align-items: center; justify-content: center; font-size: 1.8rem; box-shadow: 0 0 0 3px rgba(88, 101, 242, .35), 0 0 22px rgba(88, 101, 242, .45); }
.ec-dc .dc-ic::after { content: ''; position: absolute; right: 1px; bottom: 1px; width: 15px; height: 15px; border-radius: 50%; background: #3ddc84; border: 3px solid #111; }
.ec-dc .dc-name { font-family: 'Orbitron', sans-serif; font-weight: 900; letter-spacing: 2px; font-size: clamp(1rem, 2.6vw, 1.35rem); text-transform: uppercase; }
.ec-dc .dc-stats { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 6px; font-weight: 700; letter-spacing: 1px; font-size: .9rem; color: rgba(255, 255, 255, .65); text-transform: uppercase; }
.ec-dc .dc-stats b { color: #fff; }
.ec-dc .dc-stats .on i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #3ddc84; margin-right: 6px; animation: dc-ping 1.6s infinite; }
.ec-dc .dc-stats .vc i { color: #eb4b4b; margin-right: 6px; }
.ec-dc .dc-stats .sep { width: 1px; height: 14px; background: rgba(255, 255, 255, .2); }
@keyframes dc-ping { 0% { box-shadow: 0 0 0 0 rgba(61, 220, 132, .7); } 80%, 100% { box-shadow: 0 0 0 7px rgba(61, 220, 132, 0); } }
.ec-dc .dc-join { position: relative; overflow: hidden; display: inline-flex; align-items: center; gap: 10px; padding: 13px 26px; border-radius: 8px; background: #5865f2; color: #fff; text-decoration: none; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; box-shadow: 0 8px 24px -8px rgba(88, 101, 242, .9); transition: transform .2s ease, filter .2s ease; }
.ec-dc .dc-join::before { content: ''; position: absolute; top: 0; bottom: 0; width: 40%; left: -60%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .35), transparent); transform: skewX(-20deg); animation: dc-shine 3.5s ease-in-out infinite; }
@keyframes dc-shine { 0%, 60% { left: -60%; } 100% { left: 130%; } }
.ec-dc .dc-join:hover { transform: translateY(-2px); filter: brightness(1.1); }
.ec-dc .dc-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; padding: 20px 26px; }
.ec-dc .dc-m { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 9px 12px; border-radius: 10px; background: rgba(255, 255, 255, .025); border: 1px solid rgba(255, 255, 255, .06); transition: background .2s, border-color .2s; }
.ec-dc .dc-m:hover { background: rgba(88, 101, 242, .08); border-color: rgba(88, 101, 242, .35); }
.ec-dc .dc-av { position: relative; flex: 0 0 40px; width: 40px; height: 40px; }
.ec-dc .dc-av img { width: 40px; height: 40px; border-radius: 10px; object-fit: cover; background: #1a1a1d; }
.ec-dc .dc-av s { position: absolute; right: -3px; bottom: -3px; width: 12px; height: 12px; border-radius: 50%; border: 3px solid #111; background: #3ddc84; }
.ec-dc .dc-av s.idle { background: #f0b232; } .ec-dc .dc-av s.dnd { background: #f23f43; }
.ec-dc .dc-who { min-width: 0; }
.ec-dc .dc-who b { display: block; font-size: .98rem; letter-spacing: .5px; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ec-dc .dc-who small { display: block; font-size: .72rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: rgba(255, 255, 255, .45); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ec-dc .dc-who small.v { color: #eb4b4b; }
.ec-dc .dc-who small.v i { margin-left: 6px; animation: dc-blink 1.4s ease-in-out infinite; }
@keyframes dc-blink { 50% { opacity: .35; } }
.ec-dc .dc-more { grid-column: 1 / -1; justify-self: center; margin-top: 4px; background: none; border: 0; color: #fff; cursor: pointer; font-family: 'Orbitron', sans-serif; font-weight: 700; font-size: .78rem; letter-spacing: 3px; padding: 10px 14px; opacity: .8; }
.ec-dc .dc-more:hover { opacity: 1; color: var(--cs-orange, #e58d27); }
.ec-dc .dc-note { padding: 18px 26px; color: rgba(255, 255, 255, .6); text-align: center; }
@media (max-width: 700px) { .ec-dc .dc-list { grid-template-columns: 1fr; padding: 14px; } .ec-dc .dc-top { padding: 18px; justify-content: center; text-align: center; } .ec-dc .dc-id { flex-direction: column; } .ec-dc .dc-stats { justify-content: center; } }