/* Country code picker (phone fields) */
.ph2{grid-template-columns:auto minmax(0,1fr)}
.cc{position:relative}
.cc-btn{display:flex;align-items:center;gap:8px;min-width:132px;height:calc(100% - 6px);margin-top:6px;padding:13px 14px;border:1px solid #0c1f6622;border-radius:14px;background:#0c1f6609;color:var(--text);font:600 16px var(--fb);cursor:pointer;transition:background-color 160ms ease,border-color 160ms ease,transform 160ms var(--ease-out)}
.cc-btn:active{transform:scale(.97)}
.cc-btn:focus-visible,.cc-btn[aria-expanded=true]{outline:0;border-color:var(--gold);background:#fff}
.cc-iso{font:800 .7rem var(--fb);letter-spacing:.06em;padding:4px 6px;border-radius:7px;background:var(--tint);color:var(--royal)}
.cc-d{white-space:nowrap}
.cc-btn svg{width:16px;height:16px;margin-inline-start:auto;color:var(--muted);transition:transform 200ms var(--ease-out)}
.cc-btn[aria-expanded=true] svg{transform:rotate(180deg)}
.dark .cc-btn{background:#ffffff14;color:#fff;border-color:#ffffff26}
.dark .cc-btn:focus-visible,.dark .cc-btn[aria-expanded=true]{background:#ffffff26}
.dark .cc-iso{background:#ffffff1f;color:#fff}.dark .cc-btn svg{color:#bccdf0}

.ccp{position:fixed;inset:0;z-index:90}
.ccp[hidden]{display:none}
.ccp-back{position:absolute;inset:0;background:transparent}
.ccp-box{position:fixed;display:flex;flex-direction:column;background:#fff;color:var(--text);border-radius:18px;border:1px solid #0c1f661a;box-shadow:0 30px 70px #050e2b40,0 6px 16px #050e2b1a;overflow:hidden;opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top center;transition:opacity 160ms ease,transform 200ms var(--ease-out)}
.ccp.on .ccp-box{opacity:1;transform:none}
.ccp-head{display:none}
.ccp-search{position:relative;padding:12px 12px 8px;border-bottom:1px solid #0c1f6614}
.ccp-search svg{position:absolute;inset-inline-start:26px;top:50%;width:18px;height:18px;margin-top:-7px;color:var(--muted);pointer-events:none}
.ccp-search input{margin:0;padding:12px 14px;padding-inline-start:42px;border-radius:12px;background:var(--paper);font-size:16px}
.ccp-list{list-style:none;margin:0;padding:6px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.ccp-list li[data-i]{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;cursor:pointer;font-size:.95rem;line-height:1.3}
.ccp-list li.act{background:var(--tint)}
.ccp-list li.sel{background:#e3a02b1f}
.ccp-iso{flex:none;width:34px;text-align:center;font:800 .68rem var(--fb);letter-spacing:.06em;padding:4px 0;border-radius:7px;background:var(--tint);color:var(--royal)}
.ccp-list li.sel .ccp-iso{background:var(--gold);color:var(--ink)}
.ccp-n{flex:1;min-width:0;color:var(--ink);font-weight:600}
.ccp-d{flex:none;color:var(--muted);font-weight:600;font-variant-numeric:tabular-nums}
.ccp-ok{flex:none;width:18px;height:18px;color:var(--golddk);visibility:hidden}
.ccp-list li.sel .ccp-ok{visibility:visible}
.ccp-sec{padding:12px 12px 6px;font:700 .72rem var(--fb);letter-spacing:.1em;text-transform:uppercase;color:var(--golddk)}
.ccp-none{padding:22px 12px;text-align:center;color:var(--muted)}
[lang=ar] .ccp-sec{letter-spacing:0}

/* phones: slides up from the bottom */
.ccp.sheet .ccp-back{background:#050e2b80;opacity:0;transition:opacity 200ms ease}
.ccp.sheet.on .ccp-back{opacity:1}
.ccp.sheet .ccp-box{left:0;right:0;bottom:0;top:auto;width:auto;max-height:82vh;max-height:82dvh;border-radius:24px 24px 0 0;padding-bottom:env(safe-area-inset-bottom);transform:translateY(100%);opacity:1;transition:transform 280ms var(--ease-out)}
.ccp.sheet.on .ccp-box{transform:none}
.ccp.sheet .ccp-head{display:flex;align-items:center;justify-content:space-between;position:relative;padding:22px 18px 4px}
.ccp-grab{position:absolute;left:50%;top:8px;width:40px;height:4px;margin-left:-20px;border-radius:4px;background:#0c1f6626}
.ccp-title{font:800 1rem var(--fd);color:var(--ink)}
.ccp-x{width:36px;height:36px;border:0;border-radius:50%;background:var(--tint);color:var(--ink);font:400 1.4rem/1 var(--fb);cursor:pointer}
.ccp.sheet .ccp-list li[data-i]{padding:13px 12px}
body.ccp-lock{overflow:hidden}
@media(hover:hover) and (pointer:fine){.cc-btn:hover{border-color:#0c1f6644}.dark .cc-btn:hover{border-color:#ffffff55}}
@media(prefers-reduced-motion:reduce){.ccp-box,.ccp.sheet .ccp-box,.ccp.sheet .ccp-back{transition:none}}

/* Phone menu fix (phones/tablets only; desktop untouched).
   The header's blur effect shrank the full-screen menu to zero height, so links showed over the page. */
@media(max-width:900px){
 header{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff}
 nav{overflow-y:auto;overscroll-behavior:contain;padding:24px 0 calc(24px + env(safe-area-inset-bottom))}
 body.nav-open{overflow:hidden}
}
@media(max-width:620px){.cc-btn{min-width:0;gap:6px;padding:12px 10px}.cc-iso{padding:3px 5px}.cc-btn svg{width:14px;height:14px}}
