Update style.css

style.css

@@ -14,8 +14,6 @@
   --radius:16px;
   --shadow:0 4px 20px rgba(0,0,0,.06);
 }
-
-/* Dark mode */
 body.dark{
   --bg:#0f172a;
   --card:#111827;
@@ -26,24 +24,17 @@ body.dark{
   --table-alt:#0b1326;
   --shadow:0 4px 20px rgba(0,0,0,.35);
 }
-
 *{box-sizing:border-box}
 html,body{height:100%}
 body{
-  margin:0; font-family:"Cairo", system-ui, -apple-system, Segoe UI, Arial, sans-serif;
+  margin:0; font-family:"Cairo",system-ui,-apple-system,Segoe UI,Arial,sans-serif;
   color:var(--ink); background:var(--bg); line-height:1.7;
 }
-
 .container{max-width:1100px; margin:24px auto; padding:0 16px}
-
-.center{display:block}
 .hero{margin-bottom:16px}
 .hero-top{display:flex; align-items:center; justify-content:space-between; gap:12px}
-.hero h1{
-  margin:4px 0 6px; font-size:28px; font-weight:700; color:var(--primary);
-}
+.hero h1{margin:4px 0 6px; font-size:28px; font-weight:700; color:var(--primary)}
 .actions-inline{display:flex; gap:8px; align-items:center}
-
 .signature{
   display:inline-flex; gap:8px; align-items:center; justify-content:center;
   background:var(--card); padding:6px 12px; border-radius:999px; border:1px solid var(--border);
@@ -51,28 +42,23 @@ body{
 }
 .signature .role{color:var(--primary)}
 .signature .name{color:var(--ink)}
-
 .card{
   background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow);
   padding:18px; border:1px solid var(--border);
 }
-
 .label{display:block; font-weight:600; margin-bottom:8px; color:var(--muted)}
 .paste{
   width:100%; min-height:160px; resize:vertical; padding:12px 14px; border-radius:12px;
   border:1px solid var(--border); outline:none; background:var(--card); color:var(--ink);
 }
 .paste:focus{border-color:var(--primary); box-shadow:0 0 0 3px rgba(65,55,168,.12)}
-
 .filters{display:flex; gap:10px; margin:12px 0}
 .control{
   flex:1; padding:10px 12px; border-radius:10px; border:1px solid var(--border);
   outline:none; background:var(--card); color:var(--ink);
 }
 .control:focus{border-color:var(--primary); box-shadow:0 0 0 3px rgba(65,55,168,.08)}
-
 .hint{color:var(--muted); font-size:14px; margin:8px 0 10px}
-
 .btn-row{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:10px}
 .btn{
   padding:10px 14px; border:none; border-radius:12px; cursor:pointer; font-weight:700;
@@ -89,11 +75,9 @@ body.dark .btn{color:#eee}
 .btn-danger{background:var(--danger); color:#fff}
 .btn-light{background:#eef2ff; color:#2b2b2b}
 body.dark .btn-light{background:#1f2937; color:#e5e7eb}
-
 .badge{
   background:#fff; color:var(--primary); border-radius:999px; padding:2px 8px; margin-right:6px; font-size:12px;
 }
-
 .table-wrap{overflow:auto; border-radius:14px; border:1px solid var(--border)}
 .table{width:100%; border-collapse:separate; border-spacing:0}
 .table thead th{
@@ -106,11 +90,7 @@ body.dark .btn-light{background:#1f2937; color:#e5e7eb}
 .table td[contenteditable="true"]{outline:none}
 .table td.invalid{background:#fff3f3}
 body.dark .table td.invalid{background:#3b1d1d}
-
-/* شارة التصنيف */
-.cat{
-  display:inline-block; padding:4px 8px; border-radius:999px; font-size:12px; font-weight:700;
-}
+.cat{display:inline-block; padding:4px 8px; border-radius:999px; font-size:12px; font-weight:700}
 .cat.login{background:#fff1; color:#fff; border:1px solid #fff3}
 .cat.device{background:#0ea5e922; color:#0ea5e9; border:1px solid #0ea5e955}
 .cat.form{background:#fef3c7; color:#a16207; border:1px solid #f59e0b}
@@ -118,22 +98,14 @@ body.dark .table td.invalid{background:#3b1d1d}
 .cat.update{background:#e0e7ff; color:#3730a3; border:1px solid #6366f1}
 .cat.default{background:#f1f5f9; color:#0f172a; border:1px solid #cbd5e1}
 body.dark .cat.default{background:#111827; color:#e5e7eb; border-color:#334155}
-
-.footer{
-  text-align:center; margin:18px 0 6px; color:var(--muted);
-}
-.footer .signature{
-  box-shadow:none; background:transparent; border-color:transparent;
-  gap:6px; padding:0; font-weight:600;
-}
-
+.footer{text-align:center; margin:18px 0 6px; color:var(--muted)}
+.footer .signature{box-shadow:none; background:transparent; border-color:transparent; gap:6px; padding:0; font-weight:600}
 .toast{
   position:fixed; bottom:20px; inset-inline-start:20px; background:#111827; color:#fff;
   padding:10px 14px; border-radius:10px; box-shadow:var(--shadow); opacity:0; transform:translateY(8px);
   transition:.25s ease; pointer-events:none; font-weight:600;
 }
 .toast.show{opacity:1; transform:translateY(0)}
-
 @media (max-width:640px){
   .filters{flex-direction:column}
   .btn-row{gap:6px}