/* Phone Topbar (RTL) – v12 with animated reveal */
.tmc-phone-topbar{
  --spc-bg: rgba(255,255,255,.95);
  --spc-blur: 8px;
  --spc-border: rgba(0,0,0,.08);
  --spc-txt: #0f172a;
  --spc-accent: #10b981;
  box-sizing: border-box;
  backdrop-filter: saturate(120%) blur(var(--spc-blur));
  -webkit-backdrop-filter: saturate(120%) blur(var(--spc-blur));
  background: radial-gradient(1200px 120px at 92% -40px, rgba(16,185,129,.25), transparent 60%), var(--spc-bg);
  border-bottom: 1px solid var(--spc-border);
  box-shadow: 0 8px 20px -12px rgba(2,8,23,.35);
  font-family: inherit;
  width:100%;
  left:0; right:0;
  will-change: transform, opacity;
}
.tmc-phone-topbar.tmcpt-mode-sticky{ position: sticky; top: 0; z-index: 2; }
.tmc-phone-topbar.tmcpt-mode-fixed{ position: fixed; top: 0; left:0; right:0; z-index: 900; }

/* Reveal animations */
.tmc-phone-topbar.tmcpt-ready{ }
.tmc-phone-topbar.tmcpt-ready[data-anim="slide"]{ animation: tmcptSlide .45s cubic-bezier(.2,.8,.2,1) both; }
.tmc-phone-topbar.tmcpt-ready[data-anim="pop"]  { animation: tmcptPop   .38s cubic-bezier(.2,.8,.2,1) both; }
.tmc-phone-topbar.tmcpt-ready[data-anim="flip"] { transform-origin: top; animation: tmcptFlip  .5s  cubic-bezier(.2,.8,.2,1) both; }
.tmc-phone-topbar.tmcpt-ready[data-anim="drop"] { animation: tmcptDrop  .6s  cubic-bezier(.2,.8,.2,1) both; }

@keyframes tmcptSlide { from{ opacity:0; transform: translateY(-14px) } to{ opacity:1; transform:none } }
@keyframes tmcptPop   { from{ opacity:0; transform: scale(.96) translateY(-6px) } to{ opacity:1; transform:none } }
@keyframes tmcptFlip  { from{ opacity:0; transform: rotateX(-90deg) } to{ opacity:1; transform: none } }
@keyframes tmcptDrop  { 0%{ opacity:0; transform: translateY(-22px) } 70%{ opacity:1; transform: translateY(2px) } 100%{ transform: none } }

/* Reduce motion */
@media (prefers-reduced-motion: reduce){
  .tmc-phone-topbar{ opacity:1; animation:none !important; }
  .tmc-phone-topbar.tmcpt-ready{ animation:none !important; }
}

