{"id":727,"date":"2026-04-19T17:31:59","date_gmt":"2026-04-19T14:31:59","guid":{"rendered":"https:\/\/cattle.expert\/install-calf-journal-tmp-sw-53euh5\/"},"modified":"2026-04-19T17:31:59","modified_gmt":"2026-04-19T14:31:59","slug":"install-calf-journal","status":"publish","type":"page","link":"https:\/\/cattle.expert\/sw\/install-calf-journal\/","title":{"rendered":"Install Calf Journal (sw)"},"content":{"rendered":"<section class=\"cj-install\">\n  <header class=\"cj-install__hero\">\n    <h1 class=\"cj-install__title\">\n      Sakinisha daftari la ndama kwenye skrini kuu    <\/h1>\n    <p class=\"cj-install__lead\">\n      Mguso mmoja \u2014 na programu inafunguka kama kawaida, inafanya kazi bila mtandao, na inachukua nafasi chini ya MB 1.    <\/p>\n    <div class=\"cj-install__actions\">\n      <button type=\"button\" class=\"cj-install__cta cj-install__cta--primary\" data-cj-install-btn hidden>\n        Sakinisha programu      <\/button>\n      <span class=\"cj-install__cta-hint\" data-cj-install-hint>\n        Fuata maelekezo hapa chini \u2014 kivinjari chako kitasakinisha programu kwa sekunde chache.      <\/span>\n    <\/div>\n  <\/header>\n\n  <div class=\"cj-install__grid\">\n    <article class=\"cj-install__card\" data-cj-platform=\"ios\">\n      <h2 class=\"cj-install__card-title\">\n        iPhone \/ iPad (Safari)      <\/h2>\n      <ol class=\"cj-install__steps\">\n        <li>Fungua ukurasa huu katika Safari.<\/li>\n        <li>Bonyeza kitufe cha <strong>\u00abShiriki\u00bb<\/strong> chini ya skrini.<\/li>\n        <li>Chagua <strong>\u00abOngeza kwenye Skrini ya Mwanzo\u00bb<\/strong> kutoka orodha ya vitendo.<\/li>\n        <li>Thibitisha \u2014 aikoni itaonekana kwenye skrini ya mwanzo.<\/li>\n      <\/ol>\n    <\/article>\n\n    <article class=\"cj-install__card\" data-cj-platform=\"android\">\n      <h2 class=\"cj-install__card-title\">\n        Android (Chrome)      <\/h2>\n      <ol class=\"cj-install__steps\">\n        <li>Fungua ukurasa katika Chrome.<\/li>\n        <li>Bonyeza <strong>\u00abSakinisha\u00bb<\/strong> juu \u2014 au chagua <strong>\u00abSakinisha programu\u00bb<\/strong> kutoka kwenye menyu ya \u22ee.<\/li>\n        <li>Thibitisha usakinishaji \u2014 aikoni itaonekana kwenye skrini ya mwanzo.<\/li>\n      <\/ol>\n    <\/article>\n\n    <article class=\"cj-install__card\" data-cj-platform=\"desktop\">\n      <h2 class=\"cj-install__card-title\">\n        Kompyuta (Chrome \/ Edge)      <\/h2>\n      <ol class=\"cj-install__steps\">\n        <li>Fungua ukurasa katika Chrome au Edge.<\/li>\n        <li>Bofya aikoni ya <strong>\u00abSakinisha programu\u00bb<\/strong> kwenye upau wa anwani upande wa kulia.<\/li>\n        <li>Programu itafunguka katika dirisha tofauti \u2014 ibane kwenye Dock au upau wa kazi.<\/li>\n      <\/ol>\n    <\/article>\n  <\/div>\n\n  <p class=\"cj-install__note\">\n    Baada ya usakinishaji, programu inafanya kazi bila mtandao. Rekodi huhifadhiwa kwenye kifaa chako \u2014 ingia kwenye akaunti ili kuzilandanisha na wingu na kuzifungua kwenye vifaa kadhaa.  <\/p>\n<\/section>\n<section class=\"l-section wpb_row\"><div class=\"l-section-h i-cf\">\n<article class=\"cattle-calf-page cattle-calf-page--public\">\n\n  <nav class=\"cattle-calf-breadcrumb\" aria-label=\"Usogezaji wa tovuti\">\n    <ol>\n      <li><a href=\"https:\/\/cattle.expert\/sw\/\">Mwanzo<\/a><\/li>\n      <li><a href=\"https:\/\/cattle.expert\/sw\/uslugi\/\">Huduma<\/a><\/li>\n      <li aria-current=\"page\">Daftari la Ndama<\/li>\n    <\/ol>\n  <\/nav>\n\n  <header class=\"cattle-calf-page__header\">\n    <h1 class=\"cattle-calf-page__title\">\n      Daftari ya Ndama \u2014 rekodi ya bure mtandaoni ya kuzaa    <\/h1>\n    <p class=\"cattle-calf-page__lead\">\n      Rekodi ndama waliozaliwa hivi karibuni moja kwa moja shambani, bila intaneti.    <\/p>\n  <\/header>\n\n  <aside class=\"cattle-calf-install-cta\" role=\"complementary\" data-install-cta>\n    <button type=\"button\"\n            class=\"cattle-calf-install-cta__close\"\n            data-install-cta-close\n            aria-label=\"Ficha dokezo la usakinishaji\">\n      <span aria-hidden=\"true\">&times;<\/span>\n    <\/button>\n    <div class=\"cattle-calf-install-cta__body\">\n      <strong class=\"cattle-calf-install-cta__title\">\n        \u0425\u043e\u0442\u0438\u0442\u0435 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u0442\u0435\u043b\u0435\u0444\u043e\u043d?      <\/strong>\n      <p class=\"cattle-calf-install-cta__text\">\n        \u0414\u043e\u0431\u0430\u0432\u044c\u0442\u0435 \u0436\u0443\u0440\u043d\u0430\u043b \u043d\u0430 \u0434\u043e\u043c\u0430\u0448\u043d\u0438\u0439 \u044d\u043a\u0440\u0430\u043d \u2014 \u043e\u043d \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0431\u0435\u0437 \u0438\u043d\u0442\u0435\u0440\u043d\u0435\u0442\u0430 \u0438 \u043e\u0442\u043a\u0440\u043e\u0435\u0442\u0441\u044f \u043e\u0434\u043d\u0438\u043c \u043a\u0430\u0441\u0430\u043d\u0438\u0435\u043c.      <\/p>\n    <\/div>\n    <a class=\"cattle-calf-install-cta__button\" href=\"https:\/\/cattle.expert\/sw\/install-calf-journal\/\">\n      Jinsi ya kusakinisha      <span aria-hidden=\"true\">\u2192<\/span>\n    <\/a>\n  <\/aside>\n\n  <div class=\"cattle-calf-app cattle-calf-app--public cattle-calf-app--guest\"\n       x-data=\"calfJournalApp({&quot;restUrl&quot;:&quot;https:\\\/\\\/cattle.expert\\\/sw\\\/wp-json\\\/cattle-calf\\\/v1\\\/&quot;,&quot;nonce&quot;:&quot;ca1a948086&quot;,&quot;breeds&quot;:[&quot;Angus&quot;,&quot;Hereford&quot;,&quot;Simmental&quot;,&quot;Charolais&quot;,&quot;Limousin&quot;],&quot;visibleFields&quot;:{&quot;calf_uid&quot;:true,&quot;mother_uid&quot;:true,&quot;temp_id&quot;:true},&quot;defaultSettings&quot;:{&quot;ranch_name&quot;:&quot;&quot;,&quot;shift_number&quot;:1,&quot;id_prefix&quot;:&quot;&quot;,&quot;operator_last_name&quot;:&quot;&quot;,&quot;operator_middle_name&quot;:&quot;&quot;,&quot;operator_position&quot;:&quot;&quot;,&quot;operator_phone&quot;:&quot;&quot;,&quot;breeds&quot;:[&quot;Angus&quot;,&quot;Hereford&quot;,&quot;Simmental&quot;,&quot;Charolais&quot;,&quot;Limousin&quot;],&quot;visible_fields&quot;:{&quot;calf_uid&quot;:true,&quot;mother_uid&quot;:true,&quot;temp_id&quot;:true},&quot;ui_language&quot;:&quot;sw&quot;},&quot;isGuest&quot;:true,&quot;loginUrl&quot;:&quot;https:\\\/\\\/cattle.expert\\\/sw\\\/?auth=login&amp;redirect_to=https:\\\/\\\/cattle.expert\\\/sw\\\/install-calf-journal\\\/&quot;,&quot;registerUrl&quot;:&quot;https:\\\/\\\/cattle.expert\\\/sw\\\/?auth=register&quot;})\"\n       x-init=\"init()\">\n\n          <div class=\"cattle-calf-guest-banner\" role=\"status\">\n        <div class=\"cattle-calf-guest-banner__body\">\n          <strong class=\"cattle-calf-guest-banner__title\">\n            Hali ya Mgeni          <\/strong>\n          <p class=\"cattle-calf-guest-banner__text\">\n            Rekodi zinahifadhiwa kwenye kifaa hiki pekee. Jisajili ili kulandanisha na wingu, kuhamisha CSV, na kufungua data kwenye simu ya daktari wa mifugo.          <\/p>\n        <\/div>\n        <div class=\"cattle-calf-guest-banner__actions\">\n          <button type=\"button\" class=\"cattle-calf-guest-banner__cta\" @click=\"openLoginPopup('register', $event)\">\n            Fungua akaunti          <\/button>\n          <button type=\"button\" class=\"cattle-calf-guest-banner__link\" @click=\"openLoginPopup('login', $event)\">\n            Tayari nina akaunti \u2014 ingia          <\/button>\n        <\/div>\n      <\/div>\n    \n    <!-- Mobile-only tabs -->\n    <nav class=\"cattle-calf-tabs cattle-calf-tabs--mobile\" aria-label=\"Uongozi wa programu\">\n      <button type=\"button\" :class=\"{ active: tab === 'form' }\" @click=\"tab = 'form'\">\n        <svg class=\"cj-tab-ico\" viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" aria-hidden=\"true\"><path fill=\"currentColor\" d=\"M11 11V5a1 1 0 1 1 2 0v6h6a1 1 0 1 1 0 2h-6v6a1 1 0 1 1-2 0v-6H5a1 1 0 1 1 0-2h6Z\"\/><\/svg>\n        <span>Ongeza<\/span>\n      <\/button>\n      <button type=\"button\" :class=\"{ active: tab === 'history' }\" @click=\"tab = 'history'\">\n        <svg class=\"cj-tab-ico\" viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" aria-hidden=\"true\"><path fill=\"currentColor\" d=\"M4 6h16v2H4zM4 11h16v2H4zM4 16h16v2H4z\"\/><\/svg>\n        <span>Historia<\/span>\n        <span class=\"cattle-calf-tabs__badge\" x-text=\"totalCount\"><\/span>\n      <\/button>\n      <button type=\"button\" :class=\"{ active: tab === 'settings' }\" @click=\"tab = 'settings'\" aria-label=\"Mipangilio\">\n        <svg class=\"cj-tab-ico\" viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" aria-hidden=\"true\"><path fill=\"currentColor\" d=\"M19.14 12.94a7 7 0 0 0 .06-.94 7 7 0 0 0-.06-.94l2.03-1.58a.5.5 0 0 0 .12-.64l-1.92-3.32a.5.5 0 0 0-.6-.22l-2.39.96a7.1 7.1 0 0 0-1.63-.94l-.36-2.54a.5.5 0 0 0-.5-.42h-3.84a.5.5 0 0 0-.5.42l-.36 2.54c-.59.23-1.14.55-1.63.94l-2.39-.96a.5.5 0 0 0-.6.22L2.25 8.84a.5.5 0 0 0 .12.64l2.03 1.58A7 7 0 0 0 4.34 12c0 .32.02.63.06.94l-2.03 1.58a.5.5 0 0 0-.12.64l1.92 3.32c.14.24.42.34.6.22l2.39-.96c.5.39 1.04.71 1.63.94l.36 2.54c.05.24.25.42.5.42h3.84c.25 0 .45-.18.5-.42l.36-2.54c.59-.23 1.14-.55 1.63-.94l2.39.96c.18.08.46-.02.6-.22l1.92-3.32a.5.5 0 0 0-.12-.64l-2.03-1.58ZM12 15.4A3.4 3.4 0 1 1 12 8.6a3.4 3.4 0 0 1 0 6.8Z\"\/><\/svg>\n      <\/button>\n    <\/nav>\n\n    <!-- Two-panel layout -->\n    <div class=\"cattle-calf-panels\">\n\n      <!-- LEFT: Form panel (30% on desktop) -->\n      <div class=\"cattle-calf-panels__form\" :class=\"{ 'is-active': tab === 'form' }\">\n        <section x-data=\"calfForm()\">\n          <form class=\"cattle-calf-form\" @submit.prevent=\"save\" novalidate>\n\n  <header class=\"cattle-calf-form__header\" x-data=\"{ tipOpen: false }\">\n    <h2 class=\"cattle-calf-form__title\">\n      <span>Rekodi mpya<\/span>\n      <button type=\"button\"\n              class=\"cattle-calf-form__help\"\n              @click=\"tipOpen = !tipOpen\"\n              :aria-expanded=\"tipOpen.toString()\"\n              aria-controls=\"cj-form-tip\"\n              aria-label=\"Dokezo\">\n        <svg viewBox=\"0 0 16 16\" width=\"14\" height=\"14\" aria-hidden=\"true\"><circle cx=\"8\" cy=\"8\" r=\"7\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.4\"\/><path d=\"M6.1 6.3a1.9 1.9 0 0 1 3.8.1c0 1-.7 1.3-1.3 1.7-.4.3-.6.6-.6 1.1M8 11.5v.01\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linecap=\"round\"\/><\/svg>\n      <\/button>\n    <\/h2>\n    <p id=\"cj-form-tip\"\n       class=\"cattle-calf-form__tip\"\n       x-show=\"tipOpen\"\n       x-cloak\n       x-transition.opacity.duration.150ms\n       role=\"note\">\n      Andika kuzaa kwa haraka \u2014 unaweza kuongeza maelezo baadaye.    <\/p>\n  <\/header>\n\n  <!-- Step 1: Sex (required) \u2014 segmented control -->\n  <fieldset class=\"cattle-calf-form__section cattle-calf-form__section--sex\">\n    <legend class=\"cattle-calf-form__legend\">\n      <span class=\"cattle-calf-form__legend-text\">Jinsia<\/span>\n      <span class=\"cattle-calf-form__required\" aria-hidden=\"true\">*<\/span>\n    <\/legend>\n    <div class=\"cattle-calf-segment cattle-calf-segment--sex\" :class=\"{ 'cattle-calf-segment--bull': form.sex === 'bull', 'cattle-calf-segment--heifer': form.sex === 'heifer' }\" role=\"radiogroup\" aria-label=\"Jinsia ya ndama\">\n      <label class=\"cattle-calf-segment__item cattle-calf-segment__item--bull\" :class=\"{ 'cattle-calf-segment__item--active': form.sex === 'bull' }\">\n        <input type=\"radio\" value=\"bull\" x-model=\"form.sex\" class=\"cattle-calf-segment__input\">\n        <span class=\"cattle-calf-segment__icon\" aria-hidden=\"true\">\u2642<\/span>\n        <span class=\"cattle-calf-segment__text\">Ndama dume<\/span>\n      <\/label>\n      <label class=\"cattle-calf-segment__item cattle-calf-segment__item--heifer\" :class=\"{ 'cattle-calf-segment__item--active': form.sex === 'heifer' }\">\n        <input type=\"radio\" value=\"heifer\" x-model=\"form.sex\" class=\"cattle-calf-segment__input\">\n        <span class=\"cattle-calf-segment__icon\" aria-hidden=\"true\">\u2640<\/span>\n        <span class=\"cattle-calf-segment__text\">Ndama jike<\/span>\n      <\/label>\n    <\/div>\n    <p class=\"cattle-calf-form__error\" x-show=\"errors.sex\" x-cloak>\n      Chagua jinsia ya ndama    <\/p>\n  <\/fieldset>\n\n  <!-- Step 2: Calving difficulty (required) \u2014 color scale -->\n  <fieldset class=\"cattle-calf-form__section cattle-calf-form__section--difficulty\">\n    <legend class=\"cattle-calf-form__legend\">\n      <span class=\"cattle-calf-form__legend-text\">Ugumu wa kuzaa<\/span>\n      <span class=\"cattle-calf-form__required\" aria-hidden=\"true\">*<\/span>\n    <\/legend>\n        <div class=\"cattle-calf-scale\" role=\"radiogroup\" aria-label=\"Ugumu wa kuzaa\">\n              <label class=\"cattle-calf-scale__item cattle-calf-scale__item--1\"\n               :class=\"{ 'cattle-calf-scale__item--active': form.calving_difficulty === 1 }\"\n               title=\"Bila msaada\">\n          <input type=\"radio\" value=\"1\" x-model.number=\"form.calving_difficulty\" class=\"cattle-calf-scale__input\">\n          <span class=\"cattle-calf-scale__number\">1<\/span>\n        <\/label>\n              <label class=\"cattle-calf-scale__item cattle-calf-scale__item--2\"\n               :class=\"{ 'cattle-calf-scale__item--active': form.calving_difficulty === 2 }\"\n               title=\"Msaada kidogo\">\n          <input type=\"radio\" value=\"2\" x-model.number=\"form.calving_difficulty\" class=\"cattle-calf-scale__input\">\n          <span class=\"cattle-calf-scale__number\">2<\/span>\n        <\/label>\n              <label class=\"cattle-calf-scale__item cattle-calf-scale__item--3\"\n               :class=\"{ 'cattle-calf-scale__item--active': form.calving_difficulty === 3 }\"\n               title=\"Kuzaa kwa shida\">\n          <input type=\"radio\" value=\"3\" x-model.number=\"form.calving_difficulty\" class=\"cattle-calf-scale__input\">\n          <span class=\"cattle-calf-scale__number\">3<\/span>\n        <\/label>\n              <label class=\"cattle-calf-scale__item cattle-calf-scale__item--4\"\n               :class=\"{ 'cattle-calf-scale__item--active': form.calving_difficulty === 4 }\"\n               title=\"Upasuaji wa kuzaa\">\n          <input type=\"radio\" value=\"4\" x-model.number=\"form.calving_difficulty\" class=\"cattle-calf-scale__input\">\n          <span class=\"cattle-calf-scale__number\">4<\/span>\n        <\/label>\n              <label class=\"cattle-calf-scale__item cattle-calf-scale__item--5\"\n               :class=\"{ 'cattle-calf-scale__item--active': form.calving_difficulty === 5 }\"\n               title=\"Mkao usio wa kawaida\">\n          <input type=\"radio\" value=\"5\" x-model.number=\"form.calving_difficulty\" class=\"cattle-calf-scale__input\">\n          <span class=\"cattle-calf-scale__number\">5<\/span>\n        <\/label>\n          <\/div>\n    <p class=\"cattle-calf-scale__label\" x-show=\"form.calving_difficulty\" x-cloak>\n              <span x-show=\"form.calving_difficulty === 1\"\n              class=\"cattle-calf-scale__label-text cattle-calf-scale__label--1\">\n          Bila msaada        <\/span>\n              <span x-show=\"form.calving_difficulty === 2\"\n              class=\"cattle-calf-scale__label-text cattle-calf-scale__label--2\">\n          Msaada kidogo        <\/span>\n              <span x-show=\"form.calving_difficulty === 3\"\n              class=\"cattle-calf-scale__label-text cattle-calf-scale__label--3\">\n          Kuzaa kwa shida        <\/span>\n              <span x-show=\"form.calving_difficulty === 4\"\n              class=\"cattle-calf-scale__label-text cattle-calf-scale__label--4\">\n          Upasuaji wa kuzaa        <\/span>\n              <span x-show=\"form.calving_difficulty === 5\"\n              class=\"cattle-calf-scale__label-text cattle-calf-scale__label--5\">\n          Mkao usio wa kawaida        <\/span>\n          <\/p>\n    <p class=\"cattle-calf-form__error\" x-show=\"errors.calving_difficulty\" x-cloak>\n      Chagua ugumu wa kuzaa    <\/p>\n  <\/fieldset>\n\n  <!-- Step 3: When (date) \u2014 segmented control with inline date input -->\n  <fieldset class=\"cattle-calf-form__section cattle-calf-form__section--date\">\n    <legend class=\"cattle-calf-form__legend\">\n      <span class=\"cattle-calf-form__legend-text\">Lini<\/span>\n    <\/legend>\n    <div class=\"cattle-calf-segment cattle-calf-segment--date\" role=\"radiogroup\" aria-label=\"Tarehe ya kuzaa\">\n      <label class=\"cattle-calf-segment__item\" :class=\"{ 'cattle-calf-segment__item--active': form.birth_date === 'today' }\">\n        <input type=\"radio\" value=\"today\" x-model=\"form.birth_date\" class=\"cattle-calf-segment__input\">\n        <span class=\"cattle-calf-segment__text\">Leo<\/span>\n      <\/label>\n      <label class=\"cattle-calf-segment__item\" :class=\"{ 'cattle-calf-segment__item--active': form.birth_date === 'yesterday' }\">\n        <input type=\"radio\" value=\"yesterday\" x-model=\"form.birth_date\" class=\"cattle-calf-segment__input\">\n        <span class=\"cattle-calf-segment__text\">Jana<\/span>\n      <\/label>\n      <template x-if=\"form.birth_date !== 'custom'\">\n        <label class=\"cattle-calf-segment__item cattle-calf-segment__item--other-date\" @click.prevent=\"form.birth_date = 'custom'; $nextTick(() => $refs.customDateInput?.focus())\">\n          <span class=\"cattle-calf-segment__text\">Tarehe nyingine<\/span>\n        <\/label>\n      <\/template>\n      <template x-if=\"form.birth_date === 'custom'\">\n        <div class=\"cattle-calf-segment__item cattle-calf-segment__item--date-input\">\n          <input\n            type=\"date\"\n            x-model=\"form.birth_date_custom\"\n            x-ref=\"customDateInput\"\n            :max=\"todayIso\"\n            class=\"cattle-calf-segment__date-field\"\n            aria-label=\"Chagua tarehe ya kuzaa\">\n        <\/div>\n      <\/template>\n    <\/div>\n    <p class=\"cattle-calf-form__error\" x-show=\"form.birth_date === 'custom' && errors.birth_date_custom\" x-cloak>\n      Chagua tarehe sahihi (isiwe baada ya leo)    <\/p>\n  <\/fieldset>\n\n  <!-- Step 4: Advanced (collapsible) -->\n  <details class=\"cattle-calf-form__advanced\" x-data=\"{ open: window.matchMedia('(min-width: 960px)').matches }\" :open=\"open\" @toggle=\"open = $event.target.open\">\n    <summary class=\"cattle-calf-form__advanced-summary\">\n      <span class=\"cattle-calf-form__advanced-chevron\" aria-hidden=\"true\">\u25b8<\/span>\n      <span class=\"cattle-calf-form__advanced-text\">Maelezo ya ziada<\/span>\n      <span class=\"cattle-calf-form__advanced-meta\">Kitambulisho, mama, uzito, aina, maelezo<\/span>\n    <\/summary>\n\n    <div class=\"cattle-calf-form__advanced-body\">\n              <label class=\"cattle-calf-field cattle-calf-field--floating\">\n          <span class=\"cattle-calf-field__label\">Kitambulisho cha ndama<\/span>\n          <input type=\"text\" x-model=\"form.calf_uid\" maxlength=\"64\"\n                 :placeholder=\"nextUidPreview || '2345'\">\n        <\/label>\n      \n              <label class=\"cattle-calf-field cattle-calf-field--floating\">\n          <span class=\"cattle-calf-field__label\">Kitambulisho cha mama<\/span>\n          <input type=\"text\" x-model=\"form.mother_uid\" maxlength=\"64\" placeholder=\"1021\">\n        <\/label>\n      \n              <label class=\"cattle-calf-field cattle-calf-field--floating\">\n          <span class=\"cattle-calf-field__label\">\n            Kitambulisho cha muda            <span class=\"cattle-calf-field__info\" tabindex=\"0\" role=\"button\" aria-label=\"Dokezo\">\n              <svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\"><circle cx=\"8\" cy=\"8\" r=\"7\" stroke=\"currentColor\" stroke-width=\"1.5\"\/><path d=\"M8 7v4M8 5.5v-.01\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"\/><\/svg>\n              <span class=\"cattle-calf-field__tooltip\">Ikiwa bendi ya sikio bado haijawekwa<\/span>\n            <\/span>\n          <\/span>\n          <input type=\"text\" x-model=\"form.temp_id\" maxlength=\"64\" placeholder=\" \">\n        <\/label>\n      \n      <label class=\"cattle-calf-field cattle-calf-field--floating\">\n        <span class=\"cattle-calf-field__label\">Uzito (kg)<\/span>\n        <input type=\"number\" step=\"0.1\" min=\"0\" max=\"99\" x-model.number=\"form.weight_kg\" inputmode=\"decimal\" placeholder=\"34\">\n      <\/label>\n\n      <label class=\"cattle-calf-field cattle-calf-field--floating\">\n        <span class=\"cattle-calf-field__label\">Aina<\/span>\n        <select x-model=\"form.breed\">\n          <option value=\"\">\u2014 haijabainishwa \u2014<\/option>\n          <template x-for=\"breed in breeds\" :key=\"breed\">\n            <option :value=\"breed\" x-text=\"breed\"><\/option>\n          <\/template>\n        <\/select>\n      <\/label>\n\n      <label class=\"cattle-calf-field cattle-calf-field--floating\">\n        <span class=\"cattle-calf-field__label\">Maelezo<\/span>\n        <textarea x-model=\"form.comments\" rows=\"3\" placeholder=\"Maelezo, matatizo\u2026\"><\/textarea>\n      <\/label>\n    <\/div>\n  <\/details>\n\n  <!-- Sticky submit -->\n  <div class=\"cattle-calf-form__submit-bar\">\n    <button type=\"submit\" class=\"cattle-calf-form__submit\" :disabled=\"saving\">\n      <span x-show=\"!saving\">Hifadhi rekodi<\/span>\n      <span x-show=\"saving\" x-cloak>Inahifadhi\u2026<\/span>\n    <\/button>\n  <\/div>\n<\/form>\n        <\/section>\n      <\/div>\n\n      <!-- RIGHT: Content panel (70% on desktop) -->\n      <div class=\"cattle-calf-panels__content\" :class=\"{ 'is-active': tab !== 'form' }\">\n\n        <!-- Desktop-only subtabs -->\n        <nav class=\"cattle-calf-tabs cattle-calf-tabs--desktop\" aria-label=\"Sehemu\">\n          <button type=\"button\" :class=\"{ active: tab === 'history' || tab === 'form' }\" @click=\"tab = 'history'\">\n            Historia            <span class=\"cattle-calf-tabs__badge\" x-text=\"totalCount\"><\/span>\n          <\/button>\n          <button type=\"button\" :class=\"{ active: tab === 'settings' }\" @click=\"tab = 'settings'\">\n            <svg class=\"cj-tab-ico\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path fill=\"currentColor\" d=\"M19.14 12.94a7 7 0 0 0 .06-.94 7 7 0 0 0-.06-.94l2.03-1.58a.5.5 0 0 0 .12-.64l-1.92-3.32a.5.5 0 0 0-.6-.22l-2.39.96a7.1 7.1 0 0 0-1.63-.94l-.36-2.54a.5.5 0 0 0-.5-.42h-3.84a.5.5 0 0 0-.5.42l-.36 2.54c-.59.23-1.14.55-1.63.94l-2.39-.96a.5.5 0 0 0-.6.22L2.25 8.84a.5.5 0 0 0 .12.64l2.03 1.58A7 7 0 0 0 4.34 12c0 .32.02.63.06.94l-2.03 1.58a.5.5 0 0 0-.12.64l1.92 3.32c.14.24.42.34.6.22l2.39-.96c.5.39 1.04.71 1.63.94l.36 2.54c.05.24.25.42.5.42h3.84c.25 0 .45-.18.5-.42l.36-2.54c.59-.23 1.14-.55 1.63-.94l2.39.96c.18.08.46-.02.6-.22l1.92-3.32a.5.5 0 0 0-.12-.64l-2.03-1.58ZM12 15.4A3.4 3.4 0 1 1 12 8.6a3.4 3.4 0 0 1 0 6.8Z\"\/><\/svg>\n            Mipangilio          <\/button>\n        <\/nav>\n\n        <section x-show=\"tab === 'history' || tab === 'form'\" x-transition x-data=\"calfHistory()\">\n          <div class=\"cattle-calf-history\">\n  <div class=\"cattle-calf-history__toolbar\">\n    <input type=\"search\" placeholder=\"Tafuta kwa kitambulisho, aina, maelezo\u2026\" x-model=\"query\">\n    <button type=\"button\"\n            class=\"cattle-calf-history__export\"\n            @click=\"exportFiltered\"\n            :disabled=\"!filtered.length\"\n            x-show=\"!(window.calfAppConfig && window.calfAppConfig.isGuest)\"\n            aria-label=\"Hamisha CSV\">\n      <svg class=\"cj-btn-ico\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path fill=\"currentColor\" d=\"M12 3a1 1 0 0 1 1 1v9.17l3.3-3.29a1 1 0 0 1 1.4 1.42l-5 5a1 1 0 0 1-1.4 0l-5-5a1 1 0 1 1 1.4-1.42L11 13.17V4a1 1 0 0 1 1-1Zm-7 15h14a1 1 0 1 1 0 2H5a1 1 0 1 1 0-2Z\"\/><\/svg>\n      <span class=\"cattle-calf-history__btn-label\">\n        Kutoa        <span class=\"cj-count\" x-text=\"'(' + filtered.length + ')'\"><\/span>\n      <\/span>\n    <\/button>\n  <\/div>\n  <div class=\"cattle-calf-history__table-wrap\">\n  <table class=\"cattle-calf-history__table\">\n    <thead>\n      <tr>\n        <th class=\"cj-col-num\">#<\/th>\n        <th class=\"cj-col-date cj-sortable\" @click=\"sortBy('birth_date')\">Tarehe <span class=\"cj-si\" x-text=\"sortIcon('birth_date')\"><\/span><\/th>\n        <th class=\"cj-col-id cj-dt-only cj-sortable\" @click=\"sortBy('calf_uid')\">ID <span class=\"cj-si\" x-text=\"sortIcon('calf_uid')\"><\/span><\/th>\n        <th class=\"cj-col-breed cj-dt-only cj-sortable\" @click=\"sortBy('breed')\">Aina <span class=\"cj-si\" x-text=\"sortIcon('breed')\"><\/span><\/th>\n        <th class=\"cj-col-sex\">\u2642\u2640<\/th>\n        <th class=\"cj-col-wt cj-sortable\" @click=\"sortBy('weight_kg')\">\u2696 <span class=\"cj-si\" x-text=\"sortIcon('weight_kg')\"><\/span><\/th>\n        <th class=\"cj-col-diff cj-sortable\" @click=\"sortBy('calving_difficulty')\" title=\"Ugumu wa kuzaa\">\u26a1<\/th>\n        <th class=\"cj-col-cmt cj-dt-only\" title=\"Maelezo\">\ud83d\udcac<\/th>\n        <th class=\"cj-col-exp\"><\/th>\n      <\/tr>\n    <\/thead>\n    <template x-for=\"(row, index) in filtered\" :key=\"row.client_uuid\">\n      <tbody class=\"cj-row-group\">\n        <tr class=\"cj-row\" @click=\"toggleRow(row.client_uuid)\" :class=\"{'cj-row--expanded': expandedUuid === row.client_uuid}\">\n          <td class=\"cj-col-num\" x-text=\"index + 1\"><\/td>\n          <td class=\"cj-col-date\" x-text=\"fmtDate(row.birth_date)\"><\/td>\n          <td class=\"cj-col-id cj-dt-only\" :title=\"row.calf_uid\" x-text=\"row.calf_uid || '\u2014'\"><\/td>\n          <td class=\"cj-col-breed cj-dt-only\" :title=\"row.breed\" x-text=\"row.breed || '\u2014'\"><\/td>\n          <td class=\"cj-col-sex\">\n            <span :class=\"row.sex === 'bull' ? 'cj-sex-m' : 'cj-sex-f'\" x-text=\"row.sex === 'bull' ? '\u2642' : '\u2640'\"><\/span>\n          <\/td>\n          <td class=\"cj-col-wt\" x-text=\"row.weight_kg || '\u2014'\"><\/td>\n          <td class=\"cj-col-diff\">\n            <span x-show=\"row.calving_difficulty\" class=\"cj-diff-dot\" :class=\"'cj-diff-dot--' + row.calving_difficulty\"><\/span>\n            <span x-show=\"!row.calving_difficulty\">\u2014<\/span>\n          <\/td>\n          <td class=\"cj-col-cmt cj-dt-only\">\n            <span :class=\"row.comments ? 'cj-cmt-on' : 'cj-cmt-off'\">\ud83d\udcac<\/span>\n          <\/td>\n          <td class=\"cj-col-exp\">\n            <span class=\"cj-chv\" :class=\"{'cj-chv--open': expandedUuid === row.client_uuid}\">\u25b8<\/span>\n          <\/td>\n        <\/tr>\n        <tr x-show=\"expandedUuid === row.client_uuid\" class=\"cj-detail-row\" x-cloak>\n          <td colspan=\"9\">\n            <div class=\"cj-detail\">\n              <div class=\"cj-detail__grid\">\n                <div class=\"cj-mb-only\">\n                  <span class=\"cj-detail__label\">ID<\/span>\n                  <span class=\"cj-detail__value\" x-text=\"row.calf_uid || '\u2014'\"><\/span>\n                <\/div>\n                <div>\n                  <span class=\"cj-detail__label\">Mama<\/span>\n                  <span class=\"cj-detail__value\" x-text=\"row.mother_uid || '\u2014'\"><\/span>\n                <\/div>\n                <div class=\"cj-mb-only\">\n                  <span class=\"cj-detail__label\">Aina<\/span>\n                  <span class=\"cj-detail__value\" x-text=\"row.breed || '\u2014'\"><\/span>\n                <\/div>\n                <div>\n                  <span class=\"cj-detail__label\">ID ya Muda<\/span>\n                  <span class=\"cj-detail__value\" x-text=\"tempId(row)\"><\/span>\n                <\/div>\n                <div>\n                  <span class=\"cj-detail__label\">Ugumu<\/span>\n                  <span class=\"cj-detail__value\" x-text=\"diffLabel(row.calving_difficulty)\"><\/span>\n                <\/div>\n                <div x-show=\"row.shift_number\">\n                  <span class=\"cj-detail__label\">Zamu<\/span>\n                  <span class=\"cj-detail__value\" x-text=\"row.shift_number\"><\/span>\n                <\/div>\n              <\/div>\n              <div x-show=\"row.comments\" class=\"cj-detail__comment\" x-text=\"row.comments\"><\/div>\n              <div class=\"cj-detail__actions\">\n                <button type=\"button\" class=\"cj-detail__delete\" @click.stop=\"remove(row.client_uuid)\">\n                  \ud83d\uddd1 Futa                <\/button>\n              <\/div>\n            <\/div>\n          <\/td>\n        <\/tr>\n      <\/tbody>\n    <\/template>\n    <tbody x-show=\"filtered.length === 0\">\n      <tr>\n        <td colspan=\"9\" class=\"empty\">Bado hakuna rekodi.<\/td>\n      <\/tr>\n    <\/tbody>\n  <\/table>\n  <\/div>\n<\/div>\n        <\/section>\n\n        <section x-show=\"tab === 'settings'\" x-transition x-data=\"calfSettings()\">\n                      <div class=\"cj-settings__guest-hint\" role=\"status\">\n              <p>\n                \u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u044e\u0442\u0441\u044f \u043d\u0430 \u044d\u0442\u043e\u043c \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0435 \u0438 \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 \u043e\u0444\u043b\u0430\u0439\u043d.                <button type=\"button\" class=\"cj-settings__guest-hint-link\" @click=\"openLoginPopup('login', $event)\">\n                  Ingia                <\/button>\n                \u0438\u043b\u0438                <button type=\"button\" class=\"cj-settings__guest-hint-link\" @click=\"openLoginPopup('register', $event)\">\n                  \u0437\u0430\u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c\u0441\u044f                <\/button>\n                \u2014 \u0447\u0442\u043e\u0431\u044b \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0441 \u043e\u0431\u043b\u0430\u043a\u043e\u043c.              <\/p>\n            <\/div>\n                    <div class=\"cj-settings\" x-show=\"settings\" x-cloak>\n  <template x-if=\"settings\">\n    <div class=\"cj-settings__layout\">\n\n      <nav class=\"cj-settings__nav\" aria-label=\"Sehemu za mipangilio\">\n        <div class=\"cj-settings__nav-group\">Jumla<\/div>\n        <button type=\"button\" :class=\"{ 'is-active': activeSection === 'ranch' }\" @click=\"activeSection = 'ranch'\">\n          <span class=\"cj-settings__nav-icon\" aria-hidden=\"true\">\ud83c\udfe1<\/span>\n          Shamba        <\/button>\n        <button type=\"button\" :class=\"{ 'is-active': activeSection === 'operator' }\" @click=\"activeSection = 'operator'\">\n          <span class=\"cj-settings__nav-icon\" aria-hidden=\"true\">\ud83d\udc64<\/span>\n          Mwendeshaji        <\/button>\n        <button type=\"button\" :class=\"{ 'is-active': activeSection === 'breeds' }\" @click=\"activeSection = 'breeds'\">\n          <span class=\"cj-settings__nav-icon\" aria-hidden=\"true\">\ud83d\udc02<\/span>\n          Aina za ng&#039;ombe        <\/button>\n        <button type=\"button\" :class=\"{ 'is-active': activeSection === 'display' }\" @click=\"activeSection = 'display'\">\n          <span class=\"cj-settings__nav-icon\" aria-hidden=\"true\">\ud83d\udc41<\/span>\n          Maonyesho        <\/button>\n        <div class=\"cj-settings__nav-group\">Data<\/div>\n        <button type=\"button\" :class=\"{ 'is-active': activeSection === 'data' }\" @click=\"activeSection = 'data'\">\n          <span class=\"cj-settings__nav-icon\" aria-hidden=\"true\">\ud83d\udcbe<\/span>\n          Kuingiza \/ Kutoa        <\/button>\n      <\/nav>\n\n      <div class=\"cj-settings__content\">\n\n        <!-- \u0425\u043e\u0437\u044f\u0439\u0441\u0442\u0432\u043e -->\n        <form x-show=\"activeSection === 'ranch'\" x-transition.opacity @submit.prevent=\"save\" class=\"cj-settings__section\">\n          <h3 class=\"cj-settings__title\">Shamba<\/h3>\n          <p class=\"cj-settings__desc\">Jina la shamba, zamu, na kiambishi cha ID ya ndama kinachotengenezwa kiotomatiki.<\/p>\n\n          <label class=\"cj-settings__field\">\n            <span class=\"cj-settings__label\">Jina la shamba<\/span>\n            <input type=\"text\" x-model=\"settings.ranch_name\">\n          <\/label>\n          <label class=\"cj-settings__field\">\n            <span class=\"cj-settings__label\">Namba ya zamu<\/span>\n            <input type=\"number\" min=\"1\" max=\"99\" x-model.number=\"settings.shift_number\">\n          <\/label>\n          <label class=\"cj-settings__field\">\n            <span class=\"cj-settings__label\">Kiambishi cha ID ya ndama<\/span>\n            <input type=\"text\" x-model=\"settings.id_prefix\" placeholder=\"si lazima\">\n          <\/label>\n\n          <div class=\"cj-settings__footer\">\n            <button type=\"submit\" class=\"cj-settings__save\" :disabled=\"saving\">\n              <span x-show=\"!saving\">Hifadhi<\/span>\n              <span x-show=\"saving\">\u2026<\/span>\n            <\/button>\n            <span class=\"cj-settings__message\" x-show=\"message\" x-text=\"message\"><\/span>\n          <\/div>\n        <\/form>\n\n        <!-- \u041e\u043f\u0435\u0440\u0430\u0442\u043e\u0440 -->\n        <form x-show=\"activeSection === 'operator'\" x-transition.opacity @submit.prevent=\"save\" class=\"cj-settings__section\">\n          <h3 class=\"cj-settings__title\">Mwendeshaji<\/h3>\n          <p class=\"cj-settings__desc\">Mtu anayejaza shajara. Sehemu zote ni za hiari \u2014 jaza tu kile unachoona kinakufaa.<\/p>\n\n          <label class=\"cj-settings__field\">\n            <span class=\"cj-settings__label\">Jina la ukoo<\/span>\n            <input type=\"text\" x-model=\"settings.operator_last_name\" autocomplete=\"family-name\">\n          <\/label>\n          <label class=\"cj-settings__field\">\n            <span class=\"cj-settings__label\">Jina la kati<\/span>\n            <input type=\"text\" x-model=\"settings.operator_middle_name\" autocomplete=\"additional-name\">\n          <\/label>\n          <label class=\"cj-settings__field\">\n            <span class=\"cj-settings__label\">Cheo<\/span>\n            <input type=\"text\" x-model=\"settings.operator_position\" placeholder=\"k.m. fundi mifugo, mtaalamu wa mifugo\">\n          <\/label>\n          <label class=\"cj-settings__field\">\n            <span class=\"cj-settings__label\">Simu<\/span>\n            <input type=\"tel\" x-model=\"settings.operator_phone\" autocomplete=\"tel\" placeholder=\"+7 ___ ___-__-__\">\n          <\/label>\n\n          <div class=\"cj-settings__footer\">\n            <button type=\"submit\" class=\"cj-settings__save\" :disabled=\"saving\">\n              <span x-show=\"!saving\">Hifadhi<\/span>\n              <span x-show=\"saving\">\u2026<\/span>\n            <\/button>\n            <span class=\"cj-settings__message\" x-show=\"message\" x-text=\"message\"><\/span>\n          <\/div>\n        <\/form>\n\n        <!-- \u041f\u043e\u0440\u043e\u0434\u044b -->\n        <div x-show=\"activeSection === 'breeds'\" x-transition.opacity class=\"cj-settings__section\">\n          <h3 class=\"cj-settings__title\">Aina za ng&#039;ombe<\/h3>\n          <p class=\"cj-settings__desc\">Aina zinazopatikana kwenye fomu ya kuongeza ndama.<\/p>\n\n          <ul class=\"cj-settings__breeds\">\n            <template x-for=\"breed in settings.breeds\" :key=\"breed\">\n              <li>\n                <span x-text=\"breed\"><\/span>\n                <button type=\"button\" @click=\"removeBreed(breed); save()\" aria-label=\"Ondoa aina\">\u00d7<\/button>\n              <\/li>\n            <\/template>\n            <li x-show=\"!settings.breeds.length\" class=\"cj-settings__breeds-empty\">\n              Bado hakuna aina. Ongeza ya kwanza hapa chini.            <\/li>\n          <\/ul>\n\n          <form class=\"cj-settings__breed-add\" @submit.prevent=\"addBreed($refs.newBreed.value); $refs.newBreed.value = ''; save()\">\n            <input type=\"text\" x-ref=\"newBreed\" placeholder=\"Ongeza aina\">\n            <button type=\"submit\">+<\/button>\n          <\/form>\n        <\/div>\n\n        <!-- \u041e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 -->\n        <form x-show=\"activeSection === 'display'\" x-transition.opacity @submit.prevent=\"save\" class=\"cj-settings__section\">\n          <h3 class=\"cj-settings__title\">Maonyesho<\/h3>\n          <p class=\"cj-settings__desc\">Sehemu zipi zionyeshwe kwenye fomu na jedwali la historia.<\/p>\n\n          <label class=\"cj-settings__check\">\n            <input type=\"checkbox\" x-model=\"settings.visible_fields.calf_uid\">\n            <span>Onyesha kitambulisho cha ndama<\/span>\n          <\/label>\n          <label class=\"cj-settings__check\">\n            <input type=\"checkbox\" x-model=\"settings.visible_fields.mother_uid\">\n            <span>Onyesha kitambulisho cha mama<\/span>\n          <\/label>\n          <label class=\"cj-settings__check\">\n            <input type=\"checkbox\" x-model=\"settings.visible_fields.temp_id\">\n            <span>Onyesha kitambulisho cha muda<\/span>\n          <\/label>\n\n          <div class=\"cj-settings__footer\">\n            <button type=\"submit\" class=\"cj-settings__save\" :disabled=\"saving\">\n              <span x-show=\"!saving\">Hifadhi<\/span>\n              <span x-show=\"saving\">\u2026<\/span>\n            <\/button>\n            <span class=\"cj-settings__message\" x-show=\"message\" x-text=\"message\"><\/span>\n          <\/div>\n        <\/form>\n\n        <!-- \u0414\u0430\u043d\u043d\u044b\u0435 (\u0418\u043c\u043f\u043e\u0440\u0442 \/ \u042d\u043a\u0441\u043f\u043e\u0440\u0442) -->\n        <div x-show=\"activeSection === 'data'\" x-transition.opacity class=\"cj-settings__section cj-data\" x-data=\"calfImport()\">\n          <h3 class=\"cj-settings__title\">Kuingiza \/ Kutoa<\/h3>\n          <p class=\"cj-settings__desc\">Nakala rudufu, uhamishaji wa data, na kufuta daftari. Kwa utoaji wa haraka wa mwonekano wa sasa, tumia kitufe kwenye jedwali la historia.<\/p>\n\n          <div class=\"cj-data__grid\">\n\n            <div class=\"cj-data__action cj-data__action--primary\">\n              <div class=\"cj-data__leading\" aria-hidden=\"true\">\u2193<\/div>\n              <div class=\"cj-data__body\">\n                <div class=\"cj-data__title\">Ingiza CSV<\/div>\n                <div class=\"cj-data__desc\">Pakia rekodi kutoka faili la CSV. Inaoana na mauzo kutoka Excel na Google Sheets.<\/div>\n                <label class=\"cj-data__file\">\n                  <input type=\"file\" accept=\".csv,text\/csv\" @change=\"handleFile($event)\">\n                  <span x-text=\"file ? file.name : 'Chagua faili\u2026'\"><\/span>\n                <\/label>\n                <button type=\"button\" class=\"cj-data__btn cj-data__btn--primary\" :disabled=\"!file || importing\" @click=\"doImport\">\n                  <span x-show=\"!importing\">Ingiza<\/span>\n                  <span x-show=\"importing\">\u2026<\/span>\n                <\/button>\n                <p class=\"cj-data__result\" x-show=\"result\" x-text=\"result\"><\/p>\n              <\/div>\n            <\/div>\n\n            <div class=\"cj-data__action\">\n              <div class=\"cj-data__leading\" aria-hidden=\"true\">\u2191<\/div>\n              <div class=\"cj-data__body\">\n                <div class=\"cj-data__title\">Toa daftari zima<\/div>\n                <div class=\"cj-data__desc\">Rekodi zote, ikijumuisha zile zilizofutwa (soft-delete). Inafaa kwa nakala rudufu.<\/div>\n                <button type=\"button\" class=\"cj-data__btn\" @click=\"$dispatch('calf:export-all')\">\n                  Pakua CSV                <\/button>\n              <\/div>\n            <\/div>\n\n          <\/div>\n\n          <div class=\"cj-data__danger\">\n            <h4 class=\"cj-data__danger-title\">Eneo la Hatari<\/h4>\n            <button type=\"button\" class=\"cj-data__action cj-data__action--danger\" @click=\"$dispatch('calf:delete-all')\">\n              <div class=\"cj-data__leading\" aria-hidden=\"true\">\u26a0<\/div>\n              <div class=\"cj-data__body\">\n                <div class=\"cj-data__title\">Futa rekodi zote<\/div>\n                <div class=\"cj-data__desc\">Tunapendekeza kutoa data kwanza \u2014 kufuta hakuwezi kutenduliwa.<\/div>\n              <\/div>\n            <\/button>\n          <\/div>\n        <\/div>\n\n      <\/div>\n    <\/div>\n  <\/template>\n<\/div>\n        <\/section>\n      <\/div>\n    <\/div>\n\n    <div class=\"cattle-calf-app__status\" x-show=\"syncStatus\" x-cloak>\n      <span x-text=\"syncStatus\"><\/span>\n    <\/div>\n\n    <div class=\"cattle-calf-toast-root\"><\/div>\n\n    <div class=\"cj-auth-modal\"\n     x-data=\"calfAuth()\"\n     x-show=\"open\"\n     x-cloak\n     @keydown.escape.window=\"close()\"\n     @click.self=\"close()\"\n     @cj-open-login.window=\"openLogin()\"\n     @cj-open-register.window=\"openRegister()\"\n     role=\"dialog\"\n     aria-modal=\"true\"\n     :aria-label=\"mode === 'register' ? 'Jisajili' : (mode === 'lostpassword' ? 'Kurejesha nenosiri' : 'Ingia')\">\n  <div class=\"cj-auth-modal__card\" @click.stop>\n\n    <div class=\"cj-auth-modal__header\">\n      <h2 class=\"cj-auth-modal__title\" x-text=\"mode === 'register' ? 'Unda akaunti' : (mode === 'lostpassword' ? 'Kurejesha nenosiri' : 'Ingia kwenye akaunti yako')\"><\/h2>\n      <button type=\"button\"\n              class=\"cj-auth-modal__close\"\n              @click=\"close()\"\n              aria-label=\"Funga\">\n        <span aria-hidden=\"true\">&times;<\/span>\n      <\/button>\n    <\/div>\n\n    <div class=\"cj-auth-modal__tabs\" role=\"tablist\" x-show=\"mode !== 'lostpassword'\">\n      <button type=\"button\"\n              class=\"cj-auth-modal__tab\"\n              :class=\"{ 'is-active': mode === 'login' }\"\n              @click=\"switchMode('login')\"\n              role=\"tab\"\n              :aria-selected=\"mode === 'login'\">\n        Ingia      <\/button>\n      <button type=\"button\"\n              class=\"cj-auth-modal__tab\"\n              :class=\"{ 'is-active': mode === 'register' }\"\n              @click=\"switchMode('register')\"\n              role=\"tab\"\n              :aria-selected=\"mode === 'register'\">\n        Jisajili      <\/button>\n    <\/div>\n\n    <form class=\"cj-auth-modal__body\" @submit.prevent=\"submit()\">\n\n      <template x-if=\"errorMsg\">\n        <div class=\"cj-auth-modal__error\" role=\"alert\" x-text=\"errorMsg\"><\/div>\n      <\/template>\n\n      <template x-if=\"successMsg\">\n        <div class=\"cj-auth-modal__success\" role=\"status\" x-text=\"successMsg\"><\/div>\n      <\/template>\n\n      <!-- LOGIN -->\n      <template x-if=\"mode === 'login'\">\n        <div>\n          <label class=\"cj-auth-modal__field\">\n            <span class=\"cj-auth-modal__label\">Jina la mtumiaji au barua pepe<\/span>\n            <input type=\"text\"\n                   name=\"username\"\n                   class=\"cj-auth-modal__input\"\n                   x-model=\"form.username\"\n                   autocomplete=\"username\"\n                   autocapitalize=\"none\"\n                   autocorrect=\"off\"\n                   spellcheck=\"false\"\n                   required>\n          <\/label>\n\n          <label class=\"cj-auth-modal__field\">\n            <span class=\"cj-auth-modal__label\">Nenosiri<\/span>\n            <div class=\"cj-auth-modal__input-wrap\">\n              <input :type=\"showPwd ? 'text' : 'password'\"\n                     name=\"password\"\n                     class=\"cj-auth-modal__input\"\n                     x-model=\"form.password\"\n                     autocomplete=\"current-password\"\n                     required>\n              <button type=\"button\"\n                      class=\"cj-auth-modal__show-pwd\"\n                      @click=\"showPwd = !showPwd\"\n                      :aria-label=\"showPwd ? 'Ficha nenosiri' : 'Onyesha nenosiri'\"\n                      x-text=\"showPwd ? 'Ficha' : 'Onyesha'\"><\/button>\n            <\/div>\n          <\/label>\n\n          <button type=\"submit\" class=\"cj-auth-modal__submit\" :disabled=\"loading\">\n            <span x-show=\"!loading\">Ingia<\/span>\n            <span x-show=\"loading\" class=\"cj-auth-modal__spinner\" aria-hidden=\"true\"><\/span>\n            <span x-show=\"loading\">Inaingia\u2026<\/span>\n          <\/button>\n\n          <p class=\"cj-auth-modal__footer\">\n            <a href=\"#\"\n               @click.prevent=\"switchMode('lostpassword')\"\n               x-show=\"!loading\">Umesahau nenosiri?<\/a>\n            <br>\n            Huna akaunti?            <a href=\"#\" @click.prevent=\"switchMode('register')\">Jisajili<\/a>\n          <\/p>\n        <\/div>\n      <\/template>\n\n      <!-- REGISTER -->\n      <template x-if=\"mode === 'register'\">\n        <div>\n          <label class=\"cj-auth-modal__field\">\n            <span class=\"cj-auth-modal__label\">Barua pepe<\/span>\n            <input type=\"email\"\n                   name=\"email\"\n                   class=\"cj-auth-modal__input\"\n                   x-model=\"form.email\"\n                   autocomplete=\"email\"\n                   autocapitalize=\"none\"\n                   autocorrect=\"off\"\n                   spellcheck=\"false\"\n                   required>\n          <\/label>\n\n          <label class=\"cj-auth-modal__field\">\n            <span class=\"cj-auth-modal__label\">Jina (si lazima)<\/span>\n            <input type=\"text\"\n                   name=\"first_name\"\n                   class=\"cj-auth-modal__input\"\n                   x-model=\"form.firstName\"\n                   autocomplete=\"given-name\">\n          <\/label>\n\n          <label class=\"cj-auth-modal__field\">\n            <span class=\"cj-auth-modal__label\">Nenosiri<\/span>\n            <div class=\"cj-auth-modal__input-wrap\">\n              <input :type=\"showPwd ? 'text' : 'password'\"\n                     name=\"password\"\n                     class=\"cj-auth-modal__input\"\n                     x-model=\"form.password\"\n                     autocomplete=\"new-password\"\n                     minlength=\"8\"\n                     required>\n              <button type=\"button\"\n                      class=\"cj-auth-modal__show-pwd\"\n                      @click=\"showPwd = !showPwd\"\n                      x-text=\"showPwd ? 'Ficha' : 'Onyesha'\"><\/button>\n            <\/div>\n          <\/label>\n          <p class=\"cj-auth-modal__hint\">Angalau herufi 8.<\/p>\n\n          <button type=\"submit\" class=\"cj-auth-modal__submit\" :disabled=\"loading\">\n            <span x-show=\"!loading\">Fungua akaunti<\/span>\n            <span x-show=\"loading\" class=\"cj-auth-modal__spinner\" aria-hidden=\"true\"><\/span>\n            <span x-show=\"loading\">Inaunda\u2026<\/span>\n          <\/button>\n\n          <p class=\"cj-auth-modal__footer\">\n            \u0423\u0436\u0435 \u0435\u0441\u0442\u044c \u0430\u043a\u043a\u0430\u0443\u043d\u0442?            <a href=\"#\" @click.prevent=\"switchMode('login')\">Ingia<\/a>\n          <\/p>\n        <\/div>\n      <\/template>\n\n      <!-- LOSTPASSWORD -->\n      <template x-if=\"mode === 'lostpassword'\">\n        <div>\n          <p class=\"cj-auth-modal__hint\">Weka barua pepe yako \u2014 tutakutumia kiungo cha kubadilisha nenosiri.<\/p>\n\n          <label class=\"cj-auth-modal__field\">\n            <span class=\"cj-auth-modal__label\">Barua pepe<\/span>\n            <input type=\"email\"\n                   name=\"lost_email\"\n                   class=\"cj-auth-modal__input\"\n                   x-model=\"form.lostEmail\"\n                   autocomplete=\"email\"\n                   autocapitalize=\"none\"\n                   autocorrect=\"off\"\n                   spellcheck=\"false\"\n                   required>\n          <\/label>\n\n          <button type=\"submit\" class=\"cj-auth-modal__submit\" :disabled=\"loading\">\n            <span x-show=\"!loading\">Tuma kiungo<\/span>\n            <span x-show=\"loading\" class=\"cj-auth-modal__spinner\" aria-hidden=\"true\"><\/span>\n            <span x-show=\"loading\">Tunatuma\u2026<\/span>\n          <\/button>\n\n          <p class=\"cj-auth-modal__footer\">\n            <a href=\"#\" @click.prevent=\"switchMode('login')\">\u2190 Rudi kuingia<\/a>\n          <\/p>\n        <\/div>\n      <\/template>\n\n    <\/form>\n  <\/div>\n<\/div>\n  <\/div>\n\n<\/article>\n<\/div><\/section>\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":0,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-calf-app.php","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-727","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/cattle.expert\/sw\/wp-json\/wp\/v2\/pages\/727","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cattle.expert\/sw\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cattle.expert\/sw\/wp-json\/wp\/v2\/types\/page"}],"replies":[{"embeddable":true,"href":"https:\/\/cattle.expert\/sw\/wp-json\/wp\/v2\/comments?post=727"}],"version-history":[{"count":0,"href":"https:\/\/cattle.expert\/sw\/wp-json\/wp\/v2\/pages\/727\/revisions"}],"wp:attachment":[{"href":"https:\/\/cattle.expert\/sw\/wp-json\/wp\/v2\/media?parent=727"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}