@font-face {
  font-family: 'Qahwa Arabic';
  src: url('fonts/Qahwa-Arabic.otf') format('opentype');
}

@font-face {
  font-family: 'STC Regular';
  src: url('fonts/STC-Regular.ttf') format('truetype');
}

@font-face {
  font-family:'IBMPlexArabic';
  src: url('fonts/IBMPlexArabic.ttf') format('truetype');
}



:root {

  --green: #38726c;
  --orange: #fca311;
  --teal: #4ecdc4;
  --red: #e94f37;
  --navy: #001f3f;
  --bej:#f6efe4;
  --brik:#b96414;
  --blue:#0a719e;
  --blue-gray:#66859f;
  --abyad: #f7fff7;
}

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:'IBMPlexArabic', sans-serif;
}

body{
  background:var(--abyad);
  min-height:100vh;
  display:flex;
  flex-direction:column;
  direction:rtl;
}

/* ===== رأس (إسناد + القائمة) ===== */
.navbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 40px;
  background:transparent;
}
.navbar .logo{
  color:var(--green);
  font-size:30px;
  font-weight:bold;
  font-family:'Qahwa Arabic', serif;
  margin:0;
  text-decoration:none;
  cursor:pointer;
}
.menu-icon{ display:flex; flex-direction:column; gap:6px; cursor:pointer; }
.menu-icon span{ width:28px; height:3px; background:var(--green); border-radius:2px; }
.menu{
  position:fixed; top:0; right:0; width:250px; height:100%;
  background:var(--green); padding:20px; box-shadow:-2px 0 8px rgba(0,0,0,.3);
  transform:translateX(100%); transition:transform .4s ease; z-index:9999;
}
.menu.open{ transform:translateX(0); }
.menu ul{ list-style:none; margin:0; padding:0; }
.menu li{ margin:20px 0; }
.menu a{ color:#fff; text-decoration:none; font-size:18px; font-family:'IBMPlexArabic', sans-serif; }
.menu a:hover{ color:var(--brik); }
.close-btn{ font-size:28px; color:#fff; cursor:pointer; text-align:right; margin-bottom:20px; }
.close-btn:hover{ color:var(--brik); }

/* منطقة المحتوى تتوسّط الشاشة */
.page-main{
  flex:1;
  display:flex;
  justify-content:center;
  align-items:center;
  padding:20px 40px 60px;
}

.container{
  text-align:center;
  max-width:900px;
}

.title{
  font-size:38px;
  color:var(--green);
  margin-bottom:60px;
  font-family: 'Qahwa Arabic';
}

.text{
  font-size:18px;
  text-align: right;
  color:var(--green);
  font-weight:600;
  margin-bottom:40px;
  font-family:'IBMPlexArabic';
}

.btn{
  padding:5px 25px;
  border:none;
  border-radius:10px;
  background:var(--green);
  color:white;
  font-size:20px;
  cursor:pointer;
  font-family: 'Qahwa Arabic';
  margin-top: 35px;
}

.bold-word{
  font-weight:700;
}
.toast {
    position: fixed;
    top: 20px;
    right: 20px;
    padding: 15px 25px;
    border-radius: 8px;
    color: white;
    font-size: 16px;
    font-weight: bold;
    font-family: 'Qahwa Arabic';
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    opacity: 0;
    transform: translateX(400px);
    transition: all 0.3s ease;
    z-index: 9999;
    max-width: 350px;
    word-wrap: break-word;
}

.toast.show {
    opacity: 1;
    transform: translateX(0);
}

.toast.success {
    background: linear-gradient(135deg,#89d6b7 0%, var(--green) 100%);
}

.toast.error {
    background: linear-gradient(135deg, #e58957 0%, #ac1c2f 100%);
}

/* ===== تجاوب الموبايل ===== */
@media (max-width: 768px){
  .navbar{ padding: 14px 16px; }
  .navbar .logo{ font-size: 26px; }
  .page-main{ padding: 16px 16px 40px; }
  .title{ font-size: 26px; margin-bottom: 32px; }
  .text{ font-size: 16px; margin-bottom: 28px; }
  .btn{ font-size: 18px; padding: 8px 28px; }
}

html,body{ max-width:100%; overflow-x:hidden; }