/* Phase 9: screen layout of the form, buttons and preview bar. Nothing here styles the contract pages (.paper)
   or applies to printing, so the 3-page layout, the font sizes and the auto-fit are unchanged. */
@media screen{
  .btn{white-space:nowrap;transition:background .15s,border-color .15s}
  .btn:not(.primary):not(.gold):not(:disabled):hover{border-color:#aeb6b0;background:var(--soft)}
  .btn:focus-visible,.tab:focus-visible,.suggest-chip:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
  .tab{border-radius:6px 6px 0 0}
  .tab:not(.active):hover{color:var(--ink);background:var(--soft)}
  .archive-toolbar{align-items:stretch}
  #archiveStatus:empty{min-height:0;padding:0}
  .field label .required{margin-left:2px}
}
/* Computer: all 7 tabs visible (two rows if needed) instead of a hidden horizontal scroll */
@media screen and (min-width:981px){
  .tabs{flex-wrap:wrap;overflow:visible;row-gap:2px}
  .tab{padding:9px 11px}
}
/* Phone and tablet: shorter fixed bars, more room for the form */
@media screen and (max-width:980px){
  .form-head{padding:16px 16px 10px}
  .form-head h1{font-size:1.15rem}
  .archive-toolbar{padding:10px 16px 0;gap:6px}
  .archive-toolbar .btn{padding:10px 12px}
  #archiveStatus{padding:6px 16px;font-size:13px}
  .tab{padding:12px 11px}
  /* bottom action bar: one row instead of two */
  .actions{flex-wrap:nowrap;gap:6px;padding:8px 10px calc(8px + env(safe-area-inset-bottom))}
  .actions .btn{flex:1 1 auto;min-width:0;min-height:44px;padding:8px 6px;font-size:.78rem;overflow:hidden;text-overflow:ellipsis}
  /* preview: one slim bar above the pages */
  .mobile-actions{padding:8px 10px;gap:6px}
  .mobile-actions .btn{min-height:42px;padding:8px 4px;font-size:.82rem;min-width:0}
  .notice{padding:8px 16px 14px}
}
/* Phase 9 fix: own drop-down list for İl / İlçe / Mahalle (the browser list does not open on tap on Android) */
.has-pick{position:relative}
.has-pick input{scroll-margin-top:118px}
.pick{position:absolute;left:0;right:0;z-index:8;max-height:min(270px,42vh);overflow:auto;overscroll-behavior:contain;background:#fff;border:1px solid #cbd1cc;border-radius:8px;box-shadow:0 12px 30px #17201b2e}
.pick[hidden]{display:none}
.pick-item{padding:12px;border-bottom:1px solid #eef0ee;cursor:pointer;font-size:.92rem;line-height:1.3}
.pick-item:last-child{border-bottom:0}
.pick-item:hover,.pick-item.active{background:#f3efe4}
.pick-more{padding:10px 12px;font-size:.78rem;color:var(--muted);background:var(--soft)}
@media print{.pick{display:none!important}}