.surah-toolbar {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: nowrap;
  flex-direction: row;
  width: 100%;
}
.navplate-content-item{
    	margin-bottom: 20px;
	padding-bottom: 10px;
	border-bottom: 1px dashed #ccc !important;
	line-height: 2.2; /* افزایش فاصله خطوط در متن سوره */
}
.navplate-content-item-list{
    	margin-bottom: 20px;
	padding-bottom: 10px;
	border-bottom: 1px dashed #ccc;
	line-height: 2.2; /* افزایش فاصله خطوط در متن سوره */
}
#search-input {
  /* --- NEW (v2.2): انیمیشن برای نمایش جستجو --- */
	width: calc(100% - 20px);
	padding: 8px 10px;
	border-radius: 6px;
	border: 1px solid #ccc;
	margin-top: -10px;
	margin-bottom: 10px;
	box-shadow: 0 2px 4px rgba(0,0,0,0.05) inset;
	
	/* مخفی به صورت پیش‌فرض */
	display: block;
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	transition: all 0.3s ease-out;
}
#search-input.search-visible {
	max-height: 100px; /* ارتفاع کافی برای نمایش */
	opacity: 1;
}
/* --- END v2.2 --- */

#font-change {
	width: auto; /* v2.2: عرض خودکار */
	font-family: "Iran sans web", Sans-serif;
	font-weight: 500;
	height: 38px;
	box-sizing: border-box;
}

/* --- MODIFIED (v2.0): استایل دکمه‌های مینیمال --- */
.surah-toolbar button, .surah-toolbar select {
  padding: 6px 12px;
  border-radius: 6px;
  border: 1px solid #ccc;
  cursor: pointer;
  background: #f8f8f8;
  transition: background 0.3s ease, transform 0.2s ease, box-shadow 0.2s ease;
  height: 38px;
  font-size: 14px;
  color: #333;
  box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}

