/* =========================================================
   EVI.AZ — PUBLIC UI REFRESH 8.0
   Mobile-first, lightweight and native-feeling override layer.
   Loaded after base + page CSS.
   2026-09-27
========================================================= */

:root{
  --evi-brand:#009e8e;
  --evi-brand-dark:#087f75;
  --evi-brand-soft:#eaf8f6;
  --evi-danger:#ee4138;
  --evi-bg:#f6f7f8;
  --evi-surface:#ffffff;
  --evi-surface-2:#f1f3f4;
  --evi-text:#161b1f;
  --evi-muted:#737d84;
  --evi-line:#e8ebed;
  --evi-radius-xs:10px;
  --evi-radius-sm:13px;
  --evi-radius:16px;
  --evi-radius-lg:20px;
  --evi-shadow-xs:0 1px 2px rgba(16,24,32,.035);
  --evi-shadow-sm:0 5px 18px rgba(16,24,32,.055);
  --evi-shadow:0 10px 30px rgba(16,24,32,.07);
  --evi-safe-bottom:max(12px,env(safe-area-inset-bottom));
}

html{
  min-height:100%;
  height:auto;
  overflow-x:hidden;
  overflow-y:auto;
  background:var(--evi-bg);
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
}

body{
  margin:0;
  min-height:100%;
  height:auto;
  overflow-x:hidden;
  overflow-y:visible;
  background:var(--evi-bg) !important;
  color:var(--evi-text);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  overscroll-behavior-y:auto;
  -webkit-overflow-scrolling:touch;
}

body main{
  min-height:calc(100dvh - var(--header-height));
}

body a,
body button,
body input,
body select,
body textarea{
  -webkit-tap-highlight-color:transparent;
}

body button,
body a{
  touch-action:manipulation;
}

body img{
  max-width:100%;
}

body .container,
body .containerhome,
body .site-header-container,
body #eviStickySearchBar .evi-sticky-shell{
  width:min(100%,1180px);
}

body .containerhome{
  margin-inline:auto;
  padding-inline:14px;
}

/* ---------------------------------------------------------
   HEADER
--------------------------------------------------------- */
body .site-header-main{
  background:rgba(255,255,255,.92) !important;
  border-bottom:1px solid rgba(19,31,37,.07) !important;
  box-shadow:none !important;
  backdrop-filter:blur(20px) saturate(150%);
  -webkit-backdrop-filter:blur(20px) saturate(150%);
}

body .site-header-container{
  gap:8px;
}

body .site-header-logo{
  color:var(--evi-brand) !important;
  font-size:22px;
  font-weight:900;
  letter-spacing:-.7px;
}

body .header-icon-button,
body .header-action-button{
  border:1px solid transparent !important;
  background:#f2f4f4 !important;
  color:#475158 !important;
  box-shadow:none !important;
}

body .header-icon-button:hover,
body .header-action-button:hover{
  border-color:rgba(0,158,142,.12) !important;
  background:var(--evi-brand-soft) !important;
  color:var(--evi-brand) !important;
}

body .header-login-button,
body .header-profile-button{
  border:1px solid var(--evi-line) !important;
  background:#fff !important;
  color:#414a50 !important;
  box-shadow:none !important;
}

body .header-add-button{
  border:0 !important;
  border-radius:12px !important;
  background:var(--evi-brand) !important;
  box-shadow:0 5px 14px rgba(0,158,142,.18) !important;
}

body .header-add-button:hover{
  background:var(--evi-brand-dark) !important;
}

/* sticky search */
body #eviStickySearchBar.evi-sticky-search-bar{
  background:rgba(255,255,255,.94) !important;
  border-bottom:1px solid rgba(19,31,37,.07) !important;
  box-shadow:0 6px 18px rgba(16,24,32,.05) !important;
  backdrop-filter:blur(20px) saturate(150%);
  -webkit-backdrop-filter:blur(20px) saturate(150%);
}

body #eviStickySearchBar .evi-sticky-icon-button{
  border:1px solid transparent !important;
  background:#f2f4f4 !important;
  color:#465158 !important;
  box-shadow:none !important;
}

body #eviStickySearchBar .evi-sticky-catalog-button{
  background:var(--evi-brand-soft) !important;
  color:var(--evi-brand-dark) !important;
}

body #eviStickySearchBar .evi-sticky-add-button{
  background:var(--evi-brand) !important;
  color:#fff !important;
}

body #eviStickySearchBar .evi-sticky-search-box{
  border:1px solid #e1e6e7 !important;
  border-radius:14px !important;
  background:#f4f6f6 !important;
  box-shadow:none !important;
}

