/* ============================================================
   DASHT SEO — FIXES v1.2
   1. Off-canvas mobile menu
   2. Dark mode — comprehensive white/text fixes
   3. Cursor on all pages
   4. Dashboard sidebar dark mode
   ============================================================ */

/* ══════════════════════════════════════════════════
   3. DASHBOARD SIDEBAR DARK MODE
   ══════════════════════════════════════════════════ */

/*
  User Dashboard (front-end) isolation:
  dashboard.php loads main.css via wp_head() — we must override
  global styles that break the dashboard layout.
*/
/* Dashboard isolation moved to dashboard.css */

html.dasht-cursor-active,
html.dasht-cursor-active body,
html.dasht-cursor-active a,
html.dasht-cursor-active button {
  cursor: none !important;
}

/*
  Sidebar = always dark (var(--ink) background) → text should be light
  In dark mode, var(--ink) = #F4EFE3 (light color!) which breaks the sidebar.
  Fix: sidebar uses HARDCODED dark colors regardless of theme.
*/
.dasht-sidebar {
  background: #0E1116 !important; /* always dark */
  color: #F4EFE3 !important;      /* always light text */
}

.dasht-sidebar-brand {
  border-bottom-color: rgba(255,255,255,.1) !important;
}
.dasht-sidebar-brand .mark {
  background: #C9B18C !important;
  color: #0E1116 !important;
}
.dasht-sidebar-brand .name {
  color: #F4EFE3 !important;
}
.dasht-sidebar-brand .sub {
  color: rgba(244,239,227,.4) !important;
}

.dasht-sidebar-section-label {
  color: rgba(244,239,227,.3) !important;
}

.dasht-sidebar-link {
  color: rgba(244,239,227,.65) !important;
}
.dasht-sidebar-link:hover {
  background: rgba(255,255,255,.07) !important;
  color: #F4EFE3 !important;
}
.dasht-sidebar-link.active {
  background: rgba(201,177,140,.18) !important;
  color: #C9B18C !important;
}
.dasht-sidebar-link .icon {
  opacity: 1 !important;
}

.dasht-sidebar-footer {
  border-top-color: rgba(255,255,255,.1) !important;
}
.dasht-sidebar-footer a {
  color: rgba(244,239,227,.45) !important;
}
.dasht-sidebar-footer a:hover {
  color: #e05252 !important;
}

