@import url("https://fonts.googleapis.com/css2?family=Aref+Ruqaa:wght@400;700&display=swap");

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

:root{
  --teal:#2f8aa0;
  --teal-dark:#21778e;
  --teal-light:#b7dce4;
  --teal-side:#acd4de;
  --ink:#0f4d63;
  --border:#2a7083;
  --white:#ffffff;
}

*{box-sizing:border-box}

html,body{
  margin:0;
  padding:0;
  background:#e7f0f2;
  color:#153f4f;
}

body{
  direction:rtl;
  font-family:"Amiri", serif;
  font-size:18px;
  line-height:1.9;
}

.page{
  width:100%;
  min-height:100vh;
  background:#fff;
}

/* Header */
.site-header{
  height:158px;
  background:
    radial-gradient(circle at 50% 22%, rgba(255,255,255,.22) 0 1px, transparent 2px) 0 0/9px 9px,
    linear-gradient(#2d879c,#3293aa);
  color:#fff;
  text-align:center;
  position:relative;
  border-bottom:1px solid rgba(0,0,0,.12);
}

.site-title{
  margin:0;
  padding-top:16px;
  font-family:"Tholoth","Amiri",serif;
  font-size:42px;
  line-height:1.2;
  font-weight:700;
  text-shadow:0 1px 0 rgba(0,0,0,.12);
}

.site-subtitle{
  margin-top:2px;
  font-size:18px;
  font-weight:700;
  letter-spacing:.3px;
  color:#eefaff;
}

/* Top nav */
.top-nav-wrap{
  background:linear-gradient(#cceaf0,#9ecfda);
  border-bottom:1px solid #8dbeca;
  position:relative;
  z-index:50;
}

.top-nav{
  width:100%;
  min-height:60px;
  display:flex;
  justify-content:center;
  align-items:stretch;
  direction:rtl;
}

.nav-item{
  position:relative;
  min-width:112px;
  border-left:1px solid var(--border);
}

.nav-item:first-child{
  border-right:1px solid var(--border);
}

.nav-item > a{
  min-height:60px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 18px;
  color:#12475a;
  font-weight:700;
  text-decoration:none;
  white-space:nowrap;
}

.nav-item:hover > a,
.nav-item > a.active{
  background:linear-gradient(#2f91a7,#247a90);
  color:#fff;
}

/* dropdown */
.dropdown{
  display:none;
  position:absolute;
  top:100%;
  right:0;
  min-width:240px;
  background:#a9d2dc;
  border:1px solid #3e7d8d;
  border-top:0;
  box-shadow:none;
  z-index:100;
  direction:rtl;
}

.nav-item:hover .dropdown{
  display:block;
}

.dropdown a{
  display:block;
  padding:7px 12px;
  color:#103f50;
  background:#a9d2dc;
  text-decoration:none;
  border-bottom:1px solid #4d8391;
  text-align:right;
  line-height:1.45;
  font-weight:700;
  min-height:auto;
}

.dropdown a:last-child{
  border-bottom:0;
}

.dropdown a:hover{
  background:#8fc4d0;
  color:#083746;
}

/* Layout */
.layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 265px;
  direction:ltr;
  min-height:760px;
}

.content{
  direction:rtl;
  background:#fff;
  padding:52px 64px 70px;
  min-width:0;
}

.sidebar{
  direction:rtl;
  background:linear-gradient(#b7dce4,#a6d0da);
  border-left:1px solid #89b8c3;
  padding:30px 26px;
}

.sidebar ul{
  margin:0;
  padding:0 20px 0 0;
  list-style:disc;
}

.sidebar li{
  margin:14px 0;
  color:#20576a;
  padding-right:6px;
}

.sidebar a{
  color:#124b60;
  text-decoration:none;
  font-weight:700;
}

.sidebar a:hover{
  text-decoration:underline;
}

/* Typography / content */
.intro{
  text-align:center;
  margin:0 auto 48px;
  color:#24576b;
  font-weight:700;
}

.section-title{
  font-family:"Tholoth","Amiri",serif;
  font-size:29px;
  color:#12556d;
  margin:28px 0 10px;
  font-weight:700;
}

.section-list{
  list-style:none;
  padding:0;
  margin:0;
}

.section-list li{
  margin:9px 0;
  color:#174c60;
}

.section-list li::before{
  content:"•";
  margin-left:12px;
  color:#000;
  font-family:Arial,sans-serif;
  font-size:22px;
  font-weight:900;
  vertical-align:middle;
}

.signature{
  margin-top:24px;
  text-align:left;
  padding-left:80px;
  font-style:italic;
  color:#315d6f;
  font-size:20px;
}

.notice{
  margin-top:80px;
}

.mail{
  direction:ltr;
  display:inline-block;
  color:#0e69a1;
  text-decoration:underline;
  font-family:Arial,sans-serif;
  font-size:15px;
}

.link-box{
  display:block;
  color:#17596e;
  text-decoration:none;
  padding:9px 0;
  border-bottom:1px dotted #b9cbd1;
}

.link-box:hover{
  color:#0a7796;
}

.subsection{
  margin-bottom:36px;
}

.footer{
  background:#2b8398;
  color:#eaf8fb;
  text-align:center;
  padding:10px 20px;
  border-top:1px solid #1d6f83;
  font-size:15px;
}

/* Mobile */
@media (max-width: 900px){
  .site-header{height:auto;padding-bottom:16px}
  .site-title{font-size:34px}

  .top-nav{
    flex-wrap:wrap;
  }

  .nav-item{
    min-width:50%;
    border-bottom:1px solid #75acb9;
  }

  .nav-item > a{
    min-height:48px;
  }

  .dropdown{
    position:static;
    width:100%;
    min-width:0;
    border-left:0;
    border-right:0;
  }

  .nav-item:hover .dropdown{
    display:block;
  }

  .layout{
    grid-template-columns:1fr;
  }

  .sidebar{
    order:-1;
    border-left:0;
    border-bottom:1px solid #8bb7c2;
  }

  .sidebar ul{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0 20px;
  }

  .content{
    padding:38px 24px 60px;
  }
}

@media (max-width: 560px){
  body{font-size:17px}
  .nav-item{min-width:100%}
  .sidebar ul{grid-template-columns:1fr}
  .content{padding:30px 18px 50px}
  .section-title{font-size:25px}
}


/* When a submenu item is opened directly */
.subsection:target{
  margin-top:0;
}

/* simple footer text */
.footer{
  line-height:1.6;
}


/* Tables de classement des contenus */
.content-table{
  width:100%;
  border-collapse:collapse;
  margin:14px 0 32px;
  table-layout:fixed;
  font-size:16px;
  color:#174c60;
}

.content-table th,
.content-table td{
  border:1px solid #7eaebe;
  padding:4px 8px;
  text-align:center;
  vertical-align:middle;
  line-height:1.45;
}

.content-table th{
  background:#f5fbfc;
  color:#124b60;
  font-weight:700;
}

.content-table a{
  color:#12566c;
  text-decoration:underline;
  margin:0 2px;
  white-space:nowrap;
}

.content-table a:hover{
  color:#0a7696;
}

@media (max-width:700px){
  .content-table{
    font-size:14px;
  }

  .content-table th,
  .content-table td{
    padding:5px 4px;
  }

  .content-table a{
    white-space:normal;
  }
}


/* Police des titres arabes : Tholoth (\textthol en LaTeX) */
.site-title,
.section-title{
  font-family:"Tholoth","Traditional Arabic","Amiri",serif !important;
  font-weight:700;
}


/* Tableau : chapitre et série d'exercices correspondante */
.chapter-series-table{
  width:100%;
  border-collapse:collapse;
  margin:14px 0 32px;
  table-layout:fixed;
  font-size:16px;
  color:#174c60;
}

.chapter-series-table th,
.chapter-series-table td{
  border:1px solid #7eaebe;
  padding:7px 10px;
  text-align:center;
  vertical-align:middle;
}

.chapter-series-table th{
  background:#f5fbfc;
  font-weight:700;
  color:#124b60;
}

.chapter-series-table a{
  color:#12566c;
  text-decoration:underline;
}

/* Classement des tests d'olympiades par année scolaire */
.olympiad-table{width:100%;border-collapse:collapse;margin:14px 0 34px;table-layout:fixed;font-size:16px;color:#174c60}
.olympiad-table th,.olympiad-table td{border:1px solid #7eaebe;padding:5px 8px;text-align:center;vertical-align:middle;line-height:1.45}
.olympiad-table th{background:#f5fbfc;color:#124b60;font-weight:700}
.olympiad-table .year{width:22%;white-space:nowrap;font-family:"Amiri",serif}
.olympiad-table .tests{width:78%}
.olympiad-table a{color:#12566c;text-decoration:underline;margin:0 2px;white-space:nowrap}
@media(max-width:700px){
  .olympiad-table{font-size:14px}
  .olympiad-table .year{width:30%}
  .olympiad-table .tests{width:70%}
  .olympiad-table a{white-space:normal}
}


/* Palette : vert foncé et jaune léger */
:root{
  --teal:#245c3a;
  --teal-dark:#183f28;
  --teal-light:#f3e9a8;
  --teal-side:#f6edb8;
  --ink:#234b32;
  --border:#56765f;
  --white:#ffffff;
}

body{
  background:#f7f2cf;
  color:#244631;
}

.site-header{
  background:
    radial-gradient(circle at 50% 22%, rgba(255,255,255,.16) 0 1px, transparent 2px) 0 0/9px 9px,
    linear-gradient(#245c3a,#1d4d30) !important;
}

.site-subtitle{
  color:#fff7c7;
}

.top-nav-wrap{
  background:linear-gradient(#fbf5cf,#eee29a) !important;
  border-bottom-color:#b7aa67 !important;
}

.nav-item > a{
  color:#234b32 !important;
}

.nav-item:hover > a,
.nav-item > a.active{
  background:linear-gradient(#2d6843,#1e5032) !important;
  color:#fff !important;
}

.dropdown{
  background:#f2e7a5 !important;
  border-color:#66785a !important;
}

.dropdown a{
  color:#244631 !important;
  background:#f2e7a5 !important;
  border-bottom-color:#b7aa67 !important;
}

.dropdown a:hover{
  background:#e6d77f !important;
  color:#173b25 !important;
}

.sidebar{
  background:linear-gradient(#f6edb8,#eee29a) !important;
  border-left-color:#b7aa67 !important;
}

.sidebar a,
.sidebar li,
.section-title,
.intro,
.section-list li,
.link-box,
.content-table,
.chapter-series-table,
.olympiad-table{
  color:#245c3a !important;
}

.content-table th,
.chapter-series-table th,
.olympiad-table th{
  background:#fffbea !important;
  color:#1d4d30 !important;
}

.content-table th,
.content-table td,
.chapter-series-table th,
.chapter-series-table td,
.olympiad-table th,
.olympiad-table td{
  border-color:#8c9d79 !important;
}

.content-table a,
.chapter-series-table a,
.olympiad-table a,
.mail{
  color:#2b6541 !important;
}

.footer{
  background:#1d4d30 !important;
  color:#fff6c8 !important;
  border-top-color:#153a24 !important;
}

/* Titre français sous le titre arabe des chapitres */
.chapter-fr{
  display:inline-block;
  direction:ltr;
  font-family:Georgia,"Times New Roman",serif;
  font-size:0.92em;
  font-weight:400;
  color:#4f5f52;
}

.unavailable{
  font-family: Amiri, serif;
  font-size: 0.95em;
  color: #666;
}


/* Titres arabes : Aref Ruqaa */
h1, h2, h3, h4, h5, h6,
.section-title,
header .title,
.site-title,
nav,
th {
  font-family: "Aref Ruqaa", serif !important;
}