.surah-toolbar button:hover, .surah-toolbar select:hover {
  background: #f0f0f0;
  border-color: #bbb;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

/* --- NEW (v2.2): حالت فشرده شدن دکمه --- */
.surah-toolbar button:active {
	transform: translateY(1px);
	background: #e9e9e9;
	box-shadow: 0 1px 1px rgba(0,0,0,0.02);
}

.surah-toolbar select {
   /* برای هماهنگی با دکمه‌ها */
   padding-left: 12px;
   padding-right: 30px; /* فضای کافی برای فلش */
}

/* --- NEW (v2.0): استایل آیکون‌های SVG --- */
.surah-icon {
  width: 20px;
  height: 20px;
  vertical-align: middle;
  stroke: currentColor;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* --- MODIFIED (v2.1): تغییر نام از dark-mode به theme-dark --- */
body.theme-dark .surah-toolbar button,
body.theme-dark .surah-toolbar select {
	background: #555;
	border-color: #777;
	color: #eee;
}
body.theme-dark .surah-toolbar button:hover,
body.theme-dark .surah-toolbar select:hover {
	background: #666;
}
body.theme-dark #search-input, 
body.theme-dark #font-change {
	background-color: #333;
	border-color: #555;
	color: #eee;
}
/* --- END (v2.0) --- */

/* --- NEW (v2.1): Theme Cycler - Sepia --- */
body.theme-sepia { background-color: #fbf0e4; }
body.theme-sepia .surah-box { background-color: #fbf0e4; }
body.theme-sepia #tab-content1 { background-color: #f7f2e8 !important; }
body.theme-sepia #tab-content2 { background-color: #f7f2e8 !important; }
body.theme-sepia .surah-toolbar button, body.theme-sepia .surah-toolbar select {
	background: #f0e8d9; border-color: #dcd0b9; color: #5b4636;
}
body.theme-sepia .highlight { background-color: #fadd96; }

/* --- NEW (v2.1): Theme Cycler - Green --- */
body.theme-green { background-color: #eaf3eb; }
body.theme-green .surah-box { background-color: #eaf3eb; }
body.theme-green #tab-content1 { background-color: #f0f7f0 !important; }
body.theme-green #tab-content2 { background-color: #f0f7f0 !important; }
body.theme-green .surah-toolbar button, body.theme-green .surah-toolbar select {
	background: #d8e8d8; border-color: #b9d0b9; color: #2e4d3a;
}
body.theme-green .highlight { background-color: #b8e0b8; }

/* --- END (v2.1) --- */

#surah-content {
  font-size: 22px;
  line-height: 2;
  transition: all 0.3s ease;
  font-family: 'tahoma', sans-serif;
}

/* --- NEW: Verse-by-Verse Styles for Tab 1 --- */
.quran-aya-block {
	margin-bottom: 20px;
	padding-bottom: 10px;
	border-bottom: 1px dashed #ccc;
	line-height: 2.2; /* افزایش فاصله خطوط در متن سوره */
}

.quran-aya-block:last-child {
	border-bottom: none;
}
/* --- MODIFIED (v1.8): سلکتور قوی‌تر شد --- */
.quran-aya-block .aya-num,
.quran-text .aya-num {
	font-size: 0.7em;
	background-color: rgba(0,0,0,0.05);
	color: #555;
	border-radius: 50%;
	padding: 2px 6px;
	margin: 0 2px;
	display: inline-block;
	min-width: 16px;
	text-align: center;
	line-height: 1.6;
	vertical-align: middle;
	flex-shrink: 0; 
}

/* --- NEW: Styles for Tab 2 (Translation) --- */
/* --- MODIFIED (v1.6): پرانتزها دیگر block نیستند --- */
.navplate-content-item-label .quran-text {
	font-weight: bold;
}
.navplate-content-item-list .quran-Translate_foladvand {
	font-size: 0.9em;
	color: #333;
	font-weight: normal; /* اطمینان از اینکه کم‌رنگ‌تر است */
}
/* --- END NEW Styles --- */


.tabs {
  display: flex;
  gap: 20px;
  justify-content: center;
  margin-bottom: 5px;
}

.tab-button {
  padding: 12px 20px;
  cursor: pointer;
  background: #eee;
  border: none;
  border-radius: 10px;
  transition: background 0.3s ease, transform 0.3s ease;
  font-weight: bold;
  text-transform: uppercase;
  font-family: "Iran sans web", Sans-serif;
  color: #294750;
}

.tab-button:hover {
  background: #ddd;
  transform: scale(1.03);
  color: #294750;
}

.tab-button.active-tab {
  background: #294750;
  color: #fff;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  transform: scale(1.05);
}

.tab-content {
  display: none;
  max-height: 500px;
  overflow-y: auto;
}

/* --- NEW (v1.9): Default background colors for tabs (CSS) --- */
/* --- MODIFIED (v2.5): اینها حذف می‌شوند چون inline بازگردانده شدند --- */
/* --- (این بخش در v2.5 خالی است) --- */

/* --- MODIFIED (v2.1): تغییر نام از dark-mode به theme-dark --- */
/* --- MODIFIED (v2.5): اطمینان از !important برای تم‌ها --- */
body.theme-dark #tab-content1 { background-color: #444 !important; }
body.theme-dark #tab-content2 { background-color: #444 !important; }

/* --- DELETED (v2.1): حالت مطالعه حذف شد --- */

.highlight {
  background-color: yellow;
  font-weight: bold;
}

/* --- MODIFIED (v2.4): بازنویسی کامل منطق تمام‌صفحه با Flexbox --- */

/* 1. کانتینر اصلی تمام‌صفحه */
#surah-content:fullscreen,
#surah-content:-webkit-full-screen,
#surah-content:-moz-full-screen {
width: 100% !important;
height: 100% !important;
overflow: hidden !important; /* اسکرول به فرزندان منتقل می‌شود */
padding: 20px !important;
box-sizing: border-box !important;
display: flex !important;
flex-direction: column !important;
/* پس‌زمینه پایه خنثی */
background-color: #f9f9f9 !important; 
}

/* 2. محتوای تب در حالت تمام‌صفحه */
#surah-content:fullscreen .tab-content,
#surah-content:-webkit-full-screen .tab-content,
#surah-content:-moz-full-screen .tab-content {
flex-grow: 1; /* باعث می‌شود تمام فضای خالی را پر کند */
max-height: none !important; /* لغو محدودیت ارتفاع */
overflow-y: auto !important; /* اسکرول داخلی فعال شود */
min-height: 0; /* برای اطمینان از عملکرد صحیح flex-grow */
}

/* 3. هماهنگ‌سازی پس‌زمینه کانتینر با تم‌ها */
body.theme-dark #surah-content:fullscreen,
body.theme-dark #surah-content:-webkit-full-screen,
body.theme-dark #surah-content:-moz-full-screen {
background-color: #333 !important;
}

body.theme-sepia #surah-content:fullscreen,
body.theme-sepia #surah-content:-webkit-full-screen,
body.theme-sepia #surah-content:-moz-full-screen {
background-color: #fbf0e4 !important;
}

body.theme-green #surah-content:fullscreen,
body.theme-green #surah-content:-webkit-full-screen,
body.theme-green #surah-content:-moz-full-screen {
background-color: #eaf3eb !important;
}
/* --- END v2.4 --- */


/* --- MODIFIED (v2.3): نوار ابزار موبایل به حالت افقی (scroll) تغییر کرد --- */
@media (max-width: 768px) {
  .surah-toolbar {
	display: flex;
	flex-wrap: nowrap; /* جلوگیری از شکستن خط */
	overflow-x: auto;  /* فعال کردن اسکرول افقی */
	padding-bottom: 10px; /* ایجاد فضا برای نوار اسکرول */
  }
  .surah-toolbar button, .surah-toolbar select {
	  width: auto; /* لغو عرض ثابت */
	  flex-shrink: 0; /* جلوگیری از کوچک شدن دکمه‌ها */
	  margin-bottom: 0; /* حذف فاصله پایین */
  }
  #font-change {
	  width: 150px; /* یک عرض مناسب برای انتخاب فونت */
  }
  #show-search-btn {
	  width: auto; /* لغو عرض ۱۰۰٪ */
  }
}
/* --- END v2.3 --- */