/* ===============
   Dorra Links – Theme
   =============== */
:root{
  --bg1:#f7f8f6;
  --bg2:#eef0eb;
  --card:#ffffff;
  --ink:#101624;
  --muted:#6a6f78;
  --brand:#C4B47C;      /* gold */
  --brand-2:#D9C894;    /* light gold */
  --ring: 0 10px 30px rgba(196,180,124,.18);
}

*{box-sizing:border-box}
html{font-size:16px}
body{
  margin:0;
  font-family:'Cairo',system-ui,-apple-system,Segoe UI,Roboto,Arial,"Noto Kofi Arabic","Noto Sans Arabic",sans-serif;
  color:var(--ink);
  background:
    radial-gradient(900px 900px at 50% -200px, var(--bg2), var(--bg1)),
    radial-gradient(1px 1px at 20px 20px, rgba(0,0,0,.03) 1px, transparent 1px);
  background-size:100% 100%,24px 24px;
  min-height:100dvh;
}

.dorra-links-embed{max-width:720px;margin-inline:auto;padding:24px 12px}

.wrapper{min-height:100dvh;display:grid;place-items:center}
.phone{
  width:100%;max-width:640px;border-radius:24px;
  background:linear-gradient(180deg,#f7fbf8,#ebf4ee);
  box-shadow:0 30px 80px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.05);
  border:1px solid rgba(255,255,255,.6);overflow:hidden;position:relative;
}

