#ser-design .ser-phone-field{display:grid;gap:9px;min-width:0;align-content:start}
#ser-design .ser-phone-caption{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:20px}
#ser-design .ser-phone-caption label{font:inherit;font-size:12px;line-height:1.4;color:var(--ser-muted);margin:0}
#ser-design .ser-phone-caption .ser-phone-mode{
 all:unset;cursor:pointer;color:var(--ser-accent);font:inherit;font-size:11px;line-height:1.5;
 text-decoration:underline;text-underline-offset:3px;white-space:nowrap;
}
#ser-design .ser-phone-mode:focus-visible{outline:2px solid var(--ser-accent);outline-offset:3px;border-radius:3px}
#ser-design .ser-phone-control{display:flex;align-items:stretch;min-width:0;background:var(--ser-field);border:1px solid var(--ser-line-strong);border-radius:10px}
#ser-design .ser-phone-control:focus-within{outline:2px solid var(--ser-accent);outline-offset:2px}
#ser-design .ser-phone-field[data-invalid="true"] .ser-phone-control{border-color:var(--ser-warning)}
#ser-design .ser-phone-country{position:relative;display:flex;align-items:center;flex:0 0 108px;min-width:0;border-right:1px solid var(--ser-line);margin:8px 0}
#ser-design .ser-phone-country[hidden]{display:none}
#ser-design .ser-phone-prefix{display:flex;align-items:center;gap:6px;padding:0 12px;white-space:nowrap;color:var(--ser-ink);font:inherit;font-size:12px;font-variant-numeric:tabular-nums;pointer-events:none}
#ser-design .ser-phone-prefix::after{content:'';width:5px;height:5px;flex:none;margin-left:3px;border-right:1px solid var(--ser-muted);border-bottom:1px solid var(--ser-muted);transform:translateY(-2px) rotate(45deg)}
html #ser-design[data-active-view] .ser-form .ser-phone-field .ser-phone-country > select{
 position:absolute;inset:0;box-sizing:border-box;width:100%;height:100%;min-height:0;max-width:100%;padding:0;margin:0;
 opacity:0;cursor:pointer;border:0;border-radius:0;font:inherit;appearance:auto;
}
html #ser-design[data-active-view] .ser-form .ser-phone-field .ser-phone-control > input{
 box-sizing:border-box;width:100%;min-width:0;flex:1;margin:0;border:0;background:transparent;
 padding:12px 14px;border-radius:10px;outline:none;box-shadow:none;min-height:46px;color:var(--ser-ink);
 font:inherit;font-size:15px;line-height:1.4;font-variant-numeric:tabular-nums;
}
#ser-design .ser-phone-error{margin:0;font:inherit;font-size:11px;line-height:1.4;color:var(--ser-warning)}
#ser-design .ser-phone-error[hidden]{display:none}
#ser-design .ser-form .ser-contact-select{position:relative;display:block;min-width:0;width:100%}
#ser-design .ser-form .ser-contact-select::after{
 content:'';position:absolute;inset-inline-end:18px;top:50%;box-sizing:border-box;
 width:7px;height:7px;border-right:1.5px solid var(--ser-muted);border-bottom:1.5px solid var(--ser-muted);
 transform:translateY(-70%) rotate(45deg);pointer-events:none;
}
html #ser-design[data-active-view] .ser-form .ser-contact-select > select{
 box-sizing:border-box;display:block;width:100%;min-width:0;margin:0;
 padding-inline-end:44px;appearance:none;-webkit-appearance:none;cursor:pointer;
}
@media(max-width:420px){
 #ser-design .ser-phone-country{flex-basis:98px}
 #ser-design .ser-phone-prefix{padding-inline:9px;font-size:11px;gap:4px}
 html #ser-design[data-active-view] .ser-form .ser-phone-field .ser-phone-control > input{padding-inline:10px;font-size:16px}
}
@media(forced-colors:active){
 #ser-design .ser-phone-control{border:1px solid CanvasText}
 #ser-design .ser-phone-control:focus-within{outline:2px solid Highlight}
 #ser-design .ser-phone-prefix{color:CanvasText}
 #ser-design .ser-form .ser-contact-select::after{display:none}
 html #ser-design[data-active-view] .ser-form .ser-contact-select > select{appearance:auto;-webkit-appearance:auto}
}
