/* pharmacy.css — #176, the pharmacy chat-store. Mohamed 13/10 15:39: the SAME look as the restaurant store
 * («منقعدش نعيد designs»), so this file only adds what a pharmacy chat needs, in store.css's vocabulary:
 * Cairo, #111827 text, #64748b muted, #0369a1 solid, #e0f2fe/#0c4a6e selected, #f8fafc ground, 1px #e5e7eb
 * borders, 44px floors, SHARP corners (store.css's one radius rule; store_chat.css applies it to .sc-sheet),
 * physical RTL, no inline style. Round only where the store is round: the dots and the badge (.sc-round). */

body { background: #f8fafc; }

/* ── the chat is the page: the store's chat panel (.sc-sheet) without the dimmed page behind it ── */
.ph-sheet { z-index: 1; }
@media (min-width: 40rem) {
  body { background: #eef2f6; }
  .ph-sheet { border: 1px solid #e5e7eb; }
}
.ph-av { background: #e0f2fe; color: #0c4a6e; font-size: 1.125rem; }
.ph-demo { color: #b45309; font-weight: 700; }
#chat-lines { gap: 0.625rem; }

/* «طلباتي» in the chat's head: the store's header button (.s-head-btn) + the open-order count */
.ph-orders-btn { position: relative; padding: 0.1875rem 0.5rem; }
.ph-badge { position: absolute; top: -0.4375rem; left: -0.4375rem; min-width: 1.25rem; height: 1.25rem; padding: 0 0.25rem;
  border-radius: 999px !important; background: #c2410c; color: #fff; border: 2px solid #fff; box-sizing: border-box;
  font: 800 0.6875rem/0.875rem 'Cairo', system-ui, sans-serif; text-align: center; }

/* the bot's own lines */
.sc-in .sc-from { color: #0369a1; }
.ph-staff { border-color: #bae6fd; background: #f0f9ff; }
.ph-staff .sc-from { color: #0c4a6e; }
.ph-wide { max-width: 100%; }

/* choices: the store's chips, a little bigger, the «go on» one solid */
.ph-chips { gap: 0.5rem; }
.ph-chip { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; cursor: pointer; }
.ph-chip-main { background: #0369a1; border-color: #0369a1; color: #fff; }
.ph-chip-addr { max-width: 100%; text-align: start; white-space: normal; line-height: 1.5; padding: 0.5rem 0.875rem; }

/* photos (his prescription, the pharmacist's photo) */
.ph-thumbs { display: flex; flex-wrap: wrap; gap: 0.375rem; margin-bottom: 0.25rem; }
.ph-thumb { display: block; width: 7.5rem; height: 7.5rem; object-fit: cover; background: #e2e8f0; border: 1px solid #e5e7eb; }
.ph-thumbs-order { margin: 0.5rem 0; }
.ph-thumbs-order .ph-thumb { width: 6rem; height: 6rem; }

/* a status line + the live order card */
.ph-status { align-self: stretch; display: flex; flex-direction: column; gap: 0.375rem; }
.ph-status-t { margin: 0; align-self: flex-start; max-width: 82%; padding: 0.5rem 0.75rem; background: #fff; border: 1px solid #e5e7eb;
  font-size: 0.9375rem; line-height: 1.65; white-space: pre-line; }
.ph-ocard { border: 1px solid #e5e7eb; background: #fff; padding: 0.75rem 0.875rem 0.25rem; }
.ph-ocard-top { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }
.ph-ocard-t { font-size: 0.9375rem; font-weight: 800; color: #111827; }
.ph-dots { margin-top: 0.625rem; }
.ph-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.375rem; margin-top: 0.25rem;
  font-size: 0.6875rem; font-weight: 600; color: #64748b; line-height: 1.4; }
.ph-steps .ph-step-on { color: #0c4a6e; font-weight: 800; }
.ph-ocard-m { margin-top: 0.5rem; font-size: 0.75rem; font-weight: 600; color: #64748b; overflow-wrap: anywhere; }
.ph-ocard-total { margin-top: 0.375rem; font-size: 0.875rem; font-weight: 600; color: #0c4a6e; }
.ph-ocard-total b { font-weight: 800; }

/* the review before «ابعت الطلب» */
.ph-sum { padding: 0.75rem 0.875rem; }
.ph-sum .s-row { font-size: 0.875rem; }
.ph-sum-h { margin: 0.25rem 0 0.25rem; font-size: 0.75rem; font-weight: 800; color: #64748b; }
.ph-sum-items { margin: 0 0 0.5rem; padding: 0 1.125rem 0 0; font-size: 0.9375rem; font-weight: 700; color: #111827; }
.ph-sum-items li + li { margin-top: 0.125rem; }
.ph-sum-v { font-weight: 700; color: #0c4a6e; }
.ph-sum-addr { margin: 0 0 0.5rem; font-size: 0.875rem; }
.ph-sum-note { margin: 0.5rem 0 0; padding: 0.5rem 0.625rem; background: #fffbeb; border: 1px solid #fde68a; color: #92400e;
  font-size: 0.8125rem; font-weight: 600; line-height: 1.6; }
.ph-rx { display: inline-block; padding: 0 0.375rem; background: #FEECEF; color: #BE123C; font-size: 0.6875rem; font-weight: 800; line-height: 1.6; white-space: nowrap; }

/* the code (#170's page, as a card in the chat) */
.ph-code { padding: 1rem 0.875rem; text-align: center; }
.ph-code-t { margin: 0 0 0.5rem; font-size: 0.875rem; font-weight: 600; color: #334155; line-height: 1.7; }
.ph-code-n { margin: 0.25rem 0 0.75rem; font-size: 2.5rem; font-weight: 800; letter-spacing: 0.08em; color: #111827; font-variant-numeric: tabular-nums; }
.ph-code-go { display: flex; align-items: center; justify-content: center; text-decoration: none; }
.ph-code-wait { margin: 0.75rem 0 0; font-size: 0.8125rem; font-weight: 600; color: #475569; }
.ph-code-wait b { color: #0c4a6e; font-variant-numeric: tabular-nums; }
.ph-sq { display: inline-block; width: 0.625rem; height: 0.625rem; margin-left: 0.375rem; background: #bae6fd; animation: ph-blink 1.2s ease-in-out infinite; }
.ph-code-alt { margin: 0; font-size: 0.75rem; font-weight: 600; color: #64748b; text-align: center; }
.ph-code-alt bdi { color: #334155; font-weight: 800; }
.ph-code-off { text-align: right; }
@keyframes ph-blink { 50% { opacity: .35; } }

/* «اختار من القايمة» — the short list, store rows, no prices */
.ph-cat { display: flex; flex-direction: column; gap: 0.375rem; margin: 0; }
.ph-cat-h { margin: 0.375rem 0 0; font-size: 0.75rem; font-weight: 800; color: #64748b; }
.ph-cat-row { display: flex; align-items: center; gap: 0.5rem; width: 100%; min-height: 3rem; padding: 0.5rem 0.75rem;
  border: 1px solid #e5e7eb; background: #fff; color: #111827; font: 700 0.9375rem/1.5 'Cairo', system-ui, sans-serif;
  text-align: right; cursor: pointer; }
.ph-cat-row:active { background: #f0f9ff; }
.ph-cat-n { flex: 1 1 auto; min-width: 0; }
.ph-cat-add { flex: none; width: 2rem; height: 2rem; display: flex; align-items: center; justify-content: center;
  background: #0369a1; color: #fff; font-size: 1.25rem; font-weight: 700; }

/* «صيدلي هيرد عليك» */
.ph-wait { margin: 0; }
.ph-wait-av { background: #e0f2fe; font-size: 1rem; }
.ph-dots3 { display: flex; gap: 0.25rem; flex: none; }
.ph-dots3 i { display: block; width: 0.4375rem; height: 0.4375rem; border-radius: 999px !important; background: #0369a1; animation: sc-dot 0.9s ease-in-out infinite; }
.ph-dots3 i:nth-child(2) { animation-delay: .15s; }
.ph-dots3 i:nth-child(3) { animation-delay: .3s; }
.ph-emergency { margin: 0; font-size: 0.75rem; font-weight: 600; color: #64748b; text-align: center; }

/* the composer: the store's, plus the camera button and the topic bar's «القايمة» */
.ph-cam { flex: none; width: 2.75rem; height: 2.75rem; border: 1px solid #cbd5e1; background: #fff; color: #0369a1;
  display: flex; align-items: center; justify-content: center; cursor: pointer; }
.ph-cam svg { width: 1.375rem; height: 1.375rem; }
.ph-tel { text-align: left; letter-spacing: 0.04em; }
.ph-photo-form { margin: 0; }
.ph-bar { justify-content: space-between; }
.ph-bar-f { margin: 0; }
.ph-bar-menu { min-height: 2.75rem; padding: 0 0.25rem; border: 0; background: none; color: #0369a1; font: 800 0.8125rem 'Cairo', system-ui, sans-serif;
  text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.sc-comp[aria-busy="true"] .sc-send, form[aria-busy="true"] .sc-chip, form[aria-busy="true"] .tp-btn { opacity: .55; }

/* «طلباتي» */
.ph-order-row { padding: 0 !important; }
.ph-order-link { display: block; padding: 0.875rem; color: inherit; text-decoration: none; }
.ph-reorder-f { margin: 0; padding: 0 0.875rem 0.875rem; }
.ph-reorder { min-height: 2.75rem; }
.ph-empty { text-align: center; }
.ph-mt { margin-top: 0.75rem; }
.ph-linkbtn { display: flex; align-items: center; justify-content: center; text-decoration: none; }
.ph-center { text-align: center; }
.s-stack form { margin: 0; }
.s-stack .s-btn { width: 100%; }

/* ── the office page (the store's «تجريبي» test card + «كام رسالة متجر للعميل») ── */
.ph-pill-trial { background: #FEF5E7; color: #B45309; }
.ph-saved { background: #E9F9EF; border-color: #bbf7d0; color: #15803D; }
/* #191 «دخول جوست» on the office page: «عرض بس». */
.ph-guest { background: #FFF7ED; border-color: #FED7AA; color: #9A3412; }
.ph-tw { border-color: #fde68a; background: #fffbeb; }
.ph-tw-h { margin: 0 0 0.25rem; font-size: 0.9375rem; font-weight: 700; color: #92400e; line-height: 1.7; }
.ph-tw-note { margin: 0 0 0.75rem; font-size: 0.8125rem; font-weight: 600; color: #b45309; }
.ph-tw-word { display: flex; align-items: center; gap: 0.5rem; }
.ph-tw-v { flex: 1 1 auto; min-height: 2.75rem; display: flex; align-items: center; justify-content: center; background: #fff;
  border: 1px solid #fde68a; font: 800 1.375rem/1 'Cairo', system-ui, sans-serif; letter-spacing: 0.04em; color: #111827; }
.ph-tw-copy { flex: none; min-height: 2.75rem; width: auto; padding: 0 1rem; }
.ph-tw-go { display: flex; flex-direction: column; gap: 0.375rem; margin-top: 0.75rem; }
.ph-tw-wa { display: flex; align-items: center; justify-content: center; text-decoration: none; }
.ph-tw-num { text-align: center; font-size: 0.8125rem; font-weight: 700; color: #475569; }
.ph-tw-new { margin-top: 0.625rem; }
.ph-tw form { margin: 0; }
.ph-limit-v { margin: 0 0 0.5rem; font-size: 1rem; color: #0c4a6e; }
.ph-limit-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.625rem; margin-top: 0.5rem; }
.ph-limit fieldset { border: 0; padding: 0; margin: 0.75rem 0 0; }
.ph-check { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 2.75rem; font-weight: 700; color: #334155; }
.ph-check input { width: 1.25rem; height: 1.25rem; }
.ph-bad .s-input, .ph-bad .s-choice { border-color: #dc2626; }
.ph-err { margin: 0.5rem 0 0; padding: 0.5rem 0.75rem; background: #fef2f2; border: 1px solid #fecaca; color: #b91c1c; font-weight: 700; font-size: 0.875rem; }
.ph-limit-act { margin-top: 0.75rem; }
.ph-dec .s-row { font-size: 0.8125rem; }
.ph-dec-w { font-weight: 700; color: #475569; }
.ph-dec-issued { color: #15803D; }
.ph-dec-failed { color: #b91c1c; }
.ph-open { border-color: #bbf7d0; background: #f0fdf4; }

/* #195 «معاينة الشات» in the pharmacy admin: the customer's chat, read only (every control off). */
fieldset.ph-ro { border: 0; margin: 0; padding: 0; min-width: 0; }
/* #195 «عندك مشكلة في الطلب ده؟» on the customer's order page */
.ph-complain { margin-top: 12px; }
.ph-complain summary { cursor: pointer; font-weight: 700; }
.ph-complain form { display: grid; gap: 8px; margin-top: 10px; }
.ph-complain-k { display: flex; gap: 8px; align-items: center; }
.ph-complain textarea { width: 100%; box-sizing: border-box; font: inherit; padding: 8px; border: 1px solid #cbd5e1; border-radius: 10px; }