/* Header */
.header{padding:18px 18px 0;text-align:center}
.topbar{position:absolute;top:14px;right:14px;display:flex;gap:8px}
.icon-btn{
  width:36px;height:36px;border-radius:12px;border:1px solid rgba(255,255,255,.6);
  display:grid;place-items:center;background:#fff;cursor:pointer;box-shadow:var(--ring);color:#6a6f78;
}
.icon{width:22px;height:22px;display:block;fill:currentColor;color:#2a2e37}

.logo{width:100%;display:grid;place-items:center;margin:8px 0 0}
.logo img{max-width:96px;height:auto}

.branding{padding:8px 0 4px}
.branding h1{font-size:1.1rem;margin:6px 0 0;font-weight:700}
.branding p{margin:4px 0;color:var(--muted);font-size:.9rem}

/* (تم حذف socials بالكامل) */

/* Media */
.media{padding:0 18px 12px}
.media .hero{
  width:100%;aspect-ratio:16/10;border-radius:18px;overflow:hidden;
  background:#e9f3ec;border:1px solid rgba(255,255,255,.6);box-shadow:var(--ring)
}
.hero img{
  width:100%;height:100%;object-fit:cover;display:block;
  animation:heroIntro .8s ease-out, heroLoop 14s ease-in-out .8s infinite alternate;
}
@keyframes heroIntro{from{transform:scale(1.02);opacity:.98}to{transform:scale(1);opacity:1}}
@keyframes heroLoop{from{transform:scale(1)}to{transform:scale(1.06)}}

/* Map */
.map{padding:0 18px}
.map .frame{
  width:100%;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.6);
  background:#e9f3ec;box-shadow:var(--ring);aspect-ratio:16/10;
}
.map .address{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:10px 0}
.address .txt{font-size:.9rem;color:#35433e}
.btn{
  padding:10px 14px;border-radius:12px;background:linear-gradient(180deg,#2f7a3b,#245e2e);
  color:#fff;text-decoration:none;border:1px solid #1d5126;font-weight:700;
  box-shadow:0 6px 16px rgba(36,94,46,.25);
}
.btn:active{transform:translateY(1px)}

/* Tiles */
.tiles{padding:8px 18px 22px;display:flex;flex-direction:column;gap:10px}
.tile{
  position:relative;display:flex;align-items:center;gap:12px;
  padding:12px 56px 12px 72px;
  border-radius:999px;background:rgba(255,255,255,.55);backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.6);text-decoration:none;color:var(--ink);
  box-shadow:0 1px 0 #ffffff inset, var(--ring);
}
.tile:hover{filter:brightness(.99)}
.tile:active{transform:translateY(1px)}
.tile .left{
  position:absolute;left:8px;top:50%;transform:translateY(-50%);
  width:52px;height:52px;border-radius:50%;display:grid;place-items:center;
  background:#fff;border:1px solid rgba(196,180,124,.55);box-shadow:0 8px 18px rgba(196,180,124,.18);
}
.tile .left .icon{width:22px;height:22px;color:#7b6a3e;fill:currentColor;stroke:currentColor}
.tile .label{flex:1;text-align:center;font-weight:600}
.menu-btn{
  position:absolute;right:6px;top:50%;transform:translateY(-50%);
  width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.6);background:#fff;cursor:pointer;
}
.menu-btn .dots{width:20px;height:20px}
.tile.phone   .left{background:#fff;color:#1d1d1f}
.tile.whatsapp .left{background:#25D366;color:#fff;border-color:#1aaa4c}

/* Footer */
.footer{
  padding:18px;text-align:center;color:#7a8a86;font-size:.8rem;
  border-top:1px dashed #e1ebe3;background:linear-gradient(180deg,#f6fbf8,#eef6f1)
}

/* Modals */
.modal{
  position:fixed;inset:0;display:none;align-items:center;justify-content:center;
  background:rgba(0,0,0,.35);backdrop-filter:blur(4px);z-index:1000;padding:16px;
}
.modal.open{display:flex}
.sheet{
  width:min(560px,92vw);max-height:90vh;overflow:auto;background:#fff;border-radius:18px;
  border:1px solid rgba(255,255,255,.6);box-shadow:0 30px 70px rgba(0,0,0,.25);
}
#interestModal .sheet{width:min(680px,94vw)}
.sheet .head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid #eef2ef}
.sheet .body{padding:18px}

.share-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:14px;margin-top:10px}
.share-btn{
  display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none;
  color:#1f2329;border:1px solid #eef2ef;border-radius:16px;padding:14px;background:#fff;
}
.share-btn span{font-size:.85rem;color:#4b5a57}
.copybox{display:flex;gap:10px;align-items:center;margin-top:14px}
.copybox input{flex:1;padding:12px 14px;border:1px solid #dbe7df;border-radius:12px}
.copybox button{padding:10px 14px;border-radius:12px;border:1px solid #1d5126;background:#2f7a3b;color:#fff;font-weight:700}

/* Form */
.form-card{padding:18px}
.form{
  background:linear-gradient(180deg,#f9fcfa,#f0f6f2);padding:18px;border-radius:18px;
  border:1px solid rgba(255,255,255,.6);box-shadow:var(--ring);
}
.form h2{margin-top:0;text-align:center}
.row{display:flex;gap:10px}
.row .col{flex:1}
.input, select, textarea{
  width:100%;padding:12px 14px;border-radius:12px;border:1px solid #dbe7df;background:#fff;font-family:inherit;font-size:1rem;
}
textarea{min-height:120px;resize:vertical}
.checkline{display:flex;align-items:center;gap:10px;margin-top:10px}
.alert{padding:12px;border-radius:12px;background:#f6fff6;border:1px solid #bfe0c3;color:#214428;margin:0 18px 18px}
.success{background:#f1fff6;border-color:#a3dfb1}
.error{background:#fff5f5;border-color:#f2c4c4;color:#7a2323}

/* Responsive */
@media (max-width:420px){
  .phone{border-radius:0;max-width:100vw}
  .tile{padding-left:68px}
  .tile .left{left:6px;width:48px;height:48px}
}
.icon-btn:hover{border-color:var(--brand);color:#000}
.menu-btn:hover{border-color:var(--brand)}
.btn{background:linear-gradient(180deg,var(--brand),#a8955f);border-color:#967f49}
