@layer design-system.components{.vds-phone-input{--phone-input-country-width:5.5rem;--phone-input-dial-gap:var(--vds-space-1-5,.375rem);--phone-input-country-separator-color:var(--vds-color-border,#e5e7eb);--phone-input-flag-size:1.125rem;--phone-input-dial-font-weight:var(--vds-font-weight-medium,500);--phone-input-country-bg-hover:var(--vds-color-surface-hover,#f9fafb);--phone-input-country-padding-inline:var(--vds-space-2-5,.625rem);--phone-input-country-gap:var(--vds-space-1-5,.375rem);--phone-input-value-gap:var(--_input-px,var(--vds-space-3,.75rem));--phone-input-radius:var(--vds-radius-input,var(--vds-radius-element,.5rem))}.vds-phone-input[data-size="2xs"],.vds-phone-input[data-size=xs]{--phone-input-country-width:5.25rem;--phone-input-flag-size:.875rem;--phone-input-country-padding-inline:var(--vds-space-2,.5rem)}.vds-phone-input[data-size=sm]{--phone-input-country-width:5.375rem;--phone-input-flag-size:1rem}.vds-phone-input[data-size=lg]{--phone-input-country-width:6rem;--phone-input-flag-size:1.25rem;--phone-input-country-padding-inline:var(--vds-space-3,.75rem)}.vds-phone-input[data-size=xl]{--phone-input-country-width:6.5rem;--phone-input-flag-size:1.375rem}.vds-phone-input[data-size="2xl"]{--phone-input-country-width:7rem;--phone-input-flag-size:1.5rem}}
@layer design-system.components{.vds-phone-input{font-family:var(--vds-font-sans);font-size:var(--input-slot-font-size,var(--vds-text-sm));border-radius:var(--phone-input-radius);position:relative}.vds-phone-input>input[type=tel]{z-index:0;text-align:start;direction:ltr;padding-inline-start:calc(var(--phone-input-country-width) + var(--phone-input-value-gap));position:relative}.vds-phone-input:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))>input[type=tel]{padding-inline-start:var(--_input-px);padding-inline-end:calc(var(--phone-input-country-width) + var(--phone-input-value-gap))}.vds-phone-input-country{box-sizing:border-box;z-index:1;inline-size:var(--phone-input-country-width);justify-content:flex-start;align-items:center;gap:var(--phone-input-country-gap);padding-inline:var(--phone-input-country-padding-inline);border:0;border-inline-end:1px solid var(--phone-input-country-separator-color);color:var(--vds-color-text,#111827);font:inherit;line-height:var(--vds-control-line-height,1.5);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color var(--vds-duration-fast,.1s) var(--vds-ease-out,ease-out), box-shadow .18s ease-out;background:0 0;border-start-start-radius:inherit;border-end-start-radius:inherit;display:inline-flex;position:absolute;inset-block:0;inset-inline-start:0}@media (prefers-reduced-motion:reduce){.vds-phone-input-country{transition-duration:0s}}.vds-phone-input-country:hover:not(:disabled){background-color:var(--phone-input-country-bg-hover)}.vds-phone-input-country:focus-visible{box-shadow:0 0 0 4px var(--vds-color-primary-a4), 0 0 12px 2px var(--vds-color-primary-a2);outline:none}@media (forced-colors:active){.vds-phone-input-country:focus-visible{outline-offset:2px;box-shadow:none;outline:2px solid highlight}}.vds-phone-input-country:disabled{cursor:not-allowed;opacity:.6}.vds-phone-input-country[aria-expanded=true] .vds-phone-input-caret{transform:rotate(180deg)}.vds-phone-input-flag{--flag-size:var(--phone-input-flag-size);flex:none}.vds-phone-input-dial{font-weight:var(--phone-input-dial-font-weight);color:var(--vds-color-text-muted,#6b7280);white-space:nowrap}.vds-phone-input-caret{block-size:.625rem;inline-size:.625rem;color:var(--vds-color-text-muted,#6b7280);transition:transform var(--vds-duration-fast,.1s) var(--vds-ease-out,ease-out);flex:none;margin-inline-start:auto}.vds-phone-input-option{align-items:center;gap:var(--vds-space-2,.5rem);inline-size:100%;display:inline-flex}.vds-phone-input-option-name{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-inline-size:0;overflow:hidden}.vds-phone-input-option-dial{color:var(--vds-color-text-muted,#6b7280);font-variant-numeric:tabular-nums;flex:none}.vds-phone-input-announce{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}}
@layer design-system.components{.vds-flag,.vds-flag-placeholder{--flag-size:1.25rem;--flag-aspect:4 / 3;--flag-border-radius:min(var(--vds-radius-xs,.25rem), var(--vds-radius-2,.25rem));--flag-outline-color:color-mix(in oklch, currentColor 12%, transparent);--flag-outline-width:1px;--flag-shadow:none}.vds-flag[data-size="2xs"]{--flag-size:.875rem}.vds-flag[data-size=xs]{--flag-size:1rem}.vds-flag[data-size=sm]{--flag-size:1.125rem}.vds-flag[data-size=lg]{--flag-size:1.5rem}.vds-flag[data-size=xl]{--flag-size:1.875rem}.vds-flag[data-size="2xl"]{--flag-size:2.5rem}}
@layer design-system.components{.vds-flag{inline-size:var(--flag-size);block-size:auto;aspect-ratio:var(--flag-aspect);border-radius:var(--flag-border-radius);box-shadow:0 0 0 var(--flag-outline-width) var(--flag-outline-color) inset, var(--flag-shadow);vertical-align:middle;-webkit-user-select:none;user-select:none;flex:none;display:inline-block;overflow:hidden}.vds-flag[data-rounded=full]{border-radius:var(--vds-radius-full,9999px);--flag-aspect:1 / 1}.vds-flag:not([data-rounded]),.vds-flag[data-rounded]:not([data-rounded=""]):not([data-rounded=full]){box-shadow:0 0 0 var(--flag-outline-width) var(--flag-outline-color) inset;border-radius:0}.vds-flag-placeholder{inline-size:var(--flag-size);aspect-ratio:var(--flag-aspect);background:color-mix(in oklch, currentColor 10%, transparent);border-radius:var(--flag-border-radius);display:inline-block}}
