/* ══ FIX: كاردات التقييم على الموبايل ══
   كانت 1750 تفرض عمودين بـ!important على كل المقاسات، فتضغط الكارد الثاني إلى 120px.
   الحل: العمودان للشاشات الكبيرة فقط، وعمود واحد أسفل 980px. */

@media (min-width: 981px) {
  .apr-page .opt1-bento {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.575fr) !important;
    width: 100%;
  }
}

@media (max-width: 980px) {
  .apr-page .opt1-bento {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
  }
  .apr-page .opt1-bento > .sub-card {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
  }
}

@media (max-width: 640px) {
  /* كاردات القيمة والمقارنات */
  .apr-page .opt1-bento { gap: 14px !important; }
  .apr-page .sub-card { padding: 16px !important; border-radius: 16px !important; }
  .apr-page .sub-card-head { padding-bottom: 11px; margin-bottom: 13px; }

  /* كارد القيمة: السعر والأرقام لا تتزاحم */
  .apr-page .ind-price,
  .apr-page .opt1-price { font-size: 30px !important; line-height: 1.15; }

  /* شارات REPORTED SALE / SOLD · COMPARABLE في سطر واحد */
  .apr-page .opt1-bento .badge,
  .apr-page .opt1-bento .sold-badge {
    font-size: 10.5px !important;
    letter-spacing: .04em;
    white-space: nowrap;
    max-width: 100%;
  }

  /* شريط Comparable: نص وأرقام بلا كسر */
  .apr-page .closest-comp-strip,
  .apr-page .comparable-strip {
    flex-wrap: wrap !important;
    gap: 6px !important;
    font-size: 12.5px !important;
  }

  /* كارد Worthly score: الأرقام تقف في صف واحد مع البروغرس */
  .apr-page .score-row { gap: 8px !important; }
  .apr-page .score-row .score-num { font-size: 13px !important; }

  /* سلاسل المخططات أسفل الكارت لا تتجاوز الحاوية */
  .apr-page .opt1-bento svg,
  .apr-page .opt1-bento canvas { max-width: 100%; height: auto; }
}

@media (max-width: 400px) {
  .apr-page .sub-card { padding: 13px !important; }
  .apr-page .ind-price,
  .apr-page .opt1-price { font-size: 26px !important; }
}

/* العنوان داخل كارد السعر يُقطع على الموبايل ("INDICATIVE RANGE · PE…") */
@media (max-width: 640px) {
  .apr-page .stat-3d-tag {
    font-size: 10px !important;
    letter-spacing: .03em !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.3;
  }
}

/* ══ بلوك "Share this valuation report": كارد الـOG كان 432px داخل حاوية 348px ══
   السبب: aspect-ratio 1200/630 يجبر عرضًا أدنى مع padding، والقاعدة 1534 (1fr) لم تكفِ. */
