
.act{--b:#D97706;--b2:#F59E0B;--ink:#0F172A;--mut:#64748B;--line:#E8EDF3;--bg:#F7F9FC;--grn:#10B981;display:flex;flex-direction:column;gap:18px;color:var(--ink)}
.act *{box-sizing:border-box}
.act-hero{background:linear-gradient(120deg,#D97706,#F59E0B);border-radius:18px;padding:22px 24px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.act-hero h1{font-size:21px;font-weight:800;margin:0}
.act-hero p{font-size:12.5px;opacity:.92;margin:5px 0 0}
.act-hero-stats{display:flex;gap:11px}
.act-hero-stat{background:rgba(255,255,255,.18);border-radius:13px;padding:11px 17px;text-align:center;min-width:74px}
.act-hero-stat b{font-size:21px;font-weight:800;font-family:'Tajawal';display:block;line-height:1}
.act-hero-stat span{font-size:10.5px;opacity:.9}
.act-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}
@media(max-width:1000px){.act-stats{grid-template-columns:repeat(2,1fr)}}
.act-stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:15px;position:relative}
.act-stat-ic{position:absolute;left:14px;top:14px;width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:16px}
.act-stat-v{font-size:24px;font-weight:800;font-family:'Tajawal';line-height:1;color:#D97706}
.act-stat-l{font-size:11.5px;color:var(--mut);font-weight:600;margin-top:5px}
.act-sec-title{font-size:15px;font-weight:800;display:flex;align-items:center;gap:8px;margin:4px 0}
.act-bar{display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.act-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 15px;border-radius:9px;font-family:'Cairo';font-size:12.5px;font-weight:700;border:none;cursor:pointer}
.act-btn-p{background:var(--b);color:#fff}.act-btn-p:hover{background:#B45309}
.act-btn-o{background:#fff;color:var(--ink);border:1.5px solid var(--line)}.act-btn-o:hover{border-color:var(--b);color:var(--b)}
.act-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(max-width:850px){.act-grid{grid-template-columns:1fr}}
.act-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:16px;border-top:3px solid var(--ac,#D97706)}
.act-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}
.act-card-ic{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;background:var(--acbg,#FEF3C7)}
.act-card-name{font-size:14.5px;font-weight:800}
.act-card-sub{font-size:11.5px;color:var(--mut);margin-top:2px}
.act-badge{font-size:10px;font-weight:800;padding:3px 10px;border-radius:20px}
.act-badge.live{background:#ECFDF5;color:#059669}.act-badge.plan{background:#FEF9C3;color:#92400E}.act-badge.done{background:#EFF6FF;color:#2563EB}
.act-card-meta{font-size:11.5px;color:#475569;margin:9px 0;display:flex;align-items:center;gap:6px}
.act-prog{height:7px;background:#F1F5F9;border-radius:5px;overflow:hidden;margin:8px 0}
.act-prog i{display:block;height:100%;border-radius:5px;background:var(--ac,#D97706)}
.act-card-foot{display:flex;gap:8px;padding-top:11px;border-top:1px solid #F1F5F9;margin-top:4px}
.act-mini{flex:1;padding:7px;border-radius:8px;font-size:11.5px;font-weight:700;border:1px solid var(--line);background:#fff;color:#475569;cursor:pointer}
.act-mini:hover{border-color:var(--b);color:var(--b)}
.act-mini.primary{background:var(--b);color:#fff;border-color:var(--b)}.act-mini.primary:hover{background:#B45309}
.act-mini.danger{color:#DC2626;border-color:#FECACA}.act-mini.danger:hover{background:#DC2626;color:#fff}
.act-field{display:flex;flex-direction:column;gap:5px;margin-bottom:11px}
.act-field label{font-size:11.5px;font-weight:700;color:var(--mut)}
.act-field input,.act-field select,.act-field textarea{padding:9px 11px;border:1.5px solid var(--line);border-radius:9px;font-family:'Cairo';font-size:12.5px;outline:none}
.act-field-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
/* reports */
.act-tabs{display:flex;gap:4px;background:#EEF2F7;border-radius:11px;padding:4px;flex-wrap:wrap;width:fit-content}
.act-tab{padding:8px 15px;border:none;background:transparent;border-radius:8px;font-family:'Cairo';font-size:12.5px;font-weight:700;color:var(--mut);cursor:pointer}
.act-tab.on{background:#fff;color:var(--b);box-shadow:0 1px 3px rgba(217,119,6,.15)}
.act-tbl{width:100%;border-collapse:collapse;font-size:12.5px;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.act-tbl th{background:#FFF7ED;padding:11px;text-align:right;font-weight:800;color:#92400E;font-size:11.5px}
.act-tbl td{padding:10px 11px;border-top:1px solid #F1F5F9}
.act-rep-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}
@media(max-width:850px){.act-rep-cards{grid-template-columns:1fr}}
/* KPI cards (analytics) */
.act-kpi{background:#fff;border:1px solid var(--line);border-radius:15px;padding:16px;transition:transform .15s,box-shadow .15s}
.act-kpi:hover{transform:translateY(-2px);box-shadow:0 10px 24px -14px rgba(0,0,0,.18)}
.act-kpi-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px}
.act-kpi-ic{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:17px}
.act-kpi-trend{font-size:12px;font-weight:800}
.act-kpi-v{font-size:27px;font-weight:800;font-family:'Tajawal';line-height:1}
.act-kpi-l{font-size:12px;color:var(--ink);font-weight:700;margin-top:6px}
.act-kpi-note{font-size:10.5px;color:var(--mut);margin-top:3px}
/* analytics panels */
.act-panel{background:#fff;border:1px solid var(--line);border-radius:15px;padding:17px}
.act-panel-h{font-size:13.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:7px}
.act-dist{margin-bottom:12px}
.act-dist-top{display:flex;justify-content:space-between;font-size:12px;font-weight:700;margin-bottom:5px}
.act-dist-top b{color:var(--mut);font-weight:700}
.act-dist-bar{height:8px;background:#F1F5F9;border-radius:5px;overflow:hidden}
.act-dist-bar i{display:block;height:100%;border-radius:5px;transition:width .5s}
.act-rank{display:flex;align-items:center;gap:11px;margin-bottom:11px}
.act-rank-n{width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;flex-shrink:0}
.act-rank-c{flex:1}
.act-rank-name{font-size:12px;font-weight:700;margin-bottom:4px}
.act-rank-bar{height:6px;background:#F1F5F9;border-radius:4px;overflow:hidden}
.act-rank-bar i{display:block;height:100%;border-radius:4px}
.act-rank-v{font-size:14px;font-weight:800;font-family:'Tajawal';color:var(--ink)}
/* status cards */
.act-status-card{border-radius:15px;padding:18px;text-align:center}
.act-status-ic{font-size:22px;margin-bottom:7px}
.act-status-v{font-size:30px;font-weight:800;font-family:'Tajawal';line-height:1}
.act-status-l{font-size:12px;color:var(--mut);font-weight:700;margin-top:5px}
/* BEAUTIFUL activity cards (v2) */
.act-card2{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:transform .18s,box-shadow .18s;display:flex;flex-direction:column}
.act-card2:hover{transform:translateY(-4px);box-shadow:0 18px 40px -18px rgba(0,0,0,.28)}
.act-card2-banner{height:88px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
.act-card2-banner:after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 70% 30%,rgba(255,255,255,.25),transparent 60%)}
.act-card2-ic{font-size:40px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.2));z-index:1}
.act-card2-banner .act-badge{position:absolute;top:11px;right:11px;background:rgba(255,255,255,.95);z-index:2}
.act-card2-type{position:absolute;bottom:11px;left:11px;font-size:10.5px;font-weight:800;color:#fff;background:rgba(0,0,0,.22);padding:3px 11px;border-radius:20px;z-index:2}
.act-card2-body{padding:15px 16px 12px}
.act-card2-name{font-size:15.5px;font-weight:800;margin-bottom:13px}
.act-card2-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:13px}
.act-card2-stat{text-align:center;background:var(--bg);border-radius:11px;padding:9px 4px}
.act-card2-stat b{font-size:17px;font-weight:800;font-family:'Tajawal';display:block;line-height:1;color:var(--ink)}
.act-card2-stat span{font-size:9.5px;color:var(--mut);font-weight:600;margin-top:3px;display:block}
.act-prog2{height:8px;background:#F1F5F9;border-radius:5px;overflow:hidden;margin-bottom:9px}
.act-prog2 i{display:block;height:100%;border-radius:5px;transition:width .5s}
.act-card2-meta{font-size:11.5px;color:var(--mut);font-weight:600}
.act-card2-foot{display:flex;gap:7px;padding:12px 16px;border-top:1px solid #F1F5F9;background:#FAFCFE;margin-top:auto}
/* picker (choose teachers/grades) */
.act-pick-box{max-height:170px;overflow:auto;border:1.5px solid var(--line);border-radius:11px;padding:8px;display:flex;flex-direction:column;gap:3px}
.act-pick-box.act-pick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.act-pick{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:12.5px;transition:background .12s}
.act-pick:hover{background:var(--bg)}
.act-pick input{width:16px;height:16px;accent-color:var(--b);cursor:pointer}
.act-pick span{font-weight:700}
.act-pick small{color:var(--mut);font-size:10.5px;margin-right:auto}
.act-pick-sm{padding:6px 8px;font-size:11.5px}
/* approval chip on card */
.act-card2-approve{font-size:11px;font-weight:700;color:#475569;background:var(--bg);border-radius:8px;padding:6px 10px;margin-bottom:9px;text-align:center}
/* teacher invites block */
.act-inv-box{background:#fff;border:1px solid var(--line);border-radius:14px;padding:15px;margin-bottom:14px}
.act-inv-h{font-size:14px;font-weight:800;margin-bottom:12px;display:flex;align-items:center;gap:7px}
.act-inv{display:flex;align-items:center;gap:11px;padding:11px;border:1px solid var(--line);border-radius:11px;margin-bottom:8px}
.act-inv-ic{width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:19px;flex-shrink:0}
.act-inv-c{flex:1}
.act-inv-name{font-size:13px;font-weight:800}
.act-inv-sub{font-size:11px;color:var(--mut);margin-top:2px}
.act-inv-actions{display:flex;gap:6px}
.act-inv-yes{padding:7px 14px;border-radius:8px;border:none;background:#ECFDF5;color:#059669;font-family:'Cairo';font-size:11.5px;font-weight:800;cursor:pointer}
.act-inv-yes:hover{background:#059669;color:#fff}
.act-inv-no{padding:7px 14px;border-radius:8px;border:none;background:#FEF2F2;color:#DC2626;font-family:'Cairo';font-size:11.5px;font-weight:800;cursor:pointer}
.act-inv-no:hover{background:#DC2626;color:#fff}
.act-inv-badge{font-size:11px;font-weight:800;padding:5px 12px;border-radius:20px}
.act-inv-badge.yes{background:#ECFDF5;color:#059669}
.act-inv-badge.no{background:#FEF2F2;color:#DC2626}
@media(max-width:850px){.act div[style*="grid-template-columns:1.1fr"],.act div[style*="grid-template-columns:1fr 1fr 1fr"]{grid-template-columns:1fr!important}}
