@charset "UTF-8";
/* =====================================================================
   auth-classic.css - شكل ترفيان الكلاسيكي لصفحتي تسجيل الدخول والتسجيل (الكمبيوتر فقط)
   - داخل @media (min-width:821px) فقط، فالجوال لا يتأثر.
   - تنسيق فقط: لا يغيّر أسماء الحقول ولا النماذج ولا الأكواد، ولا يلمس حالة السيرفر (#srv_info).
   - لا يعتمد على JS ولا على classic-desktop.css / tt-res.js (ملفات الموارد غير مرتبطة به).
   - يُحمَّل من layout/form.phtml بعد desktop-bold.css.
   ===================================================================== */
@media (min-width: 821px) {

/* ---------- جدول الحقول (دخول + تسجيل) ---------- */
body #content.login #login_form,
body #content.signup #sign_input {
  width: 100%; box-sizing: border-box; margin: 10px 0 14px; padding: 8px 14px;
  border-collapse: separate; border-spacing: 0 5px;
  border: 1px solid #cdcdcd; border-radius: 4px; background: linear-gradient(#fdfdfd, #f3f3f3);
  box-shadow: inset 0 1px 0 #fff;
}
body #content.login #login_form th,
body #content.signup #sign_input th {
  width: 118px; padding: 2px 6px 2px 10px; border: 0; background: none;
  text-align: right; vertical-align: middle; white-space: nowrap;
  font: 700 14px/22px "Plex Arabic", Tahoma, sans-serif; color: #222;
}
body #content.login #login_form td,
body #content.signup #sign_input td { padding: 2px 0; border: 0; background: none; text-align: right; vertical-align: middle; }

body #content.login #login_form input.text:not(#lcap-in),
body #content.login #login_form input[type=password],
body #content.signup #sign_input input.text:not(#lcap-in),
body #content.signup #sign_input input[type=password] {
  width: 260px; max-width: 100%; height: 32px; padding: 0 8px; box-sizing: border-box;
  border: 1px solid #71d000; border-radius: 0; background: #fff; box-shadow: inset 0 1px 2px rgba(0,0,0,.09);
  font: 700 14px "Plex Arabic", Tahoma, sans-serif; color: #111; direction: ltr; text-align: right;
}
body #content.login #login_form input.text:focus,
body #content.signup #sign_input input.text:focus { outline: 0; border-color: #4a8a00; box-shadow: 0 0 0 2px rgba(113,208,0,.25); }
body #content.login #login_form span.error,
body #content.signup #sign_input span.error { display: block; margin-top: 2px; color: #c62020; font-size: 12px; }

/* ---------- تسجيل الدخول: نص «الكنية / الرقم السري» بدل الأيقونتين (CSS فقط) ---------- */
body #content.login #login_form tr:not(.lcap-row) th img { display: none; }
body #content.login #login_form tr:not(.lcap-row) th::before {
  display: block; text-align: right; font: 700 14px/22px "Plex Arabic", Tahoma, sans-serif; color: #222;
}
body #content.login #login_form tr.top th::before { content: "الكنية :"; }
body #content.login #login_form tr.btm th::before { content: "الرقم السري :"; }
body #content.login #login_form tr.lcap-row th .lcap-lb { font: 700 14px/22px "Plex Arabic", Tahoma, sans-serif; color: #222; }
body #content.login #login_form tr.lcap-row th .lcap-lb::after { content: " :"; }
/* إخفاء أيقونات التواصل (فيسبوك/تويتر/جوجل/يوتيوب) */
body #content.login .tt-social { display: none !important; }

