/* ==========================================================================
   Ultimate User Auth & Sticky Header - Luxury Beauty Clinic Style
   ========================================================================== */

/* 1. استایل‌های اصلی منوی کاربری */
.zb-auth-wrap { position: relative; display: inline-block; font-family: inherit; direction: rtl; text-align: right; z-index: 999999 !important; }

.zb-btn-main { background: #0f766e; color: #fff !important; padding: 6px 16px; text-decoration: none !important; border-radius: 8px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; border: none; font-size: 13.5px; transition: all 0.3s ease; white-space: nowrap; line-height: 1.8; position: relative; box-shadow: 0 4px 12px rgba(15, 118, 110, 0.2); }
.zb-btn-main:hover { background: #115e59; box-shadow: 0 6px 15px rgba(15, 118, 110, 0.3); }

.zb-btn-guest { background: #fff; color: #0f766e !important; border: 1.5px solid #0f766e; box-shadow: none; }
.zb-btn-guest:hover { background: #f0fdfa; color: #115e59 !important; }
.zb-btn-guest .zb-svg-icon { fill: #0f766e; }

.zb-svg-icon { width: 14px; height: 14px; margin-left: 8px; fill: currentColor; display: inline-block; vertical-align: middle; }
.zb-img-icon { width: 16px; height: 16px; margin-left: 10px; object-fit: contain; display: inline-block; vertical-align: middle; }
.zb-font-icon { width: 15px; margin-left: 10px; font-size: 15px; display: inline-block; vertical-align: middle; opacity: 0.85; transition: all 0.25s ease; }

.zb-dropdown-menu { display: none; position: absolute; top: calc(100% + 10px); left: 0; right: auto; min-width: 250px; width: max-content; max-width: 92vw; background: #fff; box-shadow: 0 15px 45px -10px rgba(0,0,0,0.12); border-radius: 14px; z-index: 99999999 !important; border: 1px solid #e2e8f0; padding: 12px; box-sizing: border-box; max-height: 75vh; overflow-y: auto; overflow-x: hidden; will-change: transform, opacity; transform: translateZ(0); }

.zb-dropdown-menu::-webkit-scrollbar { width: 5px; }
.zb-dropdown-menu::-webkit-scrollbar-track { background: #f8fafc; border-radius: 10px; }
.zb-dropdown-menu::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }

.zb-arrow-toggle { margin-right: 12px; border: solid currentColor; border-width: 0 2px 2px 0; display: inline-block; padding: 3px; transform: rotate(45deg); transition: transform 0.2s ease; margin-bottom: 2px; }
.zb-btn-main.is-open .zb-arrow-toggle { transform: rotate(-135deg); margin-bottom: -2px; }

/* =========================================
   کارت لوکس پروفایل
   ========================================= */
/* کارت بیمار (Accent: رنگ مسی/رُزگلد لوگو) */
.zb-profile-card.patient-theme { background: linear-gradient(135deg, #ffffff, #fcfaf9) !important; border-color: #f3e8e6 !important; }
.zb-profile-card.patient-theme:hover { background: #fae8e4 !important; border-color: #eecbc4 !important; }
.zb-profile-card.patient-theme .zb-profile-name { color: #0f172a !important; }
.zb-profile-card.patient-theme .zb-profile-badge { color: #b66551 !important; background: #fae8e4 !important; }

/* کارت پرسنل (Accent: فیروزه‌ای تیره) */
.zb-profile-card.staff-theme { background: linear-gradient(135deg, #f0fdfa, #ccfbf1) !important; border-color: #99f6e4 !important; }
.zb-profile-card.staff-theme:hover { background: #ccfbf1 !important; }
.zb-profile-card.staff-theme .zb-profile-name { color: #0f766e !important; }
.zb-profile-card.staff-theme .zb-profile-badge { color: #ffffff !important; background: #0f766e !important; }

/* =========================================
   آیتم‌های لیست منو (با افکت رنگ لوگو)
   ========================================= */
.zb-drop-item { display: flex !important; align-items: center; justify-content: space-between; padding: 10px 12px; color: #334155 !important; text-decoration: none !important; border-radius: 8px; transition: all 0.25s ease; font-size: 13.5px; font-weight: 500; border-bottom: 1px solid #f1f5f9; background: transparent; margin-bottom: 2px; }
.zb-drop-item:last-of-type { border-bottom: none; margin-bottom: 0; }

.zb-item-right { display: flex; align-items: center; }
/* فلش هاور به رنگ لوگو درآمده است */
.zb-hover-arrow { width: 12px; height: 12px; fill: #b66551; opacity: 0; transform: translateX(8px); transition: all 0.25s ease; }

/* تغییر رنگ پس‌زمینه و آیکون در زمان هاور به تِم گرمِ لوگو */
.zb-drop-item:hover { background: #fdf6f5; color: #b66551 !important; border-bottom-color: transparent; }
.zb-drop-item:hover .zb-hover-arrow { opacity: 1; transform: translateX(0); }
.zb-drop-item:hover .zb-font-icon { color: #b66551; opacity: 1; stroke: #b66551; }

.zb-drop-btn { display: flex !important; align-items: center; justify-content: center; background: #f8fafc; color: #334155 !important; padding: 10px; margin-top: 6px; border-radius: 8px; text-decoration: none !important; font-weight: 600; font-size: 13px; text-align: center; transition: all 0.25s; border: 1px solid #e2e8f0; }
.zb-drop-btn:hover { background: #f1f5f9; color: #0f172a !important; border-color: #cbd5e1; }

.zb-header-is-stuck { position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important; width: 100% !important; z-index: 9999999 !important; background-color: #ffffff !important; box-shadow: 0 4px 20px rgba(0,0,0,0.06) !important; animation: zb-smooth-down 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important; will-change: transform; }
@keyframes zb-smooth-down { 0% { transform: translateY(-100%); } 100% { transform: translateY(0); } }