/* afrah-fs-092 */ /* afrah-fs-092c */
/* ==========================================================================
   أفراح الأردن 4.6 — نظام الأزرار «فرحة هي الزر» (display only).
   1) every button on the site: slim (little top/bottom padding), smaller type.
   2) the Farha button kit: ask (Farha asks + reply chips), tile (Farha holds it),
      one (the single main button, Farha's face inside), lnk (gold text link), ic (small icon).
   Loaded last so it wins over the older files.
   ========================================================================== */
:root{
	--b-h:32px;--b-h-s:26px;--b-h-l:36px;
	--b-fs:11.5px;--b-fs-s:11.5px;--b-px:14px;--b-px-s:10px;
	--b-r:999px;
}

/* ---------- 1. one size for every button ---------- */
html body :is(.btn,.n-pill:not(.n-pill-s),.t3-b,.wn-btn,.w-btn,.n-cb,.au-btn,.n-bk-btn,.n-app-go,.offp,.ctf-chip,.c2-mini,.pn-btn:not(.sm),.n-signup,.n-sf-fb,.n-tb,.yes,.no,.af-btn,.af-btn-ai,.ct-btn,.ct-go,.of-btn,.bk-btn,.cs-btn,.c2-btn,.n-more,.n-ov){
	min-height:0!important;height:auto!important;
	padding-block:calc((var(--b-h) - 1.35em) / 2)!important;padding-inline:var(--b-px)!important;
	font-size:var(--b-fs)!important;line-height:1.35!important;
	border-radius:var(--b-r);
}
html body :is(.n-pill-s,.pn-btn.sm,.n-chip,.chip,.n-cmp-b,.n-grade-b,.hw-btn.s){
	min-height:0!important;height:auto!important;
	padding-block:calc((var(--b-h-s) - 1.35em) / 2)!important;padding-inline:var(--b-px-s)!important;
	font-size:var(--b-fs-s)!important;line-height:1.35!important;
}
html body :is(.btn-block,.n-signup){padding-block:calc((var(--b-h-l) - 1.35em) / 2)!important}
html body :is(.btn,.n-pill,.pn-btn,.wn-btn,.au-btn,.t3-b) svg{width:15px;height:15px}
html body :is(.btn,.n-pill,.pn-btn,.wn-btn,.au-btn,.t3-b) img{max-height:18px;width:auto}
/* small helper lines under buttons («ولا ببعتلك كود عالإيميل» and friends) */
html body :is(.au-alt,.au-codebtn,.au-terms,.n-sub-link,.ct-alt,.btn-note){font-size:11px!important}

