/* ══════════════════════════════════════════════════════════════════════════
   تعريفُ ميزةٍ في بطاقة الباقة — زرٌّ على اسم الأداة ونافذةُ تلميحٍ غنيّة
   (‏`partials/plan_feature` · `fnv-plan-tip.js` · `config/plan_features.php` · FNV-D311).

   ⚖ ميثاق §4أ: صفرُ استدارة · لا ظلال — العمقُ بكتلة إزاحةٍ `::before` على **الغلاف**
     (‏`.fnv-pt` بلا خلفيّة · `isolation:isolate`) والصندوقُ ابنٌ يحمل الخلفيّة (bug-1789000031).
   ⚖ الطبقةُ ثابتةُ الموضع في `body` فوق الترويسة (‏`--z-tip`) فلا يقصّها `overflow` البطاقة.
   ⚖ على الهاتف ورقةٌ سفليّة بزرّ إغلاقٍ ظاهر؛ وعلى الحاسوب الزرُّ للوحة المفاتيح فقط.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── الزرّ على اسم الميزة: يرث خطَّ موضعه ولونَه، والخطُّ المنقّط إشارةُ «هنا تعريف» ── */
.fnv-pf {
    display: inline; margin: 0; padding: 0 0 1px; border: 0; border-radius: 0;
    background: transparent; font: inherit; color: inherit; text-align: inherit;
    border-bottom: 1px dotted currentColor; cursor: help;
}
.fnv-pf:hover, .fnv-pf[aria-expanded="true"] { border-bottom-style: solid; }
.fnv-pf:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.fnv-pf__i { font-size: .95em; margin-inline-start: .3em; opacity: .55; vertical-align: -1px; }
.fnv-pf:hover .fnv-pf__i, .fnv-pf[aria-expanded="true"] .fnv-pf__i { opacity: 1; }

/* ── الغلاف والصندوق ── */
.fnv-pt {
    position: fixed; z-index: var(--z-tip); width: min(340px, calc(100vw - 32px));
    isolation: isolate; direction: rtl; text-align: start;
}
.fnv-pt[hidden] { display: none; }
.fnv-pt::before {
    content: ''; position: absolute; inset: 0; transform: translate(-6px, 6px);
    background: var(--fnv-gamma-neg); z-index: -1;
}
.fnv-pt__box {
    position: relative; border: 3px solid var(--fnv-ink); background: var(--fnv-surface); color: var(--fnv-ink);
}
.fnv-pt__hd {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 10px;
    padding: 10px 14px 8px; border-bottom: 2px solid var(--fnv-ink);
}
.fnv-pt__en { display: block; font-family: var(--fnv-font-mono); font-size: .8125rem; color: var(--fnv-ink-3); direction: ltr; text-align: start; }
.fnv-pt__t { margin: 0; font-size: 1rem; font-weight: 700; line-height: 1.5; color: var(--fnv-ink); }
.fnv-pt__x {
    display: none; flex: none; width: 32px; height: 32px; margin: -4px -6px 0 0; padding: 0; border: 0; border-radius: 0;
    background: transparent; color: var(--fnv-ink); font-size: 1.3rem; line-height: 1; cursor: pointer;
}
.fnv-pt__x:focus-visible { outline: 2px solid var(--fnv-ink); outline-offset: 2px; }

.fnv-pt__dl { margin: 0; padding: 10px 14px 4px; }
.fnv-pt__dl dt {
    font-family: var(--fnv-font-mono); font-size: .8125rem; font-weight: 700; color: var(--fnv-ink-3); margin: 0 0 2px;
}
.fnv-pt__dl dd { margin: 0 0 10px; font-size: .875rem; line-height: 1.8; color: var(--fnv-ink-2); }
.fnv-pt__dl dd:last-child { margin-bottom: 6px; }

.fnv-pt__ft {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding: 9px 14px; border-top: 1px solid var(--fnv-border); font-size: .8125rem;
}
.fnv-pt__go { font-weight: 700; color: var(--fnv-ink); text-decoration: none; border-bottom: 2px solid var(--fnv-ink); }
.fnv-pt__go:hover, .fnv-pt__go:focus-visible { color: var(--fnv-gamma-neg); border-color: var(--fnv-gamma-neg); outline: none; }
.fnv-pt__lock { color: var(--fnv-ink-3); }
.fnv-pt__esc { color: var(--fnv-ink-3); font-family: var(--fnv-font-mono); }

/* السنّ: يربط الصندوقَ بالزرّ — فوقه أو تحته */
.fnv-pt__a {
    position: fixed; z-index: calc(var(--z-tip) + 1); width: 0; height: 0; margin-left: -7px; pointer-events: none;
    border: 7px solid transparent; border-bottom-color: var(--fnv-ink);
}
.fnv-pt__a.is-above { border-bottom-color: transparent; border-top-color: var(--fnv-ink); }
.fnv-pt__a[hidden] { display: none; }

@media (prefers-reduced-motion: no-preference) {
    .fnv-pt { animation: fnv-pt-in .12s ease-out; }
    @keyframes fnv-pt-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
}

/* ── الهاتف: ورقةٌ سفليّة كاملةُ العرض بزرّ إغلاق، بلا سنّ ── */
@media (max-width: 640px) {
    .fnv-pt { inset: auto 0 0 0; width: auto; }
    .fnv-pt::before { display: none; }
    .fnv-pt__box { border-width: 3px 0 0; }
    .fnv-pt__x { display: inline-flex; align-items: center; justify-content: center; }
    .fnv-pt__esc { display: none; }
    .fnv-pt__a { display: none; }
    .fnv-pt__dl dd { font-size: .9rem; }
}
