/* ================================
   Container
================================ */
.container{
  max-width:100%;
  margin:auto;
  padding:0 20px;
  width:100%;
  box-sizing:border-box;
}

/* ================================
   Header
================================ */
.site-header{
  position:sticky;
  top:0;
  z-index:999;
  background:var(--color-surface);
  border-bottom:1px solid var(--color-border);
}

/* Header Layout */
.header-inner{
  height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

/* ================================
   Logo
================================ */
.logo img{
  height:42px;
  display:block;
}

/* ================================
   Clean Button Group (No Glass)
================================ */
.header-actions{
  display:flex;
  align-items:center;
  gap:0;
  border:1px solid var(--color-primary);
  border-radius:8px;        /* گردی کم */
  overflow:hidden;
  background:var(--color-surface);
}

/* Buttons */
.header-btn{
  height:44px;
  padding:0 18px;
  background:var(--color-surface);
  color:var(--color-primary);
  font-size:14px;
  border:none;
  display:flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  cursor:pointer;
  position:relative;
  transition:0.2s;
}

/* dividers */
.header-btn:not(:first-child)::before{
  content:"";
  position:absolute;
  right:0;
  top:8px;
  bottom:8px;
  width:1px;
  background:var(--color-primary);
  opacity:0.35;
}

/* hover */
.header-btn:hover{
  background:var(--color-primary);
  color:var(--color-primary-contrast) !important;
}

/* Submit Ad = main button */
.submit-ad{
  background:var(--color-primary);
  color:var(--color-primary-contrast) !important;
  font-weight:500;
}

.submit-ad:hover{
  background:#0c6f71;
}

/* remove divider left of the submit button */
.submit-ad::before{
  display:none;
}

/* Search icon color */
/* submit icon fix */
.submit-ad svg circle,
.submit-ad svg line{
  stroke:var(--color-primary-contrast);
}

/* ================================
   Search Box
================================ */
.search-container{
  position:fixed;
  top:78px;
  left:0;
  right:0;
  z-index:998;
  max-height:0;
  opacity:0;
  overflow:hidden;
  transform:translateY(-14px) scale(0.985);
  transform-origin:top center;
  filter:blur(6px);
  transition:max-height 0.38s ease, opacity 0.28s ease, border-color 0.25s ease, transform 0.38s cubic-bezier(.22,1,.36,1), filter 0.28s ease, box-shadow 0.28s ease;
  background:var(--color-surface);
  border-bottom:1px solid transparent;
  pointer-events:none;
}

.search-container.active{
  max-height:70vh;
  opacity:1;
  border-bottom:1px solid var(--color-border);
  pointer-events:auto;
  overflow:visible;
  transform:translateY(0) scale(1);
  filter:blur(0);
  box-shadow:0 16px 34px rgba(15, 23, 42, 0.12);
}

/* Shared Search Stack (normal + combo) */
.search-stack{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.plain-search-form{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:12px;
  align-items:center;
}

.plain-search-input{
  width:100%;
  min-height:44px;
  box-sizing:border-box;
  border:1px solid var(--color-border);
  border-radius:8px;
  background:var(--color-surface-alt);
  padding:11px 12px;
  font-size:14px;
  color:var(--color-text);
  outline:none;
}

.plain-search-input:focus{
  border-color:var(--color-primary);
  box-shadow:0 0 0 2px rgba(13, 131, 133, 0.14);
}

.plain-search-submit{
  min-height:44px;
  border:none;
  border-radius:8px;
  background:var(--color-primary);
  color:var(--color-primary-contrast);
  padding:0 14px;
  font-size:14px;
  font-weight:600;
  display:inline-flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  white-space:nowrap;
}

.plain-search-submit:hover{
  background:#0c6f71;
}

.search-stack-divider{
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--color-muted);
  font-size:12px;
}

.search-stack-divider::before,
.search-stack-divider::after{
  content:"";
  flex:1;
  height:1px;
  background:var(--color-border);
}

.search-stack-divider span{
  padding:0 8px;
}

/* Combo Search Form */
.combo-search-form{
  margin:0 0 16px;
}

.combo-search-fields{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr) auto;
  gap:12px;
  align-items:center;
}

