/* ===== NUX-T Contact in iPhone 17 Pro Max Frame ===== */
/* لوحة ألوان العلامة (تأكد من وجودها مرة واحدة فقط في مشروعك) */
:root{
  --nx-purple:#6b2bd8;
  --nx-purple-2:#5a26b6;
  --nx-lime:#b6ff1e;
  --nx-dark:#0b0f14;

  --glass: rgba(255,255,255,.55);
  --glass-dark: rgba(30,32,40,.65);
  --text:#0b0f14;
  --muted:#667085;
  --border: rgba(0,0,0,.10);
}
html[data-bs-theme="dark"]{
  --glass: rgba(30,32,40,.65);
  --text:#e6ebf2;
  --muted:#a0a7b7;
  --border: rgba(255,255,255,.08);
}

.nx-contact-iphone{ background: transparent; }
.nx-contact-wrap{
  display:flex; justify-content:center; align-items:center;
}

/* ===== iPhone Frame ===== */
.nx-iphone{
  position:relative;
  width:min(430px, 92vw);      /* iPhone 17 Pro Max عرض منطقي */
  aspect-ratio: 530 / 932;     /* نسبة شاشة قريبة */
  border-radius: 48px;
  transform: translateZ(0);
}
.nx-iphone-shadow{
  position:absolute; inset:auto -6% -8% -6%;
  height:16%; border-radius: 999px;
  background: radial-gradient(60% 80% at 50% 50%, rgba(0,0,0,.28), transparent 70%);
  filter: blur(16px);
  z-index:0;
}
.nx-iphone-body{
  position:absolute; inset:0; z-index:1;
  border-radius:48px;
  background: linear-gradient(145deg, #0c1016, #171b23);
  box-shadow:
    inset 0 0 0 2px rgba(255,255,255,.08),
    0 16px 40px rgba(0,0,0,.35);
  padding: 12px;  /* سمك الحافة */
}
.nx-iphone-notch{
  position:absolute; top:10px; left:50%; transform:translateX(-50%);
  width: 65%;
  pointer-events:none;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,.35));
}
.nx-iphone-screen{
  position:absolute; inset:12px; border-radius: 36px;
  background:
    radial-gradient(120% 60% at 10% -10%, rgba(107,43,216,.14), transparent 55%),
    radial-gradient(120% 60% at 90% -10%, rgba(182,255,30,.10), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.80));
  overflow:hidden;
  display:flex; flex-direction:column;
}
html[data-bs-theme="dark"] .nx-iphone-screen{
  background:
    radial-gradient(120% 60% at 10% -10%, rgba(107,43,216,.18), transparent 55%),
    radial-gradient(120% 60% at 90% -10%, rgba(182,255,30,.12), transparent 55%),
    linear-gradient(180deg, rgba(18,22,30,.92), rgba(18,22,30,.88));
}

/* ===== داخل الشاشة ===== */
.nx-contact-head{
  padding: 16px 18px 8px;
  display:grid; gap:6px; text-align:center;
}
.nx-contact-head .brand-dot{
  width:12px; height:12px; border-radius:999px; margin-inline:auto;
  background: linear-gradient(135deg, var(--nx-purple), var(--nx-lime));
  box-shadow: 0 0 12px rgba(107,43,216,.5);
}
.nx-contact-head .title{
  margin:0; font-weight:900; color:var(--text);
}
.nx-contact-head .sub{ margin:0; color:var(--muted); font-size:.92rem; }

.nx-contact-form{
  display:grid; gap:12px;
  padding: 12px 16px 8px;
  overflow:auto;
  -webkit-overflow-scrolling: touch;
}
.nx-hide{ position:absolute !important; left:-9999px !important; }

.nx-field{ display:grid; gap:6px; }
.nx-label{
  font-weight:700; color:var(--text); font-size:.92rem;
}
.nx-input{
  appearance:none;
  border:1px solid var(--border);
  border-radius:14px;
  padding: .85rem .95rem;
  background: rgba(255,255,255,.72);
  color: var(--text);
  outline: none;
  transition: box-shadow .2s ease, border-color .2s ease, background .2s ease;
}
.nx-input::placeholder{ color:#9aa3af; }
.nx-input:focus{
  border-color: rgba(107,43,216,.45);
  box-shadow: 0 0 0 4px rgba(107,43,216,.18);
  background: rgba(255,255,255,.9);
}
html[data-bs-theme="dark"] .nx-input{
  background: rgba(28,32,40,.66);
  color: var(--text);
}
html[data-bs-theme="dark"] .nx-input:focus{
  box-shadow: 0 0 0 4px rgba(107,43,216,.28);
}

.nx-btn{
  margin-top: 4px;
  border:0; border-radius: 999px; width:100%;
  padding: .9rem 1rem; font-weight:800;
  color:#0b0f14;
  background: linear-gradient(90deg, var(--nx-lime), #9c37f4);
  box-shadow: 0 16px 36px rgba(0,0,0,.16);
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.nx-btn:hover{ transform: translateY(-2px); filter: saturate(110%); }
.nx-btn:disabled{ opacity:.65; cursor:not-allowed; transform:none; }

.nx-alert{
  margin-top:10px;
  border-radius:12px;
  padding:.75rem .9rem;
  font-weight:700;
}
.nx-alert.success{ background: rgba(62,201,118,.18); color:#1b8a52; border:1px solid rgba(62,201,118,.35); }
.nx-alert.danger { background: rgba(220,53,69,.16); color:#a72c38; border:1px solid rgba(220,53,69,.35); }
.nx-alert.warning{ background: rgba(255,193,7,.16); color:#9a7300; border:1px solid rgba(255,193,7,.35); }
.d-none{ display:none !important; }

.nx-contact-footer{
  margin-top:auto; padding: 10px 14px 14px;
  display:flex; gap:8px; flex-wrap:wrap; justify-content:center;
}
.mini-chip{
  display:inline-flex; gap:8px; align-items:center;
  background: rgba(255,255,255,.58);
  border:1px solid var(--border);
  border-radius:999px; padding:.35rem .7rem; font-weight:700;
  color: var(--text); font-size:.9rem;
}
.mini-chip i{ color: var(--nx-purple); }

/* تمرير لطيف + احترام تقليل الحركة */
.nx-iphone-screen{ scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce){
  .nx-iphone-screen { scroll-behavior: auto; }
}

/* استجابة */
@media (max-width: 420px){
  .nx-iphone{ border-radius:38px; }
  .nx-iphone-body{ padding:10px; border-radius:38px; }
  .nx-iphone-screen{ inset:10px; border-radius:30px; }
}