/* Layout */
.tmc-phone-topbar .tmcpt-inner{ max-width:1200px; margin:0 auto; padding:.5rem .75rem; display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.tmcpt-left{ display:inline-flex; align-items:center; gap:.45rem; font-weight:700; color:var(--spc-txt); letter-spacing:-.2px; min-width:0; }
.tmcpt-title{ font-size:clamp(.9rem, 1.8vw, .95rem); opacity:.9; white-space:nowrap; }
.tmcpt-sep{ opacity:.3; }
.tmcpt-phone{ font-size:clamp(1rem, 2.4vw, 1.1rem); text-decoration:none; color:var(--spc-txt); padding:.25rem .6rem; border-radius:.6rem; transition: background .2s ease, color .2s ease; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:78vw; direction:ltr; unicode-bidi:plaintext; font-weight:800; }
.tmcpt-phone:hover{ background: rgba(16,185,129,.12); color:#065f46; }
.tmcpt-badge{ display:none; font-weight:700; margin-inline-start:.25rem; opacity:.9; }

.tmcpt-actions{ display:inline-flex; gap:.4rem; align-items:center; flex-shrink:0; }
.tmcpt-btn{ display:inline-flex; align-items:center; gap:.4rem; border:1px solid var(--spc-border); background:#fff; padding:.4rem .7rem; border-radius:999px; font-weight:700; font-size:.88rem; text-decoration:none; color:var(--spc-txt); transition: transform .08s ease, box-shadow .2s ease; box-shadow:0 4px 10px -6px rgba(2,8,23,.25); }
.tmcpt-btn:hover{ transform: translateY(-1px); box-shadow:0 8px 18px -8px rgba(2,8,23,.3); }
.tmcpt-btn:focus-visible{ outline:2px solid var(--spc-accent); outline-offset:2px; }
.tmcpt-wa{ background:#25D366; color:#063a2a; border-color: rgba(6,95,70,.15); }

.tmcpt-svg{ display:inline-block; width:18px; height:18px; }

.tmcpt-pulse{ width:10px; height:10px; border-radius:999px; background: var(--spc-accent); box-shadow:0 0 0 0 rgba(16,185,129,.7); animation: tmcpt-pulse 2.2s infinite; }
@keyframes tmcpt-pulse{ 0%{ box-shadow: 0 0 0 0 rgba(16,185,129,.6);} 70%{ box-shadow: 0 0 0 10px rgba(16,185,129,0);} 100%{ box-shadow: 0 0 0 0 rgba(16,185,129,0);} }

@media (max-width: 768px){
  .tmcpt-title{ display:none; }
  .tmcpt-badge{ display:inline; }
  .tmcpt-phone{ max-width:82vw; }
  .tmcpt-actions .tmcpt-btn span + span{ display:none; } /* icons only */
}


/* --- Custom fixes (v4_5) --- */
/* Ensure WhatsApp label text never takes space on mobile */
@media (max-width: 768px){
  .tmcpt-actions .tmcpt-wa span{ display: none !important; }
}
/* On very small phones, hide the WA button entirely to let the phone show fully */
@media (max-width: 360px){
  .tmcpt-actions .tmcpt-wa{ display: none !important; }
}
/* Reserve initial height to avoid white flicker before JS adjusts spacer */
.tmc-phone-topbar{ min-height: 52px; }


/* --- Custom fixes (v4_6) --- */
@media (max-width: 768px){
  .tmcpt-actions .tmcpt-wa span{ display:none !important; } /* hide 'واتس‌اپ' text */
  .tmcpt-phone{ max-width:88vw; }
}
@media (max-width: 380px){
  .tmcpt-actions .tmcpt-wa{ display:none !important; } /* hide WA button entirely on tiny phones */
}
/* Prevent initial layout shift by reserving height and removing initial translateY */
.tmc-phone-topbar{ min-height: 52px; }
/* Ensure background is not pure white at first paint */
.tmc-phone-topbar{ background: radial-gradient(1200px 120px at 92% -40px, rgba(16,185,129,.25), transparent 60%), var(--spc-bg); }

/* --- Custom fixes (v4_7) --- */
/* Force visible from first paint */
.tmc-phone-topbar{ opacity:1 !important; transform:none !important; }
/* Hide WA label on mobile to save width */
@media (max-width: 768px){ .tmcpt-actions .tmcpt-wa span{ display:none !important; } }
/* On very small screens hide WA button entirely */
@media (max-width: 420px){ .tmcpt-actions .tmcpt-wa{ display:none !important; } }
/* Avoid initial white strip: give immediate colored bg */
.tmc-phone-topbar{ background-color: rgba(16,185,129,.08); }


/* --- Custom fixes (v4_8) --- */
/* First paint stable, no flicker */
.tmc-phone-topbar{ opacity:1 !important; transform:none !important; min-height:52px; background-color: rgba(16,185,129,.08); }
/* Keep WA button but hide its text on mobile */
@media (max-width: 768px){
  .tmcpt-actions .tmcpt-wa{ display:inline-flex !important; }
  .tmcpt-actions .tmcpt-wa span{ display:none !important; }
}
/* 'Under header' visual mode */
.tmc-phone-topbar.tmcpt-under{ box-shadow: 0 4px 14px -10px rgba(2,8,23,.35); }
/* When sticky under header, don't overlay content */
.tmc-phone-topbar.tmcpt-mode-sticky{ position: sticky; top: 0; z-index: 9; }


/* --- Custom fixes (v4_9) --- */
/* bar always fixed on top, above header */
.tmc-phone-topbar.tmcpt-mode-fixed{ position: fixed; top:0; left:0; right:0; z-index: 9999; opacity:1 !important; transform:none !important; }
/* keep visual */
.tmc-phone-topbar{ min-height:52px; background-color: rgba(16,185,129,.08); }
/* WhatsApp button present; hide its label on mobile */
@media (max-width: 768px){
  .tmcpt-actions .tmcpt-wa{ display:inline-flex !important; }
  .tmcpt-actions .tmcpt-wa span{ display:none !important; }
}

/* --- Custom fixes (v4_10) --- */
/* Always visible from first paint */
.tmc-phone-topbar{ opacity:1 !important; transform:none !important; min-height:52px; background-color: rgba(16,185,129,.08); }
/* Keep WhatsApp button, hide only its label on mobile */
@media (max-width: 768px){
  .tmcpt-actions .tmcpt-wa{ display:inline-flex !important; }
  .tmcpt-actions .tmcpt-wa span{ display:none !important; }
}
/* If we move under header as sticky, add a subtle shadow */
.tmc-phone-topbar.tmcpt-under{ box-shadow: 0 4px 14px -10px rgba(2,8,23,.35); }

/* --- Custom fixes (v4_11) --- */
/* Stable first paint */
.tmc-phone-topbar{ opacity:1 !important; transform:none !important; min-height:52px; background-color: rgba(16,185,129,.08); }
/* Static (non-fixed) mode used before scroll when placed BEFORE header */
.tmc-phone-topbar.tmcpt-mode-static{ position: relative; z-index: 2; }
/* Fixed-under mode shadow for clarity */
.tmc-phone-topbar.tmcpt-under{ box-shadow: 0 4px 14px -10px rgba(2,8,23,.35); }
/* Keep WA button but hide label on mobile */
@media (max-width: 768px){
  .tmcpt-actions .tmcpt-wa{ display:inline-flex !important; }
  .tmcpt-actions .tmcpt-wa span{ display:none !important; }
}

/* --- Custom fixes (v4_12) --- */
.tmc-phone-topbar{ opacity:1 !important; transform:none !important; min-height:52px; background-color: rgba(16,185,129,.08); }
.tmc-phone-topbar.tmcpt-mode-static{ position: relative; z-index: 2; }
.tmc-phone-topbar.tmcpt-mode-fixed{ position: fixed; left:0; right:0; z-index: 9999; }
.tmc-phone-topbar.tmcpt-under{ box-shadow: 0 4px 14px -10px rgba(2,8,23,.35); }
@media (max-width: 768px){
  .tmcpt-actions .tmcpt-wa{ display:inline-flex !important; }
  .tmcpt-actions .tmcpt-wa span{ display:none !important; }
}

/* --- Custom fixes (v4_13) --- */
.tmc-phone-topbar{ opacity:1 !important; transform:none !important; min-height:52px; background-color: rgba(16,185,129,.08); }
.tmc-phone-topbar.tmcpt-mode-static{ position: relative; z-index: 2; }
.tmc-phone-topbar.tmcpt-mode-fixed{ position: fixed; left:0; right:0; z-index: 9999; }
.tmc-phone-topbar.tmcpt-under{ box-shadow: 0 4px 14px -10px rgba(2,8,23,.35); }
@media (max-width: 768px){
  .tmcpt-actions .tmcpt-wa{ display:inline-flex !important; }
  .tmcpt-actions .tmcpt-wa span{ display:none !important; } /* hide label only */
}

/* --- Custom fixes (v4_14) --- */
.tmc-phone-topbar{ opacity:1 !important; transform:none !important; min-height:52px; background-color: rgba(16,185,129,.08); }
.tmc-phone-topbar.tmcpt-mode-static{ position: relative; z-index: 2; }
.tmc-phone-topbar.tmcpt-mode-fixed{ position: fixed; left:0; right:0; z-index: 9999; }
.tmc-phone-topbar.tmcpt-under{ box-shadow: 0 4px 14px -10px rgba(2,8,23,.35); }
@media (max-width: 768px){
  .tmcpt-actions .tmcpt-wa{ display:inline-flex !important; }
  .tmcpt-actions .tmcpt-wa span{ display:none !important; }
}

/* --- Custom fixes (v4_15) --- */
.tmc-phone-topbar{ opacity:1 !important; transform:none !important; min-height:52px; background-color: rgba(16,185,129,.08); }
.tmc-phone-topbar.tmcpt-mode-static{ position: relative; z-index: 2; }
.tmc-phone-topbar.tmcpt-mode-fixed{ position: fixed; left:0; right:0; z-index: 9999; }
.tmc-phone-topbar.tmcpt-under{ box-shadow: 0 4px 14px -10px rgba(2,8,23,.35); }
@media (max-width: 768px){
  .tmcpt-actions .tmcpt-wa{ display:inline-flex !important; }
  .tmcpt-actions .tmcpt-wa span{ display:none !important; } /* hide label only */
}

/* --- Custom fixes (v4_16) --- */
.tmc-phone-topbar{ opacity:1 !important; transform:none !important; min-height:52px; background-color: rgba(16,185,129,.08); }
.tmc-phone-topbar.tmcpt-mode-static{ position: relative; z-index: 2; }
.tmc-phone-topbar.tmcpt-mode-fixed{ position: fixed; left:0; right:0; z-index: 9999; }
.tmc-phone-topbar.tmcpt-under{ box-shadow: 0 4px 14px -10px rgba(2,8,23,.35); }
@media (max-width: 768px){
  .tmcpt-actions .tmcpt-wa{ display:inline-flex !important; }
  .tmcpt-actions .tmcpt-wa span{ display:none !important; }
}

/* --- Custom fixes (v4_17) --- */
.tmc-phone-topbar{ opacity:1 !important; transform:none !important; min-height:52px; background-color: rgba(16,185,129,.08); }
.tmc-phone-topbar.tmcpt-mode-static{ position: relative; z-index: 2; }
.tmc-phone-topbar.tmcpt-mode-fixed{ position: fixed; left:0; right:0; z-index: 9999; }
.tmc-phone-topbar.tmcpt-under{ box-shadow: 0 4px 14px -10px rgba(2,8,23,.35); }
@media (max-width: 768px){
  .tmcpt-actions .tmcpt-wa{ display:inline-flex !important; }
  .tmcpt-actions .tmcpt-wa span{ display:none !important; } /* hide label only */
}


/* === Patch: keep phone topbar always above, prevent flicker === */
.tmc-phone-topbar.tmcpt-mode-fixed{
  z-index: 2147483647 !important;
}
header, .site-header, .navbar { overflow: visible !important; }
.tmc-phone-topbar{
  backface-visibility: hidden;
  transform: translateZ(0);
}
@media (prefers-reduced-motion: reduce){
  .tmc-phone-topbar{
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}