/* Domain Search Input Component */

.domain-search {
  max-width: 600px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.search-container {
  display: flex;
  background-color: var(--md-sys-color-background);
  border-radius: var(--md-sys-shape-corner-small);
  overflow: hidden;
  box-shadow: var(--md-sys-elevation-level3);
  margin-bottom: 1.5rem;
}

.domain-input {
  flex: 1;
  padding: 1.25rem 1.5rem;
  border: none;
  font-family: var(--md-sys-typescale-body-large-font-family);
  font-size: var(--md-sys-typescale-body-large-font-size);
  outline: none;
}

/* Task #165 (L4): mouse click 時 outline は非表示で OK だが、 keyboard focus 時の
   focus indicator が無いと a11y NG。 :focus-visible で keyboard navigation のみ ring 表示。 */
.domain-input:focus-visible {
  outline: 3px solid var(--btn-primary-bg, #156eb0);
  outline-offset: -3px;
}

/* Responsive */
@media (max-width: 768px) {
  .search-container {
    flex-direction: column;
  }
}