@media (max-width: 980px) {
  .apr-page .og-share-section {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 18px !important;
    padding: 16px !important;
    align-items: stretch !important;
  }
  .apr-page .og-card-preview,
  .apr-page .og-share-controls {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 640px) {
  /* الكارد نفسه: اترك النسبة لكن اسمح بالانضغاط */
  .apr-page .og-card-preview {
    aspect-ratio: auto !important;
    min-height: 0 !important;
    padding: 16px 15px !important;
    border-radius: 14px !important;
    gap: 10px;
  }
  /* عناصر داخله لا تتجاوز */
  .apr-page .og-card-preview * {
    max-width: 100% !important;
    box-sizing: border-box;
  }
  .apr-page .og-card-preview h3,
  .apr-page .og-card-preview .og-title { font-size: 22px !important; line-height: 1.1; }
  .apr-page .og-card-preview .og-price,
  .apr-page .og-card-preview .og-range { font-size: 20px !important; }

  /* شارة "WORTHLY.SI · OFFICIAL REPORT" الطويلة */
  .apr-page .og-card-preview .og-badge,
  .apr-page .og-card-preview .og-official {
    font-size: 9.5px !important;
    letter-spacing: .02em !important;
    max-width: calc(100% - 60px) !important;
    white-space: normal !important;
    line-height: 1.2;
  }

  /* صفوف المعلومات: تُكسَر بدل أن تخرج */
  .apr-page .og-card-preview [class*=row],
  .apr-page .og-card-preview [class*=meta] {
    flex-wrap: wrap !important;
    gap: 6px !important;
  }

  /* أزرار المشاركة بعرض كامل */
  .apr-page .og-share-controls { padding: 0 !important; }
  .apr-page .og-share-controls a,
  .apr-page .og-share-controls button { width: 100% !important; box-sizing: border-box; }

  /* حقل OG Image URL: الرابط يُكسَر ولا يمتد */
  .apr-page .og-url,
  .apr-page .og-share-controls code,
  .apr-page .og-share-controls input {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    overflow-wrap: anywhere;
    word-break: break-all;
    font-size: 11px !important;
  }
}

/* ══ رتوش على كارد الـOG ══ */
@media (max-width: 640px) {
  /* شارة OFFICIAL REPORT تنزل سطرًا كاملًا بدل الانضغاط */
  .apr-page .og-card-preview .og-badge,
  .apr-page .og-card-preview .og-official {
    max-width: 100% !important;
    white-space: nowrap !important;
    font-size: 9px !important;
    letter-spacing: .01em !important;
    padding: 4px 8px !important;
  }
  /* صف العنوان: اللوغو والشارة يلتفّان بترتيب */
  .apr-page .og-card-preview > *:first-child {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    align-items: center !important;
  }
  /* "Worthly Score 88/100 (Exceptional)" لا يخرج من الكارد */
  .apr-page .og-card-preview [class*=score] {
    font-size: 11px !important;
    white-space: normal !important;
    text-align: left;
    max-width: 100% !important;
    line-height: 1.25;
  }
  /* حقل OG Image URL: التسمية فوق الحقل، والقيمة تُكسَر */
  .apr-page .og-share-controls form,
  .apr-page .og-share-controls .og-url-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }
  .apr-page .og-share-controls label {
    white-space: normal !important;
    font-size: 11px !important;
  }
  .apr-page .og-share-controls input[type=text],
  .apr-page .og-share-controls input[type=url] {
    width: 100% !important;
    min-width: 0 !important;
    font-size: 10.5px !important;
  }
  .apr-page .og-share-controls button,
  .apr-page .og-share-controls .copy-btn {
    width: 100% !important;
    margin: 0 !important;
  }
}

/* ══ جدول "That name in other extensions": 518px داخل حاوية 314px ══
   الحاوية لها overflow:hidden فيُقصّ الجدول بدل أن يُمرَّر. */
@media (max-width: 980px) {
  .apr-page .ext-table-wrap {
    overflow-x: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    max-width: 100% !important;
    box-sizing: border-box;
  }
  .apr-page table.ext-tbl {
    min-width: 520px;
    font-size: 12px !important;
  }
  .apr-page .ext-tbl thead th,
  .apr-page .ext-tbl tbody td {
    padding: 9px 10px !important;
    white-space: nowrap;
  }
  .apr-page .ext-tbl tbody td .aff-reg-btn {
    font-size: 10.5px !important;
    padding: 5px 9px !important;
  }
  /* تلميح بصري أن الجدول يُمرَّر أفقيًا */
  .apr-page .ext-table-wrap { scrollbar-width: thin; }
}

@media (max-width: 640px) {
  .apr-page table.ext-tbl { min-width: 480px; }
}


/* ══ جدول Comparable على الموبايل: تمرير أفقي محترم بدل ضغط الأعمدة ══
   الضغط أنتج "PRI CE" و"REPO RTED" في أسطر — أسوأ من التمرير. */
@media (max-width: 980px) {
  .apr-page .ext-table-wrap,
  .apr-page .comp-table-wrap {
    overflow-x: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    max-width: 100% !important;
    box-sizing: border-box;
  }
  .apr-page table.ext-tbl,
  .apr-page table.comp-tbl {
    min-width: 560px !important;
    width: max-content !important;
    font-size: 12px !important;
  }
  .apr-page .ext-tbl th,
  .apr-page .ext-tbl td,
  .apr-page .comp-tbl th,
  .apr-page .comp-tbl td {
    white-space: nowrap !important;
    padding: 9px 10px !important;
    overflow-wrap: normal !important;
  }
  /* العمود النصي الطويل فقط يلتف */
  .apr-page .ext-tbl td:nth-child(3),
  .apr-page .comp-tbl td:nth-child(3) {
    white-space: normal !important;
    min-width: 210px;
    max-width: 210px;
  }
  .apr-page table.ext-tbl,
  .apr-page table.comp-tbl { min-width: 620px !important; }
}