body #eviStickySearchBar .evi-sticky-search-box:focus-within{
  border-color:rgba(0,158,142,.48) !important;
  background:#fff !important;
  box-shadow:0 0 0 3px rgba(0,158,142,.08) !important;
}

/* drawer / native sheet feeling */
body .evi-header-nav-overlay,
body .notification-drawer-overlay,
body .listing-cat-drawer::before{
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
}

body .evi-header-nav,
body .notification-drawer,
body .filter-drawer,
body .field-sheet,
body .phone-sheet{
  background:#fff;
  box-shadow:0 20px 60px rgba(12,22,28,.16);
}

body .evi-header-nav-link{
  border-radius:14px !important;
}

body .evi-header-nav-link:hover,
body .evi-header-nav-link:active{
  background:#f3faf9 !important;
}

/* ---------------------------------------------------------
   GLOBAL CARDS / FORMS
--------------------------------------------------------- */
body main .card,
body main .form-card{
  border:1px solid rgba(19,31,37,.06) !important;
  border-radius:var(--evi-radius) !important;
  background:var(--evi-surface) !important;
  box-shadow:var(--evi-shadow-xs) !important;
}

body main .form-control,
body main .form-select,
body main input[type="text"],
body main input[type="search"],
body main input[type="number"],
body main input[type="tel"],
body main input[type="email"],
body main textarea,
body main select{
  min-height:46px;
  border:1px solid #dfe4e6;
  border-radius:13px;
  background:#fff;
  color:var(--evi-text);
  box-shadow:none;
}

body main .form-control:focus,
body main .form-select:focus,
body main input:focus,
body main textarea:focus,
body main select:focus{
  border-color:rgba(0,158,142,.58) !important;
  box-shadow:0 0 0 3px rgba(0,158,142,.09) !important;
  outline:0;
}

body main .btn-brand,
body main .add-submit-button,
body main .mobile-filter-submit{
  border-color:var(--evi-brand) !important;
  background:var(--evi-brand) !important;
  color:#fff !important;
  box-shadow:none !important;
}

body main .btn-brand:hover,
body main .add-submit-button:hover,
body main .mobile-filter-submit:hover{
  border-color:var(--evi-brand-dark) !important;
  background:var(--evi-brand-dark) !important;
}

body main .btn,
body main button{
  transition:transform .14s ease,background-color .14s ease,border-color .14s ease,opacity .14s ease;
}

body main button:active,
body main .btn:active{
  transform:scale(.985);
}

/* ---------------------------------------------------------
   HOME
--------------------------------------------------------- */
body .containerhome > h2{
  margin:20px 0 11px !important;
  color:#1b2226;
  font-size:19px !important;
  line-height:1.2;
  font-weight:850 !important;
  letter-spacing:-.35px;
}

body .home-list-grid{
  gap:13px !important;
}

body .modern-home-card{
  border:0 !important;
  border-radius:15px !important;
  background:#fff !important;
  box-shadow:0 2px 10px rgba(18,26,31,.055) !important;
  transform:translateZ(0);
}

body .modern-home-card:hover{
  transform:translateY(-1px) !important;
  box-shadow:0 7px 20px rgba(18,26,31,.075) !important;
}

body .modern-home-card-image{
  height:auto !important;
  aspect-ratio:4/3;
  background:#eef1f2 !important;
}

body .modern-home-card-body{
  padding:10px 10px 11px !important;
}

body .modern-card-price{
  color:#13191d !important;
  font-size:16px !important;
  font-weight:850 !important;
}

body .modern-card-title{
  margin-top:5px !important;
  color:#384148 !important;
  font-size:12.5px !important;
  font-weight:600 !important;
}

body .modern-card-meta{
  border-top:0 !important;
  margin-top:7px !important;
  padding-top:0 !important;
  color:#91999e !important;
}

body .modern-service-badge{
  border:1px solid rgba(255,255,255,.72) !important;
  border-radius:9px !important;
  background:rgba(255,255,255,.82) !important;
  box-shadow:0 3px 10px rgba(12,20,24,.11) !important;
}

body .modern-home-card .modern-card-fav{
  border:0 !important;
  border-radius:50% !important;
  background:rgba(21,27,31,.36) !important;
  box-shadow:none !important;
}

body .modern-home-card .modern-card-fav.active{
  background:rgba(255,255,255,.94) !important;
}

body .daily-deal-home-section{
  margin:18px 0 22px !important;
  padding:14px 0 14px !important;
  border:0 !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:var(--evi-shadow-xs) !important;
}

