/* Byamber WhatsApp Order Form Modal
 * Bilingual (English + Urdu) order form that opens when the
 * "Order on WhatsApp" button is clicked on a product page.
 */

/* ── Dialog container ──────────────────────────────────────────────── */
.ba-wa-order-modal{z-index:10070}

.ba-wa-order-dialog{
  width:min(620px,100%);
  max-height:min(96dvh,860px);
  overflow-y:auto;
  overscroll-behavior:contain;
  border-radius:calc(var(--ba-card-radius,18px) + 6px);
  background:#fffdfc;
  box-shadow:0 32px 90px rgba(30,19,15,.36);
}

/* ── Header ────────────────────────────────────────────────────────── */
.ba-wa-order-inner{
  padding:clamp(1.1rem,3vw,1.85rem);
}

.ba-wa-order-header{
  display:flex;
  align-items:flex-start;
  gap:.9rem;
  margin:0 0 1.25rem;
  padding-bottom:1.1rem;
  border-bottom:1px solid rgba(0,0,0,.11);
}

.ba-wa-order-icon{
  flex:0 0 48px;
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  border-radius:999px;
  background:#25d366;
  color:#fff;
  box-shadow:0 10px 22px rgba(37,211,102,.28);
}

.ba-wa-order-title{
  margin:0 0 .28rem;
  font-size:clamp(1.4rem,3vw,1.75rem);
  line-height:1.1;
  color:var(--ba-text,#000000);
  letter-spacing:-.03em;
}

.ba-wa-order-title-ur{
  display:block;
  font-size:clamp(1rem,2vw,1.25rem);
  color:var(--ba-muted,#796b64);
  font-weight:600;
  margin-top:.18rem;
}

.ba-wa-order-subtitle{
  margin:0;
  color:var(--ba-muted,#796b64);
  font-size:.88rem;
  line-height:1.55;
}

.ba-wa-order-subtitle-ur{
  display:inline;
  color:var(--ba-muted,#796b64);
}

/* ── COD charge info strip ─────────────────────────────────────────── */
.ba-wa-cod-info{
  display:flex;
  align-items:flex-start;
  gap:.55rem;
  margin:0 0 1rem;
  padding:.7rem .95rem;
  border:1px solid rgba(229,157,0,.35);
  border-radius:14px;
  background:rgba(255,196,0,.09);
  font-size:.86rem;
  line-height:1.5;
}

.ba-wa-cod-info[hidden]{
  display:none !important;
}

.ba-wa-cod-icon{
  flex-shrink:0;
  display:flex;
  align-items:center;
  color:#9a6c00;
  padding-top:.1rem;
}

.ba-wa-cod-text strong{
  display:block;
  font-weight:800;
  color:#6b4c00;
  margin-bottom:.1rem;
}

.ba-wa-cod-text span{
  color:#7a5a00;
  font-weight:600;
}

/* ── Product info strip ─────────────────────────────────────────────── */
.ba-wa-product-info{
  display:flex;
  align-items:center;
  gap:.55rem;
  flex-wrap:wrap;
  margin:0 0 1.1rem;
  padding:.72rem .95rem;
  border:1px solid rgba(37,211,102,.3);
  border-radius:14px;
  background:rgba(37,211,102,.07);
  font-size:.88rem;
}

.ba-wa-product-info strong{
  color:var(--ba-text,#000000);
  font-weight:800;
}

.ba-wa-product-info span{
  color:var(--ba-primary-dark,#1d216b);
  font-weight:700;
}

/* ── Form ──────────────────────────────────────────────────────────── */
.ba-wa-order-form{
  display:grid;
  gap:.95rem;
}

.ba-wa-form-row{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.85rem;
}

.ba-wa-form-group{
  display:grid;
  gap:.38rem;
}

.ba-wa-form-group label{
  display:grid;
  gap:.12rem;
  font-size:.82rem;
  font-weight:850;
  color:var(--ba-text,#000000);
  line-height:1.3;
}

.ba-wa-label-en{
  display:block;
  color:var(--ba-text,#000000);
}

.ba-wa-label-ur{
  display:block;
  color:var(--ba-muted,#796b64);
  font-size:.76rem;
  font-weight:700;
}

.ba-wa-required{
  color:var(--ba-primary,#a563e5);
  font-weight:900;
}

.ba-wa-form-group input,
.ba-wa-form-group select,
.ba-wa-form-group textarea{
  width:100%;
  min-height:50px;
  padding:.78rem .9rem;
  border:1px solid var(--ba-border,#eadfd4);
  border-radius:15px;
  background:#fff;
  color:var(--ba-text,#000000);
  font:inherit;
  font-size:.92rem;
  outline:none;
  transition:border-color .18s ease,box-shadow .18s ease;
  -webkit-appearance:none;
  appearance:none;
}

.ba-wa-form-group textarea{
  min-height:90px;
  resize:vertical;
}

.ba-wa-form-group input:focus,
.ba-wa-form-group select:focus,
.ba-wa-form-group textarea:focus{
  border-color:#25d366;
  box-shadow:0 0 0 3px rgba(37,211,102,.18);
}

.ba-wa-form-group select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' fill='none' stroke='%23796b64' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m1 1 6 7 6-7'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right .85rem center;
  padding-right:2.4rem;
  cursor:pointer;
}

/* ── Error box ─────────────────────────────────────────────────────── */
.ba-wa-form-error{
  padding:.75rem .9rem;
  border:1px solid rgba(154,56,74,.28);
  border-radius:13px;
  background:rgba(154,56,74,.08);
  color:#8a3227;
  font-size:.85rem;
  font-weight:700;
  line-height:1.5;
}

/* ── Submit button ─────────────────────────────────────────────────── */
.ba-wa-order-submit{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  width:100%;
  min-height:56px;
  margin-top:.4rem;
  padding:1rem 1.4rem;
  border:0;
  border-radius:16px;
  background:#25d366;
  color:#fff;
  font:inherit;
  font-size:1rem;
  font-weight:900;
  letter-spacing:.01em;
  cursor:pointer;
  box-shadow:0 14px 34px rgba(37,211,102,.30);
  transition:transform .18s ease,background .18s ease,box-shadow .18s ease;
}

.ba-wa-order-submit:hover,
.ba-wa-order-submit:focus-visible{
  background:#128c7e;
  box-shadow:0 18px 42px rgba(18,140,126,.32);
  transform:translateY(-2px);
  outline:none;
}

.ba-wa-submit-ur{
  font-size:.88rem;
  opacity:.88;
}

/* ── Responsive ────────────────────────────────────────────────────── */
@media (max-width:520px){
  .ba-wa-order-dialog{
    border-radius:22px 22px 0 0;
    max-height:96dvh;
    margin-top:auto;
    align-self:flex-end;
  }

  .ba-wa-order-modal{
    align-items:flex-end!important;
  }

  .ba-wa-form-row{
    grid-template-columns:1fr;
  }

  .ba-wa-order-submit{
    font-size:.94rem;
  }

  .ba-wa-submit-ur{
    display:none;
  }
}

@media (prefers-reduced-motion:reduce){
  .ba-wa-order-submit{
    transition:none;
  }
  .ba-wa-order-submit:hover,
  .ba-wa-order-submit:focus-visible{
    transform:none;
  }
}