/* لوحة بريد دروب أيديا — هوية العلامة · خط تجوّل · RTL
   الألوان مستخرَجة من ملف اللوقو نفسه، ثلاثة لا غير:
   كهرماني #EBB22D (حرف الـ d) · فحمي #424242 (الكلمة) · أخضر #2DB67D (القطرة) */
:root{
  --amber:#EBB22D; --amber-d:#D29A16; --amber-ink:#8C6410;
  --green:#2DB67D; --green-d:#1C7C53;
  --ink:#424242;                     /* فحمي العلامة — العناوين */
  --text:#2F3033; --muted:#6E7076;
  --bg:#F4F5F7; --surface:#FFFFFF; --raised:#FAFAFB; --line:#E4E6EA;
  --ok:#1C7C53; --danger:#C0392B; --warn:#8C6410;
  --r:14px; --shadow:0 6px 24px rgba(66,66,66,.08);
  --num:"IBM Plex Sans","Tajawal",sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:
    radial-gradient(900px 420px at 90% -8%, rgba(235,178,45,.13), transparent 62%),
    radial-gradient(700px 360px at 2% 4%, rgba(45,182,125,.08), transparent 58%),
    var(--bg);
  color:var(--text);
  font-family:"Tajawal",system-ui,sans-serif;
  font-size:16px; line-height:1.75;
  min-height:100vh; display:flex; flex-direction:column;
}
.shell{width:100%; max-width:1080px; margin-inline:auto; padding-inline:20px}
main.shell{flex:1; padding-block:28px}
/* توسيط رأسي حقيقي لصفحة الدخول */
main.centered{display:flex; align-items:center; justify-content:center; padding-block:40px}

a{color:var(--amber-ink); text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{color:var(--ink)}

/* ── الترويسة ── */
.top{border-bottom:1px solid var(--line); background:rgba(255,255,255,.88); backdrop-filter:blur(10px);
     position:sticky; top:0; z-index:40}
.top-in{display:flex; align-items:center; gap:22px; min-height:70px}
.brand img{height:34px; display:block}
.nav{display:flex; gap:6px; margin-inline-start:auto}
.nav a{padding:9px 15px; border-radius:10px; color:var(--muted); font-weight:500}
.nav a:hover{background:rgba(235,178,45,.12); color:var(--ink); text-decoration:none}
.nav a.on{background:rgba(235,178,45,.20); color:var(--amber-ink); font-weight:700}
.out{margin:0}

/* ── البطاقات ── */
.card{background:var(--surface);
      border:1px solid var(--line); border-radius:var(--r); padding:26px; box-shadow:var(--shadow)}
.card + .card{margin-top:20px}
.card h2{margin:0 0 6px; font-size:1.2rem; font-weight:700}
.card .sub{color:var(--muted); font-size:.92rem; margin:0 0 18px}

/* ── الدخول ── */
.login{width:100%; max-width:430px}
.login .logo{text-align:center; margin-bottom:22px}
.login .logo img{height:56px}
.login h1{font-size:1.3rem; margin:0 0 4px; text-align:center}
.login .sub{text-align:center}

/* ── النماذج ── */
label{display:block; margin-bottom:7px; font-weight:500; font-size:.93rem; color:var(--ink)}
input[type=text],input[type=password],input[type=email],select{
  width:100%; padding:13px 15px; border-radius:11px;
  border:1px solid #D7DAE0; background:#FFF; color:var(--text);
  font-family:inherit; font-size:1rem; outline:none; transition:border-color .15s, box-shadow .15s;
}
input:focus,select:focus{border-color:var(--amber); box-shadow:0 0 0 3px rgba(235,178,45,.25)}
.field{margin-bottom:17px}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.hint{color:var(--muted); font-size:.84rem; margin-top:6px}

/* الأرقام والقيم اللاتينية داخل نصّ عربي — بلا انقلاب */
.num,code,.mono{font-family:var(--num); direction:ltr; unicode-bidi:isolate; display:inline-block}

/* ── الأزرار ── */
.btn,.btn-ghost,.btn-danger{
  font-family:inherit; font-size:1rem; font-weight:700; cursor:pointer;
  border-radius:11px; padding:13px 22px; border:1px solid transparent; transition:.15s;
}
.btn{width:100%; background:linear-gradient(180deg,var(--amber),var(--amber-d)); color:#3A2A00;
     box-shadow:0 2px 10px rgba(235,178,45,.35)}
.btn:hover{filter:brightness(1.05)}
.btn-sm{width:auto; padding:9px 16px; font-size:.9rem}
.btn-ghost{background:#FFF; border-color:#D7DAE0; color:var(--muted); padding:9px 16px; font-size:.9rem}
.btn-ghost:hover{color:var(--ink); border-color:var(--amber); background:rgba(235,178,45,.08)}
.btn-danger{background:#FFF; border-color:rgba(192,57,43,.35); color:var(--danger);
            padding:9px 16px; font-size:.9rem}
.btn-danger:hover{background:rgba(192,57,43,.08); border-color:var(--danger)}

/* ── الجداول ── */
table{width:100%; border-collapse:collapse; margin-top:6px}
th,td{padding:13px 12px; text-align:right; border-bottom:1px solid var(--line)}
th{color:var(--muted); font-weight:500; font-size:.86rem}
tr:last-child td{border-bottom:none}
td .mono{font-size:.94rem}
.actions{display:flex; gap:8px; justify-content:flex-start}
@media(max-width:720px){
  .row2{grid-template-columns:1fr}
  table,thead,tbody,th,td,tr{display:block}
  thead{display:none}
  tr{border:1px solid var(--line); border-radius:12px; margin-bottom:12px; padding:8px; background:var(--raised)}
  td{border:none; display:flex; justify-content:space-between; gap:12px; padding:8px 10px}
  td::before{content:attr(data-l); color:var(--muted); font-size:.85rem}
  .actions{justify-content:flex-end}
}

/* ── الإحصاءات ── */
.stats{display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; margin-bottom:20px}
.stat{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:18px;
      box-shadow:var(--shadow)}
.stat .k{color:var(--muted); font-size:.85rem}
.stat .v{font-size:1.5rem; font-weight:700; margin-top:4px; color:var(--ink)}
.bar{height:7px; border-radius:99px; background:#ECEEF1; margin-top:10px; overflow:hidden}
.bar i{display:block; height:100%; background:linear-gradient(90deg,var(--green),var(--amber))}

/* ── التنبيهات ── */
.flash{padding:14px 18px; border-radius:12px; margin-bottom:18px; border:1px solid}
.flash.ok{background:rgba(45,182,125,.10); border-color:rgba(45,182,125,.45); color:var(--green-d)}
.flash.err{background:rgba(192,57,43,.08); border-color:rgba(192,57,43,.35); color:var(--danger)}
.flash.info{background:rgba(235,178,45,.12); border-color:rgba(235,178,45,.45); color:var(--amber-ink)}
.pill{display:inline-block; padding:3px 11px; border-radius:99px; font-size:.78rem;
      background:rgba(235,178,45,.18); color:var(--amber-ink); font-weight:500}

/* ── التذييل ── */
.foot{border-top:1px solid var(--line); padding:20px 0; color:var(--muted); font-size:.88rem; margin-top:30px}

/* كلمة مرور مولَّدة */
.genbox{background:rgba(235,178,45,.08); border:1px dashed rgba(235,178,45,.55);
        border-radius:11px; padding:14px 16px; margin-top:12px}