/* ── Dashboard main area dark mode ── */
html[data-theme="dark"] .dasht-topbar {
  background: var(--paper) !important;
  border-bottom-color: rgba(244,239,227,.08) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .dasht-topbar-greeting { color: var(--ink) !important; }
html[data-theme="dark"] .dasht-content { background: var(--bg) !important; }

html[data-theme="dark"] .dasht-stat-card {
  background: var(--paper) !important;
  border-color: rgba(244,239,227,.08) !important;
}
html[data-theme="dark"] .dasht-stat-card .stat-value { color: var(--c-primary) !important; }
html[data-theme="dark"] .dasht-stat-card .stat-label { color: var(--ink-mute) !important; }

html[data-theme="dark"] .dasht-card-box {
  background: var(--paper) !important;
  border-color: rgba(244,239,227,.08) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .dasht-card-box h3 { color: var(--ink) !important; }
html[data-theme="dark"] .dasht-card-box p  { color: var(--ink-soft) !important; }
html[data-theme="dark"] .dasht-section-title { color: var(--ink) !important; }

html[data-theme="dark"] .dasht-form-group label { color: var(--ink-mute) !important; }
html[data-theme="dark"] .dasht-form-group input,
html[data-theme="dark"] .dasht-form-group textarea,
html[data-theme="dark"] .dasht-form-group select {
  background: var(--bg-2) !important;
  border-color: rgba(244,239,227,.1) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .dasht-form-group input:focus,
html[data-theme="dark"] .dasht-form-group textarea:focus {
  background: var(--paper) !important;
  border-color: var(--c-primary) !important;
}
html[data-theme="dark"] .dasht-avatar-upload-btn {
  border-color: rgba(244,239,227,.15) !important;
  color: var(--ink-soft) !important;
}
html[data-theme="dark"] .dasht-avatar-upload-btn:hover {
  border-color: var(--c-primary) !important;
  color: var(--c-primary) !important;
}

/* ── Dashboard cards body text ── */
html[data-theme="dark"] .dasht-dash-section h3 { color: var(--ink) !important; }
html[data-theme="dark"] .dasht-dash-section p  { color: var(--ink-soft) !important; }

/* ══════════════════════════════════════════════════
   v2.7 — MEGA MENU + AJAX COMMENTS + PAGE TRANSITIONS
   ══════════════════════════════════════════════════ */

/* ── MEGA MENU ── */
.has-mega { position: static !important; }
.dasht-mega-panel {
  position: absolute; top: calc(100% + 12px); left: 20px; right: 20px;
  background: var(--paper); border: 1.5px solid var(--line-soft);
  border-radius: var(--r-xl); box-shadow: 0 24px 60px -20px rgba(0,0,0,.18);
  opacity: 0; visibility: hidden; transform: translateY(-8px);
  transition: opacity .38s cubic-bezier(0.22,1,0.36,1), transform .38s, visibility .38s;
  z-index: 100; overflow: hidden;
}
.has-mega:hover .dasht-mega-panel { opacity: 1; visibility: visible; transform: translateY(0); }
.dasht-mega-inner {
  display: grid; grid-template-columns: repeat(var(--mega-cols, 3), 1fr);
  gap: 0; padding: 32px;
  background-image: var(--mega-bg, none);
  background-size: 200px; background-position: bottom left; background-repeat: no-repeat;
}
.dasht-mega-inner .sub-menu {
  display: block !important; position: static !important; opacity: 1 !important;
  visibility: visible !important; transform: none !important; box-shadow: none !important;
  border: none !important; background: transparent !important; padding: 0 !important;
  border-right: 1px solid var(--line-soft); padding-right: 28px; margin-right: 28px;
}
.dasht-mega-inner .sub-menu:last-child { border-right: none; padding-right: 0; margin-right: 0; }
.dasht-mega-inner .sub-menu a {
  display: flex; align-items: center; gap: 10px; padding: 8px 12px;
  border-radius: var(--r-sm); color: var(--ink-soft); font-family: var(--ff-fa);
  font-size: .88rem; text-transform: none; letter-spacing: 0; line-height: 1.8;
  transition: all .28s cubic-bezier(0.22,1,0.36,1);
}
.dasht-mega-inner .sub-menu a:hover { background: var(--bg-2); color: var(--c-primary); padding-right: 20px; }
.dasht-mega-inner > .sub-menu > .menu-item > a { font-weight: 700; color: var(--ink); }
.dasht-menu-icon { flex-shrink: 0; width: 18px; height: 18px; opacity: .6; }
.dasht-menu-icon svg { width: 100%; height: 100%; display: block; }
.dasht-menu-badge {
  font-size: .6rem; padding: 2px 8px; border-radius: var(--r-pill);
  background: var(--c-primary); color: #fff; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em; margin-right: 4px;
  animation: dashtPulse 2s cubic-bezier(0.22,1,0.36,1) infinite;
}
.dasht-menu-arrow { flex-shrink: 0; transition: transform .28s; }
.has-mega:hover > a .dasht-menu-arrow,
.has-children:hover > a .dasht-menu-arrow { transform: rotate(180deg); }

/* Dark */
html[data-theme="dark"] .dasht-mega-panel { background: var(--paper); border-color: rgba(244,239,227,.1); box-shadow: 0 24px 60px -20px rgba(0,0,0,.5); }
html[data-theme="dark"] .dasht-mega-inner .sub-menu { border-right-color: rgba(244,239,227,.08); }

/* Mobile mega — simple stacked */
@media (max-width: 768px) {
  .has-mega { position: relative !important; }
  .dasht-mega-panel { position: static !important; opacity: 1 !important; visibility: visible !important; transform: none !important; box-shadow: none !important; border: none !important; border-radius: 0 !important; }
  .dasht-mega-inner { grid-template-columns: 1fr !important; padding: 0 !important; gap: 0 !important; }
  .dasht-mega-inner .sub-menu { border-right: none !important; padding-right: 0 !important; margin-right: 0 !important; padding: 0 0 0 20px !important; }
}

/* ── AJAX COMMENTS ── */
.comments-area .dasht-comment-msg { min-height: 24px; margin: 12px 0; font-size: .85rem; }
.dasht-comment-form { margin-top: 24px; }
.dasht-comment-form textarea { width: 100%; min-height: 120px; padding: 16px; border: 1.5px solid var(--line-soft); border-radius: var(--r-md); background: var(--bg); color: var(--ink); font-family: var(--ff-fa); font-size: .92rem; resize: vertical; transition: border .28s; }
.dasht-comment-form textarea:focus { border-color: var(--c-primary); outline: none; }
.dasht-comment-form input[type="text"],
.dasht-comment-form input[type="email"],
.dasht-comment-form input[type="url"] { width: 100%; padding: 12px 16px; border: 1.5px solid var(--line-soft); border-radius: var(--r-pill); background: var(--bg); color: var(--ink); font-family: var(--ff-fa); font-size: .88rem; transition: border .28s; }
.dasht-comment-form input:focus { border-color: var(--c-primary); outline: none; }
.dasht-comment-form .form-submit { text-align: left; }
.dasht-comment-form .submit {
  display: inline-flex; align-items: center; gap: 8px; padding: 12px 28px;
  background: var(--ink); color: var(--bg); border: none; border-radius: var(--r-pill);
  font-family: var(--ff-mono); font-size: .78rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .1em; cursor: pointer; transition: all .38s cubic-bezier(0.22,1,0.36,1);
}
.dasht-comment-form .submit:hover { background: var(--c-primary); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(92,138,106,.3); }
.dasht-comment-form .submit:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.comment-list { list-style: none; padding: 0; }
.comment-list .comment { margin-bottom: 24px; }
.comment-list .comment-body { background: var(--paper); border: 1.5px solid var(--line-soft); border-radius: var(--r-md); padding: 24px; }
.comment-list .comment-author { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.comment-list .avatar { border-radius: 50%; }
.comment-list .fn { font-weight: 700; font-style: normal; }
.comment-list .comment-meta { font-family: var(--ff-mono); font-size: .7rem; color: var(--ink-mute); }
.comment-list .comment-content { margin-top: 12px; line-height: 2; color: var(--ink-soft); }
.comment-list .comment-content p { margin-bottom: 8px; }
.comment-list .reply { margin-top: 12px; }
.comment-list .reply a { font-family: var(--ff-mono); font-size: .72rem; color: var(--c-primary); text-decoration: none; }
.new-comment-anim { animation: commentSlideIn .55s cubic-bezier(0.22,1,0.36,1); }
@keyframes commentSlideIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }

/* ── PAGE TRANSITIONS ── */
.dasht-page-transition {
  position: fixed; inset: 0; z-index: 99999;
  background: var(--bg); pointer-events: none;
  transform: scaleY(0); transform-origin: bottom;
  transition: transform .55s cubic-bezier(0.76, 0, 0.24, 1);
}
.dasht-page-transition.active { transform: scaleY(1); transform-origin: top; }
.dasht-page-transition.done { transform: scaleY(0); transform-origin: top; transition-delay: .3s; }

/* ── SVG Icon helpers ── */
.dasht-a11y-row-icon svg,
.dasht-a11y-toggle svg { width: 22px; height: 22px; display: block; }
.dasht-team-social a svg { width: 16px; height: 16px; display: block; }
.dasht-ba-arrows span svg { width: 14px; height: 14px; display: block; }
.dasht-copy-btn svg { display: block; }
.dasht-bookmark-icon svg { display: block; }
.dasht-cookie-inner svg { flex-shrink: 0; }

/* ── SVG Icons: universal sizing fix ── */
.dasht-a11y-toggle svg { width: 22px; height: 22px; display: block; margin: 0 auto; }
.dasht-a11y-row svg,
.dasht-a11y-row-icon svg { width: 20px; height: 20px; display: block; }
.dasht-team-social a { display: inline-grid; place-items: center; }
.dasht-team-social a svg { width: 16px; height: 16px; display: block; }
.dasht-ba-arrows span { display: inline-grid; place-items: center; }
.dasht-ba-arrows span svg { width: 14px; height: 14px; display: block; }
.dasht-copy-btn { display: inline-grid; place-items: center; }
.dasht-copy-btn svg { width: 16px; height: 16px; display: block; }
.dasht-bookmark-icon { display: inline-grid; place-items: center; vertical-align: middle; }
.dasht-bookmark-icon svg { width: 15px; height: 15px; display: block; }
.dasht-cookie-inner svg { width: 20px; height: 20px; display: inline-block; vertical-align: middle; flex-shrink: 0; }

/* ══════════════════════════════════════════════════
   v2.8 — HEADER BUILDER + WOO AJAX + WHITE LABEL
   ══════════════════════════════════════════════════ */

/* ── MINI CART ── */
.dasht-cart-wrap { position: relative; }
.dasht-cart-toggle {
  position: relative; display: inline-flex; align-items: center;
  width: 42px; height: 42px; border-radius: 50%;
  border: 1.5px solid var(--line-soft); color: var(--ink);
  justify-content: center; text-decoration: none; transition: all .28s;
}
.dasht-cart-toggle:hover { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.dasht-cart-count {
  position: absolute; top: -4px; right: -4px;
  min-width: 18px; height: 18px; border-radius: 9px;
  background: var(--c-primary); color: #fff; font-size: .62rem;
  font-weight: 700; display: grid; place-items: center; padding: 0 4px;
}
.dasht-cart-count.pulse { animation: dashtPulse .4s ease; }
.dasht-mini-cart-dropdown {
  position: absolute; top: calc(100% + 12px); left: 0; min-width: 320px;
  background: var(--paper); border: 1.5px solid var(--line-soft);
  border-radius: var(--r-lg); box-shadow: 0 20px 50px -10px rgba(0,0,0,.2);
  z-index: 200; opacity: 0; visibility: hidden; transform: translateY(-8px);
  transition: all .32s cubic-bezier(0.22,1,0.36,1);
}
.dasht-mini-cart-dropdown.open { opacity: 1; visibility: visible; transform: translateY(0); }
.dasht-mini-cart-body { padding: 16px; max-height: 350px; overflow-y: auto; }
.dasht-mini-cart-empty { text-align: center; color: var(--ink-mute); padding: 20px; font-size: .9rem; }
.dasht-mini-cart-items { list-style: none; padding: 0; margin: 0; }
.dasht-mini-cart-item { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line-soft); }
.dasht-mini-cart-item:last-child { border: none; }
.dasht-mini-cart-item-img { width: 48px; height: 48px; border-radius: 8px; overflow: hidden; flex-shrink: 0; }
.dasht-mini-cart-item-img img { width: 100%; height: 100%; object-fit: cover; }
.dasht-mini-cart-item-info { flex: 1; min-width: 0; }
.dasht-mini-cart-item-info a { font-size: .85rem; font-weight: 600; text-decoration: none; color: var(--ink); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dasht-mini-cart-item-info span { font-size: .75rem; color: var(--ink-mute); }
.dasht-mini-cart-remove { background: none; border: none; color: var(--ink-mute); cursor: pointer; font-size: .9rem; padding: 4px; }
.dasht-mini-cart-total { padding: 12px 0; border-top: 1.5px solid var(--ink); border-bottom: 1px solid var(--line-soft); font-weight: 700; font-size: .95rem; margin-top: 8px; }
.dasht-mini-cart-actions { display: flex; gap: 8px; padding-top: 12px; }
.dasht-mini-cart-actions .btn { flex: 1; justify-content: center; }

/* ── QUICK VIEW ── */
.dasht-quick-view {
  position: absolute; top: 12px; right: 12px; z-index: 5;
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--paper); border: 1px solid var(--line-soft);
  font-size: 1rem; cursor: pointer; opacity: 0;
  transition: all .28s; display: grid; place-items: center;
}
.product:hover .dasht-quick-view { opacity: 1; }
.dasht-quick-view:hover { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.dasht-qv-overlay {
  position: fixed; inset: 0; z-index: 99998; background: rgba(0,0,0,.75);
  display: none; align-items: center; justify-content: center; padding: 30px;
}
.dasht-qv-overlay.open { display: flex; }
.dasht-qv-close {
  position: absolute; top: 20px; right: 20px; width: 42px; height: 42px;
  border-radius: 50%; background: rgba(255,255,255,.2); border: none;
  color: #fff; font-size: 1.2rem; cursor: pointer; z-index: 1;
}
.dasht-qv-content { background: var(--paper); border-radius: var(--r-xl); max-width: 900px; width: 100%; max-height: 85vh; overflow-y: auto; padding: 40px; }
.dasht-qv-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
.dasht-qv-image img { width: 100%; border-radius: var(--r-lg); }
.dasht-qv-info h2 { font-size: 1.8rem; margin-bottom: 12px; }
.dasht-qv-price { font-size: 1.4rem; font-weight: 800; color: var(--c-primary); margin-bottom: 16px; }
.dasht-qv-desc { color: var(--ink-soft); line-height: 1.9; margin-bottom: 24px; }
.dasht-qv-actions { display: flex; gap: 12px; flex-wrap: wrap; }
@media (max-width: 768px) {
  .dasht-mini-cart-dropdown { min-width: 280px; right: 0; left: auto; }
  .dasht-qv-grid { grid-template-columns: 1fr; gap: 24px; }
  .dasht-qv-content { padding: 24px; }
}

/* ── HEADER BUILDER hint ── */
@media (min-width: 769px) { .dasht-hb-hidden { display: none !important; } }

/* ── WHITE LABEL ── */
.dasht-wl-wrap { display: none; }

/* ══════════════════════════════════════════════════
   MOBILE HEADER — Full Responsiveness Fix
   No overflow on any screen size (360px+)
   ══════════════════════════════════════════════════ */

/* ── 640px and below: compact header ── */
@media (max-width: 640px) {
  .header { padding: 0 8px !important; }
  .header-inner { padding: 6px 8px 6px 12px !important; }
  .nav { gap: 10px !important; }
  .brand { gap: 8px !important; }
  .brand-name { font-size: .9rem !important; }
  .brand-mark { width: 34px !important; height: 34px !important; font-size: .85rem !important; }
  .dasht-logo { max-height: calc(28px * var(--logo-scale, 1)) !important; }
  .nav-actions { gap: 3px !important; }
  .nav-actions .nav-icon-btn,
  .nav-actions .theme-btn,
  .nav-actions .menu-btn,
  .nav-actions .dasht-user-btn,
  .nav-actions .dasht-search-trigger {
    width: 34px !important; min-width: 34px !important; max-width: 34px !important;
    height: 34px !important; min-height: 34px !important; max-height: 34px !important;
  }
  .nav-actions svg { width: 15px !important; height: 15px !important; }
  .nav-actions .dasht-user-avatar { width: 26px !important; height: 26px !important; }
  .dasht-register-btn { display: none !important; }
  .dasht-login-btn .dasht-btn-label { display: none !important; }
  .dasht-user-name { display: none !important; }
  .dasht-header-cta { display: none !important; }
  .brand-sub { display: none !important; }
  .menu-btn-bar { width: 15px !important; height: 1.6px !important; }
}

/* ── 380px and below: ultra-compact ── */
@media (max-width: 380px) {
  .header { padding: 0 4px !important; }
  .header-inner { padding: 5px 6px 5px 10px !important; border-radius: 40px !important; }
  .nav { gap: 4px !important; }
  .brand { gap: 4px !important; }
  .brand-name { font-size: .78rem !important; }
  .brand-mark { width: 28px !important; height: 28px !important; font-size: .7rem !important; }
  .dasht-logo { max-height: calc(24px * var(--logo-scale, 1)) !important; }
  .nav-actions { gap: 1px !important; }
  .nav-actions .nav-icon-btn,
  .nav-actions .theme-btn,
  .nav-actions .menu-btn,
  .nav-actions .dasht-user-btn,
  .nav-actions .dasht-search-trigger {
    width: 30px !important; min-width: 30px !important; max-width: 30px !important;
    height: 30px !important; min-height: 30px !important; max-height: 30px !important;
    border-width: 1px !important;
  }
  .nav-actions svg { width: 13px !important; height: 13px !important; }
  .nav-actions .dasht-user-avatar { width: 22px !important; height: 22px !important; }
  .menu-btn-bar { width: 13px !important; height: 1.4px !important; }
}

/* ── Ensure no horizontal overflow ── */
@media (max-width: 640px) {
  .nav-actions {
    flex-wrap: nowrap !important;
    overflow: visible !important;
  }
  .header-inner {
    overflow: visible !important;
  }
  body { overflow-x: clip !important; }
}

/* ══════════════════════════════════════════════════
   PREMIUM ANIMATIONS — CSS helpers
   ══════════════════════════════════════════════════ */

/* ── Text Reveal ── */
.dasht-text-reveal { clip-path: inset(0 100% 0 0); transition: clip-path .9s cubic-bezier(0.22,1,0.36,1); }
.dasht-text-reveal.revealed { clip-path: inset(0 0 0 0); }

/* ── Magnetic buttons (JS-driven) ── */
.btn,.btn-fill,.btn-accent,.svc-row,.nav-icon-btn,.theme-btn { transition: transform .25s cubic-bezier(0.22,1,0.36,1); will-change: transform; }

/* ── Floating shapes in hero ── */
.dasht-float-shape { z-index: 1; }

/* ── SVG Logo entrance ── */
.brand-mark { will-change: transform; }

/* ── Animated gradient background ── */
.topo-bg { overflow: hidden; }

/* ── Showcase: hover lift for all interactive cards ── */
.work-item,.dasht-filter-card,.svc-row,.price-card,.process-step,.dasht-team-card,
.dasht-single-wrap,.dasht-post-card,.dasht-related-card {
  transition: transform .45s cubic-bezier(0.22,1,0.36,1), box-shadow .45s, border-color .45s; }
.work-item:hover,.dasht-filter-card:hover,.svc-row:hover,.price-card:hover,
.process-step:hover,.dasht-team-card:hover,.dasht-single-wrap:hover,
.dasht-post-card:hover,.dasht-related-card:hover { transform: translateY(-6px); box-shadow: 0 20px 50px -15px rgba(0,0,0,.12); }

/* ── Counter animation ── */
.countup { display: inline-block; }

/* Dark mode spotlight override */
html[data-theme="dark"] .svc-row::after,html[data-theme="dark"] .price-card::after,
html[data-theme="dark"] .process-step::after,html[data-theme="dark"] .work-item::after {
  background: radial-gradient(circle 300px at var(--spot-x,50%) var(--spot-y,50%),rgba(107,168,122,.08),transparent 70%); }

/* ══════════════════════════════════════════════════
   PERFORMANCE DETECTOR — Notification Bar + Mode
   ══════════════════════════════════════════════════ */

/* ── Notification bar ── */
.dasht-perf-bar {
  position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%) translateY(120px);
  z-index: 9997; max-width: 520px; width: calc(100% - 32px);
  opacity: 0; transition: transform .50s cubic-bezier(0.22,1,0.36,1), opacity .50s; }
.dasht-perf-bar.show { transform: translateX(-50%) translateY(0); opacity: 1; }
.dasht-perf-inner {
  display: flex; align-items: flex-start; gap: 14px;
  background: var(--paper, #FFFEFA); border: 1.5px solid var(--line-soft, rgba(14,17,22,.12));
  border-radius: 16px; padding: 18px 20px;
  box-shadow: 0 16px 48px rgba(14,17,22,.14); }
.dasht-perf-icon {
  width: 44px; height: 44px; border-radius: 12px; background: var(--bg-2, #EAE5DB);
  display: grid; place-items: center; flex-shrink: 0; color: var(--c-accent, #C9B18C); }
.dasht-perf-icon svg { width: 22px; height: 22px; display: block; }
.dasht-perf-text { flex: 1; min-width: 0; }
.dasht-perf-text strong { display: block; font-size: .88rem; color: var(--ink, #0E1116); margin-bottom: 4px; }
.dasht-perf-text span { display: block; font-size: .78rem; color: var(--ink-soft, #2C3038); line-height: 1.7; }
.dasht-perf-actions { display: flex; flex-direction: column; gap: 6px; flex-shrink: 0; }
.dasht-perf-enable {
  background: var(--c-primary, #5C8A6A); color: #fff; border: none; border-radius: 10px;
  padding: 9px 16px; font-family: var(--ff-fa); font-size: .76rem; font-weight: 700;
  cursor: pointer; white-space: nowrap; transition: all .28s; }
.dasht-perf-enable:hover { opacity: .85; transform: translateY(-1px); }
.dasht-perf-dismiss {
  background: transparent; border: none; color: var(--ink-mute, #6b6f78);
  font-size: .9rem; cursor: pointer; padding: 4px; align-self: flex-end; }

/* ── Performance Mode: disable heavy animations ── */
body.dasht-perf-mode .dasht-float-shape,
body.dasht-perf-mode .topo-bg::before,
body.dasht-perf-mode .topo-bg::after,
body.dasht-perf-mode .dasht-preloader-spinner,
body.dasht-perf-mode .cursor,
body.dasht-perf-mode .cursor-dot { display: none !important; }

/* Grain noise (body::after) — hide completely in perf mode */
body.dasht-perf-mode::after { display: none !important; opacity: 0 !important; }

/* Kill all animations and transitions */
body.dasht-perf-mode *,
body.dasht-perf-mode *::before,
body.dasht-perf-mode *::after {
  animation: none !important;
  transition-duration: 0.1s !important;
}

/* Reveal all scroll-triggered elements immediately */
body.dasht-perf-mode .reveal,
body.dasht-perf-mode .dasht-text-reveal {
  opacity: 1 !important; transform: none !important; clip-path: none !important; }

/* Dark mode */
html[data-theme="dark"] .dasht-perf-inner { background: var(--paper, #12161D); border-color: rgba(244,239,227,.1); box-shadow: 0 16px 48px rgba(0,0,0,.4); }
html[data-theme="dark"] .dasht-perf-text strong { color: var(--ink, #F4EFE3); }

/* ══════════════════════════════════════════════════
   Ambient Editorial Motion System — soft replacement
   The site should feel alive, not animated.
   ══════════════════════════════════════════════════ */
:root {
  --motion-ease: cubic-bezier(.22, 1, .36, 1);
  --motion-ease-soft: cubic-bezier(.16, 1, .3, 1);
  --motion-fast: .32s;
  --motion-mid: .58s;
  --motion-slow: .82s;
}

/* Soft global theme color transitions only while toggling theme. */
html.dasht-theme-animating body,
html.dasht-theme-animating .header-inner,
html.dasht-theme-animating .ticker,
html.dasht-theme-animating .sec-head,
html.dasht-theme-animating .sec-num,
html.dasht-theme-animating .sec-meta,
html.dasht-theme-animating .hero-col-1,
html.dasht-theme-animating .hero-col-2,
html.dasht-theme-animating .hero-col-3,
html.dasht-theme-animating .svc-row,
html.dasht-theme-animating .process,
html.dasht-theme-animating .process-step,
html.dasht-theme-animating .price-card,
html.dasht-theme-animating .testimonial,
html.dasht-theme-animating .contact-left,
html.dasht-theme-animating .contact-form,
html.dasht-theme-animating .footer,
html.dasht-theme-animating .dasht-card-box,
html.dasht-theme-animating html.dasht-theme-animating input,
html.dasht-theme-animating textarea,
html.dasht-theme-animating select,
html.dasht-theme-animating a,
html.dasht-theme-animating button {
  transition-property: background-color, color, border-color, box-shadow, opacity, filter !important;
  transition-duration: .62s !important;
  transition-timing-function: var(--motion-ease) !important;
}

.dasht-theme-wipe {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  pointer-events: none;
  background:
    radial-gradient(circle at var(--x,50%) var(--y,50%), rgba(255,255,255,.08), transparent 36vmax),
    var(--wipe-bg, var(--bg));
  clip-path: circle(0 at var(--x,50%) var(--y,50%));
  will-change: clip-path, opacity;
}
.dasht-theme-wipe.is-active {
  animation: dashtThemeWipe .76s var(--motion-ease) both;
}
@keyframes dashtThemeWipe {
  0% { clip-path: circle(0 at var(--x,50%) var(--y,50%)); opacity: .96; }
  72% { clip-path: circle(150vmax at var(--x,50%) var(--y,50%)); opacity: .96; }
  100% { clip-path: circle(150vmax at var(--x,50%) var(--y,50%)); opacity: 0; }
}

/* Reveal: coordinated with motion-ui.css — only set base opacity here.
   Motion-ui.css handles transform/filter with higher specificity. */
.reveal {
  opacity: 0 !important;
  will-change: opacity, transform, filter;
}
.reveal.in {
  opacity: 1 !important;
}

/* Text reveal: no hard wipe; just a quiet editorial entrance. */
.dasht-text-reveal {
  clip-path: none !important;
  opacity: 0;
}
.dasht-text-reveal.revealed,
.reveal.in .dasht-text-reveal,
.reveal.in.dasht-text-reveal {
  opacity: 1;
}

/* Ambient background: slower and calmer. */
.topo-bg::before {
  animation: dashtAmbientTopo 46s ease-in-out infinite alternate !important;
  will-change: transform, opacity;
}
@keyframes dashtAmbientTopo {
  from { transform: translate3d(-6px, 4px, 0) scale(1); opacity: .58; }
  to   { transform: translate3d(18px, -14px, 0) scale(1.018); opacity: .72; }
}
body::after {
  animation: dashtAmbientGrain 18s steps(2) infinite !important;
  opacity: .018 !important;
}
@keyframes dashtAmbientGrain {
  0%, 100% { transform: translate3d(0,0,0); }
  50% { transform: translate3d(-1%, .8%, 0); }
}

/* Soft living cards: no dramatic jumps. */
.dasht-ambient-card,
.svc-row,
.work-item,
.price-card,
.process-step,
.dasht-card-box,
.dasht-post-card,
.dasht-related-card,
.dasht-single-box {
  transition:
    transform .56s var(--motion-ease),
    box-shadow .56s ease,
    border-color .42s ease,
    background-color .42s ease,
    color .42s ease !important;
}

.dasht-ambient-card::after,
.svc-row::after,
.price-card::after,
.process-step::after,
.work-item::after,
.dasht-card-box::after,
.dasht-post-card::after,
.dasht-related-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  border-radius: inherit;
  background: radial-gradient(circle 260px at var(--spot-x,50%) var(--spot-y,50%), rgba(92,138,106,.075), transparent 68%);
  transition: opacity .48s ease;
  z-index: 0;
}
.dasht-ambient-card:hover::after,
.svc-row:hover::after,
.price-card:hover::after,
.process-step:hover::after,
.work-item:hover::after,
.dasht-card-box:hover::after,
.dasht-post-card:hover::after,
.dasht-related-card:hover::after { opacity: 1; }

.svc-row > *,
.price-card > *,
.process-step > *,
.work-item > *,
.dasht-card-box > * > *,
.dasht-post-card > *,
.dasht-related-card > * {
  position: relative;
  z-index: 1;
}

.work-item:hover,
.price-card:hover,
.process-step:hover,
.dasht-card-box:hover,
.dasht-post-card:hover,
.dasht-related-card:hover {
  transform: translate3d(0, -4px, 0) !important;
  box-shadow: 0 18px 46px rgba(14,17,22,.075) !important;
}
.svc-row:hover {
  padding: 28px 32px !important;
  transform: translate3d(0, -3px, 0) !important;
  box-shadow: 0 16px 42px rgba(14,17,22,.075) !important;
}
.work-item:hover .work-cover {
  transform: translateZ(0) scale(1.012);
  border-radius: var(--r-xl) !important;
}
.work-cover {
  transition: transform .72s var(--motion-ease), border-radius .72s var(--motion-ease) !important;
}

/* Buttons: subtle lift + tiny magnetic translate from JS. */
.btn,
.dasht-form-submit,
.nav-icon-btn,
.theme-btn,
.dasht-floating-toggle,
.dasht-social-btn,
.dasht-cookie-accept,
.dasht-load-more {
  transition:
    transform .45s var(--motion-ease),
    box-shadow .45s ease,
    background-color .35s ease,
    color .35s ease,
    border-color .35s ease !important;
}
.btn:hover,
.dasht-form-submit:hover,
.nav-icon-btn:hover,
.theme-btn:hover,
.dasht-floating-toggle:hover,
.dasht-social-btn:hover,
.dasht-load-more:hover {
  transform: translate3d(var(--magnet-x,0), calc(var(--magnet-y,0) - 2px), 0) !important;
}
.is-soft-magnetic {
  transform: translate3d(var(--magnet-x,0), var(--magnet-y,0), 0) !important;
}

/* Header breathes after scroll. */
.header.is-scrolled-soft .header-inner,
.header.scrolled .header-inner {
  transform: translate3d(0, -1px, 0);
  box-shadow: 0 14px 38px rgba(14,17,22,.075) !important;
  transition:
    transform .55s var(--motion-ease),
    box-shadow .55s ease,
    background-color .45s ease,
    border-color .45s ease !important;
}

/* Nav underline draw — quiet and precise. */
@media (min-width: 769px) {
  .nav-links a {
    position: relative;
    background: transparent !important;
  }
  .nav-links a::after {
    content: "";
    position: absolute;
    right: 16px;
    left: 16px;
    bottom: 6px;
    height: 1px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: left;
    opacity: .55;
    transition: transform .48s var(--motion-ease), opacity .48s ease;
  }
  .nav-links a:hover::after,
  .nav-links a:focus-visible::after {
    transform: scaleX(1);
    transform-origin: right;
    opacity: .85;
  }
}

/* Media loading: invisible polish. */
.dasht-media-soft-load {
  opacity: 0;
  filter: blur(4px);
  transform: scale(1.006);
  transition: opacity .7s ease, filter .7s ease, transform .7s var(--motion-ease);
}
.dasht-media-soft-load.is-loaded {
  opacity: 1;
  filter: blur(0);
  transform: scale(1);
}

/* Kill old decorative floating shapes if any cached script inserted them. */
.dasht-float-shape { display: none !important; }

/* Bars/graphs grow softly when they appear. */
.dasht-progress-bar,
.dasht-traffic-bars-day i,
.dasht-metric {
  animation: dashtSoftRise .68s var(--motion-ease) both;
}
@keyframes dashtSoftRise {
  from { opacity: .55; transform: translate3d(0, 8px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
.dasht-traffic-bars-day i {
  transform-origin: bottom;
  animation-name: dashtSoftBarGrow;
}
@keyframes dashtSoftBarGrow {
  from { transform: scaleY(.22); opacity: .45; }
  to { transform: scaleY(1); opacity: 1; }
}

html[data-theme="dark"] .dasht-ambient-card::after,
html[data-theme="dark"] .svc-row::after,
html[data-theme="dark"] .price-card::after,
html[data-theme="dark"] .process-step::after,
html[data-theme="dark"] .work-item::after,
html[data-theme="dark"] .dasht-card-box::after,
html[data-theme="dark"] .dasht-post-card::after,
html[data-theme="dark"] .dasht-related-card::after {
  background: radial-gradient(circle 260px at var(--spot-x,50%) var(--spot-y,50%), rgba(201,177,140,.07), transparent 68%) !important;
}

@media (prefers-reduced-motion: reduce) {
  .dasht-theme-wipe { display: none !important; }
  .reveal,
  .reveal.in,
  .dasht-text-reveal,
  .dasht-text-reveal.revealed,
  .dasht-media-soft-load,
  .dasht-media-soft-load.is-loaded {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    clip-path: none !important;
  }
}

/* Ambient overlay safety: keep spotlight inside each card, never across the page. */
.dasht-ambient-card,
.svc-row,
.work-item,
.price-card,
.process-step,
.dasht-card-box,
.dasht-post-card,
.dasht-related-card,
.dasht-single-box {
  position: relative;
}
body > .dasht-progress-bar { animation: none !important; transform: none !important; }
.dasht-project-v2 .dasht-project-progress-bar,
.dasht-project-v2 .dasht-progress-bar { animation: dashtSoftRise .68s var(--motion-ease) both; }

/* Project cards must not receive ambient spotlight circles. */
.dasht-project-v2::before,
.dasht-project-v2::after,
.dasht-project-v2-chart::before,
.dasht-project-v2-chart::after,
.dasht-traffic-bars::before,
.dasht-traffic-bars::after,
.dasht-traffic-chart::before,
.dasht-traffic-chart::after {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  background: none !important;
}

/* Dashboard project section must never receive ambient/decorative circles. */
body.dasht-dashboard #section-projects *::before,
body.dasht-dashboard #section-projects *::after {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}
body.dasht-dashboard #section-projects circle,
body.dasht-dashboard #section-projects [class*="circle"],
body.dasht-dashboard #section-projects [class*="dot"] {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}


/* ══ 404 Page ══ */
.dasht-404-image{max-width:280px;margin:0 auto 28px;display:block;border-radius:24px}
.dasht-404-search{max-width:420px;margin:0 auto 24px}
.dasht-404-search .search-form{display:flex;gap:10px}
.dasht-404-search .search-field{flex:1;padding:14px 20px;border:1.5px solid var(--line-soft);border-radius:var(--r-pill);background:var(--paper);color:var(--ink);font-family:var(--ff-fa);font-size:.9rem}
.dasht-404-buttons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.dasht-404-minimal .dasht-404-title{font-size:clamp(4rem,12vw,10rem);opacity:.15}

/* ══ Generic Archive ══ */
.dasht-archive-page{padding-top:80px;padding-bottom:80px}
.dasht-archive-title{font-size:clamp(2rem,5vw,4rem);margin-bottom:40px}
.dasht-archive-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px}
.dasht-archive-card{background:var(--paper);border:1.5px solid var(--line-soft);border-radius:20px;overflow:hidden;transition:all .3s}
.dasht-archive-card:hover{border-color:var(--primary);box-shadow:0 8px 28px rgba(0,0,0,.06)}
.dasht-archive-thumb img{width:100%;height:auto;display:block}
.dasht-archive-card-body{padding:24px}
.dasht-archive-date{font-family:var(--ff-mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:var(--ink-mute);margin-bottom:8px}
.dasht-archive-card-title{font-size:1.2rem;margin-bottom:10px}
.dasht-archive-card-title a{color:var(--ink);text-decoration:none}
.dasht-archive-card-title a:hover{color:var(--primary)}
.dasht-archive-excerpt{color:var(--ink-mute);font-size:.9rem}
.dasht-archive-pagination{margin-top:40px}
.dasht-archive-empty{text-align:center;padding:60px 20px;color:var(--ink-mute);font-size:1rem}

/* ══ Comments ══ */
.dasht-comments{margin-top:60px}
.dasht-comments-title{font-size:1.5rem;margin-bottom:24px}
.dasht-comment-list{list-style:none;padding:0}

/* ══ Bookmark button full-width ══ */
.dasht-bookmark-btn-full{margin-top:8px;width:100%;justify-content:center}

/* ══════════════════════════════════════════════════
   v3.0.45 — Visual bug fixes: mobile off-canvas + cookie dark mode
   AUTHORITATIVE mobile nav — single source of truth for drawer positioning.
   Structure mirrors the dashboard sidebar off-canvas pattern.
   ══════════════════════════════════════════════════ */

/* ── Prevent body from scrolling behind the open drawer ── */
@media (max-width: 768px) {

  /* ══════════════════════════════════════════════════
     آفکنوس منو موبایل — طراحی زیبا با جزئیات
     ══════════════════════════════════════════════════ */

  /* ── body وقتی منو باز است ── */
  body.dasht-menu-open {
    overflow: hidden !important;
    overscroll-behavior: contain;
  }
  body.dasht-menu-open .header.header-hidden {
    transform: none !important;
  }
  /* Same guarantee while the SEARCH modal is open */
  body.dasht-search-open .header.header-hidden {
    transform: none !important;
  }

  /* ── Overlay ── */
  #dashtNavOverlay.nav-overlay,
  .nav-overlay {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 9990 !important;
    background: rgba(0, 0, 0, .45) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    /* transform حذف شد: backdrop-filter + transform sticky را می‌شکند */
    transition: opacity .35s cubic-bezier(0.22, 1, 0.36, 1) !important;
  }
  body.dasht-menu-open #dashtNavOverlay.nav-overlay,
  #dashtNavOverlay.nav-overlay.open,
  .nav-overlay.open {
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  /* ══ OFF-CANVAS DRAWER ══ */
  #navLinks.nav-links,
  .nav-links {
    display: flex !important;
    position: fixed !important;
    top: 10px !important;
    right: 10px !important;
    left: auto !important;
    bottom: 10px !important;
    width: min(320px, calc(100vw - 20px)) !important;
    max-width: calc(100vw - 20px) !important;
    height: auto !important;
    max-height: calc(100dvh - 20px) !important;
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
    border-radius: 24px !important;
    background: var(--paper) !important;
    border: 1.5px solid var(--line-soft) !important;
    z-index: 9991 !important;
    box-shadow: none !important;
    scrollbar-width: none !important;

    /* CLOSED */
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translate3d(calc(100% + 20px), 0, 0) scale(.97) !important;
    transition: transform .42s cubic-bezier(.22, 1, .36, 1),
                opacity .30s ease,
                visibility .30s ease,
                box-shadow .42s ease !important;
    will-change: transform, opacity !important;
    float: none !important;
    clear: none !important;
    margin: 0 !important;
  }
  #navLinks.nav-links::-webkit-scrollbar { display: none !important; }

  /* Dark mode drawer */
  html[data-theme="dark"] #navLinks.nav-links,
  html[data-theme="dark"] .nav-links {
    background: #12161D !important;
    border-color: rgba(244,239,227,.1) !important;
    box-shadow: none !important;
  }

  /* ── OPEN state ── */
  body.dasht-menu-open #navLinks.nav-links,
  #navLinks.nav-links.open,
  .nav-links.open {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translate3d(0, 0, 0) scale(1) !important;
    box-shadow: -28px 0 60px rgba(0, 0, 0, .28),
                0 20px 60px rgba(0, 0, 0, .15) !important;
  }
  
  /* Fix header visibility when menu is open */
  body.dasht-menu-open .header {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }
  
  html[data-theme="dark"] .nav-links.open {
    box-shadow: -28px 0 60px rgba(0, 0, 0, .6),
                0 20px 60px rgba(0, 0, 0, .4) !important;
  }

  /* ── Header داخل drawer (شامل brand logo) ── */
  .nav-links::before {
    content: '' !important;
    display: block !important;
    height: 64px !important;
    flex-shrink: 0 !important;
    /* خط جداکننده کامل از لبه تا لبه — مثل بقیه آیتم‌ها */
    border-bottom: 1px solid var(--line-soft) !important;
    position: relative !important;
  }

  html[data-theme="dark"] .nav-links::before {
    border-bottom-color: rgba(244,239,227,.08) !important;
  }

  /* ── Close button ── */
  .nav-close-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: absolute !important;
    left: 14px !important;
    top: 14px !important;
    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    border: 1.5px solid var(--line-soft) !important;
    background: var(--bg-2) !important;
    color: var(--ink) !important;
    cursor: pointer !important;
    font-size: 1rem !important;
    line-height: 1 !important;
    z-index: 20 !important;
    transition: all .22s ease !important;
  }
  .nav-close-btn:hover {
    background: var(--ink) !important;
    color: var(--bg) !important;
    border-color: var(--ink) !important;
    transform: rotate(90deg) !important;
  }
  html[data-theme="dark"] .nav-close-btn {
    background: rgba(244,239,227,.08) !important;
    border-color: rgba(244,239,227,.15) !important;
    color: rgba(244,239,227,.8) !important;
  }
  html[data-theme="dark"] .nav-close-btn:hover {
    background: rgba(244,239,227,.18) !important;
    color: #F4EFE3 !important;
    border-color: rgba(244,239,227,.35) !important;
  }

  /* ── Nav items ── */
  .nav-links > li {
    list-style: none !important;
    border-bottom: 1px solid var(--line-soft) !important;
    position: relative !important;
  }
  .nav-links > li:last-child {
    border-bottom: none !important;
  }

  /* Indicator نارنجی برای active item */
  .nav-links > li.current-menu-item > a,
  .nav-links > li.current-page-ancestor > a {
    color: var(--c-primary) !important;
    background: rgba(92,138,106,.07) !important;
  }
  .nav-links > li.current-menu-item::before {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 3px !important;
    height: 60% !important;
    background: var(--c-primary) !important;
    border-radius: 0 3px 3px 0 !important;
  }

  .nav-links a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    padding: 16px 22px !important;
    font-size: .9rem !important;
    font-weight: 600 !important;
    color: var(--ink-soft) !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    transition: background .2s ease, color .2s ease, padding-right .2s ease !important;
  }
  .nav-links > li > a {
    font-weight: 700 !important;
    font-size: .92rem !important;
  }
  .nav-links a:hover,
  .nav-links a:focus {
    background: var(--bg-2) !important;
    color: var(--ink) !important;
    padding-right: 30px !important;
  }

  /* Arrow برای آیتم‌های دارای زیرمنو */
  .nav-links > li.menu-item-has-children > a::after {
    content: '' !important;
    display: inline-block !important;
    width: 8px !important;
    height: 8px !important;
    border-right: 2px solid currentColor !important;
    border-bottom: 2px solid currentColor !important;
    transform: rotate(45deg) !important;
    flex-shrink: 0 !important;
    transition: transform .25s ease !important;
    opacity: .5 !important;
  }

  /* Sub-menus */
  .nav-links .sub-menu {
    display: block !important;
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
    background: transparent !important;
    padding: 0 0 8px 18px !important;
    border-top: none !important;
  }
  .nav-links .sub-menu li {
    border-bottom: none !important;
  }
  .nav-links .sub-menu a {
    padding: 10px 22px !important;
    font-size: .84rem !important;
    font-weight: 500 !important;
    color: var(--ink-mute) !important;
  }
  .nav-links .sub-menu a:hover {
    color: var(--c-primary) !important;
    background: rgba(92,138,106,.06) !important;
    padding-right: 28px !important;
  }

  /* Dark mode items */
  html[data-theme="dark"] .nav-links > li {
    border-bottom-color: rgba(244,239,227,.08) !important;
  }
  html[data-theme="dark"] .nav-links > li.current-menu-item > a {
    background: rgba(92,138,106,.12) !important;
  }
  html[data-theme="dark"] .nav-links a {
    color: rgba(244,239,227,.72) !important;
  }
  html[data-theme="dark"] .nav-links > li > a {
    color: rgba(244,239,227,.85) !important;
  }
  html[data-theme="dark"] .nav-links a:hover,
  html[data-theme="dark"] .nav-links a:focus {
    background: rgba(244,239,227,.06) !important;
    color: #F4EFE3 !important;
  }
  html[data-theme="dark"] .nav-links .sub-menu a {
    color: rgba(244,239,227,.45) !important;
  }
  html[data-theme="dark"] .nav-links .sub-menu a:hover {
    color: var(--c-primary) !important;
    background: rgba(92,138,106,.1) !important;
  }

}

/* ══════════════════════════════════════════════════
   NAV DRAWER HEADER — brand داخل آفکنوس موبایل
   ══════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .nav-drawer-header {
    position: absolute !important;
    top: 0 !important;
    left: 60px !important;
    right: 14px !important;
    height: 64px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 4px !important;
    overflow: hidden !important;
    pointer-events: none !important;
    /* border-bottom روی ::before است تا کامل از لبه تا لبه باشد */
    z-index: 15 !important;
  }

  .nav-drawer-header img {
    max-height: 34px !important;
    max-width: 110px !important;
    object-fit: contain !important;
    opacity: .88 !important;
    pointer-events: auto !important;
  }

  .nav-drawer-brand-name {
    font-size: .92rem !important;
    font-weight: 800 !important;
    color: var(--ink) !important;
    letter-spacing: -.02em !important;
    pointer-events: auto !important;
  }

  /* brand-mark داخل drawer */
  .nav-drawer-header .brand-mark {
    width: 36px !important;
    height: 36px !important;
    border-radius: 10px !important;
    font-size: 1rem !important;
    pointer-events: auto !important;
  }

  /* dark mode برای ::before در بالاست */
  html[data-theme="dark"] .nav-drawer-brand-name {
    color: #F4EFE3 !important;
  }
}

html[data-theme="dark"] #dashtCookieBanner.dasht-cookie-banner {
  background: #12161D !important;
  color: #F4EFE3 !important;
  border-top: 1px solid rgba(244, 239, 227, .12) !important;
  box-shadow: 0 -12px 42px rgba(0, 0, 0, .45) !important;
}
html[data-theme="dark"] #dashtCookieBanner .dasht-cookie-text,
html[data-theme="dark"] #dashtCookieBanner .dasht-cookie-text p {
  color: #D8D2C2 !important;
}
html[data-theme="dark"] #dashtCookieBanner .dasht-cookie-decline {
  background: rgba(244, 239, 227, .08) !important;
  color: #F4EFE3 !important;
  border: 1px solid rgba(244, 239, 227, .12) !important;
}

/* ══════════════════════════════════════════════════
   v3.0.46 — Mobile header + dashboard + floating item fixes
   ══════════════════════════════════════════════════ */
@media (max-width: 900px) {
  .header { padding-inline: 10px !important; }
  .header-inner { max-width: calc(100vw - 20px) !important; padding: 6px 8px 6px 12px !important; overflow: visible !important; }
  .nav { gap: 8px !important; min-width: 0 !important; }
  .brand { min-width: 0 !important; flex: 1 1 auto !important; overflow: hidden !important; }
  .brand > div:not(.brand-mark) { min-width: 0 !important; overflow: hidden !important; }
  .brand-name { max-width: 34vw !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
  .brand-sub { max-width: 34vw !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
  .nav-actions { flex: 0 0 auto !important; gap: 4px !important; min-width: 0 !important; }
  .menu-btn { display: inline-flex !important; flex-shrink: 0 !important; }
  .dasht-header-cta,
  .dasht-register-btn,
  .dasht-login-btn .dasht-btn-label,
  .dasht-user-name { display: none !important; }
  .nav-actions .nav-icon-btn,
  .nav-actions .theme-btn,
  .nav-actions .menu-btn,
  .nav-actions .dasht-user-btn,
  .nav-actions .dasht-search-trigger {
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}
@media (max-width: 420px) {
  .brand-name { max-width: 28vw !important; font-size: .86rem !important; }
  .brand-sub { display: none !important; }
  .brand-mark { width: 32px !important; height: 32px !important; }
  .dasht-logo { max-width: 112px !important; }
  .nav-actions { gap: 2px !important; }
  .nav-actions .nav-icon-btn,
  .nav-actions .theme-btn,
  .nav-actions .menu-btn,
  .nav-actions .dasht-user-btn,
  .nav-actions .dasht-search-trigger {
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;
  }
}

.dasht-floating-actions.pos-left .dasht-floating-item { transform: translateX(-10px); }
.dasht-floating-actions.is-open .dasht-floating-item { transform: translateX(0) !important; }
.dasht-floating-item { max-width: calc(100vw - 34px); }
.dasht-floating-label { overflow: hidden; text-overflow: ellipsis; }

/* v3.0.47 — dashboard fatal guards + mobile profile avatar alignment */
.dasht-dashboard-svg,
.dasht-dashboard-svg svg { width: 20px; height: 20px; display: inline-grid; place-items: center; vertical-align: middle; }
@media (max-width: 900px) {
  .nav-actions .dasht-user-btn {
    padding: 0 !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    line-height: 1 !important;
  }
  .nav-actions .dasht-user-avatar {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    margin: 0 !important;
    display: grid !important;
    place-items: center !important;
    background-size: cover !important;
    background-position: center center !important;
    border-radius: 50% !important;
  }
  .nav-actions .dasht-user-btn > svg,
  .nav-actions .dasht-user-btn .dasht-user-name { display: none !important; }
}
@media (max-width: 380px) {
  .nav-actions .dasht-user-avatar {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
  }
}

/* ══════════════════════════════════════════════════
   END OF FILE
   ══════════════════════════════════════════════════ */

/* ════════════════════════════════════════════════════
   v3.4.8 — Header must stay visible while search modal
   or any nav panel is open (all viewports)
   ════════════════════════════════════════════════════ */
body.dasht-search-open .header.header-hidden,
body.dasht-menu-open .header.header-hidden {
  transform: none !important;
}


/* v3.5.12 — Floating quick action mobile centering (authoritative)
   Root cause: later global floating-toggle text rules with !important kept
   the hidden text in flex flow on mobile and the gap pushed the SVG off-center. */
@media (max-width: 640px) {
  .dasht-floating-actions .dasht-floating-toggle {
    width: 50px !important;
    min-width: 50px !important;
    height: 50px !important;
    padding: 0 !important;
    gap: 0 !important;
    display: inline-grid !important;
    place-items: center !important;
    border-radius: 50% !important;
  }
  .dasht-floating-actions .dasht-floating-toggle-text {
    display: none !important;
    width: 0 !important;
    max-width: 0 !important;
    opacity: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    visibility: hidden !important;
  }
  .dasht-floating-actions .dasht-floating-toggle-icon {
    grid-area: 1 / 1 !important;
    display: grid !important;
    place-items: center !important;
    width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
    transform: none !important;
  }
  .dasht-floating-actions .dasht-floating-toggle-icon svg {
    display: block !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
  }
  .dasht-floating-actions.is-open .dasht-floating-toggle-icon.is-open { display: none !important; }
  .dasht-floating-actions:not(.is-open) .dasht-floating-toggle-icon.is-close { display: none !important; }
}


/* v3.6.4 — Phase 15: UI consistency / design-system aliases
   Final lightweight harmonization layer. It does not redesign components;
   it normalizes radius, focus, transitions, badges, cards and form states. */
:root {
  --ds-radius-card: var(--r-lg, 20px);
  --ds-radius-control: 14px;
  --ds-radius-pill: 999px;
  --ds-border: 1.5px solid var(--line-soft);
  --ds-focus: 0 0 0 3px rgba(92,138,106,.16);
  --ds-shadow-soft: 0 16px 42px rgba(14,17,22,.07);
  --ds-transition: .28s cubic-bezier(.22,1,.36,1);
}

.btn,
.dasht-form-submit,
.dasht-auth-submit,
.dasht-comment-submit,
.dasht-load-more,
.dsa-submit,
.dpw-submit,
.dpw-next,
.dpw-prev {
  border-radius: var(--ds-radius-pill) !important;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--ff-fa) !important;
  font-weight: 800;
  text-decoration: none !important;
  transition: transform var(--ds-transition), box-shadow var(--ds-transition), background-color var(--ds-transition), color var(--ds-transition), border-color var(--ds-transition) !important;
  touch-action: manipulation;
}

.btn:focus-visible,
.dasht-form-submit:focus-visible,
.dasht-auth-submit:focus-visible,
.dasht-comment-submit:focus-visible,
.dasht-load-more:focus-visible,
.dsa-submit:focus-visible,
.dpw-submit:focus-visible,
.dpw-next:focus-visible,
.dpw-prev:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
a:focus-visible {
  outline: 0 !important;
  box-shadow: var(--ds-focus) !important;
}

.dasht-card-box,
.dasht-post-card,
.dasht-related-card,
.price-card,
.dasht-project-v2,
.dasht-tkt-detail,
.dasht-newsletter-box,
.dasht-review-form,
.dasht-case-study .dcs-story section,
.dasht-seo-report,
.dsa-result,
.dpw-estimate {
  border-radius: var(--ds-radius-card) !important;
  border-color: var(--line-soft) !important;
}

.dasht-badge,
.dasht-section-chip,
.dasht-order-status,
.dsr-growth,
.dasht-task-count,
.dasht-traffic-legend span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-radius: var(--ds-radius-pill) !important;
  line-height: 1.45;
  font-family: var(--ff-fa) !important;
  font-weight: 800;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.dasht-form-group input,
.dasht-form-group textarea,
.dasht-form-group select,
.floating-field input,
.floating-field select,
.floating-field textarea,
.dpw-contact input,
.dpw-contact textarea,
.dsa-fields input {
  border-radius: var(--ds-radius-control);
  transition: border-color var(--ds-transition), background-color var(--ds-transition), box-shadow var(--ds-transition), color var(--ds-transition) !important;
}

.dasht-inline-status,
.dasht-form-error,
.dasht-form-success,
.dasht-dashboard-note,
.dasht-dashboard-helper,
.dasht-project-v2-note,
.dasht-project-v2-error,
.dsa-error,
.dpw-error,
.dpw-success {
  border-radius: 14px !important;
  line-height: 1.8;
}

.dasht-empty-state,
.dasht-empty-state-compact {
  border-radius: var(--ds-radius-card);
}

@media (max-width: 640px) {
  .btn,
  .dasht-form-submit,
  .dasht-auth-submit,
  .dsa-submit,
  .dpw-submit,
  .dpw-next,
  .dpw-prev {
    min-height: 46px;
  }
}


/* v3.6.6 — Brand-based dark-mode hover colors
   Primary = green, Secondary = beige. Avoid pure white hover fills in dark mode. */
html[data-theme="dark"] .btn:not(.btn-fill):not(.btn-accent):hover,
html[data-theme="dark"] .dasht-form-submit:hover,
html[data-theme="dark"] .dasht-load-more:hover,
html[data-theme="dark"] .dasht-comment-submit:hover {
  background: var(--c-primary) !important;
  color: #fff !important;
  border-color: var(--c-primary) !important;
  box-shadow: 0 12px 30px rgba(92,138,106,.26) !important;
}
html[data-theme="dark"] .btn-accent:hover,
html[data-theme="dark"] .dasht-floating-toggle:hover,
html[data-theme="dark"] .auth-theme-btn:hover {
  background: var(--c-accent) !important;
  color: #0E1116 !important;
  border-color: var(--c-accent) !important;
  box-shadow: 0 12px 30px rgba(201,177,140,.24) !important;
}
html[data-theme="dark"] a:hover:not(.btn):not(.dasht-form-submit):not(.dasht-floating-item) {
  color: var(--c-accent);
}
