@charset "utf-8";.form .repeat-container.is-view-transition{& .mobile-scroll-x.repeat-items{scroll-snap-type:none!important}& .repeat-item{view-transition-name:match-element;& *{view-transition-name:none}}}.form{display:flex;flex-direction:column;align-items:center;gap:2rem;width:100%;&>[data-form-message]{display:flex;flex-direction:column;gap:1rem;padding:1rem;width:100%;border:2px solid;border-radius:var(--border-radius);&[data-form-message="success"]{border-color:var(--color-green);color:var(--color-green)}&[data-form-message="error"]{border-color:var(--color-red);color:var(--color-red)}}& .form-groups{display:flex;flex-direction:column;gap:2rem;width:-webkit-fill-available;width:-moz-available;width:stretch;padding:2rem;background-color:var(--background-color-01);border-radius:var(--border-radius);& .form-group{display:flex;flex-direction:column;align-items:flex-start;gap:0.5rem;width:-webkit-fill-available;width:-moz-available;width:stretch;&:has(.form-group){gap:1rem}&>.form-field{pointer-events:none;display:flex;flex-direction:column;align-items:flex-start;gap:0.5rem;width:-webkit-fill-available;width:-moz-available;width:stretch;color:inherit;&>.label-text,&>:where(input, textarea, select){pointer-events:auto}@media (any-hover: hover){&:hover{opacity:unset;transition:unset}&>.label-text{transition:opacity 0.5s ease;&:hover{opacity:0.6}}&>.label-text,&>[type="date"]{cursor:pointer}&>:where(input, textarea, select){cursor:initial}}}&>fieldset{&:disabled{display:none}&>legend{margin-block-end:0.5rem}}&>label:not(.form-field),&>.form-field>.label-text,&>legend{display:inline-flex;align-items:center;gap:0.25rem;flex-wrap:wrap;color:var(--text-color);&.required>[data-text]::after{content:attr(data-text);padding:calc(0.0625rem - 1px) calc(0.375rem - 1px);background-color:var(--color-red);border:1px solid var(--color-red);border-radius:var(--border-radius);line-height:1;color:#fff;white-space:pre-wrap}}&:not(.required-checkbox-group):has(:where(input, textarea, select):valid),&.required-checkbox-group:has(input:checked){&>label:not(.form-field),&>.form-field>.label-text,&>legend{&.required>[data-text]::after{background-color:transparent;border:1px solid var(--color-green);color:var(--color-green)}}}& :where(input:not([type="radio"], [type="checkbox"]), textarea, select){display:block;width:100%;padding:0.5em 0.75em;background-color:#fff;border:1px solid var(--background-color-01);border-radius:var(--border-radius);&[type="date"]{max-width:15em}.select-wrapper>&{padding-inline-end:2em}&.accent{background-color:color-mix(in srgb,var(--color-green) 20%,transparent)}&:disabled{background-color:color-mix(in srgb,var(--text-color) 20%,transparent);color:#fff}&:user-invalid{border:1px solid var(--color-red)}}& textarea{overflow-y:auto;resize:vertical;field-sizing:content;min-height:5rem;max-height:30rem;.form-groups>.form-group>&{min-height:15rem}}&>.form-group-radio,&>.form-group-checkbox{display:flex;gap:0.25em 1em;flex-wrap:wrap;&>label:has(input){display:flex;align-items:center;gap:0.25rem;&>input{appearance:auto;display:inline-block}}}&.selectboxes{flex-direction:row;flex-wrap:wrap;&>.form-group{width:auto;min-width:min(15rem,100%);&>.select-wrapper{width:100%;&:has(:disabled){cursor:not-allowed;color:#fff}}}}&>.error-message{color:var(--color-red);.form-group:not(.required-checkbox-group):not(:has(:where(input, textarea, select):user-invalid))>&,.form-group.required-checkbox-group:not(:has(input:not(:checked):user-invalid))>&{display:none}}}& .tab-wrapper{display:flex;gap:0.5rem;width:-webkit-fill-available;width:-moz-available;width:stretch;border-block-end:2px solid var(--text-light-color);overflow-x:auto;&>.tab-label{flex-shrink:0;max-width:90%;padding:0.5rem;border-start-start-radius:var(--border-radius);border-start-end-radius:var(--border-radius);background-color:var(--text-light-color);color:#fff;&:has(:checked){background-color:var(--color-green)}}}& [class*="tab-content-"]{height:0;margin-block-start:-1rem;opacity:0;overflow:hidden;pointer-events:none;.tab-wrapper:has(.tab-first:checked)~&.tab-content-first,.tab-wrapper:has(.tab-second:checked)~&.tab-content-second,.tab-wrapper:has(.tab-third:checked)~&.tab-content-third{height:auto;min-height:min(30rem,80svh);margin-block-start:0;opacity:1;overflow:visible;pointer-events:auto}}& details{width:100%;&>summary{padding-block:0.25rem;padding-inline:0.375rem 0.75rem;background-color:color-mix(in srgb,var(--color-green) 20%,transparent);border-radius:var(--border-radius)}&>.form-group{padding-block-start:0.5rem}}& .repeat-container{--repeat-padding-inline:1rem;counter-reset:repeat-counter;&>.repeat-items{display:flex;flex-direction:column;align-items:flex-start;gap:1rem var(--repeat-padding-inline);width:100%;&:not(:has(> *)){display:none}&>.repeat-item{counter-increment:repeat-counter;position:relative;z-index:1;padding-block:1.75rem 1rem;padding-inline:var(--repeat-padding-inline);background-color:color-mix(in srgb,var(--background-color-01) 50%,#fff);box-shadow:inset 2px 2px 4px color-mix(in srgb,var(--text-light-color) 25%,#fff),inset -2px -2px 4px color-mix(in srgb,var(--text-light-color) 25%,#fff);border-radius:var(--border-radius);transition:background-color 0.5s ease;&:nth-child(even){background-color:var(--background-color-01)}&.confirm-delete{background-color:color-mix(in srgb,var(--color-red) 50%,transparent);transition:unset}&.is-duplicating{background-color:color-mix(in srgb,var(--color-green) 10%,transparent)}&::before{position:absolute;inset-inline-start:0;inset-block-start:0;z-index:3;content:counters(repeat-counter,"-")" ";display:flex;justify-content:center;align-items:center;padding:0.375rem 0.5rem;background-color:var(--main-color-01);border-radius:var(--border-radius);font-size:0.75rem;font-weight:bold;line-height:1;color:#fff}&>.tab-wrapper{margin-inline-end:calc(var(--repeat-padding-inline) * -1);padding-inline-end:var(--repeat-padding-inline)}& .repeat-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:0.75rem;margin-block-end:-1rem;margin-inline:calc(var(--repeat-padding-inline) * -1);padding:0.5rem var(--repeat-padding-inline);width:-webkit-fill-available;width:-moz-available;width:stretch;background-color:color-mix(in srgb,var(--text-light-color) 10%,transparent);border-end-start-radius:var(--border-radius);border-end-end-radius:var(--border-radius);&>button{padding:0.25rem 0.5rem;border:1px solid;border-radius:var(--border-radius);background-color:#fff}&>button.duplicate{color:var(--color-green)}&>button.delete{border-color:var(--color-red);background-color:var(--color-red);color:#fff}}&:first-child>.repeat-actions>.move-up,&:last-child>.repeat-actions>.move-down,&>.repeat-actions>*:disabled,&>.repeat-actions:not(:has(> *:not(:disabled))){display:none}}}&>.button-wrapper{display:flex;width:100%;background-color:color-mix(in srgb,var(--color-green) 10%,transparent);border-radius:var(--border-radius);&.flex-end{justify-content:flex-end}&>.repeat-button{display:inline-flex;gap:0 0.125rem;flex-wrap:wrap;padding:0.25rem 0.5rem;background-color:var(--color-green);border-radius:var(--border-radius);color:#fff;&:disabled{display:none}}}}}&>.reset-wrapper{display:flex;justify-content:flex-end;width:100%;margin-block:-1.25rem -1rem;&>button[type="reset"]{display:inline-block;padding:0.25rem 0.5rem;margin-inline-start:auto;background-color:var(--link-color);border-radius:var(--border-radius);color:#fff}}&>.submit-wrapper{display:flex;flex-direction:column;align-items:center;gap:1rem;width:100%;&>.button-wrapper{width:100%;max-width:min(30rem,100%);&>button{display:flex;justify-content:center;width:100%;padding:0.5rem 1rem;background-color:var(--color-green);border-radius:var(--border-radius);font-size:1.125rem;color:#fff}}&>.spinner{visibility:hidden;display:inline-block;width:3rem;height:3rem;border-radius:50%;border:0.25rem solid var(--background-color-01);border-top-color:var(--color-green);&.is-active{visibility:visible;animation:spinner 1.5s linear infinite}}.form:has(:where(input, textarea, select):invalid)>&{&>.button-wrapper{&>button{background-color:var(--background-color-01);color:color-mix(in srgb,var(--text-color) 25%,#fff)}}}}& .display-none{display:none}}@keyframes spinner{to{transform:rotate(360deg)}}@media screen and (min-width: 600px){.form{&>.form-groups{box-shadow:1px 1px 4px color-mix(in srgb,var(--text-light-color) 25%,#fff),-1px -1px 4px color-mix(in srgb,var(--text-light-color) 25%,#fff);& .repeat-container{& .repeat-container{padding-inline-start:var(--repeat-padding-inline);border-inline-start:0.25rem solid var(--text-light-color)}}}}}@media screen and (max-width: 599px){.form{&>.form-groups{padding-block:1.5rem 2rem;padding-inline:1rem;margin-inline-start:-1rem;border-radius:0;border-start-end-radius:var(--border-radius);border-end-end-radius:var(--border-radius);& .repeat-container{--repeat-padding-inline:0.75rem;&>.repeat-items{&>.repeat-item{&>.tab-wrapper{margin-inline:calc(var(--repeat-padding-inline) * -1);padding-inline:var(--repeat-padding-inline)}}}&:has(> .mobile-scroll-x){height:100%;&>.repeat-items{scroll-snap-type:x mandatory;overflow-x:auto;flex-direction:row;height:100%;&>.repeat-item{scroll-snap-align:start;scroll-margin-inline-start:var(--repeat-padding-inline);overflow-y:auto;flex-shrink:0;max-height:80svh;& .repeat-actions{&>button:where(.move-up, .move-down){transform:rotate(-90deg)}}}}&:has(> .mobile-scroll-x > :nth-child(2)){margin-inline:calc(var(--repeat-padding-inline) * -1);&>.repeat-items{padding-inline:var(--repeat-padding-inline);&>.repeat-item{width:calc(100% - (var(--repeat-padding-inline) + 0.5rem))}}&>.button-wrapper{width:calc(100% - (var(--repeat-padding-inline) * 2));margin-inline-start:var(--repeat-padding-inline)}}}}&>.repeat-container{margin-inline-start:-1rem;&>.repeat-items{&>.repeat-item{padding-inline-start:1rem;box-shadow:inset -2px 2px 4px 0px color-mix(in srgb,var(--text-light-color) 25%,#fff),inset -2px -2px 4px 0px color-mix(in srgb,var(--text-light-color) 25%,#fff);border-radius:0;border-start-end-radius:var(--border-radius);border-end-end-radius:var(--border-radius);&::before{border-start-start-radius:0}&>.tab-wrapper{margin-inline-start:-1rem;padding-inline-start:1rem}&>.repeat-actions{margin-inline-start:-1rem;border-end-start-radius:0}}}&>.button-wrapper{border-radius:0;border-start-end-radius:var(--border-radius);border-end-end-radius:var(--border-radius)}}}}}