1<!doctype html> 2<html lang="ar" dir="rtl"> 3<head> 4 <meta charset="utf-8" /> 5 <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" /> 6 <meta name="theme-color" content="#123c2e" /> 7 <meta name="description" content="My Diet Tracker - ØØ³Ø§Ø¨ Ø§ÙØ³Ø¹Ø±Ø§Øª ÙØªØ³Ø¬Ù٠اÙÙØ¬Ø¨Ø§Øª Ù٠تابعة اÙÙØ²Ù" /> 8 <title>My Diet Tracker v7</title> 9 <link rel="manifest" href="manifest.json" /> 10 <link rel="icon" href="icons/icon-192.png" /> 11 <link rel="apple-touch-icon" href="icons/icon-192.png" /> 12 <link rel="stylesheet" href="styles.css" /> 13</head> 14<body> 15 <div class="app-shell"> 16 <aside class="sidebar" aria-label="Ø§ÙØªÙÙÙ Ø§ÙØ±Ø¦ÙسÙ"> 17 <div class="brand"> 18 <div class="brand-mark" aria-hidden="true">M</div> 19 <div><strong>My Diet Tracker</strong><span>Ø§ÙØ³Ø¹Ø±Ø§Øª ÙØ§ÙØ¯Ø§ÙØª ÙØ§ÙØªÙØ¯Ù </span></div> 20 </div> 21 <nav class="nav-list"> 22 <button class="nav-item active" data-view="dashboard"><span>â</span>اÙÙÙÙ </button> 23 <button class="nav-item" data-view="add"><span>ï¼</span>تسجÙÙ ÙØ¬Ø¨Ø©</button> 24 <button class="nav-item" data-view="mealplanner"><span>â</span>ØØ§Ø³Ø¨Ø© اÙÙØ¬Ø¨Ø©</button> 25 <button class="nav-item" data-view="explore"><span>â</span>Ø§Ø³ØªÙØ´Ù Ø§ÙØ£Ø·Ø¹Ù Ø©</button> 26 <button class="nav-item" data-view="foods"><span>â«</span>Ù ÙØªØ¨ØªÙ</button> 27 <button class="nav-item" data-view="calculator"><span>â</span>ØØ§Ø³Ø¨Ø© Ø§ÙØ³Ø¹Ø±Ø§Øª</button> 28 <button class="nav-item" data-view="history"><span>â¦</span>Ø§ÙØ³Ø¬Ù</button> 29 <button class="nav-item" data-view="progress"><span>â</span>Ø§ÙØªÙد٠</button> 30 <button class="nav-item" data-view="settings"><span>â</span>Ø§ÙØ¥Ø¹Ø¯Ø§Ø¯Ø§Øª</button> 31 </nav> 32 <div class="sidebar-footer"> 33 <button id="themeToggle" class="ghost-button full">اÙÙØ¶Ø¹ Ø§ÙØ¯Ø§ÙÙ</button> 34 <small id="storageStatus">Ø§ÙØÙØ¸ اÙÙ ØÙÙ ÙØ¹Ù Ù</small><small class="developer-credit">Developed by Hamido</small> 35 </div> 36 </aside> 37 38 <main class="main-content"> 39 <header class="topbar"> 40 <div><p class="eyebrow" id="todayLabel"></p><h1 id="pageTitle">اÙÙÙÙ </h1></div> 41 <div class="topbar-actions"> 42 <button id="syncStatusButton" class="ghost-button compact" data-go="settings">Ù ØÙÙ</button> 43 <button id="installButton" class="ghost-button" hidden>ØªØ«Ø¨ÙØª</button> 44 <button class="primary-button compact" data-go="add">Ø¥Ø¶Ø§ÙØ© طعا٠</button> 45 </div> 46 </header> 47 48 <section id="toast" class="toast" role="status" aria-live="polite"></section> 49 50 <section id="dashboardView" class="view active-view"> 51 <div class="hero-card"> 52 <div class="hero-copy"> 53 <div class="hero-badges"><span class="pill" id="dayModeBadge">اÙÙØ¯Ù Ø§ÙØ£Ø³Ø§Ø³Ù</span><button id="editTodayGoal" class="link-chip">تعدÙÙ ÙØ¯Ù اÙÙÙÙ </button></div> 54 <h2><span id="heroRemaining">0</span><span id="heroRemainingLabel"> سعر ٠تبÙÙ</span></h2> 55 <p id="heroSummary">ابدأ بتسجÙ٠أÙÙ ÙØ¬Ø¨Ø© اÙÙÙÙ .</p> 56 <div class="hero-actions"> 57 <button class="primary-button" data-go="add">سجÙÙ ÙØ¬Ø¨Ø©</button> 58 <button class="secondary-button" data-go="mealplanner">Ø¬Ø±ÙØ¨ ÙØ¬Ø¨Ø©</button> 59 <button class="secondary-button" id="repeatYesterdayBtn">ÙØ±Ø± Ø£Ù٠أ٠س</button> 60 </div> 61 </div> 62 <div class="calorie-ring" id="calorieRing" aria-label="ÙØ³Ø¨Ø© Ø§ÙØ³Ø¹Ø±Ø§Øª اÙ٠ستÙÙÙØ©"> 63 <div><strong id="ringCalories">0</strong><span>Ù Ù <b id="ringGoal">0</b></span></div> 64 </div> 65 </div> 66 67 <div class="stats-grid"> 68 <article class="stat-card"><div class="stat-head"><span>Ø§ÙØ¨Ø±ÙتÙÙ</span><b id="proteinStat">0 / 0 ج٠</b></div><div class="progress-track"><i id="proteinBar"></i></div></article> 69 <article class="stat-card"><div class="stat-head"><span>اÙÙØ±Ø¨ÙÙÙØ¯Ø±Ø§Øª</span><b id="carbsStat">0 / 0 ج٠</b></div><div class="progress-track"><i id="carbsBar"></i></div></article> 70 <article class="stat-card"><div class="stat-head"><span>Ø§ÙØ¯ÙÙÙ</span><b id="fatStat">0 / 0 ج٠</b></div><div class="progress-track"><i id="fatBar"></i></div></article> 71 <article class="stat-card"><div class="stat-head"><span>اÙ٠اء</span><b id="waterStat">0 / 3 ÙØªØ±</b></div><div class="water-actions"><button id="removeWater" aria-label="Ø¥ÙÙØ§Øµ ربع ÙØªØ± ٠اء" title="â 0.25 ÙØªØ±">â</button><div class="progress-track"><i id="waterBar"></i></div><button id="addWater" aria-label="Ø¥Ø¶Ø§ÙØ© ربع ÙØªØ± ٠اء" title="+ 0.25 ÙØªØ±">ï¼</button></div><small class="water-hint">Ù٠ضغطة = 0.25 ÙØªØ±</small></article> 72 </div> 73 74 <div class="content-grid two-columns"> 75 <article class="panel"> 76 <div class="panel-header"><div><span class="eyebrow">ÙØ¬Ø¨Ø§Øª اÙÙÙÙ </span><h3>ØªÙØ§ØµÙÙ Ø§ÙØ£ÙÙ</h3></div><button class="text-button" data-go="history">عرض Ø§ÙØ³Ø¬Ù</button></div> 77 <div id="todayMeals" class="meal-list"></div> 78 </article> 79 <article class="panel"> 80 <div class="panel-header"><div><span class="eyebrow">Ø§ÙØªØ±Ø§Ø ذÙÙ</span><h3>٠اذا ÙÙØ§Ø³Ø¨ اÙ٠تبÙÙØ</h3></div><button class="text-button" data-go="explore">اÙÙ Ø²ÙØ¯</button></div> 81 <div id="remainingSuggestions" class="suggestion-list"></div> 82 </article> 83 </div> 84 85 <div class="content-grid two-columns"> 86 <article class="panel"> 87 <div class="panel-header"><div><span class="eyebrow">آخر 7 Ø£ÙØ§Ù </span><h3>Ù ØªÙØ³Ø· Ø§ÙØ§Ùتزا٠</h3></div></div> 88 <div class="weekly-summary"><div><strong id="weeklyAverage">0</strong><span>Ù ØªÙØ³Ø· Ø§ÙØ³Ø¹Ø±Ø§Øª</span></div><div><strong id="daysLogged">0</strong><span>Ø£ÙØ§Ù Ù Ø³Ø¬ÙØ©</span></div><div><strong id="latestWeight">â</strong><span>آخر ÙØ²Ù</span></div></div> 89 <div id="weekBars" class="week-bars"></div> 90 </article> 91 <article class="panel"> 92 <div class="panel-header"><div><span class="eyebrow">ØØ³Ø§Ø¨Ù Ø§ÙØØ§ÙÙ</span><h3>Ù ÙØ®Øµ Ø§ÙØ³Ø¹Ø±Ø§Øª</h3></div><button class="text-button" data-go="calculator">Ø§ÙØªØ Ø§ÙØØ§Ø³Ø¨Ø©</button></div> 93 <div id="dashboardEnergySummary" class="energy-mini-grid"></div> 94 </article> 95 </div> 96 </section> 97 98 <section id="addView" class="view"> 99 <div class="content-grid two-columns form-layout"> 100 <article class="panel sticky-panel"> 101 <div class="panel-header"><div><span class="eyebrow">تسجÙÙ Ø³Ø±ÙØ¹</span><h3>Ø¥Ø¶Ø§ÙØ© طعا٠ÙÙÙÙÙ </h3></div></div> 102 <form id="logFoodForm" class="form-stack"> 103 <div class="form-row"><label>Ø§ÙØªØ§Ø±ÙØ®<input id="logDate" type="date" required /></label><label>اÙÙØ¬Ø¨Ø©<select id="mealType" required><option value="breakfast">اÙÙØ·Ø§Ø±</option><option value="snack1">Ø³ÙØ§Ù 1</option><option value="lunch">Ø§ÙØºØ¯Ø§Ø¡</option><option value="snack2">Ø³ÙØ§Ù 2</option><option value="dinner">Ø§ÙØ¹Ø´Ø§Ø¡</option></select></label></div> 104 <label>Ø§Ø¨ØØ« Ø¹Ù Ø§ÙØ·Ø¹Ø§Ù <input id="foodSearch" type="search" placeholder="٠ثاÙ: Ø¬Ø¨ÙØ© ÙØ±ÙØ´ أ٠رز" autocomplete="off" /></label> 105 <label>Ø§ÙØ·Ø¹Ø§Ù <select id="foodSelect" required></select></label> 106 <label>اÙÙÙ ÙØ© <span id="quantityHint" class="muted-inline"></span><input id="foodQuantity" type="number" min="0.1" step="0.1" value="100" required /></label>
107 <div class="nutrition-preview"><div><span>Ø§ÙØ³Ø¹Ø±Ø§Øª</span><strong id="previewCalories">0</strong></div><div><span>Ø¨Ø±ÙØªÙÙ</span><strong id="previewProtein">0 ج٠</strong></div><div><span>ÙØ§Ø±Ø¨</span><strong id="previewCarbs">0 ج٠</strong></div><div><span>دÙÙÙ</span><strong id="previewFat">0 ج٠</strong></div></div> 108 <button class="primary-button full" type="submit">Ø¥Ø¶Ø§ÙØ© ÙÙÙØ¬Ø¨Ø©</button> 109 <button class="secondary-button full" type="button" data-go="foods">Ø§ÙØ£ÙÙØ© ØºÙØ± Ù ÙØ¬ÙØ¯Ø©Ø Ø£Ø¶ÙÙØ§ بسرعة</button> 110 </form> 111 112 <div class="section-divider"><span>اÙÙ Ø´Ø±ÙØ¨Ø§Øª</span></div> 113 <form id="logDrinkForm" class="form-stack drink-form"> 114 <p class="helper-card">اÙÙ Ø´Ø±ÙØ¨Ø§Øª Ù ÙÙØµÙØ© Ø¹Ù ÙØ§Ø¦Ù Ø© Ø§ÙØ·Ø¹Ø§Ù . اختر اÙÙ Ø´Ø±ÙØ¨Ø ÙØ¹Ø¯Ø¯ Ø§ÙØ£ÙÙØ§Ø¨Ø ÙØ§ÙØ³ÙØ± ÙÙ ÙÙ ÙÙØ¨.</p> 115 <label>اÙÙ Ø´Ø±ÙØ¨<select id="drinkSelect" required></select></label> 116 <div class="form-row"> 117 <label>عدد Ø§ÙØ£ÙÙØ§Ø¨<input id="drinkCups" type="number" min="0.5" max="20" step="0.5" value="1" required /></label> 118 <label>Ù ÙØ§Ø¹Ù Ø§ÙØ³Ùر ÙÙÙ ÙÙØ¨<input id="drinkSugar" type="number" min="0" max="10" step="0.5" value="0" /></label> 119 </div> 120 <div id="drinkPreview" class="drink-preview"><strong>0 سعر</strong><span>0 Ø¬Ù ÙØ§Ø±Ø¨</span></div> 121 <button class="secondary-button full" type="submit">Ø¥Ø¶Ø§ÙØ© اÙÙ Ø´Ø±ÙØ¨ ÙÙÙØ¬Ø¨Ø©</button> 122 <button class="ghost-button full" type="button" data-open-custom-drink="log">اÙÙ Ø´Ø±ÙØ¨ ØºÙØ± Ù ÙØ¬ÙØ¯Ø Ø£Ø¶ÙÙ ÙÙ ÙØªØ¨ØªÙ</button> 123 </form> 124 </article> 125 <article class="panel"> 126 <div class="panel-header"><div><span class="eyebrow">Ù ÙØ®Øµ Ø§ÙØªØ§Ø±ÙØ® اÙ٠ختار</span><h3 id="selectedDayTitle">اÙÙÙÙ </h3></div></div> 127 <div id="selectedDaySummary" class="day-summary-card"></div><div id="selectedDayEntries" class="meal-list"></div> 128 </article> 129 </div> 130 </section> 131 132 <section id="mealplannerView" class="view"> 133 <article class="panel discovery-hero meal-planner-hero"> 134 <div><span class="eyebrow">ØØ³Ø§Ø¨ بدÙ٠تسجÙÙ</span><h2>Ø¬Ø±ÙØ¨ اÙÙØ¬Ø¨Ø© ÙØ¨Ù ٠ا ØªØ¹ØªÙ Ø¯ÙØ§</h2><p>أض٠ÙÙ Ù ÙÙÙØ§Øª اÙÙØ¬Ø¨Ø© ÙØ´Ø§Ùد Ù Ø¬Ù ÙØ¹ Ø§ÙØ³Ø¹Ø±Ø§Øª ÙØ§ÙÙ Ø§ÙØ±Ùز. ÙÙ ØªØªØºÙØ± ÙÙÙ ÙØ§ØªÙ Ø¥ÙØ§ بعد Ø§ÙØ¶ØºØ· عÙÙ Â«Ø¥Ø¶Ø§ÙØ© اÙÙØ¬Ø¨Ø© ÙÙÙÙ٠».</p></div> 135 <div id="draftGoalSummary" class="meal-fit-card"></div> 136 </article> 137 138 <div class="content-grid two-columns form-layout"> 139 <article class="panel sticky-panel"> 140 <div class="panel-header"><div><span class="eyebrow">Ù ÙÙÙØ§Øª اÙÙØ¬Ø¨Ø©</span><h3>Ø£Ø¶Ù Ù Ù Ù ÙØªØ¨Ø© Ø§ÙØ£Ø·Ø¹Ù Ø©</h3></div></div> 141 <form id="draftFoodForm" class="form-stack"> 142 <label>Ø§Ø¨ØØ« Ø¹Ù Ø§ÙØ·Ø¹Ø§Ù <input id="draftFoodSearch" type="search" placeholder="٠ثاÙ: Ø£Ø±Ø²Ø ÙØ±Ø§Ø®Ø Ø³ÙØ±..." autocomplete="off" /></label> 143 <label>Ø§ÙØ·Ø¹Ø§Ù <select id="draftFoodSelect" required></select></label> 144 <label>اÙÙÙ ÙØ© <span id="draftQuantityHint" class="muted-inline"></span><input id="draftFoodQuantity" type="number" min="0.1" step="0.1" value="100" required /></label>
145 <div class="nutrition-preview"><div><span>Ø§ÙØ³Ø¹Ø±Ø§Øª</span><strong id="draftPreviewCalories">0</strong></div><div><span>Ø¨Ø±ÙØªÙÙ</span><strong id="draftPreviewProtein">0 ج٠</strong></div><div><span>ÙØ§Ø±Ø¨</span><strong id="draftPreviewCarbs">0 ج٠</strong></div><div><span>دÙÙÙ</span><strong id="draftPreviewFat">0 ج٠</strong></div></div> 146 <button class="primary-button full" type="submit">أض٠ÙÙØªØ¬Ø±Ø¨Ø© ÙÙØ·</button> 147 </form> 148 149 <div class="section-divider"><span>Ù Ø´Ø±ÙØ¨ ٠ع اÙÙØ¬Ø¨Ø©</span></div> 150 <form id="draftDrinkForm" class="form-stack drink-form"> 151 <label>اÙÙ Ø´Ø±ÙØ¨<select id="draftDrinkSelect" required></select></label> 152 <div class="form-row"> 153 <label>عدد Ø§ÙØ£ÙÙØ§Ø¨<input id="draftDrinkCups" type="number" min="0.5" max="20" step="0.5" value="1" required /></label> 154 <label>Ù ÙØ§Ø¹Ù Ø§ÙØ³Ùر ÙÙÙ ÙÙØ¨<input id="draftDrinkSugar" type="number" min="0" max="10" step="0.5" value="0" /></label> 155 </div> 156 <div id="draftDrinkPreview" class="drink-preview"><strong>0 سعر</strong><span>0 Ø¬Ù ÙØ§Ø±Ø¨</span></div> 157 <button class="secondary-button full" type="submit">أض٠اÙÙ Ø´Ø±ÙØ¨ ÙÙØªØ¬Ø±Ø¨Ø© ÙÙØ·</button> 158 <button class="ghost-button full" type="button" data-open-custom-drink="draft">اÙÙ Ø´Ø±ÙØ¨ ØºÙØ± Ù ÙØ¬ÙØ¯Ø Ø£Ø¶ÙÙ ÙÙ ÙØªØ¨ØªÙ</button> 159 </form> 160 161 <details class="advanced-details draft-custom-details"> 162 <summary>Ù ÙÙÙÙ Ù Ø¤ÙØª ØºÙØ± Ù ÙØ¬Ùد Ù٠اÙÙ ÙØªØ¨Ø©</summary> 163 <form id="draftCustomForm" class="details-body form-stack"> 164 <label>اس٠اÙÙ ÙÙÙÙ <span class="required-mark">Ù Ø·ÙÙØ¨</span><input id="draftCustomName" type="text" placeholder="٠ثاÙ: ØµÙØµ خاص" required /></label> 165 <label>إج٠اÙ٠سعرات٠<span class="required-mark">Ù Ø·ÙÙØ¨</span><input id="draftCustomCalories" type="number" min="0" step="0.1" placeholder="٠ثاÙ: 120" required /></label> 166 <p class="helper-card">Ø§ÙØ¨Ø±ÙتÙÙ ÙØ§ÙÙØ§Ø±Ø¨ ÙØ§ÙدÙÙÙ Ø§Ø®ØªÙØ§Ø±ÙØ©. ÙØ°Ø§ اÙÙ ÙÙÙÙ ÙÙ ÙÙØÙØ¸ ÙÙ Ù ÙØªØ¨ØªÙ Ø¥ÙØ§ إذا Ø£Ø¶ÙØªÙ ÙØ§ØÙÙØ§ Ù Ù ÙØ³Ù Â«Ù ÙØªØ¨ØªÙ».</p> 167 <div class="form-row"><label>Ø§ÙØ¨Ø±ÙتÙÙ (ج٠)<input id="draftCustomProtein" type="number" min="0" step="0.1" placeholder="Ø§Ø®ØªÙØ§Ø±Ù" /></label><label>اÙÙØ§Ø±Ø¨ (ج٠)<input id="draftCustomCarbs" type="number" min="0" step="0.1" placeholder="Ø§Ø®ØªÙØ§Ø±Ù" /></label></div> 168 <label>Ø§ÙØ¯ÙÙÙ (ج٠)<input id="draftCustomFat" type="number" min="0" step="0.1" placeholder="Ø§Ø®ØªÙØ§Ø±Ù" /></label> 169 <button class="secondary-button full" type="submit">أض٠اÙÙ ÙÙÙ٠اÙÙ Ø¤ÙØª</button> 170 </form> 171 </details> 172 </article> 173 174 <article class="panel"> 175 <div class="panel-header wrap-header"><div><span class="eyebrow">اÙÙØªÙجة Ø§ÙØªØ¬Ø±ÙØ¨ÙØ©</span><h3>إج٠اÙ٠اÙÙØ¬Ø¨Ø©</h3></div><button id="clearDraftMeal" class="ghost-button compact">Ù Ø³Ø Ø§ÙÙØ¬Ø¨Ø©</button></div> 176 <div id="draftMealTotals" class="draft-total-grid"></div> 177 <div id="draftMealItems" class="draft-list"></div> 178 <div class="draft-commit"> 179 <div class="panel-header"><div><span class="eyebrow">بعد اÙ٠راجعة ÙÙØ·</span><h3>اعت٠اد اÙÙØ¬Ø¨Ø©</h3></div></div> 180 <div class="form-row"><label>Ø§ÙØªØ§Ø±ÙØ®<input id="draftCommitDate" type="date" /></label><label>اÙÙØ¬Ø¨Ø©<select id="draftCommitMeal"><option value="breakfast">اÙÙØ·Ø§Ø±</option><option value="snack1">Ø³ÙØ§Ù 1</option><option value="lunch" selected>Ø§ÙØºØ¯Ø§Ø¡</option><option value="snack2">Ø³ÙØ§Ù 2</option><option value="dinner">Ø§ÙØ¹Ø´Ø§Ø¡</option></select></label></div> 181 <button id="commitDraftMeal" class="primary-button full" type="button">Ø¥Ø¶Ø§ÙØ© اÙÙØ¬Ø¨Ø© ÙÙÙÙÙ </button> 182 <p class="mini-note">ÙØ¨Ù Ø§ÙØ¶ØºØ· عÙÙ Ø§ÙØ²Ø±Ø اÙÙ ÙÙÙØ§Øª Ù ÙØ¬Ùدة ÙÙ Ø§ÙØØ§Ø³Ø¨Ø© ÙÙØ· ÙÙØ§ تدخ٠ض٠٠سعرات ÙÙÙ Ù.</p> 183 </div> 184 </article> 185 </div> 186 </section> 187 188 <section id="exploreView" class="view"> 189 <article class="panel discovery-hero"> 190 <div><span class="eyebrow">Ø§Ø³ØªÙØ´Ø§Ù ÙØ¨Ù Ø§ÙØªØ³Ø¬ÙÙ</span><h2>Ø§Ø¨ØØ« ع٠أÙÙ ÙÙØ§Ø³Ø¨ ÙØ¯ÙÙ</h2><p>ÙØ§Ø±Ù Ø§ÙØ³Ø¹Ø±Ø§Øª ÙØ§ÙØ¨Ø±ÙØªÙÙØ Ø«Ù Ø£Ø¶Ù Ø§ÙØ·Ø¹Ø§Ù ٠باشرة٠إÙÙ ÙÙÙ Ù.</p></div> 191 <div class="discovery-controls"><input id="exploreSearch" type="search" placeholder="Ø§Ø¨ØØ«: ÙØ±Ø§Ø®Ø Ø¨Ø·Ø§Ø·Ø³Ø Ø²Ø¨Ø§Ø¯Ù..." /><select id="exploreCategory"></select><select id="exploreFilter"><option value="all">ÙÙ Ø§ÙØ£Ø·Ø¹Ù Ø©</option><option value="highProtein">Ø¨Ø±ÙØªÙÙ Ù Ø±ØªÙØ¹</option><option value="lowCalorie">سعرات Ù ÙØ®Ùضة</option><option value="lowFat">ÙÙÙÙ Ø§ÙØ¯ÙÙÙ</option><option value="highFiber">Ø£ÙÙØ§Ù Ù Ø±ØªÙØ¹Ø©</option><option value="favorites">اÙÙ ÙØ¶ÙØ©</option></select><select id="exploreSort"><option value="recommended">Ø§ÙØ£Ùسب ÙÙØ¯Ù اÙÙÙÙ </option><option value="proteinDesc">Ø§ÙØ£Ø¹ÙÙ Ø¨Ø±ÙØªÙÙÙØ§</option><option value="caloriesAsc">Ø§ÙØ£Ù٠سعرات</option><option value="name">Ø§ÙØ§Ø³Ù </option></select></div> 192 </article> 193 194 <div class="content-grid explore-layout"> 195 <article class="panel"> 196 <div class="panel-header wrap-header"><div><span class="eyebrow">ÙØ§Ø¹Ø¯Ø© Ø§ÙØ£Ø·Ø¹Ù Ø©</span><h3 id="exploreCount">Ø§ÙØ£Ø·Ø¹Ù Ø© اÙÙ ØªØ§ØØ©</h3></div><button id="clearCompare" class="ghost-button compact">Ù Ø³Ø Ø§ÙÙ ÙØ§Ø±ÙØ©</button></div> 197 <div id="exploreFoods" class="food-card-grid"></div> 198 </article> 199 <aside class="panel compare-panel"> 200 <div class="panel-header"><div><span class="eyebrow">ØØªÙ 3 أطع٠ة</span><h3>اÙÙ ÙØ§Ø±ÙØ©</h3></div></div> 201 <div id="compareFoods" class="compare-box"></div> 202 <hr /> 203 <div class="panel-header"><div><span class="eyebrow">
203Ø¨ØØ« عاÙÙ Ù</span><h3>USDA Ø§Ø®ØªÙØ§Ø±Ù</h3></div></div> 204 <div class="form-stack"><input id="usdaQuery" type="search" placeholder="Ø§ÙØªØ¨ Ø¨Ø§ÙØ¥ÙجÙÙØ²ÙØ© ٠ث٠chicken breast" /><input id="usdaApiKey" type="text" placeholder="API Key أ٠اترÙÙ ÙØ§Ø³ØªØ®Ø¯Ø§Ù DEMO_KEY" /><button id="searchUsda" class="secondary-button">Ø¨ØØ« خارجÙ</button><div id="usdaResults" class="external-results"></div></div> 205 </aside> 206 </div> 207 </section> 208 209 <section id="foodsView" class="view"> 210 <div class="content-grid two-columns form-layout"> 211 <article class="panel sticky-panel"> 212 <div class="panel-header"><div><span class="eyebrow">Ø¥Ø¶Ø§ÙØ© Ø³Ø±ÙØ¹Ø©</span><h3 id="foodFormTitle">Ø·Ø¹Ø§Ù Ø¬Ø¯ÙØ¯</h3></div></div> 213 <form id="customFoodForm" class="form-stack"> 214 <input id="editingFoodId" type="hidden" /> 215 <label>Ø§Ø³Ù Ø§ÙØ·Ø¹Ø§Ù <span class="required-mark">Ù Ø·ÙÙØ¨</span><input id="customFoodName" type="text" placeholder="٠ثاÙ: Ø³ÙØ·Ø© Ø§ÙØ¨Ùت" required /></label> 216 <label>Ø§ÙØ³Ø¹Ø±Ø§Øª Ø§ÙØØ±Ø§Ø±ÙØ© <span class="required-mark">Ù Ø·ÙÙØ¨</span><input id="customCalories" type="number" min="0" step="0.1" placeholder="٠ثاÙ: 180" required /></label> 217 <p class="helper-card">ÙÙÙÙ Ø§ÙØ§Ø³Ù ÙØ§Ùسعرات ÙÙØ·. ÙÙ Ø§ÙØªÙاصÙÙ Ø§ÙØªØ§ÙÙØ© Ø§Ø®ØªÙØ§Ø±ÙØ©Ø ÙÙÙ Ù٠تعدÙÙÙØ§ ÙØ§ØÙÙØ§.</p> 218 <details class="advanced-details"> 219 <summary>Ø¥Ø¶Ø§ÙØ© ØªÙØ§ØµÙÙ Ø§Ø®ØªÙØ§Ø±ÙØ©</summary> 220 <div class="details-body form-stack"> 221 <div class="form-row"><label>اÙÙÙÙ Ø© ÙÙÙ<input id="customFoodBasis" type="number" value="100" min="0.1" step="0.1" /></label><label>اÙÙØØ¯Ø©<select id="customFoodUnit"><option value="g">جرا٠</option><option value="ml">Ù Ù</option><option value="piece">ÙØ·Ø¹Ø©</option><option value="serving">ØØµØ©</option><option value="tbsp">Ù ÙØ¹ÙØ© ÙØ¨Ùرة</option><option value="cup">ÙÙØ¨</option></select></label></div> 222 <div class="form-row"><label>Ø§ÙØ¨Ø±ÙتÙÙ (ج٠)<input id="customProtein" type="number" min="0" step="0.1" placeholder="Ø§Ø®ØªÙØ§Ø±Ù" /></label><label>اÙÙØ§Ø±Ø¨ (ج٠)<input id="customCarbs" type="number" min="0" step="0.1" placeholder="Ø§Ø®ØªÙØ§Ø±Ù" /></label></div> 223 <div class="form-row"><label>Ø§ÙØ¯ÙÙÙ (ج٠)<input id="customFat" type="number" min="0" step="0.1" placeholder="Ø§Ø®ØªÙØ§Ø±Ù" /></label><label>Ø§ÙØ£ÙÙØ§Ù (ج٠)<input id="customFiber" type="number" min="0" step="0.1" placeholder="Ø§Ø®ØªÙØ§Ø±Ù" /></label></div> 224 <label>Ø§ÙØªØµÙÙÙ<select id="customCategory"></select></label> 225 <div class="inline-create"><input id="newCategoryName" type="text" placeholder="تصÙÙÙ Ø¬Ø¯ÙØ¯ Ù Ø«Ù: Ø£ÙÙ Ø§ÙØ¨Ùت" /><button id="addCategoryButton" class="ghost-button" type="button">Ø¥Ø¶Ø§ÙØ© تصÙÙÙ</button></div> 226 <label>اÙÙ Ø§Ø±ÙØ© أ٠اÙ٠صدر<input id="customBrand" type="text" placeholder="Ø§Ø®ØªÙØ§Ø±Ù" /></label> 227 <label>Ù ÙØ§ØØ¸Ø§Øª<textarea id="customNotes" rows="2" placeholder="Ø§Ø®ØªÙØ§Ø±Ù: Ù Ø·Ø¨ÙØ®Ø بدÙÙ Ø²ÙØªØ ٠٠اÙÙ ÙØµÙ..."></textarea></label> 228 <label class="check-row"><input id="customFavorite" type="checkbox" /> أضÙÙ ÙÙÙ ÙØ¶ÙØ©</label> 229 </div> 230 </details> 231 <div id="macroCheck" class="macro-check" hidden></div> 232 <div class="button-row"><button class="primary-button" type="submit">ØÙظ Ø§ÙØ·Ø¹Ø§Ù </button><button id="cancelFoodEdit" class="ghost-button" type="button" hidden>Ø¥ÙØºØ§Ø¡ Ø§ÙØªØ¹Ø¯ÙÙ</button></div> 233 </form> 234 </article> 235 <article class="panel"> 236 <div class="panel-header wrap-header"><div><span class="eyebrow">Ù ÙØªØ¨ØªÙ</span><h3>Ø§ÙØ£Ø³Ø§Ø³ÙØ© ÙØ§Ù٠خصصة</h3></div><div class="header-filters"><input id="foodsListSearch" class="inline-search" type="search" placeholder="Ø¨ØØ«..." /><select id="foodsListCategory"></select></div></div> 237 <div id="foodsList" class="foods-list"></div> 238 </article> 239 </div> 240 </section> 241 242 <section id="calculatorView" class="view"> 243 <div class="content-grid calculator-layout"> 244 <article class="panel"> 245 <div class="panel-header"><div><span class="eyebrow">BMR + TDEE</span><h3>ØØ§Ø³Ø¨Ø© Ø§ÙØ³Ø¹Ø±Ø§Øª ÙØ§ÙÙØ¯Ù</h3></div><button id="loadMyProfile" class="ghost-button compact">Ø§Ø³ØªØ®Ø¯Ù Ø¨ÙØ§ÙاتÙ</button></div> 246 <form id="calculatorForm" class="form-stack"> 247 <div class="form-row"><label>اÙÙÙØ¹<select id="calcSex" required><option value="male">Ø°ÙØ±</option><option value="female">Ø£ÙØ«Ù</option></select></label><label>Ø§ÙØ³Ù<input id="calcAge" type="number" min="18" max="100" required /></label></div> 248 <div class="form-row"><label>Ø§ÙØ·ÙÙ (س٠)<input id="calcHeight" type="number" min="120" max="230" required /></label><label>اÙÙØ²Ù (ÙØ¬Ù )<input id="calcWeight" type="number" min="30" max="400" step="0.1" required /></label></div> 249 <label>٠عد٠اÙÙØ´Ø§Ø·<select id="calcActivity"><option value="1.2">ÙÙÙÙ Ø¬Ø¯ÙØ§ â Ø¬ÙÙØ³ Ø£ØºÙØ¨ اÙÙÙÙ ÙÙØ§ ÙÙØ¬Ø¯ ت٠رÙÙ Ù ÙØªØ¸Ù </option><option value="1.375">Ø®ÙÙÙ â ØØ±ÙØ© Ø¨Ø³ÙØ·Ø© أ٠ت٠رÙÙ 1â3 Ø£ÙØ§Ù </option><option value="1.5" selected>Ù ØªÙØ³Ø· Ù ØØ§Ùظ â Ø¬ÙÙ 3â5 Ø£ÙØ§Ù ٠ع جÙÙØ³ Ø£ØºÙØ¨ اÙÙÙÙ </option><option value="1.55">Ù ØªÙØ³Ø· â ØØ±ÙØ© ÙÙÙ ÙØ© ÙØªÙ رÙÙ 3â5 Ø£ÙØ§Ù </option><option value="1.725">Ù Ø±ØªÙØ¹ â ØªÙ رÙÙ ÙÙÙ 6â7 Ø£ÙØ§Ù Ø£Ù Ø¹Ù Ù Ù ØªØØ±Ù</option><option value="1.9">Ù Ø±ØªÙØ¹ Ø¬Ø¯ÙØ§ â ØªØ¯Ø±Ùب Ø´Ø§Ù ÙØ¹Ù ٠بدÙÙ</option></select></label> 250 <p class="helper-card">Ø³ÙØØ³Ø¨ Ø§ÙØªØ·Ø¨Ù٠تÙÙØ§Ø¦ÙÙØ§ سعرات Ø§ÙØ«Ø¨Ø§ØªØ ÙØ§ÙتراØÙا Ù ØØ§ÙØ¸ÙØ§ ÙÙÙØ²ÙÙØ ÙØ§ÙتراØÙا Ù ØØ§ÙØ¸ÙØ§ ÙÙØ²Ùادة. Ø§ÙØ®Ùارات Ø§ÙØªØ§ÙÙØ© ØªØªÙØ ÙÙ Ø£ÙØ¶Ùا تجربة عجز Ø£Ù ÙØ§Ø¦Ø¶ ٠خصص.</p><div class="goal-builder"> 251 <label>اÙÙØ¯Ù<select id="calcGoalType"><option value="maintain">ثبات</option><option value="deficit">خسارة ÙØ²Ù</option><option value="surplus">Ø²ÙØ§Ø¯Ø© ÙØ²Ù</option></select></label> 252 <label>طرÙÙØ© Ø§ÙØªØ¹Ø¯ÙÙ<select id="calcAdjustmentMode"><option value="percent">ÙØ³Ø¨Ø© ٠٠سعرات Ø§ÙØ«Ø¨Ø§Øª</option><option value="calories">عدد سعرات ثابت</option></select></label> 253 <label id="calcAdjustmentLabel">اÙÙØ³Ø¨Ø© %<input id="calcAdjustment" type="number" min="0" max="40" step="1" value="20" /></label> 254 </div> 255 <button class="primary-button full" type="submit">Ø§ØØ³Ø¨ Ø§ÙØ³Ø¹Ø±Ø§Øª</button> 256 </form> 257 </article> 258 <article class="panel result-panel"> 259 <div class="panel-header"><div><span class="eyebrow">اÙÙØªÙجة</span><h3>ØªÙØ¯Ùر Ø§ÙØ§ØØªÙاج اÙÙÙÙ Ù</h3></div></div> 260 <div id="calculatorResults" class="calculator-results empty-state"><strong>Ø£Ø¯Ø®Ù Ø§ÙØ¨ÙØ§ÙØ§Øª ÙØ§Ø¶ØºØ· Ø§ØØ³Ø¨</strong><span>Ø³ØªØ¸ÙØ± سعرات Ø§ÙØ«Ø¨Ø§Øª ÙØ§ÙØªØ±Ø§ØØ§Øª تÙÙØ§Ø¦ÙØ© ÙÙÙØ²ÙÙ ÙØ§ÙØ²ÙØ§Ø¯Ø©Ø ٠ع Ø¥Ù ÙØ§ÙÙØ© تجربة ÙØ¯Ù ٠خصص.</span></div> 261 </article> 262 </div> 263 </section> 264 265 <section id="historyView" class="view"> 266 <article class="panel"><div class="panel-header wrap-header"><div><span class="eyebrow">
266Ø§ÙØ³Ø¬Ù اÙÙÙÙ Ù</span><h3>راجع أ٠عدÙ٠أ٠ÙÙÙ </h3></div><div class="button-row"><input id="historyDate" type="date" /><button id="copyPreviousDay" class="secondary-button">ÙØ³Ø® اÙÙÙÙ Ø§ÙØ³Ø§Ø¨Ù</button></div></div><div id="historySummary" class="history-total"></div><div id="historyMeals" class="meal-list"></div></article> 267 </section> 268 269 <section id="progressView" class="view"> 270 <div class="content-grid two-columns form-layout"> 271 <article class="panel sticky-panel"><div class="panel-header"><div><span class="eyebrow">تسجÙ٠اÙÙÙØ§Ø³</span><h3>Ø£Ø¶Ù ÙØ²ÙÙ</h3></div></div><form id="weightForm" class="form-stack"><label>Ø§ÙØªØ§Ø±ÙØ®<input id="weightDate" type="date" required /></label><label>اÙÙØ²Ù باÙÙÙÙÙØ¬Ø±Ø§Ù <input id="weightValue" type="number" min="20" max="400" step="0.1" required /></label><label>Ù ÙØ§ØØ¸Ø© Ø§Ø®ØªÙØ§Ø±ÙØ©<textarea id="weightNote" rows="3" placeholder="٠ثاÙ: صباØÙا ÙØ¨Ù اÙÙØ·Ø§Ø±"></textarea></label><button class="primary-button full" type="submit">ØÙظ اÙÙØ²Ù</button></form><div class="mini-note">تابع Ù ØªÙØ³Ø· Ø§ÙØ§ØªØ¬Ø§Ù Ø§ÙØ£Ø³Ø¨ÙØ¹ÙØ رÙÙ ÙÙÙ ÙØ§ØØ¯ ÙØªØ£Ø«Ø± باÙÙ ÙØ§Ù ÙØ§ÙÙ ÙØ ÙØªÙÙÙØª اÙÙÙØ§Ø³.</div></article> 272 <article class="panel"><div class="panel-header"><div><span class="eyebrow">ØªØºÙØ± اÙÙØ²Ù</span><h3>Ø§ÙØ±Ø³Ù Ø§ÙØ¨ÙاÙÙ</h3></div></div><div class="progress-cards"><div><span>Ø§ÙØ¨Ø¯Ø§ÙØ©</span><strong id="startWeight">â</strong></div><div><span>Ø§ÙØØ§ÙÙ</span><strong id="currentWeight">â</strong></div><div><span>Ø§ÙØªØºÙر</span><strong id="weightChange">â</strong></div></div><canvas id="weightChart" height="260"></canvas><div id="weightEntries" class="weight-list"></div></article> 273 </div> 274 </section> 275 276 <section id="settingsView" class="view"> 277 <div class="content-grid settings-grid"> 278 <article class="panel"><div class="panel-header"><div><span class="eyebrow">Ø¨ÙØ§ÙاتÙ</span><h3>اÙÙ ÙÙ Ø§ÙØ´Ø®ØµÙ</h3></div></div><form id="profileForm" class="form-stack"><div class="form-row"><label>Ø§ÙØ¹Ù ر<input id="profileAge" type="number" min="18" max="100" required /></label><label>اÙÙÙØ¹<select id="profileSex"><option value="unspecified">ØºÙØ± Ù ØØ¯Ø¯</option><option value="male">Ø°ÙØ±</option><option value="female">Ø£ÙØ«Ù</option></select></label></div><div class="form-row"><label>Ø§ÙØ·ÙÙ (س٠)<input id="profileHeight" type="number" min="120" max="230" required /></label><label>اÙÙØ²Ù Ø§ÙØØ§ÙÙ (ÙØ¬Ù )<input id="profileWeight" type="number" min="20" max="400" step="0.1" required /></label></div><label>Ø£ÙØ§Ù Ø§ÙØ¬ÙÙ Ø£Ø³Ø¨ÙØ¹ÙÙØ§<select id="profileWorkouts"><option value="0">ÙØ§ أت٠رÙ</option><option value="1">ÙÙÙ </option><option value="2">ÙÙ٠اÙ</option><option value="3">3 Ø£ÙØ§Ù </option><option value="4">4 Ø£ÙØ§Ù </option><option value="5">5 Ø£ÙØ§Ù </option><option value="6">6 Ø£ÙØ§Ù </option><option value="7">7 Ø£ÙØ§Ù </option></select></label><label>ÙØ´Ø§Ø· باÙ٠اÙÙÙÙ <select id="profileDailyActivity"><option value="sedentary">ÙÙÙÙ â Ø¬ÙÙØ³ ÙÙ Ø§ÙØ¨Ùت ØºØ§ÙØ¨Ùا</option><option value="light">Ø®ÙÙÙ â ØØ±ÙØ© Ù٠شاÙÙØ± Ø¨Ø³ÙØ·Ø©</option><option value="active">ÙØ´Ø· â ØØ±ÙØ© أ٠ع٠٠بدÙÙ</option></select></label><button class="primary-button" type="submit">ØÙظ Ø¨ÙØ§ÙاتÙ</button></form></article> 279 280 <article class="panel goals-panel"><div class="panel-header"><div><span class="eyebrow">Ø£ÙØ¯Ø§Ù ÙØ§Ø¨ÙØ© ÙÙØªØ®ØµÙص</span><h3>Ø§ÙØ³Ø¹Ø±Ø§Øª ÙØ§ÙÙ Ø§ÙØ±Ùز</h3></div></div><div class="goal-tabs"><button class="goal-tab active" data-goal-profile="default">Ø§ÙØ£Ø³Ø§Ø³Ù</button><button class="goal-tab" data-goal-profile="training">ÙÙÙ Ø§ÙØªÙ رÙÙ</button><button class="goal-tab" data-goal-profile="rest">ÙÙÙ Ø§ÙØ±Ø§ØØ©</button></div><form id="goalsForm" class="form-stack"><input id="activeGoalProfile" type="hidden" value="default" /><label>ÙØ¯Ù Ø§ÙØ³Ø¹Ø±Ø§Øª<input id="goalCalories" type="number" min="500" max="8000" step="10" required /></label><div class="form-row"><label>Ø§ÙØ¨Ø±ÙتÙÙ (ج٠)<input id="goalProtein" type="number" min="0" max="500" required /></label><label>اÙÙØ§Ø±Ø¨ (ج٠)<input id="goalCarbs" type="number" min="0" max="1000" required /></label></div><div class="form-row"><label>Ø§ÙØ¯ÙÙÙ (ج٠)<input id="goalFat" type="number" min="0" max="500" required /></label><label>ÙØ¯Ù اÙ٠اء (ÙØªØ±)<input id="goalWater" type="number" min="0.5" max="10" step="0.25" required /></label></div><p class="mini-note">3 ÙØªØ±Ø§Øª ÙØ¯Ù Ù Ø¨Ø¯Ø¦Ù ÙØ§Ø¨Ù ÙÙØªØ¹Ø¯ÙÙØ ÙÙÙØ³ ØØ¯Ù
280ا طبÙÙØ§ Ø¥ÙØ²Ø§Ù ÙÙØ§ ÙÙØ¬Ù ÙØ¹.</p><button class="primary-button" type="submit">ØÙظ ÙØ°Ø§ اÙÙØ¯Ù</button></form></article> 281 282 <article class="panel cloud-panel"><div class="panel-header"><div><span class="eyebrow">Ø§Ø®ØªÙØ§Ø±Ù</span><h3>اÙÙ Ø²Ø§Ù ÙØ© بÙÙ Ø§ÙØ£Ø¬Ùزة</h3></div><span id="cloudBadge" class="status-badge">ØºÙØ± ٠تصÙ</span></div><p class="muted-copy">ÙØ³ØªÙ ر Ø§ÙØªØ·Ø¨ÙÙ ÙÙ Ø§ÙØÙØ¸ Ù ØÙÙÙØ§. ÙÙÙÙ Ø²Ø§Ù ÙØ© بÙ٠اÙÙ ÙØ¨Ø§ÙÙ ÙØ§ÙÙØ§Ø¨Ø Ø§Ø±Ø¨Ø·Ù Ø¨Ù Ø´Ø±ÙØ¹ Supabase خاص بÙ.</p><details class="advanced-details"><summary>إعداد Ø§ÙØ§ØªØµØ§Ù Ø§ÙØ³ØØ§Ø¨Ù</summary><div class="details-body form-stack"><label>Supabase Project URL<input id="supabaseUrl" type="url" placeholder="https://xxxx.supabase.co" /></label><label>Supabase anon key<textarea id="supabaseAnonKey" rows="3" placeholder="اÙÙ ÙØªØ§Ø Ø§ÙØ¹Ø§Ù anon key"></textarea></label><button id="saveCloudConfig" class="secondary-button" type="button">ØÙظ إعداد Ø§ÙØ§ØªØµØ§Ù</button></div></details><form id="cloudAuthForm" class="form-stack"><label>Ø§ÙØ¨Ø±Ùد Ø§ÙØ¥ÙÙØªØ±ÙÙÙ<input id="cloudEmail" type="email" autocomplete="email" /></label><label>ÙÙÙ Ø© اÙÙ Ø±ÙØ±<input id="cloudPassword" type="password" minlength="6" autocomplete="current-password" /></label><div class="button-row"><button id="cloudLogin" class="primary-button" type="button">تسجÙÙ Ø§ÙØ¯Ø®ÙÙ</button><button id="cloudSignup" class="secondary-button" type="button">Ø¥ÙØ´Ø§Ø¡ ØØ³Ø§Ø¨</button><button id="cloudLogout" class="ghost-button" type="button" hidden>تسجÙÙ Ø§ÙØ®Ø±Ùج</button></div></form><div class="button-row cloud-actions"><button id="pushCloud" class="secondary-button" type="button">Ø±ÙØ¹ Ø¨ÙØ§Ùات ÙØ°Ø§ Ø§ÙØ¬Ùاز</button><button id="pullCloud" class="secondary-button" type="button">ØªÙØ²ÙÙ Ø¨ÙØ§Ùات Ø§ÙØ³ØØ§Ø¨Ø©</button></div><p id="cloudMessage" class="mini-note">ØªØØªØ§Ø¬ إعداد Ø§ÙØ¬Ø¯ÙÙ ÙØ³Ùاسات Ø§ÙØ£Ù ا٠اÙÙ ÙØ¶ØØ© ÙÙ Ù ÙÙ README.</p></article> 283 284 <article class="panel"><div class="panel-header"><div><span class="eyebrow">اÙÙØ³Ø®Ø© Ø§ÙØ§ØØªÙØ§Ø·ÙØ©</span><h3>Ø¨ÙØ§Ùات٠٠ÙÙÙ</h3></div></div><div class="form-stack"><button id="exportBackup" class="secondary-button">ØªØµØ¯ÙØ± ÙØ³Ø®Ø© JSON</button><button id="exportCsv" class="secondary-button">ØªØµØ¯ÙØ± سج٠اÙÙØ¬Ø¨Ø§Øª CSV</button><label class="file-button">استرجاع ÙØ³Ø®Ø© JSON<input id="importBackup" type="file" accept="application/json" hidden /></label><button id="resetData" class="danger-button">Ù Ø³Ø ÙÙ Ø§ÙØ¨ÙØ§ÙØ§Øª</button></div></article> 285 286 <article class="panel"><div class="panel-header"><div><span class="eyebrow">ع٠اÙÙØ³Ø®Ø©</span><h3>My Diet Tracker v7</h3></div></div><div class="about-copy"><p>ÙØ¹Ù Ù Ù ØÙÙÙØ§ ÙÙØ±ÙØ§Ø ÙÙÙÙÙ Ø¨ÙØ§Ùات اÙÙØ³Ø® Ø§ÙØ³Ø§Ø¨ÙØ© تÙÙØ§Ø¦ÙÙØ§.</p><p><strong>Developed by Hamido</strong></p><p>ÙÙÙ Ø§ÙØ£Ø·Ø¹Ù Ø© ØªÙØ±ÙØ¨ÙØ© ÙÙØ¯ تختÙÙ ØØ³Ø¨ اÙÙ ÙØªØ¬ ÙØ·Ø±ÙÙØ© Ø§ÙØªØ³ÙÙØ©. Ø¹ÙØ¯ تÙÙØ± Ù ÙØµÙ ØºØ°Ø§Ø¦ÙØ استخد٠ÙÙÙ Ø§ÙØ¹Ø¨ÙØ©.</p></div></article> 287 </div> 288 </section> 289 </main> 290 291 <nav class="mobile-nav" aria-label="تÙÙ٠اÙÙ ÙØ¨Ø§ÙÙ"> 292 <button class="mobile-nav-item active" data-view="dashboard"><span>â</span><small>اÙÙÙÙ </small></button> 293 <button class="mobile-nav-item" data-view="add"><span>ï¼</span><small>Ø¥Ø¶Ø§ÙØ©</small></button> 294 <button class="mobile-nav-item" data-view="mealplanner"><span>â</span><small>تجربة</small></button> 295 <button class="mobile-nav-item" data-view="explore"><span>â</span><small>Ø§Ø³ØªÙØ´Ù</small></button> 296 <button class="mobile-nav-item" data-view="calculator"><span>â</span><small>Ø§ÙØØ§Ø³Ø¨Ø©</small></button> 297 <button class="mobile-nav-item" data-view="settings"><span>â</span><small>اÙÙ Ø²ÙØ¯</small></button> 298 </nav> 299 </div> 300 301 <dialog id="customDrinkDialog"> 302 <form id="customDrinkForm" class="dialog-card form-stack"> 303 <div class="panel-header"><div><span class="eyebrow">Ø¥Ø¶Ø§ÙØ© Ø³Ø±ÙØ¹Ø©</span><h3>Ù Ø´Ø±ÙØ¨ Ø¬Ø¯ÙØ¯</h3></div><button id="closeCustomDrinkDialog" class="icon-button" type="button" aria-label="Ø¥ØºÙØ§Ù">Ã</button></div> 304 <label>اس٠اÙÙ Ø´Ø±ÙØ¨ <span class="required-mark">Ù Ø·ÙÙØ¨</span><input id="customDrinkName" type="text" placeholder="٠ثاÙ: ÙØ§ØªÙÙ Ù ÙØ²ÙÙ" required /></label> 305 <label>Ø§ÙØ³Ø¹Ø±Ø§Øª Ù٠اÙÙÙØ¨ <span class="required-mark">Ù Ø·ÙÙØ¨</span><input id="customDrinkCalories" type="number" min="0" step="0.1" placeholder="٠ثاÙ: 90" required /></label> 306 <p class="helper-card">Ø§ÙØªØ¨ سعرات اÙÙ Ø´Ø±ÙØ¨ Ø§ÙØ£Ø³Ø§Ø³ÙØ© Ù٠اÙÙÙØ¨. Ø§ÙØ³Ùر Ø§ÙØ°Ù ØªØ®ØªØ§Ø±Ù Ø¹ÙØ¯ تسجÙ٠اÙÙ Ø´Ø±ÙØ¨ سÙÙØ¶Ø§Ù تÙÙØ§Ø¦ÙÙØ§. Ù٠اÙÙ Ø´Ø±ÙØ¨ Ø¬Ø§ÙØ² ÙÙ ØÙÙØ Ø§ÙØªØ¨ Ø³Ø¹Ø±Ø§ØªÙ ÙØ§Ù ÙØ© ÙØ§ØªØ±Ù Ù ÙØ§Ø¹Ù Ø§ÙØ³Ùر ØµÙØ±Ùا.</p>
307 <details class="advanced-details"> 308 <summary>ØªÙØ§ØµÙÙ Ø§Ø®ØªÙØ§Ø±ÙØ©</summary> 309 <div class="details-body form-stack"> 310 <div class="form-row"><label>Ø§ÙØ¨Ø±ÙتÙÙ Ù٠اÙÙÙØ¨ (ج٠)<input id="customDrinkProtein" type="number" min="0" step="0.1" placeholder="Ø§Ø®ØªÙØ§Ø±Ù" /></label><label>اÙÙØ§Ø±Ø¨ Ù٠اÙÙÙØ¨ (ج٠)<input id="customDrinkCarbs" type="number" min="0" step="0.1" placeholder="Ø§Ø®ØªÙØ§Ø±Ù" /></label></div> 311 <div class="form-row"><label>Ø§ÙØ¯ÙÙÙ Ù٠اÙÙÙØ¨ (ج٠)<input id="customDrinkFat" type="number" min="0" step="0.1" placeholder="Ø§Ø®ØªÙØ§Ø±Ù" /></label><label>Ø§ÙØ£ÙÙØ§Ù Ù٠اÙÙÙØ¨ (ج٠)<input id="customDrinkFiber" type="number" min="0" step="0.1" placeholder="Ø§Ø®ØªÙØ§Ø±Ù" /></label></div> 312 <label>ØØ¬Ù اÙÙÙØ¨ Ø§ÙØªÙØ±ÙØ¨Ù باÙÙ Ù<input id="customDrinkMl" type="number" min="1" step="1" placeholder="Ø§Ø®ØªÙØ§Ø±Ù: 250" /></label> 313 <label>اÙÙ Ø§Ø±ÙØ© أ٠اÙ٠صدر<input id="customDrinkBrand" type="text" placeholder="Ø§Ø®ØªÙØ§Ø±Ù" /></label> 314 <label>Ù ÙØ§ØØ¸Ø§Øª<textarea id="customDrinkNotes" rows="2" placeholder="Ø§Ø®ØªÙØ§Ø±Ù: بØÙÙØ¨ خاÙÙ Ø§ÙØ¯Ø³Ù Ø Ø¬Ø§ÙØ² ÙÙ ØÙÙ..."></textarea></label> 315 <label class="check-row"><input id="customDrinkFavorite" type="checkbox" /> أضÙÙ ÙÙÙ ÙØ¶ÙØ©</label> 316 </div> 317 </details> 318 <div class="button-row"><button id="cancelCustomDrink" class="ghost-button" type="button">Ø¥ÙØºØ§Ø¡</button><button class="primary-button" type="submit">ØÙظ اÙÙ Ø´Ø±ÙØ¨</button></div> 319 </form> 320 </dialog> 321 322 <dialog id="confirmDialog"><form method="dialog" class="dialog-card"><h3 id="confirmTitle">تأÙÙØ¯</h3><p id="confirmMessage"></p><div class="button-row"><button value="cancel" class="ghost-button">Ø¥ÙØºØ§Ø¡</button><button value="confirm" class="danger-button">تأÙÙØ¯</button></div></form></dialog> 323 324 <dialog id="todayGoalDialog"><form method="dialog" id="todayGoalForm" class="dialog-card form-stack"><h3>ÙØ¯Ù اÙÙÙÙ </h3><label>ÙÙØ¹ اÙÙÙÙ <select id="todayGoalMode"><option value="default">اÙÙØ¯Ù Ø§ÙØ£Ø³Ø§Ø³Ù</option><option value="training">ÙÙ٠ت٠رÙÙ</option><option value="rest">ÙÙÙ Ø±Ø§ØØ©</option><option value="custom">ÙØ¯Ù ٠خصص ÙÙØ°Ø§ اÙÙÙÙ </option></select></label><div id="todayCustomGoalFields" class="form-stack"><label>Ø§ÙØ³Ø¹Ø±Ø§Øª<input id="todayGoalCalories" type="number" min="500" max="8000" /></label><div class="form-row"><label>Ø§ÙØ¨Ø±ÙتÙÙ<input id="todayGoalProtein" type="number" min="0" /></label><label>اÙÙØ§Ø±Ø¨<input id="todayGoalCarbs" type="number" min="0" /></label></div><div class="form-row"><label>Ø§ÙØ¯ÙÙÙ<input id="todayGoalFat" type="number" min="0" /></label><label>اÙ٠اء (ÙØªØ±)<input id="todayGoalWater" type="number" min="0.5" max="10" step="0.25" /></label></div></div><div class="button-row"><button value="cancel" class="ghost-button">Ø¥ÙØºØ§Ø¡</button><button id="resetTodayGoal" type="button" class="secondary-button">Ø¥Ø²Ø§ÙØ© Ø§ÙØªØ®ØµÙص</button><button id="saveTodayGoal" value="default" type="submit" class="primary-button">ØÙظ</button></div></form></dialog> 325 326
326<script src="app.js" defer></script>
326 327</body> 328</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.