/* ---------- 2. the Farha kit ---------- */
/* a) Farha asks, the visitor answers with reply chips */
.fb-ask{display:grid;grid-template-columns:44px minmax(0,1fr);gap:8px;align-items:end}
.fb-ask>img{width:44px;height:44px;border-radius:50%;object-fit:cover;object-position:50% 15%;background:var(--s3,#221D16)}
.fb-bub{background:rgba(255,250,240,.96);color:#3a2a1c;border-radius:16px 16px 16px 4px;padding:7px 12px;font-size:12.5px;line-height:1.45}
.fb-reps{display:flex;flex-wrap:wrap;gap:6px;padding-inline-start:52px;margin-top:6px}
.fb-rep{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(232,207,138,.45);background:rgba(232,207,138,.06);color:var(--gl,#E8CF8A);border-radius:14px 14px 4px 14px;padding:4px 12px;font:700 11.5px/1.35 var(--fb,inherit);cursor:pointer;text-decoration:none;transition:background .2s}
.fb-rep:hover{background:rgba(232,207,138,.16)}
.fb-rep.q{border-color:var(--ln2,#332B1F);color:var(--mu,#9A8F7B);background:none}
.fb-rep img{width:16px;height:16px;object-fit:contain}
/* b) Farha holds it */
.fb-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:8px}
.fb-tile{display:grid;justify-items:center;gap:2px;border:0;border-radius:14px;padding:4px 2px 6px;background:radial-gradient(100% 80% at 50% 100%,rgba(232,207,138,.14),transparent 70%);color:var(--gl,#E8CF8A);font:700 11.5px/1.3 var(--fb,inherit);text-decoration:none;cursor:pointer}
.fb-tile img{width:70px;height:84px;object-fit:contain;object-position:bottom;transition:transform .3s}
.fb-tile:hover img{transform:translateY(-5px) rotate(-3deg)}
/* c) the one main button (one per page) */
.fb-one{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(232,207,138,.55);background:linear-gradient(180deg,#2a2218,#18130d);color:var(--tx,#EFE7D6);border-radius:999px;padding-block:3px;padding-inline:4px 16px;font:800 12px/1.35 var(--fb,inherit);text-decoration:none;cursor:pointer;transition:box-shadow .2s}
.fb-one>img{width:28px;height:28px;border-radius:50%;object-fit:cover;object-position:50% 15%;background:#3a2f22;transition:transform .35s}
.fb-one:hover{box-shadow:0 0 0 3px rgba(232,207,138,.12),0 8px 20px rgba(201,162,74,.22)}
.fb-one:hover>img{transform:rotate(-12deg) scale(1.08)}
/* d) gold text link */
.fb-lnk{background:none;border:0;padding:0;font:700 12px/1.4 var(--fb,inherit);color:var(--gl,#E8CF8A);text-decoration:none;cursor:pointer;background-image:linear-gradient(currentColor,currentColor);background-size:0 1px;background-repeat:no-repeat;background-position:100% 100%;transition:background-size .3s}
.fb-lnk:hover{background-size:100% 1px}
.fb-lnk.s{font-size:11px;color:var(--mu,#9A8F7B)}
/* e) small icon button */
.fb-ic{width:34px;height:34px;border-radius:50%;border:1px solid var(--ln2,#332B1F);background:var(--s1,#13100C);display:inline-grid;place-content:center;color:var(--gl,#E8CF8A);cursor:pointer;transition:border-color .2s}
.fb-ic:hover{border-color:var(--gd,#C9A24A)}
.fb-ic img,.fb-ic svg{width:17px;height:17px;object-fit:contain}
.fb-ic.on svg{fill:#d65a7e;stroke:#d65a7e}

/* «فرحة بلس»: a small coloured plus beside the name instead of the label */
.fh-plus{display:inline-grid;place-content:center;width:17px;height:17px;border-radius:50%;background:conic-gradient(#f0b04a,#e8cf8a,#d65a7e,#f0b04a);color:#1b130a;font:900 12px/1 system-ui,sans-serif;vertical-align:middle;margin-inline-start:4px;box-shadow:0 0 0 2px rgba(0,0,0,.35)}
@media (prefers-reduced-motion:reduce){.fb-tile img,.fb-one>img{transition:none}}

/* supplier page: «استلم بروفايلك» */
.n-claim{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;justify-content:center;margin:6px 16px 18px;padding:10px 14px;border:1px dashed var(--ln2,#332B1F);border-radius:14px;font-size:12px;color:var(--tx,#EFE7D6)}
.n-claim small{flex-basis:100%;text-align:center;color:var(--mu,#9A8F7B);font-size:10.5px}

/* ---------- 4.6 — Google rating badge (display only; Google's logo is an uploaded image) ---------- */
.g-bd{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:1px 8px 1px 5px;font:700 10.5px/1.6 var(--fb,inherit);white-space:nowrap;text-decoration:none;vertical-align:middle}
.g-bd img{width:14px;height:14px;object-fit:contain}
.g-bd i{font-style:normal;color:#f5b301;letter-spacing:-1px}
.g-bd small{font-size:10px;font-weight:400;opacity:.75}
.g-bd.light,.g-bd.nm{background:#fff;color:#202124!important}
.g-bd.nm{font-size:11px;margin-inline-start:4px;box-shadow:0 0 0 1px rgba(0,0,0,.06)}
.g-bd.card{position:absolute;z-index:2;top:8px;inset-inline-start:8px;background:rgba(16,13,10,.72);color:#fff;backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.18)}
.hc-tile .g-bd.card{position:static;align-self:flex-start}

/* ---------- «صالات قريبة»: short cards ---------- */
.hc-nears{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.hc-near{display:grid;grid-template-columns:84px minmax(0,1fr);gap:10px;align-items:center;padding:7px;border-radius:16px;background:var(--s2,#1A1611);border:1px solid var(--ln,#262118);color:var(--tx,#EFE7D6);text-decoration:none}
.hc-near:hover{border-color:var(--gd,#C9A24A)}
.hc-near>i{display:block;aspect-ratio:1;border-radius:12px;background:var(--s3,#221D16) center/cover no-repeat}
.hc-near .t{display:grid;gap:3px;min-width:0}
.hc-near .t>b{font-size:13.5px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hc-near .t>b em{font-style:normal}
.hc-near .d{display:flex;flex-wrap:wrap;gap:2px 8px;font-size:11px;color:var(--mu,#9A8F7B)}
.hc-near .d b{color:var(--gl,#E8CF8A);font-weight:700}
.hc-near .g-bd,.hc-near .n-tier{justify-self:start}

/* ---------- homepage: story-tall tiles ---------- */
.hc-tiles{gap:10px}
.hc-tile{position:relative;flex:0 0 auto;width:clamp(150px,40vw,200px);aspect-ratio:3/4;border-radius:18px;overflow:hidden;background:var(--s3,#221D16) center/cover no-repeat;color:#fff;text-decoration:none;scroll-snap-align:start}
.hc-tile:not([style]),.hc-near>i:not([style]){background-image:radial-gradient(circle at 30% 20%,rgba(232,207,138,.22),transparent 55%),linear-gradient(160deg,#2a2219,#14110c)}
.hc-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05) 40%,rgba(10,8,6,.9))}
.hc-tile .t{position:absolute;z-index:1;bottom:10px;inset-inline:10px;display:flex;flex-direction:column;gap:5px}
.hc-tile .t b{font-size:13.5px;line-height:1.25}
.hc-tile .ring{position:absolute;z-index:1;top:8px;inset-inline-end:8px;width:32px;height:32px;border-radius:50%;padding:2px;background:conic-gradient(#E8CF8A,#C9A24A,#E8CF8A)}
.hc-tile .ring img{width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:50% 15%;background:#2a2219}
.hc-tile .tag{position:absolute;z-index:1;top:10px;inset-inline-start:10px;font-size:10.5px;font-weight:800;background:rgba(232,207,138,.92);color:#2a1d0e;border-radius:999px;padding:1px 9px}
.n-cb>img{width:22px;height:22px;object-fit:contain}
/* 4.6.1 — story + reels players above everything (header, tabs, bottom bar, Farha). */
html body .rp,html body .story{z-index:100000}
body.story-lock .n-bnav,body.story-lock .n-tabs,body.story-lock .fh-fab,body.story-lock .n-cbar{visibility:hidden}
.rp .rp-close{z-index:6}
/* 2.9.x — generated button icons. */
.ui-ic{width:1.4em;height:1.4em;object-fit:contain;flex:0 0 auto;display:inline-block;vertical-align:middle}
.n-ib .ui-ic{width:22px;height:22px}
.n-bk-ic .ui-ic{width:26px;height:26px}
/* 4.9 — halls toolbar: the three buttons share one height and shape. */
html body .n-tools .n-tb{height:34px!important;padding-block:0!important;border-radius:999px!important;line-height:1!important}
html body .n-tools .n-tb-s{padding-inline:4px!important}
html body .n-tools .n-tb-s .n-dd-b{height:32px;padding-block:0}
html body .n-tools .n-tb .ui-ic{width:18px;height:18px;flex:0 0 18px}
/* 4.9 — iPhone zooms the page when a text field is under 16px: keep fields at 16px on phones. */
@media (max-width:820px){html body :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=button]):not([type=submit]),select,textarea){font-size:16px!important;min-width:0}}
/* 4.9 — «القائمة» page on: no ☰ at the top on phones (the bottom bar has «القائمة»). */
body.mn-on .n-menu-b{display:none!important}
.n-sf-q{min-width:0}.n-sf-q input{width:100%}
/* 4.9 — active bar above the item (it sat on the label after the smaller font). */
.n-bnav a.on::after{bottom:auto;top:0}
/* 4.9 — hall header: numbers as one line of small pills under the name. */
.n-pf-pl{list-style:none;margin:8px 0 0;padding:0;display:flex;align-items:center;gap:4px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.n-pf-pl::-webkit-scrollbar{display:none}
.n-pf-pl li{flex:none}
.n-pf-pl a,.n-pf-pl li>span{display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 8px;gap:4px;border-radius:999px;border:1px solid var(--ln);background:var(--s1);color:var(--mu)!important;font-size:11px;text-decoration:none!important;white-space:nowrap}
.n-pf-pl b{color:var(--tx);font-weight:800;font-variant-numeric:tabular-nums}
.n-pf-pl .n-i{width:14px;height:14px;color:var(--gl)}
.n-pf-pl li.m-farha a,.n-pf-pl li.m-farha>span{height:32px;padding:0 8px 0 4px;font-size:12px;border-color:rgba(201,162,74,.5);background:rgba(201,162,74,.1);color:var(--gl)!important}
.n-pf-pl li.m-farha b{color:var(--gp);font-size:14px}
.n-pf-pl li.m-farha .n-av,.n-pf-pl li.m-farha img{width:24px!important;height:24px!important;border-radius:50%}
.n-pf-pl li.m-icon a,.n-pf-pl li.m-icon>span{padding:0 8px}
/* «احجز مع فرحة» the same height as the Farha pill; not stretched. */
html body.v3 .n-pf-act .n-bk-btn{flex:0 0 auto;height:32px!important;padding-block:0!important;padding-inline:12px 14px!important;font-size:12.5px!important}
.v3 .n-pf-act{gap:6px}
.v3 .n-pf-act .n-ib{width:32px;height:32px}
.v3 .n-pf-act .n-ib .n-i,.v3 .n-pf-act .n-ib .ui-ic{width:17px;height:17px}
.v3 .n-pf-act .n-ib-cmp.on{background:var(--gd);border-color:var(--gd);color:#17140F}
/* Grade: icon only beside the blue check; a tap shows its name and level. */
.n-pf-n{position:relative}
.n-gd-w{display:inline-flex}
.n-grade-i{width:26px;height:26px;padding:0;border-radius:50%;border:1px solid rgba(201,162,74,.45);background:var(--s1);display:grid;place-items:center;cursor:pointer}
.n-grade-i img{width:18px;height:18px;border-radius:50%}
.n-tip{position:absolute;top:calc(100% + 6px);inset-inline-start:0;z-index:30;display:grid;gap:2px;width:max-content;max-width:100%;background:#241e17;border:1px solid var(--ln2,var(--ln));border-radius:12px;padding:8px 11px;box-shadow:0 10px 26px rgba(0,0,0,.45);text-align:start}
.n-tip[hidden]{display:none}
.n-tip b{font-size:13px;color:var(--tx)}
.n-tip small{font-size:11px;color:var(--mu)}
.n-tip button{justify-self:start;margin-top:4px;border:0;background:none;padding:0;color:var(--gl);font:700 11.5px var(--fb);cursor:pointer;text-decoration:underline;text-underline-offset:3px}