/**
 * Dev SI.KHAN — SCOPED overrides.
 * This file is enqueued LAST so it wins the cascade regardless of plugin CSS.
 * Every selector is high-specificity + attribute-scoped so it only touches
 * the exact elements the theme owns. Nothing here is global.
 */

/* ==========================================================
   Header CTA — the "Hire on Fiverr" pill in nav
   ========================================================== */
html body a.ds-nav-cta[data-ds-cta="1"],
html body a.nav-cta[data-ds-cta="1"]{
  padding:10px 18px !important;
  border-radius:10px !important;
  background:linear-gradient(135deg,#22d3ee,#3b82f6) !important;
  color:#03121e !important;
  font-weight:600 !important;
  font-size:14px !important;
  text-decoration:none !important;
  border:1px solid transparent !important;
  display:inline-block !important;
  transition:transform .25s ease, background .25s ease, color .25s ease, box-shadow .25s ease, border-color .25s ease !important;
}
html body a.ds-nav-cta[data-ds-cta="1"]:hover,
html body a.ds-nav-cta[data-ds-cta="1"]:focus,
html body a.nav-cta[data-ds-cta="1"]:hover,
html body a.nav-cta[data-ds-cta="1"]:focus{
  transform:translateY(-2px) !important;
  background:linear-gradient(135deg,#0a1224,#111d38) !important;
  color:#ffffff !important;
  border-color:#22d3ee !important;
  box-shadow:0 8px 24px rgba(34,211,238,.35) !important;
}
html body a.ds-nav-cta[data-ds-cta="1"]:hover *,
html body a.ds-nav-cta[data-ds-cta="1"]:focus *{
  color:#ffffff !important;
}

/* ==========================================================
   Social icons — scoped to [data-ds-social] rows only
   ========================================================== */
html body .ds-socials.ds-socials--wrap{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  list-style:none !important;
  padding:0 !important;
  margin:0 !important;
}
html body a.ds-socials__btn[data-ds-social],
html body a.ds-social-btn[data-ds-social]{
  box-sizing:border-box !important;
  width:36px !important;
  height:36px !important;
  min-width:36px !important;
  max-width:36px !important;
  min-height:36px !important;
  max-height:36px !important;
  flex:0 0 36px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:10px !important;
  background:linear-gradient(135deg,#111d38,#0a1224) !important;
  border:1px solid rgba(34,211,238,.28) !important;
  color:#22d3ee !important;
  text-decoration:none !important;
  padding:0 !important;
  margin:0 !important;
  line-height:1 !important;
  position:relative !important;
  overflow:hidden !important;
  transition:transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease !important;
  box-shadow:0 4px 12px rgba(0,0,0,.35), inset 0 0 0 1px rgba(34,211,238,.06) !important;
}
html body a.ds-socials__btn[data-ds-social]:hover,
html body a.ds-social-btn[data-ds-social]:hover{
  transform:translateY(-2px) !important;
  background:linear-gradient(135deg,#22d3ee,#3b82f6) !important;
  color:#03121e !important;
  border-color:transparent !important;
  box-shadow:0 10px 24px rgba(34,211,238,.4) !important;
}
html body a.ds-socials__btn[data-ds-social] .ds-socials__ic,
html body a.ds-social-btn[data-ds-social] .ds-social-ic{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:16px !important;
  height:16px !important;
  color:inherit !important;
  line-height:1 !important;
}
html body a.ds-socials__btn[data-ds-social] svg,
html body a.ds-social-btn[data-ds-social] svg{
  width:16px !important;
  height:16px !important;
  max-width:16px !important;
  max-height:16px !important;
  min-width:16px !important;
  min-height:16px !important;
  display:block !important;
  fill:currentColor;
}