/* Phone input с выбором страны — единый компонент для всех лендингов Микрюкова */
.phone-input{
  display:flex;
  align-items:stretch;
  width:100%;
  border-radius:12px;
  overflow:visible;
  position:relative;
  background:var(--panel, #1B1F26);
  border:1.5px solid var(--line, rgba(214,168,79,.18));
  transition:border-color .15s;
}
.phone-input.is-focus{ border-color:var(--gold, #D6A84F); background:var(--panel-2, #242932); }
.phone-input.is-invalid{ border-color:#ff7676; }

.phone-input__country{
  display:flex;
  align-items:center;
  gap:6px;
  padding:0 14px 0 16px;
  background:transparent;
  border:0;
  border-right:1px solid var(--line, rgba(214,168,79,.18));
  color:var(--ink, #F8F8F6);
  font-family:inherit;
  font-size:16px;
  font-weight:500;
  cursor:pointer;
  min-height:52px;
  transition:background .15s;
  white-space:nowrap;
  -webkit-tap-highlight-color:transparent;
}
.phone-input__country:hover{ background:rgba(214,168,79,.06); }
.phone-input__country:focus-visible{ outline:none; background:rgba(214,168,79,.10); }
.phone-input__flag{ font-size:20px; line-height:1; }
.phone-input__code{ font-weight:600; letter-spacing:.3px; color:var(--ink, #F8F8F6); }
.phone-input__caret{
  width:8px; height:8px;
  border-right:1.5px solid var(--ink-3, #a8adb5);
  border-bottom:1.5px solid var(--ink-3, #a8adb5);
  transform:rotate(45deg);
  margin-top:-3px; margin-left:2px;
  transition:transform .15s;
}
.phone-input.is-open .phone-input__caret{ transform:rotate(-135deg); margin-top:2px; }

.phone-input__number{
  flex:1;
  min-width:0;
  padding:16px 18px !important;
  background:transparent !important;
  border:0 !important;
  color:var(--ink, #F8F8F6);
  font-family:inherit;
  font-size:16px !important;
  outline:none !important;
  letter-spacing:.3px;
}
.phone-input__number::placeholder{ color:var(--ink-3, #a8adb5); font-weight:400; }

/* Dropdown */
.phone-input__dropdown{
  position:absolute;
  top:calc(100% + 6px);
  left:0; right:0;
  background:#1B1F26;
  border:1.5px solid var(--gold, #D6A84F);
  border-radius:12px;
  box-shadow:0 20px 60px rgba(0,0,0,.6);
  z-index:9999;
  overflow:hidden;
  max-height:340px;
  display:flex;
  flex-direction:column;
  animation:pi-open .18s ease-out;
}
@keyframes pi-open{ from{opacity:0;transform:translateY(-4px)} to{opacity:1;transform:none} }

.phone-input__search-wrap{
  padding:10px 12px;
  border-bottom:1px solid rgba(214,168,79,.15);
  background:#242932;
}
.phone-input__search{
  width:100%;
  padding:10px 14px;
  border-radius:8px;
  background:#1B1F26;
  border:1px solid rgba(214,168,79,.2);
  color:#F8F8F6;
  font-family:inherit;
  font-size:15px;
  outline:none;
}
.phone-input__search:focus{ border-color:#D6A84F; }
.phone-input__search::placeholder{ color:#a8adb5; }

.phone-input__list{
  overflow-y:auto;
  padding:6px 0;
  -webkit-overflow-scrolling:touch;
}
.phone-input__item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 16px;
  cursor:pointer;
  font-size:15px;
  color:#F8F8F6;
  transition:background .1s;
  border:0;
  background:transparent;
  width:100%;
  text-align:left;
  font-family:inherit;
}
.phone-input__item:hover,
.phone-input__item.is-hilite{ background:rgba(214,168,79,.10); }
.phone-input__item.is-current{ background:rgba(214,168,79,.18); }
.phone-input__item-flag{ font-size:20px; line-height:1; flex:0 0 20px; }
.phone-input__item-name{ flex:1; }
.phone-input__item-code{ color:#a8adb5; font-weight:500; letter-spacing:.3px; }
.phone-input__list-empty{ padding:20px 16px; text-align:center; color:#a8adb5; font-size:14px; }

/* Mobile: dropdown fullwidth bottom sheet on very small screens */
@media (max-width:400px){
  .phone-input__country{ padding:0 10px 0 12px; font-size:15px; min-height:48px; }
  .phone-input__number{ padding:14px 14px !important; }
}