body .daily-deal-home-header h2{
  font-size:19px !important;
}

body .daily-deal-home-count{
  background:#fff1ed !important;
}

body .discounted-home-section{
  margin-top:22px !important;
}

body .discounted-home-title{
  font-size:18px !important;
}

body .discounted-home-title-icon{
  border-radius:10px !important;
  background:var(--evi-brand-soft) !important;
}

/* category cards */
body .category-modern-card{
  border:0 !important;
  border-radius:16px !important;
  background:#fff !important;
  box-shadow:0 2px 10px rgba(18,26,31,.05) !important;
}

body .category-modern-card:hover{
  transform:translateY(-1px) !important;
  box-shadow:0 6px 18px rgba(18,26,31,.07) !important;
}

body .category-modern-image-wrap{
  background:#f3f5f5 !important;
}

body .category-modern-title{
  color:#30393e !important;
  font-weight:700 !important;
}

/* featured stores */
body .home-featured-stores,
body .featured-stores-section{
  border-radius:18px !important;
}

body .store-card,
body .favorite-store-card{
  border:1px solid rgba(19,31,37,.055) !important;
  border-radius:17px !important;
  background:#fff !important;
  box-shadow:0 3px 14px rgba(18,26,31,.055) !important;
}

/* ---------------------------------------------------------
   LISTING COLLECTION
--------------------------------------------------------- */
body .mobile-search-box-modern{
  min-height:48px !important;
  border:1px solid #e0e5e6 !important;
  border-radius:15px !important;
  background:#fff !important;
  box-shadow:0 2px 10px rgba(18,26,31,.04) !important;
}

body .mobile-search-box-modern:focus-within{
  border-color:rgba(0,158,142,.42) !important;
  box-shadow:0 0 0 3px rgba(0,158,142,.075) !important;
}

body .mobile-search-submit,
body .mobile-search-filter{
  border-radius:11px !important;
}

body .listing-category-shell,
body .listing-discount-note,
body .listing-filter-card{
  border-color:rgba(19,31,37,.06) !important;
  border-radius:17px !important;
  background:#fff !important;
  box-shadow:var(--evi-shadow-xs) !important;
}

body .filter-drawer{
  border-top-left-radius:22px;
  border-top-right-radius:22px;
}

body .filter-footer{
  padding-bottom:calc(12px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

/* ---------------------------------------------------------
   PROFILE / FAVORITES / HELP / STORE
--------------------------------------------------------- */
body .profile-flutter-page,
body .favorites-page,
body .help-page{
  background:var(--evi-bg) !important;
}

body .profile-user-card,
body .profile-section,
body .profile-quick,
body .pf-premium-card,
body .pf-invite-card,
body .favorites-panel{
  border:1px solid rgba(19,31,37,.055) !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 2px 10px rgba(18,26,31,.045) !important;
}

body .profile-quick-icon,
body .profile-chip{
  border-radius:12px !important;
}

body .favorites-tabs{
  border:0 !important;
  border-radius:14px !important;
  background:#eaeeef !important;
  padding:3px !important;
}

body .favorites-tab{
  border-radius:11px !important;
}

body .favorites-tab.active{
  background:#fff !important;
  box-shadow:0 2px 8px rgba(18,26,31,.07) !important;
}

/* ---------------------------------------------------------
   ADD / EDIT / DETAIL
--------------------------------------------------------- */
body .add-listing-page{
  background:var(--evi-bg) !important;
}

body .add-listing-card,
body .add-submit-card,
body .add-seo-info-card{
  border:1px solid rgba(19,31,37,.055) !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 2px 10px rgba(18,26,31,.045) !important;
}

body .add-upload-dropzone{
  border-style:dashed !important;
  border-color:#d6dedf !important;
  border-radius:16px !important;
  background:#f8fafa !important;
}

body .listing-detail-modern .card,
body .listing-detail-modern .listing-detail-card,
body .listing-detail-modern .seller-card{
  border-color:rgba(19,31,37,.055) !important;
  box-shadow:0 2px 10px rgba(18,26,31,.045) !important;
}

/* ---------------------------------------------------------
   BOOTSTRAP MODALS -> native sheet on mobile
--------------------------------------------------------- */
body .modal-content{
  border:0 !important;
  border-radius:20px !important;
  box-shadow:0 24px 70px rgba(12,22,28,.20) !important;
}

body .modal-header{
  border-bottom:1px solid var(--evi-line) !important;
}

body .modal-footer{
  border-top:1px solid var(--evi-line) !important;
}

/* ---------------------------------------------------------
   FOOTER
--------------------------------------------------------- */
body .evi-footer{
  margin-top:34px !important;
  border-top:1px solid var(--evi-line) !important;
  background:#fff !important;
}

body .evi-footer-store-button{
  border:1px solid var(--evi-line) !important;
  border-radius:14px !important;
  box-shadow:none !important;
}

/* ---------------------------------------------------------
   MOBILE NAV
--------------------------------------------------------- */
@media(max-width:991.98px){
  body:has(#eviMobileBottomNav){
    padding-bottom:calc(68px + env(safe-area-inset-bottom)) !important;
  }

  body #eviMobileBottomNav{
    left:10px !important;
    right:10px !important;
    bottom:max(7px,env(safe-area-inset-bottom)) !important;
  }

  body #eviMobileBottomNav .nav-wrap{
    min-height:62px !important;
    border:1px solid rgba(255,255,255,.80) !important;
    border-radius:20px !important;
    background:rgba(255,255,255,.88) !important;
    box-shadow:0 8px 28px rgba(16,24,32,.12) !important;
    backdrop-filter:blur(24px) saturate(155%) !important;
    -webkit-backdrop-filter:blur(24px) saturate(155%) !important;
  }

  body #eviMobileBottomNav .nav-item{
    border-radius:14px !important;
  }

  body #eviMobileBottomNav .nav-center{
    width:44px !important;
    height:44px !important;
    border:0 !important;
    border-radius:14px !important;
    background:var(--evi-brand) !important;
    box-shadow:0 7px 18px rgba(0,158,142,.26) !important;
  }
}

