@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;600;700;800&display=swap');
:root{--ink:#163537;--muted:#708485;--green:#0b6b63;--mint:#e6f4f0;--line:#e4ece9;--bg:#f4f7f6;--gold:#c39954;--danger:#bd4b4b;--white:#fff}
*{box-sizing:border-box}body{margin:0;font-family:Tajawal,Arial,sans-serif;color:var(--ink);background:var(--bg)}button,input,select,textarea{font:inherit}.hidden{display:none!important}.error{color:var(--danger);font-size:13px;margin-top:10px}.login-screen{min-height:100vh;display:grid;grid-template-columns:1.15fr .85fr;background:#fff}.login-art{background:linear-gradient(145deg,#083f3c,#0c766b);color:#fff;padding:9vw;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}.login-art:after{content:'';position:absolute;width:480px;height:480px;border:1px solid #ffffff29;border-radius:50%;left:-160px;bottom:-180px;box-shadow:0 0 0 70px #ffffff08,0 0 0 140px #ffffff08}.brand-mark{width:62px;height:62px;border:1px solid #ffffff80;display:grid;place-items:center;border-radius:18px;font-weight:800;font-size:22px}.login-art h1{font-size:54px;line-height:1.25;margin:32px 0 15px}.login-art p{max-width:500px;line-height:2;color:#d3e8e3}.login-card{width:min(410px,80%);margin:auto}.brand-mobile{font-weight:800;letter-spacing:2px;margin-bottom:70px}.brand-mobile span{color:var(--gold)}.login-card h2{font-size:30px;margin-bottom:5px}.login-card>p{color:var(--muted);margin-bottom:36px}.login-card label{display:block;font-size:14px;font-weight:600;margin:17px 0}.login-card input,.form-grid input,.form-grid select{width:100%;border:1px solid var(--line);border-radius:10px;padding:13px;margin-top:7px;outline:0}.login-card input:focus,.form-grid input:focus{border-color:var(--green);box-shadow:0 0 0 3px #0b6b6312}.login-card button,.primary{border:0;background:var(--green);color:#fff;border-radius:10px;padding:13px 20px;font-weight:700;cursor:pointer}.login-card button{width:100%;margin-top:10px}.app{display:grid;grid-template-columns:245px 1fr;min-height:100vh}aside{background:#0a4946;color:#fff;padding:25px 18px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}.logo{display:flex;align-items:center;gap:12px;padding:5px 8px 35px;font-size:15px;letter-spacing:1px}.logo b{color:#d4b06e}.logo small{display:block;color:#9fc4bf;font-size:10px;letter-spacing:0;margin-top:3px}.logo-icon{width:39px;height:39px;border:1px solid #ffffff75;border-radius:12px;display:grid;place-items:center;font-weight:800}nav{display:grid;gap:7px}nav button{display:flex;align-items:center;gap:13px;border:0;color:#c5ddda;background:transparent;padding:13px;border-radius:9px;cursor:pointer;text-align:right}nav button.active,nav button:hover{background:#ffffff16;color:#fff}nav i{margin-right:auto;background:#d2a459;color:#173b39;border-radius:20px;font-style:normal;font-size:11px;padding:2px 7px}.side-foot{margin-top:auto;border-top:1px solid #ffffff1f;padding-top:18px;display:flex;gap:10px;align-items:center}.side-foot small{display:block;color:#9fc4bf;font-size:11px}.side-foot>button{margin-right:auto;color:#fff;background:none;border:0;font-size:20px;cursor:pointer}.user-avatar{width:38px;height:38px;border-radius:50%;background:#d3aa65;color:#183c39;display:grid;place-items:center;font-weight:800}main{min-width:0;padding:0 35px 45px}header{height:105px;display:flex;align-items:center;justify-content:space-between}header h1{margin:0;font-size:24px}header p{margin:5px 0 0;color:var(--muted);font-size:13px}.header-actions{display:flex;gap:10px}.icon-btn,.secondary{border:1px solid var(--line);background:#fff;padding:10px 15px;border-radius:9px;color:var(--ink);cursor:pointer}.menu-btn{display:none}.hero{background:linear-gradient(110deg,#0b5c56,#128278);color:#fff;border-radius:18px;padding:28px 35px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 10px 30px #0b6b6314}.hero span{color:#b9ded8;font-size:13px}.hero h2{font-size:28px;margin:7px 0}.hero p{margin:0;color:#d4e9e6}.hero-ring{width:110px;height:110px;border:8px solid #ffffff24;border-top-color:#d6b273;border-radius:50%;display:grid;place-content:center;text-align:center}.hero-ring b{font-size:23px}.hero-ring small{font-size:10px;color:#d2e4e1}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin:18px 0}.stats article{background:#fff;border:1px solid var(--line);border-radius:13px;padding:19px;display:flex;gap:14px;align-items:center}.stats small{display:block;color:var(--muted);font-size:12px}.stats b{display:block;font-size:25px;margin-top:3px}.stat-icon{width:43px;height:43px;border-radius:12px;display:grid;place-items:center;font-weight:800}.blue{background:#e8f0fa;color:#4175a6}.orange{background:#fbefe1;color:#c47a2f}.green{background:#e5f4ef;color:#147467}.gold{background:#f7f0e5;color:#b0823b}.grid{display:grid;grid-template-columns:1.6fr 1fr;gap:18px;margin-bottom:18px}.panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.panel-head h3{margin:0;font-size:17px}.panel-head p{margin:4px 0 0;color:var(--muted);font-size:12px}.panel-head>b{background:#f9e8e8;color:var(--danger);padding:7px 12px;border-radius:20px}.pipeline{display:grid;gap:12px}.pipe-row{display:grid;grid-template-columns:110px 1fr 35px;align-items:center;gap:10px;font-size:13px}.bar{height:9px;background:#eef2f1;border-radius:10px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,#0c6b63,#59aaa1);border-radius:10px}.mini-list.empty,.empty-state{color:var(--muted);text-align:center;padding:35px}.mini-item{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:11px 0;font-size:13px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:right;color:var(--muted);font-weight:500;background:#f7f9f8}th,td{padding:13px;border-bottom:1px solid var(--line)}.toolbar{display:flex;gap:12px;margin-bottom:15px}.search{flex:1;background:#fff;border:1px solid var(--line);border-radius:10px;padding:0 14px;display:flex;align-items:center}.search input{border:0;outline:0;padding:12px;width:100%;background:transparent}.toolbar select{border:1px solid var(--line);border-radius:10px;padding:0 15px;background:#fff}.leads-layout{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(450px,1.2fr);gap:15px;height:calc(100vh - 180px)}.leads-list,.lead-detail{overflow:auto;padding:0}.lead-row{padding:16px 18px;border-bottom:1px solid var(--line);cursor:pointer;display:grid;grid-template-columns:45px 1fr auto;gap:11px}.lead-row:hover,.lead-row.active{background:#f1f8f6}.lead-row .avatar{width:43px;height:43px;border-radius:50%;background:var(--mint);display:grid;place-items:center;color:var(--green);font-weight:800}.lead-row h4{margin:0 0 4px}.lead-row p{margin:0;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:240px}.lead-row time{font-size:10px;color:var(--muted)}.badge{display:inline-block;padding:4px 8px;border-radius:20px;background:var(--mint);color:var(--green);font-size:10px}.detail-head{padding:20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}.detail-head h3{margin:0}.detail-head p{margin:4px 0;color:var(--muted)}.detail-body{display:grid;grid-template-columns:1fr 230px;height:calc(100% - 82px)}.conversation{padding:20px;display:flex;flex-direction:column}.messages{flex:1;overflow:auto;display:flex;flex-direction:column;gap:9px}.msg{max-width:75%;padding:10px 13px;border-radius:12px;font-size:13px;background:#f0f3f2}.msg.out{align-self:flex-start;background:#daf0eb}.msg small{display:block;color:var(--muted);font-size:9px;margin-top:5px}.reply{display:flex;gap:8px;border-top:1px solid var(--line);padding-top:12px}.reply textarea{resize:none;flex:1;border:1px solid var(--line);border-radius:9px;padding:10px}.reply button{border:0;background:var(--green);color:#fff;border-radius:9px;padding:0 18px}.lead-meta{border-right:1px solid var(--line);padding:18px;overflow:auto}.lead-meta label{display:block;font-size:11px;color:var(--muted);margin:12px 0}.lead-meta input,.lead-meta select{width:100%;padding:8px;border:1px solid var(--line);border-radius:7px;margin-top:4px;color:var(--ink)}.lead-meta button{width:100%;margin-top:10px}.cards-list{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.follow-card{border:1px solid var(--line);border-right:4px solid #d6a04a;border-radius:10px;padding:15px}.follow-card h4{margin:0}.follow-card p{color:var(--muted);font-size:12px}dialog{border:0;border-radius:16px;width:min(620px,92%);padding:28px;box-shadow:0 30px 100px #183c3950}dialog::backdrop{background:#1635378c}.close{float:left;border:0;background:none;font-size:25px;cursor:pointer}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:25px 0}.form-grid label{font-size:13px;font-weight:600}.modal-actions{display:flex;justify-content:flex-end;gap:9px}#toast{position:fixed;bottom:25px;left:25px;background:#173f3c;color:#fff;padding:12px 20px;border-radius:9px;transform:translateY(100px);transition:.25s;z-index:20}#toast.show{transform:translateY(0)}
@media(max-width:1000px){.stats{grid-template-columns:1fr 1fr}.grid{grid-template-columns:1fr}.app{grid-template-columns:80px 1fr}aside{padding:20px 10px}.logo div,nav span,.side-foot>div:not(.user-avatar){display:none}.logo{justify-content:center}.leads-layout{grid-template-columns:1fr}.lead-detail{position:fixed;inset:20px;z-index:5;box-shadow:0 15px 80px #173d3a55}.lead-detail:has(.empty-state){display:none}.cards-list{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.login-screen{grid-template-columns:1fr}.login-art{display:none}.login-card{width:86%}.app{display:block}.app aside{position:fixed;right:-260px;width:245px;z-index:10;transition:.2s}.app aside.open{right:0}.logo div,nav span,.side-foot>div:not(.user-avatar){display:block}.menu-btn{display:block;border:0;background:none;font-size:22px}main{padding:0 15px 30px}header{height:85px}.header-actions .icon-btn{display:none}.hero{padding:22px}.hero h2{font-size:21px}.hero-ring{display:none}.stats{grid-template-columns:1fr 1fr}.stats article{padding:13px}.stat-icon{display:none}.stats b{font-size:21px}.form-grid{grid-template-columns:1fr}.cards-list{grid-template-columns:1fr}.detail-body{grid-template-columns:1fr}.lead-meta{display:none}.lead-detail{inset:5px}.primary{padding:11px}.header-actions .primary{font-size:0}.header-actions .primary:first-letter{font-size:18px}}
.availability-box{margin-top:auto;margin-bottom:14px;padding:12px;background:#ffffff12;border-radius:10px}.availability-box select{width:calc(100% - 20px);background:transparent;color:#fff;border:0;outline:0}.availability-box select option{color:#173f3c}.availability-box>span{display:inline-block;width:9px;height:9px;border-radius:50%;background:#9aaead}.availability-box>span.on{background:#5ee0a9;box-shadow:0 0 0 4px #5ee0a920}.availability-box small{display:block;color:#a9cac6;margin-top:6px;font-size:10px}.side-foot{margin-top:0}.days{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0}.days label{border:1px solid var(--line);padding:8px 10px;border-radius:8px;font-size:12px}.form-note{font-size:12px;color:var(--muted);background:#f4f8f7;padding:10px;border-radius:8px}.status-live{color:#07855d;font-weight:700}.status-off{color:#8a9a99}
