@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800;900&display=swap');

/* Unified Arabic typography — admin + student pages */
html, body,
button, input, select, textarea,
a, label, table, th, td,
.card, .box, .panel, .notice, .btn, .btnx,
.action-link-button, .status-pill,
.home-split-page, .admin-premium-page,
.login-panel, .ranking-page {
  font-family: 'Cairo','Segoe UI',Tahoma,Arial,sans-serif !important;
}

html { font-size: 16px; }
body {
  font-weight: 400;
  line-height: 1.78;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1,h2,h3,h4,h5,h6,
.brand strong,
.section-title,
.page-heading h1,
.admin-section-heading h2,
.track-header h2,
.login-panel h2,
th {
  font-family: 'Cairo','Segoe UI',Tahoma,Arial,sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

button,.btn,.btnx,.action-link-button,
input[type="submit"],input[type="button"],
select,.form-control {
  font-family: 'Cairo','Segoe UI',Tahoma,Arial,sans-serif !important;
}

/* Arabic numerals and data stay crisp */
.ltr,.score-align,[dir="ltr"] {
  font-variant-numeric: tabular-nums;
}

/* Student preference page */
.pref-wrap .box { line-height: 1.8; }
.pref-wrap .student-name { font-weight: 700; }
.pref-wrap .track,
.pref-wrap .rank-label,
.pref-wrap .contact-field,
.pref-wrap .pref-select,
.pref-wrap .btnx { font-weight: 700 !important; }
.pref-wrap .pref-select { line-height: 1.6; }

/* Admin tables */
.table-wrap th { font-weight: 700 !important; }
.table-wrap td { font-weight: 500; }
.status-pill { font-weight: 700 !important; }

/* Touch-first mobile refinements */
@media (max-width: 700px) {
  html { font-size: 15px; }
  body { line-height: 1.75; }

  .container { width: min(100% - 18px, 1180px) !important; }

  h1 { font-size: clamp(23px, 7vw, 31px) !important; line-height: 1.45 !important; }
  h2 { font-size: clamp(20px, 6vw, 27px) !important; line-height: 1.5 !important; }
  h3 { line-height: 1.55 !important; }

  button,.btn,.btnx,.action-link-button,
  input[type="submit"],input[type="button"] {
    min-height: 44px;
    font-size: 14px !important;
    line-height: 1.45;
  }

  input,select,textarea,.form-control,.pref-select,
  .contact-input,.contact-textarea {
    font-size: 16px !important;
  }

  .table-wrap th,
  .table-wrap td {
    font-size: 13px !important;
    line-height: 1.55 !important;
  }

  .status-pill { font-size: 12px !important; }

  /* Student registration specifically */
  .pref-wrap {
    width: 100%;
    margin: 12px auto !important;
    padding: 9px !important;
  }
  .pref-wrap .box {
    padding: 16px !important;
    border-radius: 16px !important;
    margin-bottom: 14px !important;
  }
  .pref-wrap .student-head h1,
  .pref-wrap .student-name {
    font-size: 21px !important;
    line-height: 1.55 !important;
  }
  .pref-wrap .student-summary-sub,
  .pref-wrap .contact-note,
  .pref-wrap .photo-help,
  .pref-wrap .declaration-text,
  .pref-wrap .pref-help {
    font-size: 14px !important;
    line-height: 1.85 !important;
  }
  .pref-wrap .track { font-size: 13px !important; }
  .pref-wrap .student-summary-meta small,
  .pref-wrap .meta small { font-size: 12px !important; }
  .pref-wrap .student-summary-meta b,
  .pref-wrap .meta b { font-size: 16px !important; }
  .pref-wrap .rank-label { font-size: 14px !important; }
  .pref-wrap .pref-select-row { border-radius: 13px !important; }
  .pref-wrap .pref-select { min-height: 50px !important; font-weight: 700 !important; }
  .pref-wrap .actions { gap: 9px !important; }
  .pref-wrap .actions .btnx { width: 100%; flex: 1 1 100% !important; }

  /* Admin pages on phones */
  .admin-dashboard-main,
  .admin-applications-page,
  .section { padding-left: 0 !important; padding-right: 0 !important; }
  .page-heading h1 { font-size: 24px !important; }
  .admin-stat-card strong { font-size: 28px !important; }
  .admin-action-card h3 { font-size: 21px !important; }
  .filter-panel { gap: 10px !important; }
}

@media (max-width: 430px) {
  html { font-size: 14.5px; }
  .pref-wrap .box { padding: 14px !important; }
  .pref-wrap .student-head h1,
  .pref-wrap .student-name { font-size: 19px !important; }
  .pref-wrap .pref-help { padding: 12px 13px !important; }
  .pref-wrap .rank { width: 34px !important; height: 34px !important; font-size: 15px !important; }
  .table-wrap th,.table-wrap td { font-size: 12.5px !important; }
}