/*
 * responsive.css - طبقة توافق إضافية (تُحمَّل بعد mobile.css).
 * شريط الموارد عاد لشكله القديم (4 عدادات في صف واحد بتعبئة خضراء) كما في mobile.css.
 * منع قص الأرقام الكبيرة صار بتصغير الخط تلقائيًا لكل عداد داخل mobile.js (دالة fitResources).
 */
@media (max-width: 820px) {
  body #resWrap #l1, body #resWrap #l2, body #resWrap #l3, body #resWrap #l4 { min-width: 0; overflow: hidden; white-space: nowrap; }
}

/*
 * ===== السوق (مبنى 17) - ترتيب الحقول على الجوال =====
 * الجوال فقط (حتى 820px): الكمبيوتر بدون أي تغيير.
 * يغطي: إرسال الموارد، الشراء، البيع، تاجر المبادلة.
 * لا يغيّر أسماء الحقول ولا المعرّفات ولا منطق اللعبة.
 */
@media (max-width: 820px) {
  #content div#build.gid17 { --mk-green: #71a400; --mk-line: #e4e4e4; --mk-soft: #eef6dc; --mk-ink: #4d7a00; }
  #content div#build.gid17 #contract, #content div#build.gid17 form { width: 100%; max-width: 560px; box-sizing: border-box; }
  #content div#build.gid17 .clear { display: none; }

  /* --- الجداول الأساسية: عرض كامل بدون عوم --- */
  #content div#build.gid17 table.send_res, #content div#build.gid17 table.res_target,
  #content div#build.gid17 table.buy_select, #content div#build.gid17 table#sell,
  #content div#build.gid17 table#npc, #content div#build.gid17 table.traders {
    float: none !important; width: 100% !important; max-width: 560px; margin: 0 0 12px !important; box-sizing: border-box;
  }
  #content div#build.gid17 table.send_res tbody, #content div#build.gid17 table.res_target tbody { display: block; }

  /* --- إرسال الموارد: جدول كلاسيكي مثل ترافيان الأصلية (أيقونة | الاسم | الكمية | الحد الأقصى) --- */
  #content div#build.gid17 table.send_res { display: table; width: 100% !important; max-width: 420px; background: transparent; border-collapse: collapse; margin: 6px 0 8px !important; }
  #content div#build.gid17 table.send_res tbody { display: table-row-group; }
  #content div#build.gid17 table.send_res tr { display: table-row; padding: 0; border: 0; }
  #content div#build.gid17 table.send_res td { display: table-cell; width: auto; padding: 3px 3px !important; line-height: 1.3; vertical-align: middle; border-bottom: 1px solid var(--mk-line); }
  #content div#build.gid17 table.send_res td.ico { width: 26px !important; text-align: center; }
  #content div#build.gid17 table.send_res td.ico img { position: static; display: inline-block; margin: 0; vertical-align: middle; }
  #content div#build.gid17 table.send_res td.nam { width: 1% !important; white-space: nowrap; text-align: right; font-weight: 700; font-size: 13px; }
  #content div#build.gid17 table.send_res td.val { width: 1% !important; text-align: right; }
  #content div#build.gid17 table.send_res td.val input.text {
    width: 96px !important; max-width: 100% !important; height: 30px !important; min-height: 30px; padding: 0 4px !important; direction: ltr; text-align: center;
    font: 400 16px Tahoma, Arial, sans-serif !important; color: #000; background: #fff; border: 1px solid #71d000 !important; border-radius: 0 !important; box-shadow: none !important;
  }
  #content div#build.gid17 table.send_res td.max { width: auto !important; white-space: nowrap; text-align: right; direction: ltr; font-size: 13px; }
  #content div#build.gid17 table.send_res td.max a { display: inline-block; min-width: 0; padding: 8px 2px; border-radius: 0; background: none; color: #3c8a00; font: 400 13px Tahoma, Arial, sans-serif; text-decoration: none; touch-action: manipulation; }
  #content div#build.gid17 table#send_validate td.max { color: #8a8a8a; background-image: none; font-weight: 400; }
  #content div#build.gid17 table#send_validate td.val input.text { background: #f6f6f6; border-color: #c8c8c8 !important; }

  /* --- وجهة الإرسال: التجار / القرية / أو / X Y (شكل كلاسيكي مضغوط) --- */
  #content div#build.gid17 table.res_target { display: table; width: 100% !important; max-width: 420px; background: transparent; border-collapse: collapse; }
  #content div#build.gid17 table.res_target tbody { display: table-row-group; }
  #content div#build.gid17 table.res_target tr { display: table-row; }
  #content div#build.gid17 table.res_target td, #content div#build.gid17 table.res_target th { display: table-cell; width: auto; padding: 4px 3px !important; text-align: right; vertical-align: middle; }
  #content div#build.gid17 table#target_select td.mer { padding: 6px 3px !important; font-weight: 700; }
  #content div#build.gid17 table#target_select td.vil, #content div#build.gid17 table#target_select td.coo { white-space: nowrap; }
  #content div#build.gid17 table#target_select td.vil *, #content div#build.gid17 table#target_select td.coo * { float: none !important; }
  #content div#build.gid17 table#target_select td.vil span, #content div#build.gid17 table#target_select td.coo span { display: inline-block; min-width: 18px; font-size: 13px; font-weight: 700; direction: ltr; vertical-align: middle; }
  #content div#build.gid17 table#target_select input.text {
    height: 30px !important; min-height: 30px; padding: 0 4px !important; margin: 0 2px !important; vertical-align: middle; direction: ltr; text-align: center;
    font: 400 16px Tahoma, Arial, sans-serif !important; color: #000; background: #fff; border: 1px solid #71d000 !important; border-radius: 0 !important; box-shadow: none !important;
  }
  #content div#build.gid17 table#target_select td.vil input.text { width: calc(100% - 70px) !important; max-width: 240px; direction: rtl; }
  #content div#build.gid17 table#target_select td.coo input.text { width: 60px !important; }
  #content div#build.gid17 table#target_select td.or { text-align: right; color: #777; font-size: 12px; padding: 2px 3px !important; }

  /* --- تأكيد الإرسال (ترافيان الكلاسيك): من ... إلى ... | المدة | التجار --- */
  #content div#build.gid17 table#target_validate { margin-top: 4px; border-collapse: collapse; }
  #content div#build.gid17 table#target_validate th { width: 1% !important; white-space: nowrap; font-weight: 700; color: #555; border-top: 1px solid var(--mk-line); padding: 6px 4px !important; }
  #content div#build.gid17 table#target_validate td { border-top: 1px solid var(--mk-line); padding: 6px 4px !important; line-height: 1.7; }
  #content div#build.gid17 table#target_validate td a { display: inline-block; padding: 3px 1px; color: #3c8a00; font-weight: 700; text-decoration: none; touch-action: manipulation; }
  #content div#build.gid17 table#target_validate .mk-sep { color: #aaa; margin: 0 2px; }
  #content div#build.gid17 table#target_validate .mk-xy { color: #777; direction: ltr; display: inline-block; }

  /* --- التكرار (نادي الذهب) والزر --- */
  #content div#build.gid17 p.mk-repeat { display: flex; align-items: center; gap: 8px; margin: 8px 0; }
  #content div#build.gid17 p.mk-repeat select { flex: 0 1 90px; width: auto; height: 30px !important; min-height: 30px; padding: 0 4px !important; border: 1px solid #71d000 !important; border-radius: 0 !important; font: 400 16px Tahoma, Arial, sans-serif !important; }
  #content div#build.gid17 form > p:has(#btn_ok) { text-align: center; margin: 12px 0; }
  #content div#build.gid17 input#btn_ok { transform: none; margin: 6px; }
  #content div#build.gid17 p.error, #content div#build.gid17 p.error2 { margin: 6px 0; line-height: 1.5; }

  /* --- التجار القادمون / الذاهبون --- */
  #content div#build.gid17 table.traders { table-layout: fixed; }
  #content div#build.gid17 table.traders th { width: 24% !important; }
  #content div#build.gid17 table.traders td, #content div#build.gid17 table.traders th { word-break: break-word; overflow-wrap: anywhere; }
  #content div#build.gid17 table.traders div.in, #content div#build.gid17 table.traders div.at { float: none; width: auto; text-align: right; }
  #content div#build.gid17 table.traders tr.res td img { vertical-align: middle; }

  /* --- الشراء: البحث / النسبة / العرض --- */
  #content div#build.gid17 table.buy_select { display: block; background: #fff; }
  #content div#build.gid17 table.buy_select thead, #content div#build.gid17 table.buy_select tbody { display: block; }
  #content div#build.gid17 table.buy_select thead td { display: block; padding: 4px 6px !important; font-weight: 700; text-align: right; }
  #content div#build.gid17 table.buy_select tbody { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 4px; }
  #content div#build.gid17 table#ratio_select tbody { grid-template-columns: repeat(2, 1fr); }
  #content div#build.gid17 table.buy_select tr { display: contents; }
  #content div#build.gid17 table.buy_select tbody td { display: flex; align-items: center; justify-content: center; height: auto; min-height: 44px; padding: 0 !important; border: 1px solid var(--mk-line); border-radius: 8px; }
  #content div#build.gid17 table.buy_select tbody td a { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 44px; font-weight: 700; text-decoration: none; }
  #content div#build.gid17 table.buy_select td.hl { border-color: #f0b25a; }
  #content div#build.gid17 table#search_select, #content div#build.gid17 table#ratio_select, #content div#build.gid17 table#bid_select { margin-right: 0 !important; }

  /* --- قائمة العروض (شراء) --- */
  #content div#build.gid17 table#range { width: 100% !important; margin-top: 8px !important; table-layout: fixed; }
  #content div#build.gid17 table#range th, #content div#build.gid17 table#range td { padding: 6px 3px !important; font-size: 12px; word-break: break-word; overflow-wrap: anywhere; vertical-align: middle; }
  #content div#build.gid17 table#range td.val, #content div#build.gid17 table#range td.dur { width: auto !important; white-space: normal; text-align: center; }
  #content div#build.gid17 table#range td.act { width: 22% !important; }
  #content div#build.gid17 table#range td img[class^="r"] { display: block; margin: 0 auto 2px; }
  #content div#build.gid17 table#range tfoot td { text-align: center; }
  #content div#build.gid17 table#summary { width: 100% !important; }

  /* --- البيع: بطاقة لكل صف (عنوان، ثم كمية + مورد، ثم الخيارات) --- */
  #content div#build.gid17 table#sell { display: block; background: transparent; }
  #content div#build.gid17 table#sell tbody { display: block; }
  #content div#build.gid17 table#sell tr {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; align-items: center;
    padding: 10px; margin-bottom: 10px; background: #fff; border: 1px solid var(--mk-line); border-radius: 10px;
  }
  #content div#build.gid17 table#sell th { grid-column: 1 / -1; width: auto !important; padding: 0 !important; text-align: right; font-weight: 700; color: var(--mk-ink); }
  #content div#build.gid17 table#sell td { display: block; width: auto !important; padding: 0 !important; }
  #content div#build.gid17 table#sell td.val input.text, #content div#build.gid17 table#sell td.res select { width: 100% !important; max-width: none !important; }
  #content div#build.gid17 table#sell td.val input.text { direction: ltr; }
  #content div#build.gid17 table#sell td.tra, #content div#build.gid17 table#sell td.al { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; line-height: 1.4; }
  #content div#build.gid17 table#sell td.tra input.text { width: 64px !important; flex: 0 0 64px; direction: ltr; }
  #content div#build.gid17 table#sell input.check { width: 22px; height: 22px; margin: 0; top: 0; flex: 0 0 auto; }

  /* --- عروضي --- */
  #content div#build.gid17 table#sell_overview { width: 100% !important; table-layout: fixed; margin-top: 8px; }
  #content div#build.gid17 table#sell_overview th, #content div#build.gid17 table#sell_overview td { padding: 6px 2px !important; font-size: 12px; text-align: center; word-break: break-word; overflow-wrap: anywhere; vertical-align: middle; }
  #content div#build.gid17 table#sell_overview td.abo { width: 15% !important; }
  #content div#build.gid17 table#sell_overview td.val { width: auto !important; text-align: center; }
  #content div#build.gid17 table#sell_overview td img[class^="r"] { display: block; margin: 0 auto 2px; }

  /* --- تاجر المبادلة: بطاقة لكل مورد (الكمية الحالية | الحقل | الفرق) + ملخص --- */
  #content div#build.gid17 table#npc {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 4px 10px; align-items: center;
    padding: 8px; background: #fff; border: 1px solid var(--mk-line); border-radius: 10px;
  }
  #content div#build.gid17 table#npc thead, #content div#build.gid17 table#npc tbody, #content div#build.gid17 table#npc tr { display: contents; }
  #content div#build.gid17 table#npc th { grid-column: 1 / -1; order: 0; padding: 2px 0 6px !important; text-align: right; }
  #content div#build.gid17 table#npc td { display: block; width: auto !important; min-width: 0; padding: 0 !important; text-align: center; }
  #content div#build.gid17 table#npc td.all { grid-row: span 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-size: 13px; overflow-wrap: anywhere; word-break: break-all; direction: ltr; }
  #content div#build.gid17 table#npc td.all a { display: inline-flex; padding: 8px 12px; border-radius: 8px; background: var(--mk-soft); touch-action: manipulation; }
  #content div#build.gid17 table#npc td.sel input.text { width: 100% !important; max-width: none !important; direction: ltr; }
  #content div#build.gid17 table#npc td.rem { margin-bottom: 8px; font-size: 12px; color: #777; direction: ltr; overflow-wrap: anywhere; word-break: break-all; }
  #content div#build.gid17 table#npc td.sum { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 8px; padding: 6px 4px !important; border-top: 1px solid var(--mk-line); font-size: 13px; text-align: right; overflow-wrap: anywhere; }
  /* ترتيب العناصر: لكل مورد (الكمية الحالية، الحقل، الفرق) ثم الملخص */
  #content div#build.gid17 table#npc thead tr:nth-child(2) td.all:nth-child(1) { order: 11; } #content div#build.gid17 table#npc tbody tr:nth-child(1) td.sel:nth-child(1) { order: 12; } #content div#build.gid17 table#npc tbody tr:nth-child(2) td.rem:nth-child(1) { order: 13; }
  #content div#build.gid17 table#npc thead tr:nth-child(2) td.all:nth-child(2) { order: 21; } #content div#build.gid17 table#npc tbody tr:nth-child(1) td.sel:nth-child(2) { order: 22; } #content div#build.gid17 table#npc tbody tr:nth-child(2) td.rem:nth-child(2) { order: 23; }
  #content div#build.gid17 table#npc thead tr:nth-child(2) td.all:nth-child(3) { order: 31; } #content div#build.gid17 table#npc tbody tr:nth-child(1) td.sel:nth-child(3) { order: 32; } #content div#build.gid17 table#npc tbody tr:nth-child(2) td.rem:nth-child(3) { order: 33; }
  #content div#build.gid17 table#npc thead tr:nth-child(2) td.all:nth-child(4) { order: 41; } #content div#build.gid17 table#npc tbody tr:nth-child(1) td.sel:nth-child(4) { order: 42; } #content div#build.gid17 table#npc tbody tr:nth-child(2) td.rem:nth-child(4) { order: 43; }
  #content div#build.gid17 table#npc thead tr:nth-child(2) td.sum { order: 100; } #content div#build.gid17 table#npc tbody tr:nth-child(1) td.sum { order: 101; } #content div#build.gid17 table#npc tbody tr:nth-child(2) td.sum { order: 102; }
  #content div#build.gid17 p#submitText, #content div#build.gid17 p#submitButton { margin: 10px 0; }
  #content div#build.gid17 p#submitText a, #content div#build.gid17 p#submitButton a { display: block; max-width: 560px; padding: 12px 10px; border-radius: 8px; background: var(--mk-soft); text-align: center; font-weight: 700; touch-action: manipulation; }
  #content div#build.gid17 p#submitButton[style*="none"] { display: none !important; }

  /* --- فقرات النتائج (بعد المبادلة) --- */
  #content div#build.gid17 p b { overflow-wrap: anywhere; }
}

/* ===== تأكيد الإرسال: من ... إلى ... (كمبيوتر + جوال): لا تنكسر الأسماء والإحداثيات في منتصفها ===== */
#content div#build.gid17 table#target_validate tr.mk-from td a, #content div#build.gid17 table#target_validate tr.mk-to td a { white-space: nowrap; }
#content div#build.gid17 table#target_validate .mk-xy { white-space: nowrap; unicode-bidi: isolate; direction: ltr; }