/* HRH Quick Form — هوية لونين فقط: ذهبي مطفي + أخضر زمردي
 * كل الدرجات مشتقة من اللونين فقط. كل شيء داخل .hrq حتى لا يتأثر القالب. */
.hrq{
  --em:#0B6B4D;      /* زمردي */
  --em-d:#064330;    /* زمردي غامق */
  --em-x:#042F22;    /* زمردي أعمق (خلفية الحقول) */
  --au:#B8963E;      /* ذهبي مطفي */
  --au-h:#CBA94E;    /* ذهبي عند التفاعل */
  --au-l:#E6D8A8;    /* ذهبي فاتح (للنصوص) */
  --au-s:rgba(184,150,62,.16);
  --au-line:rgba(184,150,62,.5);
  --ease:cubic-bezier(.2,.75,.25,1);
  width:min(100%,560px);max-width:100%;margin:clamp(12px,3vw,36px) auto;padding:clamp(8px,2vw,16px);
  color:var(--au-l);font:15px/1.7 'Cairo','Tajawal',Tahoma,sans-serif;direction:rtl;isolation:isolate;
}
.hrq,.hrq *{box-sizing:border-box;min-width:0}
.hrq *{overflow-wrap:anywhere}
.hrq button,.hrq input,.hrq select{font-family:inherit}

.hrq-card {
    position: relative;
    overflow: hidden;
    overflow: clip;
    border-radius: 26px;
    border: 1px solid var(--au-line);
    background: repeating-linear-gradient(135deg,rgba(184,150,62,.045) 0 1px,transparent 1px 14px),
    linear-gradient(165deg,var(--em) 0%,var(--em-d) 62%,var(--em-x) 100%);
    box-shadow: 0 30px 70px -28px var(--em-x),0 0 0 4px var(--em-d),0 0 0 5px var(--au-line);
}
.hrq-card:before{ /* شريط ذهبي علوي */
  content:'';position:absolute;inset-block-start:0;inset-inline:0;height:4px;
  background:linear-gradient(90deg,transparent,var(--au) 20%,var(--au-h) 50%,var(--au) 80%,transparent);
}

/* ===== الرأس ===== */
.hrq-head{padding:clamp(28px,6vw,44px) clamp(20px,6vw,40px) 8px;text-align:center}
.hrq-logo{
  display:block;margin:0 auto 14px;width:76px;height:76px;object-fit:contain;padding:10px;
  background:var(--em-x);border:1.5px solid var(--au);border-radius:50%;
}
.hrq-badge{
  display:inline-block;margin-bottom:12px;padding:3px 16px;border:1px solid var(--au);border-radius:99px;
  color:var(--au);background:var(--au-s);font-size:12px;font-weight:700;letter-spacing:.06em;
}
.hrq-head h2{margin:0 0 8px;color:var(--au-l);font-size:clamp(22px,5.4vw,30px);font-weight:800;line-height:1.3;text-wrap:balance}
.hrq-head p{max-width:420px;margin:0 auto;color:var(--au-l);font-size:13.5px;line-height:1.85;opacity:.85}
.hrq-head:after{
  content:'';display:block;width:64px;height:2px;margin:20px auto 0;background:var(--au);border-radius:2px;
  box-shadow:0 0 0 4px var(--au-s);
}
.hrq-head.compact{padding-block-end:0}
.hrq-head.compact h2,.hrq-head.compact p,.hrq-head.compact .hrq-badge{display:none}

/* ===== النموذج ===== */
#hrqForm{padding:20px clamp(20px,6vw,40px) clamp(24px,5vw,36px)}
.hrq-field{margin-bottom:16px}
.hrq-field>label:first-child{display:block;margin-bottom:6px;color:var(--au-l);font-size:14px;font-weight:700}
.hrq-field b{color:var(--au)}
.hrq input[type=text],.hrq input[type=tel],.hrq input:not([type]),.hrq select{
  display:block;width:100%;height:50px;padding:0 16px;margin:0;
  color:var(--au-l);background:var(--em-x);border:1px solid var(--au-line);border-radius:14px;
  font-size:16px;line-height:1.4;outline:0;box-shadow:none;
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease),background-color .2s var(--ease);
}
.hrq input::placeholder{color:var(--au);opacity:.55}
.hrq input:hover,.hrq select:hover{border-color:var(--au)}
.hrq input:focus,.hrq select:focus{border-color:var(--au-h);box-shadow:0 0 0 3px rgba(184,150,62,.3)}
.hrq select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer;padding-inline-start:16px;padding-inline-end:44px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none' stroke='%23B8963E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m1.5 1.5 5.5 5.5 5.5-5.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:left 16px center;background-size:14px 9px;
}
.hrq select option{background:var(--em-x);color:var(--au-l)}
.hrq input:-webkit-autofill{-webkit-text-fill-color:var(--au-l);caret-color:var(--au-l);-webkit-box-shadow:0 0 0 60px var(--em-x) inset}

