/* IPTV Customer Manager — Professional Portal Theme */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

.iptv-theme-dark, .iptv-pro{
    --iptv-bg:#05070d;
    --iptv-bg-grad: radial-gradient(circle at 15% 0%, rgba(37,99,235,0.16), transparent 40%), radial-gradient(circle at 85% 100%, rgba(56,189,248,0.10), transparent 40%), #05070d;
    --iptv-panel:#0d1220;
    --iptv-panel-2:#121a2e;
    --iptv-green:#3b82f6;
    --iptv-green-light:#60a5fa;
    --iptv-green-dark:#1d4ed8;
    --iptv-text:#ffffff;
    --iptv-muted:#8b95ab;
    --iptv-border:#1d2740;
    font-family:'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ---------- Promo Ticker ---------- */
.iptv-ticker{ background:linear-gradient(90deg, var(--iptv-green-dark), var(--iptv-green)); color:#ffffff; overflow:hidden; border-radius:8px; margin-bottom:18px; font-weight:600; font-size:13px; white-space:nowrap; }
.iptv-ticker-track{ display:inline-flex; gap:60px; padding:9px 0; animation:iptvScroll 18s linear infinite; }
.iptv-ticker-track span{ padding-left:30px; }
@keyframes iptvScroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ---------- Login Page ---------- */
.iptv-pro{ background:var(--iptv-bg-grad); border-radius:16px; padding:18px; }
.iptv-login-wrap{ min-height:65vh; display:flex; align-items:center; justify-content:center; padding:30px 16px; }
.iptv-login-box{ background:var(--iptv-panel); border:1px solid var(--iptv-border); border-radius:18px; padding:42px 36px; width:100%; max-width:400px; box-shadow:0 20px 60px rgba(0,0,0,0.4), 0 0 0 1px rgba(59,130,246,0.05); text-align:center; }
.iptv-login-logo{ display:inline-flex; align-items:center; font-weight:800; letter-spacing:2px; font-size:18px; color:#ffffff; background:linear-gradient(135deg,var(--iptv-green-light),var(--iptv-green-dark)); padding:10px 20px; border-radius:10px; margin-bottom:18px; box-shadow:0 8px 20px rgba(59,130,246,0.25); }
.iptv-login-logo span{ color:#ffffff; opacity:.6; margin-left:4px; }
.iptv-login-box h2{ color:var(--iptv-text); margin:0 0 4px; font-size:22px; font-weight:700; }
.iptv-login-sub{ color:var(--iptv-muted); font-size:13px; margin:0 0 18px; }
.iptv-login-box label{ display:block; text-align:left; color:var(--iptv-muted); font-size:12px; text-transform:uppercase; letter-spacing:.5px; margin:14px 0 6px; font-weight:500; }
.iptv-login-box input{ width:100%; padding:12px 14px; background:#070a09; border:1px solid var(--iptv-border); border-radius:10px; color:var(--iptv-text); font-family:inherit; box-sizing:border-box; }
.iptv-login-box input:focus{ outline:none; border-color:var(--iptv-green); box-shadow:0 0 0 3px rgba(59,130,246,0.15); }
.iptv-login-error{ background:rgba(239,68,68,0.12); color:#fca5a5; border:1px solid rgba(239,68,68,0.3); padding:9px 12px; border-radius:8px; font-size:13px; margin-bottom:6px; }
.iptv-login-badges{ display:flex; justify-content:space-between; margin-top:26px; padding-top:18px; border-top:1px solid var(--iptv-border); }
.iptv-badge{ display:flex; flex-direction:column; }
.iptv-badge strong{ color:var(--iptv-green-light); font-size:14px; }
.iptv-badge span{ color:var(--iptv-muted); font-size:10px; text-transform:uppercase; letter-spacing:.4px; margin-top:2px; }

/* ---------- Dashboard Shell ---------- */
.iptv-portal{ background:var(--iptv-bg-grad); color:var(--iptv-text); border-radius:16px; padding:26px; font-family:'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
.iptv-topbar{ display:flex; justify-content:space-between; align-items:center; padding-bottom:18px; border-bottom:1px solid var(--iptv-border); margin-bottom:16px; flex-wrap:wrap; gap:10px; }
.iptv-brand{ font-weight:800; font-size:19px; color:var(--iptv-green-light); letter-spacing:.3px; display:flex; align-items:center; gap:8px; }
.iptv-brand::before{ content:"▣"; color:var(--iptv-green); }
.iptv-user{ color:var(--iptv-muted); font-size:14px; }
.iptv-user a.iptv-logout{ color:#fca5a5; text-decoration:none; margin-left:10px; font-weight:500; }
.iptv-user a.iptv-logout:hover{ text-decoration:underline; }

.iptv-tabs{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:22px; }
.iptv-tab-btn, a.iptv-tab-link{ background:var(--iptv-panel); color:var(--iptv-muted); border:1px solid var(--iptv-border); padding:10px 18px; border-radius:30px; cursor:pointer; font-size:13px; font-weight:500; transition:all .15s; text-decoration:none; font-family:inherit; }
.iptv-tab-btn:hover, a.iptv-tab-link:hover{ color:var(--iptv-text); border-color:var(--iptv-green); }
.iptv-tab-btn.active, a.iptv-tab-link.active{ background:linear-gradient(135deg,var(--iptv-green-light),var(--iptv-green-dark)); color:#ffffff; border-color:transparent; font-weight:700; box-shadow:0 6px 16px rgba(59,130,246,0.25); }
.iptv-tab-content{ display:none; animation:iptvFade .2s ease; }
.iptv-tab-content.active{ display:block; }
@keyframes iptvFade{ from{opacity:0;} to{opacity:1;} }

.iptv-card{ background:var(--iptv-panel); border:1px solid var(--iptv-border); border-radius:14px; padding:22px; margin-bottom:18px; }
.iptv-card h3,.iptv-card h4{ color:var(--iptv-green-light); margin-top:0; font-weight:700; }
.iptv-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:700px){ .iptv-grid-2{ grid-template-columns:1fr; } }

.iptv-table-wrap{ overflow-x:auto; border-radius:12px; }
.iptv-table{ width:100%; border-collapse:collapse; background:var(--iptv-panel); border-radius:12px; overflow:hidden; }
.iptv-table th, .iptv-table td{ padding:12px 14px; border-bottom:1px solid var(--iptv-border); text-align:left; font-size:13px; }
.iptv-table th{ color:var(--iptv-green-light); text-transform:uppercase; font-size:11px; letter-spacing:.5px; background:var(--iptv-panel-2); }
.iptv-table tr:hover td{ background:rgba(59,130,246,0.03); }

.iptv-card form label{ display:block; margin:12px 0 6px; color:var(--iptv-muted); font-size:12px; text-transform:uppercase; letter-spacing:.4px; font-weight:500; }
.iptv-card form input, .iptv-card form select, .iptv-card form textarea{ width:100%; padding:10px 12px; background:#070a09; border:1px solid var(--iptv-border); border-radius:9px; color:var(--iptv-text); font-family:inherit; box-sizing:border-box; }
.iptv-card form input:focus, .iptv-card form select:focus, .iptv-card form textarea:focus{ outline:none; border-color:var(--iptv-green); }

.iptv-btn{ background:linear-gradient(135deg,var(--iptv-green-light),var(--iptv-green-dark)); color:#ffffff; border:none; padding:11px 22px; border-radius:9px; font-weight:700; cursor:pointer; margin-top:16px; font-family:inherit; box-shadow:0 6px 16px rgba(59,130,246,0.2); }
.iptv-btn:hover{ filter:brightness(1.08); }
.iptv-btn-block{ width:100%; }
.iptv-btn-sm{ background:var(--iptv-green); color:#ffffff; border:none; padding:6px 12px; border-radius:7px; font-size:12px; cursor:pointer; font-weight:600; }
.iptv-inline-form{ display:flex; gap:6px; align-items:center; flex-wrap:wrap; }

.iptv-flash{ background:rgba(59,130,246,0.12); border:1px solid var(--iptv-green); color:var(--iptv-green-light); padding:11px 16px; border-radius:10px; margin-bottom:18px; font-size:14px; font-weight:500; }

.iptv-kb-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:16px; margin-bottom:28px; }
.iptv-kb-blog-card{ background:var(--iptv-panel); border:1px solid var(--iptv-border); border-radius:12px; overflow:hidden; transition:transform .15s; }
.iptv-kb-blog-card:hover{ transform:translateY(-2px); border-color:var(--iptv-green); }
.iptv-kb-blog-card img{ width:100%; height:130px; object-fit:cover; }
.iptv-kb-blog-card h4{ padding:12px 14px 0; margin:0; font-size:15px; }
.iptv-kb-excerpt{ padding:6px 14px 16px; color:var(--iptv-muted); font-size:13px; line-height:1.5; }

.iptv-promo-card{ border-left:3px solid var(--iptv-green); background:linear-gradient(135deg, var(--iptv-panel), var(--iptv-panel-2)); }

/* ---------- Agent Cards (CRM-style) ---------- */
.iptv-agent-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; }
.iptv-agent-card{ margin-bottom:0; }
.iptv-agent-card-top{ display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.iptv-agent-photo{ width:48px; height:48px; border-radius:50%; object-fit:cover; border:2px solid var(--iptv-green); }
.iptv-agent-photo-fallback{ display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--iptv-green-light),var(--iptv-green-dark)); color:#ffffff; font-weight:700; font-size:18px; }
.iptv-agent-card p{ margin:4px 0; color:var(--iptv-text); }