/* forms.css - 検索フォームなどフォーム系コンポーネント */
/* Guide Search (投稿検索フォーム) */
.guide-search-box { 
    margin: 24px auto 32px;
    padding: 32px 24px;
    max-width: 1120px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 10px #0000000d;
    margin-left: auto;
    margin-right: auto;
    }

.guide-search-form {
     display:flex; align-items:center;
     gap:8px; 
     /* background:#fff;  */
     /* border:1px solid #D1D5DB;  */
     /* padding:10px;  */
     /* box-shadow:0 1px 3px rgba(0,0,0,0.05);  */
     /* transition:border-color .2s ease;  */
    }

.guide-search-input {
     flex:1 1 auto; 
     min-width:0; 
     border: 1px solid #D1D5DB !important; 
     outline:none; 
     background:transparent; 
     font-size:20px; 
     line-height:1.5; 
     padding:10px 12px; 
     color:#6d6d6d; 
     border-radius:8px;
    }

.guide-search-input:focus-within {
     border-color:#050505 !important; 
    }

.guide-search-input::placeholder {
     color:#9CA3AF; 
    }

.guide-search-button {
     display:inline-flex; 
     align-items:center; 
     justify-content:center; 
     border:none; outline:none; 
     cursor:pointer; 
     padding:18px 24px; 
     border-radius:8px; 
     color:#fff; 
     background:#FF8A00; 
     font-weight:500; 
     font-size:14px; 
     transition:background .2s ease; }

.guide-search-button:hover { background:#FF6D00; }

.guide-search-button:disabled {
  background: #D1D5DB;
  cursor: not-allowed;
  opacity: 0.6;
}
.guide-search-button:disabled:hover { background: #D1D5DB; }
.guide-search-button i { font-size:16px; }
.guide-search-button-text { display:none; }

/* 検索ワードサジェスト */
.guide-search-suggestions { margin-top: 16px; }
.search-suggestions-title { font-size: 13px; font-weight: 600; color: #6B7280; margin-bottom: 10px; }
.search-suggestions-list { display: flex; flex-wrap: wrap; gap: 8px; }
.search-suggestion-tag { display: inline-block; padding: 6px 12px; background: #F3F4F6; border: 1px solid #D1D5DB; border-radius: 6px; color: #374151; font-size: 13px; cursor: pointer; transition: all .2s ease; text-decoration: none; }
.search-suggestion-tag:hover { background: #E5E7EB; border-color: #9CA3AF; }

@media (max-width:834px){
     .guide-search-form{ 
        gap:6px;
     } 
     .guide-search-input{ 
        font-size:14px;
     }
    .guide-search-button {
     padding:14px 24px; 
    }
}

@media (max-width:480px){
     .guide-search-form{
         flex-wrap:wrap;
          padding:8px;
         }
     .guide-search-input{
         flex:1 1 100%;
         width:100%;
         padding:10px;
         background:#fff; 
         border:1px solid #D1D5DB; 
         border-radius:6px; 
        }
     .guide-search-button{ 
        width:100%; 
        justify-content:center; 
        margin-top:6px; 
        padding:10px; 
    } 
}