/* ---------- كود التحقق: في سطر واحد بجانب الكلمة، وبنفس عرض بقية الحقول (260px) فلا يطوّل الجدول ---------- */
body #content.login .lcap, body #content.signup .lcap {
  display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; width: 260px; max-width: 100%; height: 34px;
}
body #content.login .lcap img, body #content.signup .lcap img {
  flex: 0 0 108px; width: 108px; height: 34px; border-radius: 0; border: 1px solid #b4b4b4; background: #f4f9ec; object-fit: fill;
}
body #content.login .lcap .lcap-re, body #content.signup .lcap .lcap-re {
  flex: 0 0 32px; width: 32px; height: 32px; border-radius: 0; border: 1px solid #71d000;
  background: linear-gradient(#fff, #e6e6e6); color: #4a8a1f; font-size: 18px; line-height: 1; cursor: pointer; padding: 0;
}
body #content.login .lcap .lcap-re:hover, body #content.signup .lcap .lcap-re:hover { border-color: #4a8a00; background: linear-gradient(#fff, #dff0bf); }
body #content.login .lcap input.text, body #content.signup .lcap input.text {
  flex: 1 1 auto !important; width: auto !important; min-width: 0; height: 34px !important; padding: 0 !important; box-sizing: border-box;
  border: 1px solid #71d000 !important; border-radius: 0 !important; background: #fff !important; box-shadow: inset 0 1px 2px rgba(0,0,0,.09) !important;
  text-align: center; letter-spacing: 6px; font: 700 18px "Plex Arabic", Tahoma, sans-serif !important; direction: ltr;
}

/* ---------- التسجيل: العناوين ---------- */
body #content.signup .rg h4 {
  margin: 20px 0 10px; padding: 0 0 5px; border-bottom: 1px solid #cdcdcd;
  font: 700 16px "Plex Arabic", Tahoma, sans-serif; color: #333;
}

/* ---------- التسجيل: اختيار القبيلة ---------- */
body #content.signup .rg-tribes { gap: 10px; }
body #content.signup .rg-tribe {
  padding: 10px 4px 8px; border: 1px solid #c4c4c4; border-radius: 4px; background: linear-gradient(#fff, #f0f0f0);
  box-shadow: inset 0 1px 0 #fff; transition: border-color .15s, background .15s;
}
body #content.signup .rg-tribe:hover { border-color: #71d000; }
body #content.signup .rg-tribe .pic { box-shadow: 0 1px 3px rgba(0,0,0,.2); }
body #content.signup .rg-tribe b { font: 700 14px "Plex Arabic", Tahoma, sans-serif; color: #333; }
body #content.signup .rg-tribe.on {
  transform: none; border-color: #5c9a00; background: linear-gradient(#f8fdec, #e2f2bf);
  box-shadow: 0 0 0 2px rgba(113,208,0,.35), inset 0 1px 0 #fff;
}
body #content.signup .rg-tribe.on .pic { transform: none; }
body #content.signup .rg-tribe.on b { color: #2f5d00; }
body #content.signup .rg-tribe .ck { top: 5px; left: 5px; width: 18px; height: 18px; font-size: 12px; line-height: 18px; background: #5c9a00; }

/* ---------- التسجيل: موقع البداية ---------- */
body #content.signup .rg-map { max-width: 400px; padding: 5px; border: 1px solid #c4c4c4; border-radius: 4px; background: #fff; box-sizing: border-box; }
body #content.signup .rg-chips { gap: 6px; margin: 12px 0 4px; }
body #content.signup .rg-chip {
  padding: 6px 14px; border: 1px solid #c4c4c4; border-radius: 3px; background: linear-gradient(#fff, #eeeeee);
  font: 700 13px "Plex Arabic", Tahoma, sans-serif; color: #444;
}
body #content.signup .rg-chip:hover { border-color: #71d000; }
body #content.signup .rg-chip.on { border-color: #5c9a00; background: linear-gradient(#f8fdec, #dcefb4); color: #2f5d00; }

/* ---------- زر التسجيل: بنفس شكل زر الدخول الأخضر ---------- */
body #content.signup .rg-btn {
  min-width: 190px; height: 42px; padding: 0 22px; border: 2px solid #4f7f10; border-radius: 12px; cursor: pointer;
  background: linear-gradient(180deg, #b4e063 0, #86bd2a 48%, #6ba316 52%, #7db722 100%);
  box-shadow: inset 0 1.5px 0 rgba(255,255,255,.65), inset 0 -2px 0 rgba(0,0,0,.12), 0 2px 0 #44700c, 0 4px 8px rgba(52,86,8,.25);
  font: 700 17px "Plex Arabic", Tahoma, sans-serif; color: #fff; text-shadow: 0 1.5px 0 rgba(52,86,8,.55); letter-spacing: 0;
}
body #content.signup .rg-btn:hover { filter: brightness(1.05); color: #fff; border-color: #4f7f10; }
body #content.signup .rg-btn:active { transform: translateY(2px); box-shadow: inset 0 1.5px 0 rgba(255,255,255,.5), 0 1px 0 #44700c; }
}