/* ---------------------------------------------------------
   PHONE
--------------------------------------------------------- */
@media(max-width:767.98px){
  :root{
    --header-height:54px;
  }

  body{
    padding-top:var(--header-height) !important;
  }

  body.has-app-banner{
    padding-top:calc(var(--header-height) + var(--app-banner-height)) !important;
  }

  body .site-header-main{
    height:var(--header-height) !important;
  }

  body .site-header-container{
    padding-inline:10px !important;
  }

  body .site-header-logo{
    font-size:20px !important;
  }

  body .header-icon-button{
    width:36px !important;
    height:36px !important;
    border-radius:12px !important;
    font-size:16px !important;
  }

  body .container,
  body .containerhome{
    max-width:100%;
    padding-left:12px !important;
    padding-right:12px !important;
  }

  body .containerhome{
    padding-top:10px !important;
  }

  body .containerhome > h2{
    margin-top:18px !important;
    margin-bottom:10px !important;
    font-size:18px !important;
  }

  body .home-list-grid{
    gap:8px !important;
  }

  body .modern-home-card{
    border-radius:14px !important;
  }

  body .modern-home-card-image{
    aspect-ratio:1.24/1;
  }

  body .modern-home-card-body{
    padding:8px 8px 9px !important;
  }

  body .modern-card-price{
    font-size:14px !important;
  }

  body .modern-card-title{
    height:32px !important;
    font-size:11.5px !important;
    line-height:1.38 !important;
  }

  body .modern-card-meta{
    font-size:8.4px !important;
  }

  body .daily-deal-home-section{
    width:calc(100% + 24px);
    margin-left:-12px !important;
    margin-right:-12px !important;
    border-radius:0 !important;
    box-shadow:none !important;
  }

  body .discounted-home-scroll,
  body .daily-deal-scroll{
    scroll-padding-left:12px;
  }

  body .category-modern-card{
    border-radius:14px !important;
    box-shadow:0 1px 7px rgba(18,26,31,.045) !important;
  }

  body main .card,
  body main .form-card{
    border-radius:16px !important;
  }

  body .modal-dialog{
    margin:0 !important;
    min-height:100dvh;
    display:flex;
    align-items:flex-end;
  }

  body .modal-content{
    width:100%;
    max-height:92dvh;
    border-radius:22px 22px 0 0 !important;
  }

  body .evi-footer{
    margin-top:24px !important;
    padding-bottom:calc(78px + env(safe-area-inset-bottom)) !important;
  }

  body .evi-footer-main,
  body .evi-footer-links-grid{
    gap:22px !important;
  }
}

@media(max-width:390px){
  body .container,
  body .containerhome{
    padding-left:10px !important;
    padding-right:10px !important;
  }

  body .home-list-grid{
    gap:7px !important;
  }

  body .modern-home-card-image{
    aspect-ratio:1.18/1;
  }
}

/* Accessibility */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}
