/* ستايل 2: وضع فاتح وبسيط، مختلف تمامًا عن الستايل الداكن */

/* المتغيّرات */
:root{
  --bg: #f3f4f6;
  --bg-accent: #ffffff;
  --card: #ffffff;
  --text: #111827;
  --muted: #6b7280;
  --acc: #2563eb;
  --danger: #dc2626;
  --border: rgba(15,23,42,0.12);
  --input-bg: #f9fafb;
}

/* الأساسيات */
* { box-sizing: border-box; }
html { color-scheme: light; }
body{
  margin: 0;
  font-family: "Tajawal", system-ui, "Segoe UI", Arial;
  color: var(--text);
  background:
    radial-gradient(1200px 800px at 80% -10%, #dbeafe 0%, transparent 55%),
    radial-gradient(1000px 700px at 0% 100%, #e0f2fe 0%, transparent 60%),
    linear-gradient(160deg, #f3f4f6 0%, #e5e7eb 100%);
}

/* الروابط والعناوين */
a { color: var(--acc); text-decoration: none; }
h1 { font-size: clamp(1.4rem, 1.05rem + 1.8vw, 2.2rem); margin: 10px 0 16px; font-weight: 800; }
h2 { font-size: clamp(1.1rem, 1rem + .7vw, 1.6rem); margin: 24px 0 12px; font-weight: 800; }

/* الهيدر */
header{
  display:flex; justify-content:space-between; align-items:center;
  padding: 14px 20px;
  background: linear-gradient(180deg, #ffffff, #e5edf9);
  border-bottom: 1px solid var(--border);
}
.logo { font-weight: 900; color: var(--text); letter-spacing:.3px; }
nav a { margin-inline-start: 10px; }

.home-btn {
  display: inline-block;
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  color: #fff;
  padding: 9px 16px;
  border-radius: 12px;
  font-weight: 600;
  text-decoration: none;
  margin-left: 12px;
  transition: 0.25s ease;
  box-shadow: 0 4px 10px rgba(15,23,42,0.18);
}

.home-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(15,23,42,0.25);
}

/* الحاوية العامة */
.container{ max-width: 1200px; margin: 24px auto; padding: 0 16px; }

/* شريط بطاقات (جامعات/دكاترة) */
.cards{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 16px;
}

/* البطاقة العامة */
.card{
  background: var(--card);
  padding: 14px;
  border-radius: 16px;
  border: 1px solid var(--border);
  display: block;
  color: var(--text);
  box-shadow: 0 10px 25px rgba(15,23,42,.08);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.card:hover{
  transform: translateY(-3px);
  box-shadow: 0 18px 40px rgba(15,23,42,.14);
  border-color: rgba(37,99,235,0.5);
  background: linear-gradient(180deg, #ffffff, #f9fafb);
}

.card-title{ font-weight: 800; margin: 0 0 6px; }
.card-sub{ color: var(--muted); font-size: .9rem; }

/* بطاقة الجامعة */
.uni-tile{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:12px; padding: 16px; text-align:center;
}

/* شعار الجامعة */
.uni-logo{
  width: 100%; max-width: 280px;
  aspect-ratio: 16 / 11;
  object-fit: contain; object-position: center;
  border-radius: 14px;
  background: #f9fafb;
  border: 1px solid var(--border);
  padding: 10px;
}

/* صورة الدكتور */
.avatar, .avatar-xl{
  object-fit: cover; background: #f9fafb;
  border: 1px solid var(--border);
}
.avatar { width: 56px; height: 56px; border-radius: 12px; }
.avatar-xl { width: 120px; height: 120px; border-radius: 16px; }

/* النماذج */
.form, .add-prof-form { display: grid; gap: 12px; max-width: 760px; }
.form.inline { grid-template-columns: 1fr auto; align-items: center; }
label{ display: grid; gap: 8px; font-weight: 700; }
input, select, textarea, button{
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--input-bg);
  color: var(--text);
  outline: none;
}
input::placeholder, textarea::placeholder{ color: #9ca3af; opacity: .9; }
input:focus, select:focus, textarea:focus{
  border-color: rgba(37,99,235,0.7);
  box-shadow: 0 0 0 3px rgba(37,99,235,0.25);
}

/* استجابة نموذج الإضافة */
@media (min-width: 768px){
  .add-prof-form{ grid-template-columns: repeat(2, 1fr); }
  .full{ grid-column: 1 / -1; }
}

/* الأزرار */
button{
  background: linear-gradient(180deg, #2563eb, #1d4ed8);
  color:#f9fafb;
  border: 1px solid rgba(37,99,235,0.9);
  font-weight: 800; cursor: pointer;
  border-radius: 12px;
  box-shadow: 0 10px 25px rgba(37,99,235,.35);
  transition: transform .06s ease, filter .15s ease, box-shadow .15s ease;
}
button:hover { filter: brightness(1.05); }
button:active { transform: translateY(1px); }

button.danger{
  background: linear-gradient(180deg, #ef4444, #b91c1c);
  color: #fef2f2; border-color: rgba(248,113,113,0.9);
  box-shadow: 0 10px 25px rgba(239,68,68,.35);
}
button.danger:hover{ filter: brightness(1.03); }

/* تنسيقات النصوص والإشعارات */
.muted{ color: var(--muted); }
.alert{
  background: #f9fafb;
  border: 1px solid var(--border);
  color: var(--text);
  padding: 12px; border-radius: 12px; margin: 8px 0;
}

/* تبويبات لوحة التحكم */
.tabs a{
  margin-inline-end: 8px; padding: 8px 10px; border-radius: 10px;
  background: #f3f4f6;
  border: 1px solid var(--border);
  color: var(--text);
}
.tabs a.active{ background: #e5efff; border-color: rgba(37,99,235,0.7); }

/* صفوف عرض الطلبات */
.row{
  display:flex; gap:12px; align-items:center;
  background: #ffffff;
  padding: 10px; border-radius: 12px; border: 1px solid var(--border);
  margin: 8px 0;
}
.grow{ flex: 1; }

/* الفوتر */
footer{
  padding: 24px;
  background: linear-gradient(180deg, #f9fafb, #f3f4f6);
  color: var(--muted);
  text-align:center; font-size: 14px; border-top: 1px solid var(--border);
}

/* تحسينات وصولية */
.card:focus-visible, a:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible{
  outline: 3px solid rgba(37,99,235,0.8);
  outline-offset: 3px;
}

/* إخفاء العناصر عند الفلترة */
[hidden]{ display:none !important; }