/* رفع الملف */
.hrq-file{
  position:relative;display:flex;align-items:center;gap:12px;min-height:64px;padding:12px 16px;cursor:pointer;
  color:var(--au);background:var(--au-s);border:1.5px dashed var(--au);border-radius:14px;
  transition:background-color .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease);
}
.hrq-file:hover{background:rgba(184,150,62,.24);color:var(--au-h)}
.hrq-file:focus-within{box-shadow:0 0 0 3px rgba(184,150,62,.3)}
.hrq-file input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;font-size:0}
.hrq-file svg{flex:0 0 auto}
.hrq-file span{flex:1 1 auto;font-size:13.5px;font-weight:600;line-height:1.5}
.hrq-file.has{border-style:solid;background:var(--au);color:var(--em-x)}
.hrq-file.has span{font-weight:800}

/* خطأ — بدون ألوان خارج الهوية: حدّ منقّط + اهتزاز */
.hrq .bad{border-color:var(--au-l)!important;border-style:dashed!important;box-shadow:0 0 0 3px rgba(230,216,168,.35)!important;animation:hrqShake .35s var(--ease)}
@keyframes hrqShake{20%,60%{transform:translateX(5px)}40%,80%{transform:translateX(-5px)}}
.hrq-msg{display:none;margin:2px 0 14px;padding:11px 14px;color:var(--em-x);background:var(--au);border-radius:12px;font-size:13.5px;font-weight:700;line-height:1.6}
.hrq-msg.on{display:block}

/* الزر */
.hrq-btn{
  position:relative;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:54px;margin:4px 0 0;padding:0 20px;
  color:var(--em-x);background:linear-gradient(180deg,var(--au-h),var(--au));border:0;border-radius:14px;cursor:pointer;
  font-size:17px;font-weight:800;letter-spacing:.01em;
  box-shadow:0 10px 24px -10px var(--em-x),0 0 0 1px var(--au-h) inset;
  transition:transform .2s var(--ease),filter .2s var(--ease),box-shadow .2s var(--ease);
}
.hrq-btn:hover{filter:brightness(1.07);transform:translateY(-1px)}
.hrq-btn:active{transform:translateY(1px)}
.hrq-btn:focus-visible{outline:0;box-shadow:0 0 0 3px var(--em-d),0 0 0 5px var(--au-l)}
.hrq-btn:disabled{cursor:wait;filter:saturate(.8) brightness(.92);transform:none}
.hrq-btn.busy:before{
  content:'';width:18px;height:18px;border:2.5px solid rgba(4,47,34,.3);border-top-color:var(--em-x);border-radius:50%;animation:hrqSpin .7s linear infinite;
}
@keyframes hrqSpin{to{transform:rotate(360deg)}}
.hrq-note{margin:14px 0 0;color:var(--au-l);font-size:12px;text-align:center;opacity:.7}
.hrq-hp{position:absolute!important;inset-inline-start:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}

/* ===== النجاح ===== */
.hrq-done{padding:8px clamp(20px,6vw,40px) clamp(30px,6vw,44px);text-align:center}
.hrq-done[hidden]{display:none}
.hrq-check{
  display:grid;place-items:center;width:76px;height:76px;margin:10px auto 16px;color:var(--em-x);
  background:var(--au);border-radius:50%;box-shadow:0 0 0 7px var(--au-s),0 0 0 8px var(--au-line);animation:hrqPop .5s var(--ease);
}
@keyframes hrqPop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
.hrq-done h3{margin:0 0 8px;color:var(--au-l);font-size:24px;font-weight:800}
.hrq-done p{margin:0 auto 18px;max-width:380px;color:var(--au);font-size:14px;line-height:1.9}
.hrq-code{display:inline-block;padding:9px 20px;color:var(--au-l);background:var(--em-x);border:1px solid var(--au);border-radius:12px;font-size:14px}
.hrq-code b{margin-inline-start:6px;color:var(--au-h);font-size:16px;letter-spacing:.08em;direction:ltr;unicode-bidi:embed}

.hrq-closed{padding:34px 24px;color:var(--au-l);text-align:center;font-size:16px;font-weight:700}

@media (max-width:420px){
  .hrq{padding:6px}
  .hrq-card{border-radius:20px}
}
@media (prefers-reduced-motion:reduce){
  .hrq *,.hrq *:before{animation:none!important;transition:none!important}
}

