/* การ์ด "ติดตามเรา" — frontend/partials/social-follow-card.blade.php (ใช้ในหน้า preview ของ admin ด้วย) */
.social-follow-card{background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.06);border:1px solid #eef2f7;font-family:inherit}
.sfc-header{position:relative;padding:24px 16px 16px;text-align:center;color:#fff}
.sfc-header-bg{position:absolute;inset:0;background:linear-gradient(135deg,#7f1d1d 0%,#ef4444 50%,#ff6b35 100%);opacity:.95;z-index:0}
.sfc-brand{position:relative;z-index:1}
.sfc-logo{width:64px;height:64px;border-radius:50%;background:#fff;margin:0 auto 8px;padding:6px;box-shadow:0 2px 8px rgba(0,0,0,.15);overflow:hidden;display:flex;align-items:center;justify-content:center}
.sfc-logo img{width:100%;height:100%;object-fit:contain;border-radius:50%}
.sfc-brand-name{font-size:18px;font-weight:700;line-height:1.2;color:#fff}
.sfc-tagline{font-size:12px;opacity:.95;margin-top:4px;color:#ffe4e6}

.sfc-channels{padding:8px 0}
.sfc-channel{display:flex;align-items:center;gap:12px;padding:10px 14px;text-decoration:none;color:#1f2937;border-bottom:1px solid #f3f4f6;transition:all .15s ease;background:#fff}
.sfc-channel:last-child{border-bottom:none}
.sfc-channel:hover{background:#f9fafb;color:#1f2937;text-decoration:none;transform:translateX(2px)}
.sfc-channel.sfc-hidden{display:none}
.sfc-channel-icon{width:36px;height:36px;border-radius:8px;background:var(--sfc-color);color:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;box-shadow:0 1px 3px rgba(0,0,0,.1)}
.sfc-channel-info{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}
.sfc-channel-name{font-size:13px;font-weight:600;color:#1f2937}
.sfc-channel-tag{font-size:11px;color:#6b7280;margin-top:1px}
.sfc-channel-followers{font-size:11px;font-weight:600;color:var(--sfc-color);background:color-mix(in srgb,var(--sfc-color) 10%,transparent);padding:3px 8px;border-radius:10px;flex-shrink:0}
.sfc-channel-tag:empty,.sfc-channel-followers:empty{display:none}
.sfc-channel-arrow{font-size:11px;color:#9ca3af;flex-shrink:0;transition:transform .15s ease}
.sfc-channel:hover .sfc-channel-arrow{transform:translateX(3px);color:var(--sfc-color)}

@media (max-width:768px){
    .sfc-header{padding:18px 12px 12px}
    .sfc-logo{width:54px;height:54px}
    .sfc-brand-name{font-size:16px}
    .sfc-tagline{font-size:11px}
    .sfc-channel{padding:9px 12px;gap:10px}
    .sfc-channel-icon{width:32px;height:32px;font-size:14px}
}