/* V84.49 — public-page visual cleanup based on live screenshots.
   هدف الملف: علاج مشاكل الترتيب العامة في الصفحات العامة،
   خصوصاً زر إضافة المشروع، الفراغات الكبيرة، وترتيب البطاقات والفلاتر على الجوال. */

/* ------------------------------------------------------------------
   Home page: force a compact vertical rhythm to eliminate stray gaps.
   ------------------------------------------------------------------ */
body.sayyarati-home-v8448-body .sayyarati-home-v8448{
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
}
body.sayyarati-home-v8448-body .sayyarati-home-v8448 > *{
  margin:0!important;
}
body.sayyarati-home-v8448-body .home-v8440-wallet-shell,
body.sayyarati-home-v8448-body .home-v8440-services,
body.sayyarati-home-v8448-body .home-v8440-vehicles,
body.sayyarati-home-v8448-body .home-v8440-ad-slider{
  min-height:0!important;
  height:auto!important;
}
body.sayyarati-home-v8448-body .home-v8440-services::before,
body.sayyarati-home-v8448-body .home-v8440-services::after,
body.sayyarati-home-v8448-body .home-v8440-vehicles::before,
body.sayyarati-home-v8448-body .home-v8440-vehicles::after{
  display:none!important;
  content:none!important;
}

/* ------------------------------------------------------------------
   Shared create-project button: ensure it is always styled and anchored.
   ------------------------------------------------------------------ */
main.page,
main.external-directory-page,
.commerce-directory-v74,
.lifestyle-v77{
  position:relative!important;
}

/* Default placement for pages where the button is a direct child of <main>. */
main.page > .section-context-add-v8419,
main.external-directory-page > .section-context-add-v8419{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  transform:none!important;
  display:inline-flex!important;
  margin:0 0 14px auto!important;
}

/* Header/hero surfaces that include the button internally. */
.commerce-directory-v74__header,
.lifestyle-v77__hero,
.external-nav-hero,
.page-hero,
.clean-directory-hero{
  position:relative!important;
}
.commerce-directory-v74__header > .section-context-add-v8419,
.lifestyle-v77__hero > .section-context-add-v8419{
  position:absolute!important;
  top:18px!important;
  left:18px!important;
  transform:none!important;
  z-index:5!important;
}

/* ------------------------------------------------------------------
   General public-page cards and spacing.
   ------------------------------------------------------------------ */
main.page,
main.external-directory-page,
.commerce-directory-v74,
.lifestyle-v77{
  padding-bottom:122px!important;
}

.page-hero,
.clean-directory-hero,
.external-nav-hero,
.external-directory-filters,
.external-directory-head,
.governorate-filter,
.support-activity-cta,
.professional-empty,
.compact-empty-section{
  border-radius:24px!important;
}

/* Sonar/external directory cleanup. */
.external-directory-page{
  display:flex!important;
  flex-direction:column!important;
  gap:14px!important;
}
.external-directory-page > *{margin:0!important}
.external-directory-filters form{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
}
.external-directory-filters button{min-height:48px!important}

/* Generic professional/service sections. */
main.page > .page-hero,
main.page > .clean-directory-hero{
  margin-top:0!important;
}
main.page > .grid.cards-3,
main.page > .directory-grid-clean{
  margin-top:14px!important;
}

/* ------------------------------------------------------------------
   Responsive mobile fixes.
   ------------------------------------------------------------------ */
@media(max-width:760px){
  body.sayyarati-home-v8448-body .sayyarati-home-v8448{gap:14px!important}

  .commerce-directory-v74,
  .lifestyle-v77,
  main.page,
  main.external-directory-page{
    padding-bottom:112px!important;
  }

  /* On mobile the create button should never overlap content. */
  .commerce-directory-v74__header > .section-context-add-v8419,
  .lifestyle-v77__hero > .section-context-add-v8419,
  main.page > .section-context-add-v8419,
  main.external-directory-page > .section-context-add-v8419{
    position:static!important;
    top:auto!important;
    left:auto!important;
    transform:none!important;
    width:max-content!important;
    max-width:100%!important;
    margin:0 0 10px auto!important;
  }

  .commerce-directory-v74__header,
  .lifestyle-v77__hero,
  .external-nav-hero,
  .page-hero,
  .clean-directory-hero,
  .external-directory-filters,
  .external-directory-head,
  .governorate-filter,
  .support-activity-cta,
  .professional-empty,
  .compact-empty-section{
    border-radius:20px!important;
  }

  .commerce-directory-v74__header{
    padding-top:16px!important;
  }

  .lifestyle-v77__hero{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:12px!important;
    padding:18px!important;
  }
  .lifestyle-v77__hero-copy{width:100%!important}
  .lifestyle-v77__hero h1{margin:4px 0 0!important}
  .lifestyle-v77__hero-icon{align-self:flex-end!important}

  .external-directory-filters form{
    grid-template-columns:1fr!important;
  }
  .external-directory-head{
    display:grid!important;
    gap:10px!important;
  }
  .external-directory-head .external-location-sort{
    width:100%!important;
    min-height:44px!important;
  }

  main.page > .grid.cards-3,
  main.page > .directory-grid-clean,
  .commerce-directory-v74__grid,
  .lifestyle-v77__grid,
  .external-location-list{
    gap:12px!important;
  }
}

@media(max-width:430px){
  .commerce-directory-v74__header,
  .lifestyle-v77__hero,
  .external-nav-hero,
  .page-hero,
  .clean-directory-hero,
  .external-directory-filters,
  .external-directory-head,
  .governorate-filter,
  .support-activity-cta,
  .professional-empty,
  .compact-empty-section{
    border-radius:18px!important;
  }

  .section-context-add-v8419{
    min-height:36px!important;
    padding:7px 10px!important;
    font-size:11px!important;
    border-radius:11px!important;
  }
  .section-context-add-v8419 svg{width:17px!important;height:17px!important}
}
