/* --- تفعيل الثيم الذهبي الكامل --- */

/* 1. جسم السبحة (Counter Body) */
body.gold-theme .counter-body {
  background-image: url('30.jpg') !important;
  background-size: cover !important;
  background-position: center !important;
  border: 2px solid #d4af37 !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}

/* 2. إطار الشاشة (البيضاء) */
body.gold-theme .screen-frame {
  background-color: white !important;
  width: 165px;
  height: fit-content;
  border-radius: 12px;
  margin-top: 25px;
  padding: 8px;
  box-shadow: inset 0 0 15px rgba(0, 0, 0, 0.2) !important;
  z-index: 2;
}

/* 3. شاشة الـ LCD والأرقام الذهبية */
body.gold-theme .lcd-display {
  background-color: white !important;
  height: 55px;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 45px;
  font-weight: 700;
  /* جعل الأرقام تأخذ شكل الذهب */
  background-image: url('30.jpg') !important;
  background-size: cover;
  background-position: center;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-stroke: 1px rgba(184, 134, 11, 0.5);
  box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.1);
  font-family: 'Arial Black', Gadget, sans-serif;
  border: 1px solid #ddd;
}

/* 4. زر الريسيت (الصورة الذهبية 32) */
body.gold-theme #resetBtn {
  /* width: 35px !important;
  height: 35px !important; */
  background-image: url('32.png') !important;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-color: transparent !important;
  border: none !important;
  cursor: pointer;
  margin-top: -15px;
  z-index: 2;
  outline: none;
  box-shadow: 0 0 2px rgba(255, 255, 255, 0.450), 0 0 10px rgba(255, 255, 255, 0.450);
  border-radius: 50%;
}

body.gold-theme #resetBtn:active {
  transform: translateY(8px);
  -webkit-transform: translateY(8px);
  -moz-transform: translateY(8px);
  -ms-transform: translateY(8px);
  -o-transform: translateY(8px);
}

/* 5. زر "اضغط" الرئيسي (الصورة 31) */
body.gold-theme #countBtn {
  background-image: url('31.png') !important;
  background-size: 100% 100%;
  background-color: transparent !important;
  border: none !important;
  color: transparent !important;
  /* إخفاء كلمة اضغط لتظهر الصورة */
  box-shadow: none;
  margin-top: 60px;
}

/* 6. بادج عدد الحسنات (التدرج الذهبي) */
body.gold-theme .hasanat-badge {
    
  color: #5d4412 !important;
  border: 1px solid #aa771c !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

body.gold-theme .hasanat-count {
  color: #5d4412 !important;
}

/* 7. أزرار الأذكار والمزيد (التدرج الذهبي) */
body.gold-theme .nav-btn {
  background: linear-gradient(to bottom, #bf953f, #8a6624) !important;
  color: white !important;
  border: 1px solid #5d4412 !important;
}

/* --- تنسيق أزرار الأذكار والمزيد في الوضع الذهبي --- */

body.gold-theme .nav-btn {
  /* التدرج الذهبي اللي أنت طلبته */
  background: linear-gradient(45deg, #bf953f, #fcf6ba, #b38728) !important;

  /* لون النص نخليه بني داكن عشان يليق مع الدهبي ويكون واضح */
  color: #5d4412 !important;

  /* إضافة حدود وظلال لتعزيز الشكل الملكي */
  border: 1px solid #aa771c !important;
  font-weight: bold !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3) !important;

  /* تأكيد أن الخلفية لا تتكرر وتغطي الزر بالكامل */
  background-size: cover !important;
}

/* تأثير بسيط عند الضغط على الأزرار وهي ذهبية */
body.gold-theme .nav-btn:active {
  transform: scale(0.95);
  filter: brightness(1.1);
}

/* تنسيق كارت الذكر الحالي في الوضع الذهبي */
body.gold-theme .current-dhikr-card {
  /*1.الخلفيةبتدرجالألوانالذهبية*/
  background: linear-gradient(45deg, #bf953f, #fcf6ba, #b38728) !important;
  /*2.البوردرالذهبي*/
  border-image-source: linear-gradient(45deg, #bf953f, #fcf6ba, #b38728) !important;
  /*3.الظللإعطاءعمقللكارت*/
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4) !important;
}

/* 4. تنسيق الخط (أسود خفيف) داخل الكارت */
body.gold-theme #activeDhikr {
  color: rgba(0, 0, 0, 0.75) !important;
}