.combo-search-fields > *{
  min-width:0;
}

.combo-search-field{
  display:block;
  position:relative;
}

.combo-search-input{
  width:100%;
  box-sizing:border-box;
  border:1px solid var(--color-border);
  background:var(--color-surface-alt);
  border-radius:8px;
  padding:12px 12px;
  outline:none;
  color:var(--color-text);
  font-size:14px;
  transition:border-color 0.2s ease, box-shadow 0.2s ease;
}

.combo-suggest-box{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  right:0;
  z-index:35;
  max-height:320px;
  overflow:auto;
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:12px;
  box-shadow:0 14px 30px rgba(15, 23, 42, 0.18);
  display:none;
  scrollbar-width:thin;
  scrollbar-color:rgba(13,131,133,.45) transparent;
}

.combo-suggest-box.is-open{
  display:block;
}

.combo-suggest-box::-webkit-scrollbar{
  width:8px;
}

.combo-suggest-box::-webkit-scrollbar-thumb{
  background:rgba(13,131,133,.38);
  border-radius:999px;
}

.combo-suggest-box::-webkit-scrollbar-track{
  background:transparent;
}

.combo-suggest-item{
  display:block;
  width:100%;
  border:none;
  border-bottom:1px solid var(--color-border);
  background:transparent;
  color:var(--color-text);
  text-align:right;
  padding:10px 12px;
  font-size:14px;
  cursor:pointer;
}

.combo-suggest-item:last-child{
  border-bottom:none;
}

.combo-suggest-item:hover{
  background:var(--color-surface-alt);
}

.combo-search-input:focus{
  border-color:var(--color-primary);
  box-shadow:0 0 0 2px rgba(13, 131, 133, 0.14);
}

.combo-search-submit{
  border:none;
  border-radius:8px;
  background:var(--color-primary);
  color:var(--color-primary-contrast);
  height:44px;
  padding:0 18px;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  white-space:nowrap;
}

.combo-search-submit:hover{
  background:#0c6f71;
}

.theme-toggle .icon-sun{
  display:none;
}

html[data-theme='dark'] .theme-toggle .icon-moon{
  display:none;
}

html[data-theme='dark'] .theme-toggle .icon-sun{
  display:block;
}

/* ================================
   Responsive
================================ */
@media(max-width:768px){

  body{
    --iranpeida-search-offset:0px;
  }

  body.search-open .site-content{
    padding-top:calc(var(--iranpeida-search-offset) + 12px);
    transition:padding-top 0.34s cubic-bezier(.22,1,.36,1);
  }

  .header-inner{
    height:70px;
  }

  .logo img{
    height:34px;
  }

  .header-btn{
    height:40px;
    padding:0 12px;
    font-size:13px;
  }

  .search-container.active{
    max-height:80vh;
    z-index:1001;
    box-shadow:0 18px 38px rgba(15, 23, 42, 0.16);
  }

  .search-container{
    top:70px;
  }

  .search-container > .container{
    padding-top:10px;
    padding-bottom:12px;
  }

  .plain-search-form{
    grid-template-columns:minmax(0, 1fr);
    gap:8px;
  }

  .plain-search-submit{
    width:100%;
    justify-content:center;
    min-height:42px;
  }

  .plain-search-input{
    font-size:16px;
    min-height:42px;
  }

  .combo-search-fields{
    grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
    gap:8px;
    padding-bottom:8px;
  }

  .combo-search-submit{
    width:100%;
    grid-column:1 / -1;
    height:42px;
  }

  .combo-suggest-box{
    max-height:340px;
  }

  /* Prevent iOS Safari auto-zoom on focus */
  .combo-search-input{
    font-size:16px;
  }
}

@media(max-width:480px){
  body.search-open .site-content{
    padding-top:calc(var(--iranpeida-search-offset) + 14px);
  }

  .search-container{
    transform:translateY(-12px) scale(0.99);
  }

  .search-container > .container{
    padding-top:8px;
    padding-bottom:10px;
    padding-left:12px;
    padding-right:12px;
  }

  .combo-suggest-box{
    max-height:300px;
    border-radius:10px;
  }
}