/**
 * Do not edit directly
 * Generated by cocokits 'scss-builder'
 */
 
:where(.cck-button){
  display:inline-flex;
  justify-content:center;
  align-items:center;
  margin:0;
  border:none;
  outline:transparent;
  cursor:pointer;
  box-sizing:border-box;
  border-radius:var(--radi-6);
  transition:all 100ms;
}
:where(.cck-button):focus-visible{
  box-shadow:0 0 0 3px var(--state-brand-selected);
}
:where(.cck-button .cck-svg-icon--default-color .cck-svg-icon__svg){
  fill:currentcolor;
}

:where(.cck-button__backdrop){
  display:none;
}

:where(.cck-button__default.cck-button__color--brand){
  background-color:var(--state-brand-active);
  color:var(--text-light-primary);
}
:where(.cck-button__default.cck-button__color--brand):hover{
  background-color:var(--state-brand-hover);
}
:where(.cck-button__default.cck-button__color--brand):active{
  background-color:var(--state-brand-selected);
}
:where(.cck-button__default.cck-button__color--brand):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}
:where(.cck-button__default.cck-button__color--highlight){
  background-color:var(--state-highlight-active);
  color:var(--text-light-primary);
}
:where(.cck-button__default.cck-button__color--highlight):hover{
  background-color:var(--state-highlight-hover);
}
:where(.cck-button__default.cck-button__color--highlight):active{
  background-color:var(--state-highlight-selected);
}
:where(.cck-button__default.cck-button__color--highlight):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}
:where(.cck-button__default.cck-button__color--success){
  background-color:var(--state-success-active);
  color:var(--text-light-primary);
}
:where(.cck-button__default.cck-button__color--success):hover{
  background-color:var(--state-success-hover);
}
:where(.cck-button__default.cck-button__color--success):active{
  background-color:var(--state-success-selected);
}
:where(.cck-button__default.cck-button__color--success):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}
:where(.cck-button__default.cck-button__color--danger){
  background-color:var(--state-danger-active);
  color:var(--text-light-primary);
}
:where(.cck-button__default.cck-button__color--danger):hover{
  background-color:var(--state-danger-hover);
}
:where(.cck-button__default.cck-button__color--danger):active{
  background-color:var(--state-danger-selected);
}
:where(.cck-button__default.cck-button__color--danger):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}

:where(.cck-button__secondary){
  background-color:var(--base-surface-2);
  color:var(--text-dark-primary);
  border:1px solid var(--base-border);
  outline:1px solid transparent;
}
:where(.cck-button__secondary):hover{
  background-color:var(--base-fill-2);
  border:1px solid var(--base-fill-2);
}
:where(.cck-button__secondary):active{
  background-color:var(--base-fill-1);
  border:1px solid var(--base-border);
}
:where(.cck-button__secondary):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  border:none;
}

:where(.cck-button__ghost){
  background-color:var(--base-surface-1);
  outline:1px solid transparent;
}
:where(.cck-button__ghost.cck-button__color--brand){
  border:1px solid var(--state-brand-active);
  color:var(--state-brand-active);
}
:where(.cck-button__ghost.cck-button__color--brand):hover{
  outline:1px solid var(--state-brand-hover);
  border:1px solid var(--state-brand-hover);
}
:where(.cck-button__ghost.cck-button__color--brand):active{
  border:1px solid var(--state-brand-selected);
  outline:1px solid var(--state-brand-selected);
}
:where(.cck-button__ghost.cck-button__color--brand):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  border:none;
}
:where(.cck-button__ghost.cck-button__color--highlight){
  border:1px solid var(--state-highlight-active);
  color:var(--state-highlight-active);
}
:where(.cck-button__ghost.cck-button__color--highlight):hover{
  border:1px solid var(--state-highlight-hover);
  outline:1px solid var(--state-highlight-hover);
}
:where(.cck-button__ghost.cck-button__color--highlight):active{
  border:1px solid var(--state-highlight-selected);
  outline:1px solid var(--state-highlight-selected);
}
:where(.cck-button__ghost.cck-button__color--highlight):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  border:none;
}
:where(.cck-button__ghost.cck-button__color--success){
  border:1px solid var(--state-success-active);
  color:var(--state-success-active);
}
:where(.cck-button__ghost.cck-button__color--success):hover{
  border:1px solid var(--state-success-hover);
  outline:1px solid var(--state-success-hover);
}
:where(.cck-button__ghost.cck-button__color--success):active{
  border:1px solid var(--state-success-selected);
  outline:1px solid var(--state-success-selected);
}
:where(.cck-button__ghost.cck-button__color--success):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  border:none;
}
:where(.cck-button__ghost.cck-button__color--danger){
  border:1px solid var(--state-danger-active);
  color:var(--state-danger-active);
}
:where(.cck-button__ghost.cck-button__color--danger):hover{
  border:1px solid var(--state-danger-hover);
  outline:1px solid var(--state-danger-hover);
}
:where(.cck-button__ghost.cck-button__color--danger):active{
  border:1px solid var(--state-danger-selected);
  outline:1px solid var(--state-danger-selected);
}
:where(.cck-button__ghost.cck-button__color--danger):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  border:none;
}

:where(.cck-button__size--sm){
  height:36px;
  gap:var(--spacing-3);
  padding:var(--spacing-0) var(--spacing-7);
  font:var(--text-sm-font-semibold);
}
:where(.cck-button__size--md){
  height:44px;
  gap:var(--spacing-5);
  padding:var(--spacing-0) var(--spacing-8);
  font:var(--text-base-font-semibold);
}
:where(.cck-button__size--lg){
  height:44px;
  gap:var(--spacing-7);
  padding:var(--spacing-0) var(--spacing-8);
  font:var(--text-lg-font-semibold);
}
:where(.cck-button__size--xl){
  height:56px;
  gap:var(--spacing-7);
  padding:var(--spacing-0) var(--spacing-10);
  font:var(--text-xl-font-semibold);
}

:where(.cck-checkbox){
  display:flex;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}

:where(.cck-checkbox__wrapper){
  display:inline-flex;
  align-items:center;
  vertical-align:middle;
}

:where(.cck-checkbox__input-wrapper){
  display:inline-block;
  position:relative;
  box-sizing:content-box;
  line-height:0;
  white-space:nowrap;
  cursor:pointer;
  flex-shrink:0;
}

:where(.cck-checkbox__input){
  position:absolute;
  margin:0;
  padding:0;
  opacity:0;
  cursor:inherit;
  width:100%;
  height:100%;
  top:0;
  left:0;
  right:0;
}
:where(.cck-checkbox__input:focus-visible ~ .cck-checkbox__background){
  box-shadow:0 0 0 1px var(--state-brand-selected);
  border:2px solid var(--state-brand-selected);
}

:where(.cck-checkbox__background){
  position:absolute;
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  width:100%;
  height:100%;
  border-radius:var(--radi-4);
  pointer-events:none;
  will-change:background-color, outline-color;
  transition:background-color 90ms cubic-bezier(0.4, 0, 0.6, 1), border-color 90ms cubic-bezier(0.4, 0, 0.6, 1);
  border:2px solid var(--base-border);
  background-color:var(--base-fill-1);
}

:where(.cck-checkbox.cck-checkbox--disabled .cck-checkbox__background){
  border:2px solid transparent;
  background-color:var(--base-disabled);
}
:where(.cck-checkbox.cck-checkbox--disabled .cck-checkbox__label){
  color:var(--base-disabled);
}
:where(.cck-checkbox.cck-checkbox--disabled *){
  cursor:default;
}

:where(.cck-checkbox--indeterminate .cck-checkbox__background){
  border:2px solid var(--state-brand-active);
  background-color:var(--state-brand-active);
}
:where(.cck-checkbox--indeterminate .cck-checkbox__checkmark){
  transform:rotate(45deg);
  opacity:0;
  transition:opacity 90ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms cubic-bezier(0.4, 0, 0.6, 1);
}
:where(.cck-checkbox--indeterminate .cck-checkbox__mixedmark){
  transform:scaleX(1) rotate(0deg);
  opacity:1;
}

:where(.cck-checkbox__mixedmark){
  width:100%;
  height:0;
  transform:scaleX(0) rotate(0deg);
  border-width:2px;
  border-radius:100px;
  border-style:solid;
  opacity:0;
  transition:opacity 90ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms cubic-bezier(0.4, 0, 0.6, 1);
  border-color:#fff;
  margin:2px;
}

:where(.cck-checkbox__checkmark){
  position:absolute;
  inset:0;
  width:100%;
  opacity:0;
  transition:opacity 180ms cubic-bezier(0.4, 0, 0.6, 1);
  color:#fff;
  padding:2px;
}

:where(.cck-checkbox--checked .cck-checkbox__background){
  border:2px solid var(--state-brand-active);
  background-color:var(--state-brand-active);
}
:where(.cck-checkbox--checked .cck-checkbox__checkmark){
  opacity:1;
}

:where(.cck-checkbox__checkmark-path){
  fill:currentcolor;
}

:where(.cck-checkbox__label){
  margin-left:0;
  margin-right:auto;
  padding-left:0;
  padding-right:0;
  order:0;
  text-align:left;
  color:var(--text-dark-primary);
  cursor:pointer;
  white-space:nowrap;
}
:where(.cck-checkbox__label):empty{
  display:none;
}

:where(.cck-checkbox__size--sm .cck-checkbox__wrapper){
  gap:var(--spacing-7);
}
:where(.cck-checkbox__size--sm .cck-checkbox__input-wrapper){
  width:22px;
  height:22px;
}
:where(.cck-checkbox__size--sm .cck-checkbox__label){
  font:var(--text-sm-font-medium);
}
:where(.cck-checkbox__size--md .cck-checkbox__wrapper){
  gap:var(--spacing-7);
}
:where(.cck-checkbox__size--md .cck-checkbox__input-wrapper){
  width:24px;
  height:24px;
}
:where(.cck-checkbox__size--md .cck-checkbox__label){
  font:var(--text-base-font-medium);
}
:where(.cck-checkbox__size--lg .cck-checkbox__wrapper){
  gap:var(--spacing-8);
}
:where(.cck-checkbox__size--lg .cck-checkbox__input-wrapper){
  width:32px;
  height:32px;
}
:where(.cck-checkbox__size--lg .cck-checkbox__label){
  font:var(--text-lg-font-medium);
}
:where(.cck-checkbox__size--xl .cck-checkbox__wrapper){
  gap:var(--spacing-8);
}
:where(.cck-checkbox__size--xl .cck-checkbox__input-wrapper){
  width:32px;
  height:32px;
}
:where(.cck-checkbox__size--xl .cck-checkbox__label){
  font:var(--text-xl-font-medium);
}

:where(.cck-chip){
  border-radius:var(--radi-5);
  border:1px solid var(--base-border);
  display:flex;
  align-items:center;
  color:var(--text-dark-primary);
  cursor:default;
  background-color:var(--base-surface-2);
  transition:all 100ms;
}

:where(.cck-chip--disabled){
  border:1px solid transparent;
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  pointer-events:none;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}

:where(.cck-chip__content-wrapper){
  display:flex;
  justify-content:center;
  align-items:center;
}

:where(.cck-chip__remove-icon-wrapper){
  flex-shrink:0;
  display:flex;
  justify-content:center;
  align-items:center;
}
:where(.cck-chip__remove-icon-wrapper .cck-icon-button){
  background-color:transparent;
  color:var(--base-fill-4);
  border-radius:50%;
  width:24px;
  height:24px;
  padding:0;
}
:where(.cck-chip__remove-icon-wrapper .cck-icon-button):hover{
  background-color:var(--base-fill-1);
}
:where(.cck-chip__remove-icon-wrapper .cck-icon-button .cck-svg-icon){
  width:100%;
  height:100%;
}

:where(.cck-chip__size--sm){
  height:26px;
  gap:var(--spacing-4);
  padding:0 var(--spacing-7);
  font:var(--text-xs-font-medium);
}
:where(.cck-chip__size--sm.cck-chip--removable){
  padding:0 var(--spacing-6) 0 var(--spacing-7);
}
:where(.cck-chip__size--md){
  height:34px;
  gap:var(--spacing-4);
  padding:0 var(--spacing-8);
  font:var(--text-base-font-medium);
}
:where(.cck-chip__size--md.cck-chip--removable){
  padding:0 var(--spacing-7) 0 var(--spacing-8);
}
:where(.cck-chip__size--lg){
  height:44px;
  gap:var(--spacing-6);
  padding:0 var(--spacing-9);
  font:var(--text-lg-font-medium);
}
:where(.cck-chip__size--lg.cck-chip--removable){
  padding:0 var(--spacing-8) 0 var(--spacing-9);
}

:where(.cck-chip-list){
  display:flex;
  flex-wrap:wrap;
  align-items:stretch;
  justify-content:flex-start;
}

:where(.cck-chip-list__input){
  flex:1;
  background:transparent;
  border:none;
  outline:none;
  font:var(--text-base-font-medium);
  color:var(--text-dark-primary);
}
:where(.cck-chip-list__input::-moz-placeholder){
  color:var(--text-dark-tertiary);
  -moz-transition:color 100ms ease-in;
  transition:color 100ms ease-in;
}
:where(.cck-chip-list__input::placeholder){
  color:var(--text-dark-tertiary);
  transition:color 100ms ease-in;
}
:where(.cck-chip-list__input::-moz-placeholder):not(:focus){
  color:transparent;
}
:where(.cck-chip-list__input::placeholder):not(:focus){
  color:transparent;
}

:where(.cck-chip-list__size--sm){
  gap:6px;
}
:where(.cck-chip-list__size--sm .cck-chip-list__input){
  height:26px;
  margin-left:var(--spacing-5);
  font:var(--text-xs-font-medium);
}
:where(.cck-chip-list__size--sm .cck-chip-list__input):first-child{
  margin-left:calc(var(--spacing-6) - 4px);
}
:where(.cck-chip-list__size--md){
  gap:6px;
}
:where(.cck-chip-list__size--md .cck-chip-list__input){
  height:34px;
  margin-left:var(--spacing-6);
  font:var(--text-base-font-medium);
}
:where(.cck-chip-list__size--md .cck-chip-list__input):first-child{
  margin-left:calc(var(--spacing-7) - 4px);
}
:where(.cck-chip-list__size--lg){
  gap:6px;
}
:where(.cck-chip-list__size--lg .cck-chip-list__input){
  height:44px;
  margin-left:var(--spacing-7);
  font:var(--text-lg-font-medium);
}
:where(.cck-chip-list__size--lg .cck-chip-list__input):first-child{
  margin-left:calc(var(--spacing-7) - 6px);
}

:where(*){
  box-sizing:border-box;
}

:where(.cck-divider){
  display:block;
  background-color:var(--base-border);
  flex-shrink:0;
}

:where(.cck-divider__horizontal){
  width:100%;
  margin:4px 0;
}

:where(.cck-divider__horizontal.cck-divider__size--sm){
  height:1px;
}

:where(.cck-divider__horizontal.cck-divider__size--md){
  width:100%;
  height:2px;
}

:where(.cck-divider__vertical){
  height:100%;
  margin:0 4px;
}

:where(.cck-divider__vertical.cck-divider__size--sm){
  width:1px;
}

:where(.cck-divider__vertical.cck-divider__size--md){
  width:2px;
}

:where(.cck-error){
  display:flex;
  gap:6px;
  font:var(--text-sm-font-medium);
  color:var(--state-danger-active);
}
:where(.cck-error .cck-svg-icon--default-color .cck-svg-icon__svg){
  fill:currentcolor;
}

:where(.cck-form-field){
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  min-width:100px;
}
:where(.cck-form-field .cck-select){
  height:100%;
  width:100%;
  flex:1;
}
:where(.cck-form-field .cck-input){
  width:100%;
  flex:1;
}

:where(.cck-form-field--error .cck-form-field__wrapper){
  border:1px solid var(--state-danger-active);
  outline:1px solid var(--state-danger-active);
}

:where(.cck-form-field--focused .cck-form-field__wrapper){
  border:1px solid var(--state-brand-active);
  outline:1px solid var(--state-brand-active);
  background-color:var(--base-surface-2);
}

:where(.cck-form-field--disabled .cck-form-field__wrapper){
  background-color:var(--base-fill-1);
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  pointer-events:none;
}

:where(.cck-form-field__wrapper){
  width:100%;
  display:flex;
  flex-direction:row;
  align-items:stretch;
  border-radius:var(--radi-6);
  border:1px solid var(--base-border);
  outline:1px solid transparent;
  overflow:hidden;
  background-color:var(--base-surface-1);
}

:where(.cck-form-field__size--sm.cck-form-field--with-input .cck-form-field__wrapper),:where( .cck-form-field__size--sm.cck-form-field--with-select .cck-form-field__wrapper){
  height:36px;
}
:where(.cck-form-field__size--sm.cck-form-field--with-input .cck-form-field__input-wrapper),:where( .cck-form-field__size--sm.cck-form-field--with-select .cck-form-field__input-wrapper){
  padding:0 var(--spacing-6) 0 var(--spacing-7);
}
:where(.cck-form-field__size--sm .cck-form-field--with-textarea .cck-form-field__input-wrapper){
  padding:var(--spacing-6) var(--spacing-6) var(--spacing-6) var(--spacing-7);
}
:where(.cck-form-field__size--sm.cck-form-field--with-chip-list .cck-form-field__input-wrapper){
  padding:4px;
}
:where(.cck-form-field__size--sm .cck-input),:where(
.cck-form-field__size--sm .cck-leading),:where(
.cck-form-field__size--sm .cck-trailing),:where(
.cck-form-field__size--sm .cck-textarea),:where(
.cck-form-field__size--sm .cck-select){
  font:var(--text-sm-font-medium);
}
:where(.cck-form-field__size--md.cck-form-field--with-input .cck-form-field__wrapper),:where( .cck-form-field__size--md.cck-form-field--with-select .cck-form-field__wrapper){
  height:44px;
}
:where(.cck-form-field__size--md.cck-form-field--with-input .cck-form-field__input-wrapper),:where( .cck-form-field__size--md.cck-form-field--with-select .cck-form-field__input-wrapper){
  padding:0 var(--spacing-7) 0 var(--spacing-8);
}
:where(.cck-form-field__size--md .cck-form-field--with-textarea .cck-form-field__input-wrapper){
  padding:var(--spacing-7) var(--spacing-7) var(--spacing-7) var(--spacing-8);
}
:where(.cck-form-field__size--md.cck-form-field--with-chip-list .cck-form-field__input-wrapper){
  padding:4px;
}
:where(.cck-form-field__size--md .cck-input),:where(
.cck-form-field__size--md .cck-leading),:where(
.cck-form-field__size--md .cck-trailing),:where(
.cck-form-field__size--md .cck-textarea),:where(
.cck-form-field__size--md .cck-select){
  font:var(--text-base-font-medium);
}
:where(.cck-form-field__size--lg.cck-form-field--with-input .cck-form-field__wrapper),:where( .cck-form-field__size--lg.cck-form-field--with-select .cck-form-field__wrapper){
  height:56px;
}
:where(.cck-form-field__size--lg.cck-form-field--with-input .cck-form-field__input-wrapper),:where( .cck-form-field__size--lg.cck-form-field--with-select .cck-form-field__input-wrapper){
  padding:0 var(--spacing-7) 0 var(--spacing-8);
}
:where(.cck-form-field__size--lg .cck-form-field--with-textarea .cck-form-field__input-wrapper){
  padding:var(--spacing-7) var(--spacing-7) var(--spacing-7) var(--spacing-8);
}
:where(.cck-form-field__size--lg.cck-form-field--with-chip-list .cck-form-field__input-wrapper){
  padding:6px;
}
:where(.cck-form-field__size--lg .cck-input),:where(
.cck-form-field__size--lg .cck-leading),:where(
.cck-form-field__size--lg .cck-trailing),:where(
.cck-form-field__size--lg .cck-textarea),:where(
.cck-form-field__size--lg .cck-select){
  font:var(--text-lg-font-medium);
}

:where(.cck-form-field__feedback-wrapper){
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
:where(.cck-form-field__feedback-wrapper):empty{
  display:none;
}

:where(.cck-form-field__input-wrapper){
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:8px;
}

:where(.cck-form-field--with-chip-list .cck-chip-list){
  flex:1;
}
:where(.cck-form-field--with-chip-list .cck-form-field__wrapper){
  cursor:text;
}
:where(.cck-form-field--with-chip-list .cck-suffix),:where( .cck-form-field--with-chip-list .cck-prefix){
  align-self:flex-start;
}
:where(.cck-form-field--with-chip-list.cck-form-field__size--sm .cck-suffix){
  margin-top:6px;
  margin-right:4px;
}
:where(.cck-form-field--with-chip-list.cck-form-field__size--md .cck-suffix){
  margin-top:8px;
  margin-right:4px;
}
:where(.cck-form-field--with-chip-list.cck-form-field__size--lg .cck-suffix){
  margin-top:12px;
  margin-right:8px;
  margin-left:4px;
}
:where(.cck-form-field--with-chip-list.cck-form-field__size--sm .cck-prefix){
  margin-top:6px;
  margin-left:4px;
}
:where(.cck-form-field--with-chip-list.cck-form-field__size--md .cck-prefix){
  margin-top:8px;
  margin-left:4px;
}
:where(.cck-form-field--with-chip-list.cck-form-field__size--lg .cck-prefix){
  margin-top:12px;
  margin-left:8px;
  margin-right:4px;
}

:where(.cck-form-field--with-textarea .cck-form-field__input-wrapper){
  padding:10px 10px 10px 16px;
}
:where(.cck-form-field--with-textarea .cck-form-field__input-wrapper):hover:not(:has(textarea:focus-visible)){
  background-color:var(--base-fill-1);
}

:where(.cck-form-field--with-input .cck-form-field__input-wrapper):hover:not(:has(input:focus-visible)),:where(
.cck-form-field--with-select .cck-form-field__input-wrapper):hover:not(:has(input:focus-visible)){
  background-color:var(--base-fill-1);
}

:where(.cck-hint){
  display:flex;
  gap:6px;
  font:var(--text-sm-font-medium);
  color:var(--text-dark-secondary);
}
:where(.cck-hint .cck-svg-icon--default-color .cck-svg-icon__svg){
  fill:currentcolor;
}
:where(.cck-hint__color--default){
  color:var(--text-dark-secondary);
}
:where(.cck-hint__color--success){
  color:var(--state-success-active);
}

:where(.cck-svg-icon){
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}

:where(.cck-svg-icon__svg){
  width:100%;
  height:100%;
}

:where(.cck-svg-icon__size--xs){
  width:var(--icon-xs);
  height:var(--icon-xs);
}
:where(.cck-svg-icon__size--sm){
  width:var(--icon-sm);
  height:var(--icon-sm);
}
:where(.cck-svg-icon__size--md){
  width:var(--icon-md);
  height:var(--icon-md);
}
:where(.cck-svg-icon__size--lg){
  width:var(--icon-lg);
  height:var(--icon-lg);
}
:where(.cck-svg-icon__size--xl){
  width:var(--icon-xl);
  height:var(--icon-xl);
}
:where(.cck-svg-icon__size--2xl){
  width:var(--icon-2xl);
  height:var(--icon-2xl);
}
:where(.cck-svg-icon__size--3xl){
  width:var(--icon-3xl);
  height:var(--icon-3xl);
}
:where(.cck-svg-icon__size--4xl){
  width:var(--icon-4xl);
  height:var(--icon-4xl);
}

:where(.cck-svg-icon__color--grey){
  fill:var(--base-fill-4);
}
:where(.cck-svg-icon__color--brand){
  fill:var(--state-brand-active);
}
:where(.cck-svg-icon__color--highlight){
  fill:var(--state-highlight-active);
}
:where(.cck-svg-icon__color--success){
  fill:var(--state-success-active);
}
:where(.cck-svg-icon__color--danger){
  fill:var(--state-danger-active);
}

:where(.cck-icon-button){
  display:inline-flex;
  justify-content:center;
  align-items:center;
  margin:0;
  border:none;
  outline:transparent;
  cursor:pointer;
  box-sizing:border-box;
  border-radius:var(--radi-6);
  transition:all 100ms;
}
:where(.cck-icon-button .cck-svg-icon--default-color){
  fill:currentcolor;
}
:where(.cck-icon-button):focus-visible{
  box-shadow:0 0 0 3px var(--state-brand-selected);
}

:where(.cck-icon-button__default.cck-icon-button__color--brand){
  background-color:var(--state-brand-active);
  color:var(--text-light-primary);
}
:where(.cck-icon-button__default.cck-icon-button__color--brand):hover{
  background-color:var(--state-brand-hover);
}
:where(.cck-icon-button__default.cck-icon-button__color--brand):active{
  background-color:var(--state-brand-selected);
}
:where(.cck-icon-button__default.cck-icon-button__color--brand):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}
:where(.cck-icon-button__default.cck-icon-button__color--highlight){
  background-color:var(--state-highlight-active);
  color:var(--text-light-primary);
}
:where(.cck-icon-button__default.cck-icon-button__color--highlight):hover{
  background-color:var(--state-highlight-hover);
}
:where(.cck-icon-button__default.cck-icon-button__color--highlight):active{
  background-color:var(--state-highlight-selected);
}
:where(.cck-icon-button__default.cck-icon-button__color--highlight):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}
:where(.cck-icon-button__default.cck-icon-button__color--success){
  background-color:var(--state-success-active);
  color:var(--text-light-primary);
}
:where(.cck-icon-button__default.cck-icon-button__color--success):hover{
  background-color:var(--state-success-hover);
}
:where(.cck-icon-button__default.cck-icon-button__color--success):active{
  background-color:var(--state-success-selected);
}
:where(.cck-icon-button__default.cck-icon-button__color--success):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}
:where(.cck-icon-button__default.cck-icon-button__color--danger){
  background-color:var(--state-danger-active);
  color:var(--text-light-primary);
}
:where(.cck-icon-button__default.cck-icon-button__color--danger):hover{
  background-color:var(--state-danger-hover);
}
:where(.cck-icon-button__default.cck-icon-button__color--danger):active{
  background-color:var(--state-danger-selected);
}
:where(.cck-icon-button__default.cck-icon-button__color--danger):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}

:where(.cck-icon-button__secondary){
  background-color:var(--base-surface-2);
  color:var(--text-dark-primary);
  border:1px solid var(--base-border);
  outline:1px solid transparent;
}
:where(.cck-icon-button__secondary):hover{
  background-color:var(--base-fill-2);
  border:1px solid var(--base-fill-2);
}
:where(.cck-icon-button__secondary):active{
  background-color:var(--base-fill-1);
  border:1px solid var(--base-border);
}
:where(.cck-icon-button__secondary):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  border:none;
}

:where(.cck-icon-button__ghost){
  background-color:var(--base-surface-1);
  outline:1px solid transparent;
}
:where(.cck-icon-button__ghost.cck-icon-button__color--brand){
  border:1px solid var(--state-brand-active);
  color:var(--state-brand-active);
}
:where(.cck-icon-button__ghost.cck-icon-button__color--brand):hover{
  outline:1px solid var(--state-brand-hover);
  border:1px solid var(--state-brand-hover);
}
:where(.cck-icon-button__ghost.cck-icon-button__color--brand):active{
  border:1px solid var(--state-brand-selected);
  outline:1px solid var(--state-brand-selected);
}
:where(.cck-icon-button__ghost.cck-icon-button__color--brand):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  border:none;
}
:where(.cck-icon-button__ghost.cck-icon-button__color--highlight){
  border:1px solid var(--state-highlight-active);
  color:var(--state-highlight-active);
}
:where(.cck-icon-button__ghost.cck-icon-button__color--highlight):hover{
  border:1px solid var(--state-highlight-hover);
  outline:1px solid var(--state-highlight-hover);
}
:where(.cck-icon-button__ghost.cck-icon-button__color--highlight):active{
  border:1px solid var(--state-highlight-selected);
  outline:1px solid var(--state-highlight-selected);
}
:where(.cck-icon-button__ghost.cck-icon-button__color--highlight):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  border:none;
}
:where(.cck-icon-button__ghost.cck-icon-button__color--success){
  border:1px solid var(--state-success-active);
  color:var(--state-success-active);
}
:where(.cck-icon-button__ghost.cck-icon-button__color--success):hover{
  border:1px solid var(--state-success-hover);
  outline:1px solid var(--state-success-hover);
}
:where(.cck-icon-button__ghost.cck-icon-button__color--success):active{
  border:1px solid var(--state-success-selected);
  outline:1px solid var(--state-success-selected);
}
:where(.cck-icon-button__ghost.cck-icon-button__color--success):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  border:none;
}
:where(.cck-icon-button__ghost.cck-icon-button__color--danger){
  border:1px solid var(--state-danger-active);
  color:var(--state-danger-active);
}
:where(.cck-icon-button__ghost.cck-icon-button__color--danger):hover{
  border:1px solid var(--state-danger-hover);
  outline:1px solid var(--state-danger-hover);
}
:where(.cck-icon-button__ghost.cck-icon-button__color--danger):active{
  border:1px solid var(--state-danger-selected);
  outline:1px solid var(--state-danger-selected);
}
:where(.cck-icon-button__ghost.cck-icon-button__color--danger):disabled{
  background-color:var(--base-fill-1);
  color:var(--base-disabled);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  border:none;
}

:where(.cck-icon-button__size--sm){
  width:36px;
  height:36px;
}
:where(.cck-icon-button__size--sm .cck-svg-icon--default-size){
  width:var(--icon-md);
  height:var(--icon-md);
}
:where(.cck-icon-button__size--md){
  width:44px;
  height:44px;
}
:where(.cck-icon-button__size--md .cck-svg-icon--default-size){
  width:var(--icon-lg);
  height:var(--icon-lg);
}
:where(.cck-icon-button__size--lg){
  width:44px;
  height:44px;
}
:where(.cck-icon-button__size--lg .cck-svg-icon--default-size){
  width:var(--icon-xl);
  height:var(--icon-xl);
}
:where(.cck-icon-button__size--xl){
  width:56px;
  height:56px;
}
:where(.cck-icon-button__size--xl .cck-svg-icon--default-size){
  width:var(--icon-2xl);
  height:var(--icon-2xl);
}

:where(.cck-input){
  border:none;
  outline:none;
  background-color:transparent;
  font:var(--text-base-font-medium);
  color:var(--text-dark-primary);
  text-overflow:ellipsis;
}

:where(.cck-input::-moz-placeholder){
  color:var(--text-dark-tertiary);
}

:where(.cck-input::placeholder){
  color:var(--text-dark-tertiary);
}

:where(.cck-input):disabled{
  color:var(--base-disabled);
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  cursor:default;
}

:where(.cck-label){
  display:flex;
  font:var(--text-base-font-regular);
  color:var(--text-dark-secondary);
}

:where(.cck-label__required-marker){
  margin-left:4px;
}

:where(.cck-leading){
  background-color:var(--base-surface-2);
  display:flex;
  justify-content:center;
  align-items:center;
  font:var(--text-base-font-medium);
  color:var(--text-dark-tertiary);
  gap:var(--spacing-4);
  padding:0 var(--spacing-7);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}
:where(.cck-leading--clickable){
  cursor:pointer;
  transition:background-color 100ms;
}
:where(.cck-leading--clickable):active{
  background-color:var(--base-fill-1);
}
:where(.cck-leading--clickable):hover{
  background-color:var(--base-fill-2);
}

:where(.cck-menu){
  display:flex;
  flex-direction:column;
  border:1px solid var(--base-border);
  border-radius:var(--radi-6);
  padding:0;
  box-shadow:0 8px 10px -6px rgba(13, 16, 23, 0.0392156863), 0 18px 22px -4px rgba(13, 16, 23, 0.0784313725);
  margin:4px 0;
  background-color:var(--base-surface-1);
  overflow:hidden;
}

:where(.cck-menu__overlay .cck-overlay__backdrop){
  background-color:rgba(0, 0, 0, 0);
}

:where(.cck-menu-item){
  display:flex;
  align-items:center;
  justify-content:flex-start;
  font:var(--text-base-font-medium);
  padding:var(--spacing-6) var(--spacing-5);
  gap:var(--spacing-6);
  color:var(--text-dark-secondary);
}

:where(.cck-menu-item):not(.cck-menu-item--disabled){
  cursor:pointer;
}

:where(.cck-menu-item--disabled),:where(
.cck-menu-item--disabled .cck-svg-icon.cck-svg-icon--default-color){
  color:var(--base-disabled);
}

:where(.cck-menu-item):not(.cck-menu-item--disabled):hover{
  background-color:var(--base-fill-1);
}

:where(.cck-menu-item .cck-svg-icon.cck-svg-icon--default-size){
  width:var(--icon-lg);
  height:var(--icon-lg);
}

:where(.cck-menu-item .cck-svg-icon.cck-svg-icon--default-color .cck-svg-icon__svg){
  fill:currentcolor;
}

:where(.cck-select__options-wrapper){
  max-height:inherit;
  height:inherit;
  overflow:auto;
  margin-top:6px;
  background-color:var(--base-surface-1);
  border:1px solid var(--base-border);
  border-radius:var(--radi-6);
}

:where(.cck-option__content-wrapper){
  flex:1;
}

:where(.cck-option){
  padding:0 12px;
  display:flex;
  align-items:center;
  font:var(--text-base-font-medium);
  color:var(--text-dark-secondary);
  gap:8px;
}

:where(.cck-option):not(.cck-option--disabled){
  cursor:pointer;
}

:where(.cck-option--disabled){
  color:var(--base-disabled);
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}

:where(.cck-option):not(.cck-option--disabled):hover{
  background-color:var(--base-fill-1);
}

:where(.cck-option .cck-checkbox__input-wrapper){
  width:22px;
  height:22px;
}

:where(.cck-option--single.cck-option--selected){
  color:var(--state-brand-active);
}

:where(.cck-option__size--sm){
  height:40px;
}

:where(.cck-option__size--md){
  height:48px;
}

:where(.cck-option__size--lg){
  height:56px;
}

:where(.cck-option__selected-checkmark .cck-svg-icon){
  width:var(--icon-md);
  height:var(--icon-md);
  fill:currentcolor;
}

:where(.cck-option-group){
  display:flex;
  flex-direction:column;
}

:where(.cck-option-group--label){
  display:flex;
  align-items:center;
  font:var(--text-base-font-bold);
  color:var(--text-dark-primary);
  padding:0 12px;
}

:where(.cck-option-group--disabled .cck-option-group--label){
  color:var(--base-disabled);
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}

:where(.cck-option-group .cck-option){
  padding:0 24px;
}

:where(.cck-option-group__size--sm .cck-option-group--label){
  height:40px;
}

:where(.cck-option-group__size--md .cck-option-group--label){
  height:48px;
}

:where(.cck-option-group__size--lg .cck-option-group--label){
  height:56px;
}

:where(.cck-prefix){
  flex-grow:0;
}

:where(.cck-prefix .cck-svg-icon.cck-svg-icon--default-size){
  width:var(--icon-md);
  height:var(--icon-md);
}

:where(.cck-radio-button){
  cursor:pointer;
  color:var(--text-dark-primary);
}
:where(.cck-radio-button.cck-radio-button--disabled){
  cursor:default;
  pointer-events:none;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  color:var(--base-disabled);
}
:where(.cck-radio-button.cck-radio-button--disabled .cck-radio-button__input-wrapper){
  background-color:var(--base-disabled);
  border-color:transparent;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}
:where(.cck-radio-button.cck-radio-button--disabled .cck-radio-button__label){
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}
:where(.cck-radio-button:hover .cck-radio-button__input-wrapper){
  box-shadow:0 0 0 3px var(--state-brand-selected);
}

:where(.cck-radio-button__wrapper){
  display:inline-flex;
  align-items:center;
  vertical-align:middle;
}

:where(.cck-radio-button__input-wrapper){
  display:flex;
  justify-content:center;
  align-items:center;
  flex-shrink:0;
  border-radius:50%;
  position:relative;
  background-color:var(--base-fill-1);
  border:2px solid var(--base-border);
}

:where(.cck-radio-button__input){
  position:absolute;
  margin:0;
  padding:0;
  opacity:0;
  top:0;
  right:0;
  left:0;
  cursor:inherit;
  z-index:1;
  width:100%;
  height:100%;
}

:where(.cck-radio-button__background){
  opacity:0;
  background-color:var(--base-surface-1);
  border-radius:50%;
}

:where(.cck-radio-button__label){
  white-space:nowrap;
}

:where(.cck-radio-button--checked .cck-radio-button__input-wrapper){
  background-color:var(--state-brand-active);
  border-color:var(--state-brand-active);
}
:where(.cck-radio-button--checked .cck-radio-button__background){
  opacity:1;
}

:where(.cck-radio-button__size--sm){
  font:var(--text-sm-font-medium);
}
:where(.cck-radio-button__size--sm .cck-radio-button__wrapper){
  gap:var(--spacing-7);
}
:where(.cck-radio-button__size--sm .cck-radio-button__input-wrapper){
  width:22px;
  height:22px;
}
:where(.cck-radio-button__size--sm .cck-radio-button__background){
  width:12px;
  height:12px;
}
:where(.cck-radio-button__size--md){
  font:var(--text-base-font-medium);
}
:where(.cck-radio-button__size--md .cck-radio-button__wrapper){
  gap:var(--spacing-7);
}
:where(.cck-radio-button__size--md .cck-radio-button__input-wrapper){
  width:24px;
  height:24px;
}
:where(.cck-radio-button__size--md .cck-radio-button__background){
  width:12px;
  height:12px;
}
:where(.cck-radio-button__size--lg){
  font:var(--text-lg-font-medium);
}
:where(.cck-radio-button__size--lg .cck-radio-button__wrapper){
  gap:var(--spacing-8);
}
:where(.cck-radio-button__size--lg .cck-radio-button__input-wrapper){
  width:32px;
  height:32px;
}
:where(.cck-radio-button__size--lg .cck-radio-button__background){
  width:16px;
  height:16px;
}
:where(.cck-radio-button__size--xl){
  font:var(--text-xl-font-medium);
}
:where(.cck-radio-button__size--xl .cck-radio-button__wrapper){
  gap:var(--spacing-8);
}
:where(.cck-radio-button__size--xl .cck-radio-button__input-wrapper){
  width:32px;
  height:32px;
}
:where(.cck-radio-button__size--xl .cck-radio-button__background){
  width:16px;
  height:16px;
}

:where(.cck-radio-group){
  display:flex;
  align-items:flex-start;
}

:where(.cck-radio-group__row){
  flex-direction:row;
  gap:24px;
}

:where(.cck-radio-group__column){
  flex-direction:column;
  gap:12px;
}

:where(.cck-select){
  display:flex;
  align-items:center;
  border-radius:var(--radi-6);
  cursor:pointer;
  font:var(--text-base-font-medium);
  color:var(--text-dark-primary);
}
:where(.cck-select:hover .cck-svg-icon){
  fill:var(--base-fill-5);
}

:where(.cck-select--disabled){
  cursor:initial;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  color:var(--base-disabled);
}

:where(.cck-select__placeholder){
  color:var(--text-dark-tertiary);
}

:where(.cck-select__trigger-wrapper){
  overflow:hidden;
  flex:1;
  color:currentcolor;
  text-align:start;
  padding-right:8px;
}

:where(.cck-select__trigger-value){
  white-space:nowrap;
  text-overflow:ellipsis;
  overflow:hidden;
}

:where(.cck-select__overlay .cck-overlay__backdrop){
  background-color:rgba(0, 0, 0, 0);
}

:where(.cck-select__dropdown-icon-wrapper){
  transition:300ms transform;
}

:where(.cck-select__dropdown-icon-wrapper .cck-svg-icon){
  width:var(--icon-lg);
  height:var(--icon-lg);
}

:where(.cck-select--opened .cck-select__dropdown-icon-wrapper){
  transform:rotate(180deg);
}

:where(.cck-suffix){
  flex-grow:0;
}

:where(.cck-suffix .cck-svg-icon.cck-svg-icon--default-size){
  width:var(--icon-md);
  height:var(--icon-md);
}

:where(.cck-textarea){
  border:none;
  outline:none;
  background-color:transparent;
  scrollbar-color:var(--base-border) transparent;
  font:var(--text-base-font-medium);
  color:var(--text-dark-primary);
  padding:0;
  min-height:24px;
  min-width:100%;
}

:where(.cck-textarea::-moz-placeholder){
  color:var(--text-dark-tertiary);
}

:where(.cck-textarea::placeholder){
  color:var(--text-dark-tertiary);
}

:where(.cck-textarea::-webkit-resizer){
  width:9px;
  height:9px;
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="9" height="9" viewBox="0 0 9 9" fill="none"><path d="M4 4L7.2929 0.707105C7.92286 0.0771402 9 0.523309 9 1.41421V6C9 7.65685 7.65685 9 6 9H1.41421C0.523309 9 0.077142 7.92286 0.707107 7.29289L4 4Z" fill="%23A1A1AA"/></svg>');
  background-repeat:no-repeat;
  background-position:bottom right;
}

:where(.cck-textarea):disabled{
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  cursor:default;
  color:var(--base-disabled);
}

:where(.cck-toggle){
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  cursor:pointer;
}
:where(.cck-toggle__label){
  display:flex;
  align-items:center;
  cursor:pointer;
  white-space:nowrap;
  color:var(--text-dark-primary);
}
:where(.cck-toggle--label-before .cck-toggle__label){
  flex-direction:row-reverse;
}
:where(.cck-toggle__input){
  position:relative;
  width:100%;
  height:100%;
  padding:0;
  margin:0;
  opacity:0;
  cursor:pointer;
  z-index:3;
}
:where(.cck-toggle .cck-toggle__slider-wrapper){
  position:relative;
}
:where(.cck-toggle .cck-toggle__slider-wrapper):has(input:focus-visible){
  outline:2px solid var(--state-brand-selected);
}
:where(.cck-toggle__size--sm .cck-toggle__label){
  gap:var(--spacing-7);
  font:var(--text-sm-font-medium);
}
:where(.cck-toggle__size--md .cck-toggle__label){
  gap:var(--spacing-7);
  font:var(--text-base-font-medium);
}
:where(.cck-toggle__size--lg .cck-toggle__label){
  gap:var(--spacing-8);
  font:var(--text-lg-font-medium);
}
:where(.cck-toggle__size--xl .cck-toggle__label){
  gap:var(--spacing-8);
  font:var(--text-xl-font-medium);
}
:where(.cck-toggle__knob .cck-toggle__thumb){
  position:absolute;
  z-index:2;
  background-color:var(--base-surface-1);
  transition:0.3s ease all;
}
:where(.cck-toggle__knob .cck-toggle__backdrop){
  position:absolute;
  z-index:1;
  width:100%;
  height:100%;
  top:0;
  left:0;
  transition:0.3s ease background-color;
}
:where(.cck-toggle__knob.cck-toggle--checked .cck-toggle__thumb){
  top:50%;
  left:100%;
  transform:translate(calc(-100% - var(--frames-x--toggle-margin)), -50%);
}
:where(.cck-toggle__knob.cck-toggle--checked .cck-toggle__backdrop){
  background-color:var(--state-brand-active);
}
:where(.cck-toggle__knob.cck-toggle--unchecked .cck-toggle__thumb){
  top:50%;
  left:0;
  transform:translate(var(--frames-x--toggle-margin), -50%);
}
:where(.cck-toggle__knob.cck-toggle--unchecked .cck-toggle__backdrop){
  background-color:var(--base-fill-2);
}
:where(.cck-toggle__knob.cck-toggle__size--sm){
  --frames-x--toggle-margin:2px;
}
:where(.cck-toggle__knob.cck-toggle__size--sm .cck-toggle__slider-wrapper){
  width:40px;
  height:19px;
}
:where(.cck-toggle__knob.cck-toggle__size--sm .cck-toggle__thumb){
  width:18px;
  height:15px;
  border-radius:var(--radi-2);
}
:where(.cck-toggle__knob.cck-toggle__size--sm .cck-toggle__slider-wrapper){
  border-radius:var(--radi-3);
}
:where(.cck-toggle__knob.cck-toggle__size--sm .cck-toggle__backdrop){
  border-radius:var(--radi-3);
}
:where(.cck-toggle__knob.cck-toggle__size--md){
  --frames-x--toggle-margin:2px;
}
:where(.cck-toggle__knob.cck-toggle__size--md .cck-toggle__slider-wrapper){
  width:48px;
  height:24px;
}
:where(.cck-toggle__knob.cck-toggle__size--md .cck-toggle__thumb){
  width:22px;
  height:20px;
  border-radius:var(--radi-4);
}
:where(.cck-toggle__knob.cck-toggle__size--md .cck-toggle__slider-wrapper){
  border-radius:var(--radi-5);
}
:where(.cck-toggle__knob.cck-toggle__size--md .cck-toggle__backdrop){
  border-radius:var(--radi-5);
}
:where(.cck-toggle__knob.cck-toggle__size--lg){
  --frames-x--toggle-margin:4px;
}
:where(.cck-toggle__knob.cck-toggle__size--lg .cck-toggle__slider-wrapper){
  width:56px;
  height:32px;
}
:where(.cck-toggle__knob.cck-toggle__size--lg .cck-toggle__thumb){
  width:26px;
  height:24px;
  border-radius:var(--radi-5);
}
:where(.cck-toggle__knob.cck-toggle__size--lg .cck-toggle__slider-wrapper){
  border-radius:var(--radi-6);
}
:where(.cck-toggle__knob.cck-toggle__size--lg .cck-toggle__backdrop){
  border-radius:var(--radi-6);
}
:where(.cck-toggle__knob.cck-toggle__size--xl){
  --frames-x--toggle-margin:4px;
}
:where(.cck-toggle__knob.cck-toggle__size--xl .cck-toggle__slider-wrapper){
  width:80px;
  height:44px;
}
:where(.cck-toggle__knob.cck-toggle__size--xl .cck-toggle__thumb){
  width:36px;
  height:36px;
  border-radius:var(--radi-5);
}
:where(.cck-toggle__knob.cck-toggle__size--xl .cck-toggle__slider-wrapper){
  border-radius:var(--radi-6);
}
:where(.cck-toggle__knob.cck-toggle__size--xl .cck-toggle__backdrop){
  border-radius:var(--radi-6);
}
:where(.cck-toggle__switch .cck-toggle__thumb){
  position:absolute;
  z-index:2;
  background-color:var(--base-surface-1);
  transition:0.3s ease all;
  box-shadow:0 1px 2px var(--colors-alpha-dark-50);
}
:where(.cck-toggle__switch .cck-toggle__backdrop){
  position:absolute;
  z-index:1;
  width:100%;
  height:100%;
  left:0;
  top:50%;
  transform:translate(0px, -50%);
  transition:0.3s ease background-color;
}
:where(.cck-toggle__switch.cck-toggle--checked .cck-toggle__thumb){
  top:50%;
  left:100%;
  transform:translate(-100%, -50%);
}
:where(.cck-toggle__switch.cck-toggle--checked .cck-toggle__backdrop){
  background-color:var(--state-brand-active);
}
:where(.cck-toggle__switch.cck-toggle--unchecked .cck-toggle__thumb){
  top:50%;
  left:0;
  transform:translate(0, -50%);
}
:where(.cck-toggle__switch.cck-toggle--unchecked .cck-toggle__backdrop){
  background-color:var(--base-fill-2);
}
:where(.cck-toggle__switch.cck-toggle__size--sm .cck-toggle__slider-wrapper){
  width:40px;
}
:where(.cck-toggle__switch.cck-toggle__size--sm .cck-toggle__thumb){
  width:20px;
  height:20px;
  border-radius:var(--radi-4);
}
:where(.cck-toggle__switch.cck-toggle__size--sm .cck-toggle__backdrop){
  border-radius:var(--radi-6);
  height:12px;
}
:where(.cck-toggle__switch.cck-toggle__size--md .cck-toggle__slider-wrapper){
  width:44px;
}
:where(.cck-toggle__switch.cck-toggle__size--md .cck-toggle__thumb){
  width:24px;
  height:24px;
  border-radius:var(--radi-5);
}
:where(.cck-toggle__switch.cck-toggle__size--md .cck-toggle__slider-wrapper){
  border-radius:var(--radi-5);
}
:where(.cck-toggle__switch.cck-toggle__size--md .cck-toggle__backdrop){
  border-radius:var(--radi-6);
  height:16px;
}
:where(.cck-toggle__switch.cck-toggle__size--lg .cck-toggle__slider-wrapper){
  width:56px;
}
:where(.cck-toggle__switch.cck-toggle__size--lg .cck-toggle__thumb){
  width:32px;
  height:32px;
  border-radius:var(--radi-6);
}
:where(.cck-toggle__switch.cck-toggle__size--lg .cck-toggle__slider-wrapper){
  border-radius:var(--radi-6);
}
:where(.cck-toggle__switch.cck-toggle__size--lg .cck-toggle__backdrop){
  border-radius:var(--radi-6);
  height:20px;
}
:where(.cck-toggle__switch.cck-toggle__size--xl .cck-toggle__slider-wrapper){
  width:80px;
}
:where(.cck-toggle__switch.cck-toggle__size--xl .cck-toggle__thumb){
  width:40px;
  height:40px;
  border-radius:var(--radi-6);
}
:where(.cck-toggle__switch.cck-toggle__size--xl .cck-toggle__slider-wrapper){
  border-radius:var(--radi-6);
}
:where(.cck-toggle__switch.cck-toggle__size--xl .cck-toggle__backdrop){
  border-radius:var(--radi-6);
  height:32px;
}
:where(.cck-toggle__knob.cck-toggle--disabled),:where( .cck-toggle__switch.cck-toggle--disabled){
  cursor:default;
  pointer-events:none;
}
:where(.cck-toggle__knob.cck-toggle--disabled .cck-toggle__thumb),:where( .cck-toggle__switch.cck-toggle--disabled .cck-toggle__thumb){
  background-color:var(--base-fill-3);
}
:where(.cck-toggle__knob.cck-toggle--disabled .cck-toggle__backdrop),:where( .cck-toggle__switch.cck-toggle--disabled .cck-toggle__backdrop){
  background-color:var(--base-fill-2);
}
:where(.cck-toggle__knob.cck-toggle--disabled .cck-toggle__label),:where( .cck-toggle__switch.cck-toggle--disabled .cck-toggle__label){
  color:var(--base-disabled);
}

:where(.cck-trailing){
  background-color:var(--base-surface-2);
  display:flex;
  justify-content:center;
  align-items:center;
  font:var(--text-base-font-medium);
  color:var(--text-dark-tertiary);
  gap:var(--spacing-4);
  padding:0 var(--spacing-7);
  cursor:default;
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
}
:where(.cck-trailing--clickable){
  cursor:pointer;
  transition:background-color 100ms;
}
:where(.cck-trailing--clickable):active{
  background-color:var(--base-fill-1);
}
:where(.cck-trailing--clickable):hover:not(:active){
  background-color:var(--base-fill-2);
}

:where(.cck-avatar){
  border-radius:50%;
  display:flex;
  justify-content:center;
  align-items:center;
  overflow:hidden;
}
:where(.cck-avatar__image),:where( .cck-avatar__placeholder-image),:where( .cck-avatar__fallback-image){
  width:100%;
  height:100%;
  -o-object-fit:cover;
  object-fit:cover;
  border-radius:inherit;
}
:where(.cck-avatar--with-label){
  color:var(--text-light-primary);
  background-color:var(--state-brand-active);
}
:where(.cck-avatar--clickable){
  cursor:pointer;
}
:where(.cck-avatar__size--xs){
  width:28px;
  height:28px;
}
:where(.cck-avatar__size--xs.cck-avatar--with-label){
  font:var(--text-xs-font-semibold);
}
:where(.cck-avatar__size--sm){
  width:32px;
  height:32px;
}
:where(.cck-avatar__size--sm.cck-avatar--with-label){
  font:var(--text-xs-font-semibold);
}
:where(.cck-avatar__size--md){
  width:40px;
  height:40px;
}
:where(.cck-avatar__size--md.cck-avatar--with-label){
  font:var(--text-sm-font-semibold);
}
:where(.cck-avatar__size--lg){
  width:44px;
  height:44px;
}
:where(.cck-avatar__size--lg.cck-avatar--with-label){
  font:var(--text-lg-font-semibold);
}
:where(.cck-avatar__size--xl){
  width:56px;
  height:56px;
}
:where(.cck-avatar__size--xl.cck-avatar--with-label){
  font:var(--text-xl-font-semibold);
}
:where(.cck-avatar__size--2xl){
  width:72px;
  height:72px;
}
:where(.cck-avatar__size--2xl.cck-avatar--with-label){
  font:var(--text-2xl-font-semibold);
}

:where(.cck-avatar-group){
  display:flex;
}
:where(.cck-avatar-group--direction-left){
  direction:rtl;
}
:where(.cck-avatar-group--direction-left.cck-avatar-group__size--xs .cck-avatar):not(:last-of-type){
  margin-left:-10px;
}
:where(.cck-avatar-group--direction-left.cck-avatar-group__size--sm .cck-avatar):not(:last-of-type){
  margin-left:-10px;
}
:where(.cck-avatar-group--direction-left.cck-avatar-group__size--md .cck-avatar):not(:last-of-type){
  margin-left:-14px;
}
:where(.cck-avatar-group--direction-left.cck-avatar-group__size--lg .cck-avatar):not(:last-of-type){
  margin-left:-16px;
}
:where(.cck-avatar-group--direction-left.cck-avatar-group__size--xl .cck-avatar):not(:last-of-type){
  margin-left:-16px;
}
:where(.cck-avatar-group--direction-left.cck-avatar-group__size--2xl .cck-avatar):not(:last-of-type){
  margin-left:-18px;
}
:where(.cck-avatar-group--direction-right.cck-avatar-group__size--xs .cck-avatar):not(:first-of-type){
  margin-left:-10px;
}
:where(.cck-avatar-group--direction-right.cck-avatar-group__size--sm .cck-avatar):not(:first-of-type){
  margin-left:-10px;
}
:where(.cck-avatar-group--direction-right.cck-avatar-group__size--md .cck-avatar):not(:first-of-type){
  margin-left:-14px;
}
:where(.cck-avatar-group--direction-right.cck-avatar-group__size--lg .cck-avatar):not(:first-of-type){
  margin-left:-16px;
}
:where(.cck-avatar-group--direction-right.cck-avatar-group__size--xl .cck-avatar):not(:first-of-type){
  margin-left:-16px;
}
:where(.cck-avatar-group--direction-right.cck-avatar-group__size--2xl .cck-avatar):not(:first-of-type){
  margin-left:-18px;
}
:where(.cck-avatar-group .cck-avatar){
  border:2px solid var(--base-surface-1);
}

:where(.cck-avatar-label){
  display:flex;
  align-items:center;
}
:where(.cck-avatar-label__title){
  color:var(--text-dark-primary);
}
:where(.cck-avatar-label__description){
  color:var(--text-dark-tertiary);
}
:where(.cck-avatar-label__label-wrapper){
  display:flex;
}
:where(.cck-avatar-label--avatar-right){
  flex-direction:row-reverse;
}
:where(.cck-avatar-label--avatar-right .cck-avatar-label__label-wrapper){
  text-align:right;
}
:where(.cck-avatar-label--avatar-left){
  flex-direction:row;
}
:where(.cck-avatar-label--avatar-top){
  flex-direction:column;
}
:where(.cck-avatar-label--avatar-bottom){
  flex-direction:column-reverse;
}
:where(.cck-avatar-label--avatar-top.cck-avatar-label--label-vertical .cck-avatar-label__label-wrapper),:where( .cck-avatar-label--avatar-bottom.cck-avatar-label--label-vertical .cck-avatar-label__label-wrapper){
  align-items:center;
}
:where(.cck-avatar-label--avatar-left.cck-avatar-label--label-horizontal .cck-avatar-label__label-wrapper),:where( .cck-avatar-label--avatar-right.cck-avatar-label--label-horizontal .cck-avatar-label__label-wrapper){
  align-items:center;
}
:where(.cck-avatar-label--label-horizontal .cck-avatar-label__label-wrapper){
  flex-direction:row;
  align-items:center;
}
:where(.cck-avatar-label--label-vertical .cck-avatar-label__label-wrapper){
  flex-direction:column;
  justify-content:center;
}
:where(.cck-avatar-label__size--xs){
  gap:var(--spacing-5);
}
:where(.cck-avatar-label__size--xs .cck-avatar-label__label-wrapper){
  gap:2px;
  font:var(--text-xs-font-medium);
}
:where(.cck-avatar-label__size--xs.cck-avatar-label--avatar-left.cck-avatar-label--label-horizontal .cck-avatar-label__label-wrapper),:where( .cck-avatar-label__size--xs.cck-avatar-label--avatar-right.cck-avatar-label--label-horizontal .cck-avatar-label__label-wrapper){
  gap:var(--spacing-5);
}
:where(.cck-avatar-label__size--sm){
  gap:var(--spacing-5);
}
:where(.cck-avatar-label__size--sm .cck-avatar-label__label-wrapper){
  font:var(--text-xs-font-medium);
}
:where(.cck-avatar-label__size--sm.cck-avatar-label--label-horizontal .cck-avatar-label__label-wrapper){
  gap:var(--spacing-5);
}
:where(.cck-avatar-label__size--sm.cck-avatar-label--label-vertical .cck-avatar-label__label-wrapper){
  gap:4px;
}
:where(.cck-avatar-label__size--md){
  gap:var(--spacing-5);
}
:where(.cck-avatar-label__size--md .cck-avatar-label__label-wrapper){
  font:var(--text-sm-font-medium);
}
:where(.cck-avatar-label__size--md.cck-avatar-label--label-horizontal .cck-avatar-label__label-wrapper){
  gap:var(--spacing-5);
}
:where(.cck-avatar-label__size--md.cck-avatar-label--label-vertical .cck-avatar-label__label-wrapper){
  gap:2px;
}
:where(.cck-avatar-label__size--lg){
  gap:var(--spacing-8);
}
:where(.cck-avatar-label__size--lg .cck-avatar-label__label-wrapper){
  font:var(--text-base-font-medium);
}
:where(.cck-avatar-label__size--lg.cck-avatar-label--label-horizontal .cck-avatar-label__label-wrapper){
  gap:var(--spacing-8);
}
:where(.cck-avatar-label__size--lg.cck-avatar-label--label-vertical .cck-avatar-label__label-wrapper){
  gap:2px;
}
:where(.cck-avatar-label__size--xl){
  gap:var(--spacing-8);
}
:where(.cck-avatar-label__size--xl .cck-avatar-label__label-wrapper){
  font:var(--text-lg-font-medium);
}
:where(.cck-avatar-label__size--xl.cck-avatar-label--label-horizontal .cck-avatar-label__label-wrapper){
  gap:var(--spacing-8);
}
:where(.cck-avatar-label__size--xl.cck-avatar-label--label-vertical .cck-avatar-label__label-wrapper){
  gap:4px;
}
:where(.cck-avatar-label__size--2xl){
  gap:var(--spacing-8);
}
:where(.cck-avatar-label__size--2xl .cck-avatar-label__label-wrapper){
  font:var(--text-xl-font-medium);
}
:where(.cck-avatar-label__size--2xl.cck-avatar-label--label-horizontal .cck-avatar-label__label-wrapper){
  gap:var(--spacing-8);
}
:where(.cck-avatar-label__size--2xl.cck-avatar-label--label-vertical .cck-avatar-label__label-wrapper){
  gap:4px;
}

:where(.cck-accordion){
  display:flex;
  flex-direction:column;
}
:where(.cck-accordion__default.cck-accordion__size--sm){
  gap:var(--spacing-7);
}
:where(.cck-accordion__default.cck-accordion__size--md){
  gap:var(--spacing-8);
}
:where(.cck-accordion__underline.cck-accordion__size--sm){
  gap:var(--spacing-8);
}
:where(.cck-accordion__underline.cck-accordion__size--md){
  gap:var(--spacing-10);
}

:where(.cck-accordion-header){
  display:flex;
  align-items:center;
  color:var(--text-dark-primary);
}
:where(.cck-accordion-header .cck-svg-icon.cck-svg-icon--default-color){
  fill:var(--text-dark-primary);
}
:where(.cck-accordion-header--icon-left){
  flex-direction:row-reverse;
  justify-content:flex-end;
}
:where(.cck-accordion-header--icon-left > .cck-accordion-header__icon-btn){
  margin-right:var(--spacing-8);
}
:where(.cck-accordion-header--icon-right > .cck-accordion-header__icon-btn){
  margin-left:auto;
}
:where(.cck-accordion-header .cck-accordion-header__icon-btn){
  background-color:transparent;
  border:none;
  color:var(--base-fill-4);
  border-radius:var(--radi-6);
  cursor:pointer;
  outline:none;
}
:where(.cck-accordion-header .cck-accordion-header__icon-btn):hover{
  border:none;
}
:where(.cck-accordion-header--trigger-icon .cck-accordion-header__icon-btn):hover{
  background-color:var(--base-fill-1);
}
:where(.cck-accordion-header--trigger-header){
  cursor:pointer;
}
:where(.cck-accordion-header--trigger-header > .cck-accordion-header__icon-btn):hover{
  background-color:transparent;
}

:where(.cck-accordion-panel--disabled > .cck-accordion-header){
  color:var(--base-disabled);
}
:where(.cck-accordion-panel--disabled > .cck-accordion-header--trigger-header){
  cursor:not-allowed;
}
:where(.cck-accordion-panel--disabled > .cck-accordion-header > .cck-accordion-header__icon-btn){
  display:none;
}
:where(.cck-accordion__size--sm .cck-accordion-header){
  font:var(--text-base-font-medium);
}
:where(.cck-accordion__size--sm .cck-accordion-header > .cck-accordion-header__icon-btn){
  width:36px;
  height:36px;
}
:where(.cck-accordion__size--md .cck-accordion-header){
  font:var(--text-lg-font-medium);
}
:where(.cck-accordion__size--md .cck-accordion-header > .cck-accordion-header__icon-btn){
  width:44px;
  height:44px;
}
:where(.cck-accordion__default > .cck-accordion-panel--collapsed > .cck-accordion-header){
  background-color:var(--base-surface-2);
}
:where(.cck-accordion__default.cck-accordion__size--sm > .cck-accordion-panel > .cck-accordion-header){
  height:56px;
  padding:0 var(--spacing-7) 0 var(--spacing-8);
}
:where(.cck-accordion__default.cck-accordion__size--md > .cck-accordion-panel > .cck-accordion-header){
  height:72px;
  padding:0 var(--spacing-8) 0 var(--spacing-10);
}
:where(.cck-accordion__underline.cck-accordion__size--sm > .cck-accordion-panel > .cck-accordion-header){
  height:40px;
}
:where(.cck-accordion__underline.cck-accordion__size--md > .cck-accordion-panel > .cck-accordion-header){
  height:52px;
}

:where(.cck-accordion-panel){
  overflow:hidden;
}
:where(.cck-accordion-panel__content-wrapper){
  font:var(--text-base-font-regular);
  color:var(--text-dark-secondary);
}
:where(.cck-accordion-panel--collapsed){
  padding-bottom:0;
}

:where(.cck-accordion-panel){
  transition:padding-bottom 300ms;
}
:where(.cck-accordion--instant-animation > .cck-accordion-panel){
  transition:none;
}
:where(.cck-accordion__size--sm .cck-accordion-panel--expanded){
  padding-bottom:var(--spacing-8);
}
:where(.cck-accordion__size.md .cck-accordion-panel--expanded){
  padding-bottom:var(--spacing-10);
}
:where(.cck-accordion__default > .cck-accordion-panel){
  border:1px solid var(--base-border);
  border-radius:var(--radi-6);
  background-color:var(--base-surface-1);
}
:where(.cck-accordion__default.cck-accordion__size--sm > .cck-accordion-panel > .cck-accordion-panel__content-wrapper){
  padding-left:var(--spacing-8);
  padding-right:var(--spacing-7);
}
:where(.cck-accordion__default.cck-accordion__size--md > .cck-accordion-panel > .cck-accordion-panel__content-wrapper){
  padding-left:var(--spacing-10);
  padding-right:var(--spacing-8);
}
:where(.cck-accordion__underline){
  padding-bottom:var(--spacing-8);
}
:where(.cck-accordion__underline > .cck-accordion-panel){
  border-bottom:1px solid var(--base-border);
}

:where(.cck-tabs){
  display:flex;
  flex-direction:column;
  gap:12px;
}

:where(.cck-tabs__headers-wrapper){
  display:flex;
  justify-content:center;
  gap:var(--spacing-2);
  flex-wrap:wrap;
}

:where(.cck-tabs--align-left .cck-tabs__headers-wrapper){
  align-self:flex-start;
  align-items:flex-start;
  justify-content:flex-start;
}

:where(.cck-tabs--align-center .cck-tabs__headers-wrapper){
  align-self:center;
  align-items:center;
  justify-content:center;
}

:where(.cck-tabs--align-right .cck-tabs__headers-wrapper){
  align-self:flex-end;
  align-items:flex-end;
  justify-content:flex-end;
}

:where(.cck-tabs--align-stretch .cck-tabs__headers-wrapper){
  align-self:stretch;
  align-items:stretch;
  justify-content:stretch;
}

:where(.cck-tabs__toggle .cck-tabs__headers-wrapper){
  padding:var(--spacing-2);
  border-radius:var(--radi-6);
  background-color:var(--base-fill-1);
}

:where(.cck-tabs__size--sm .cck-tabs__headers-wrapper){
  min-height:36px;
}

:where(.cck-tabs__size--md .cck-tabs__headers-wrapper){
  min-height:44px;
}

:where(.cck-tabs__size--lg .cck-tabs__headers-wrapper){
  min-height:56px;
}

:where(.cck-tab){
  display:flex;
  background:transparent;
  border:none;
  outline:none;
  color:var(--text-dark-tertiary);
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  cursor:pointer;
  position:relative;
}
:where(.cck-tab .cck-svg-icon.cck-svg-icon--default-color){
  color:currentcolor;
  fill:currentcolor;
}

:where(.cck-tab__label){
  position:relative;
  z-index:1;
}

:where(.cck-tab--unselected):not(.cck-tab--disabled):focus-visible{
  outline:2px solid var(--state-brand-selected);
}

:where(.cck-tab--selected){
  color:var(--text-dark-primary);
}

:where(.cck-tab--disabled){
  color:var(--base-disabled);
  cursor:not-allowed;
}

:where(.cck-tab__indicator){
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:0;
}

:where(.cck-tabs--align-stretch .cck-tab){
  flex:1;
}

:where(.cck-tabs__toggle .cck-tab){
  border-radius:var(--radi-5);
}
:where(.cck-tabs__toggle .cck-tab--unselected):not(.cck-tab--disabled):hover{
  background-color:var(--base-fill-2);
}
:where(.cck-tabs__toggle .cck-tab__indicator){
  border-radius:var(--radi-5);
  background-color:var(--base-surface-1);
  border:1px solid var(--base-border);
}

:where(.cck-tabs__fill .cck-tab){
  border-radius:var(--radi-6);
}
:where(.cck-tabs__fill .cck-tab__indicator){
  border-radius:var(--radi-5);
  background-color:var(--base-surface-2);
  border:2px solid var(--state-brand-selected);
}

:where(.cck-tabs__line .cck-tab__indicator){
  border-bottom:var(--stroke-lg) solid var(--state-brand-selected);
}

:where(.cck-tabs__size--sm .cck-tab){
  font:var(--text-sm-font-medium);
  padding:0 var(--spacing-7);
  height:36px;
}
:where(.cck-tabs__size--sm .cck-tab.cck-tab--selected){
  font:var(--text-sm-font-semibold);
}

:where(.cck-tabs__size--md .cck-tab){
  font:var(--text-base-font-medium);
  padding:0 var(--spacing-8);
  height:44px;
}
:where(.cck-tabs__size--md .cck-tab.cck-tab--selected){
  font:var(--text-base-font-semibold);
}

:where(.cck-tabs__size--lg .cck-tab){
  font:var(--text-lg-font-medium);
  padding:0 var(--spacing-9);
  height:56px;
}
:where(.cck-tabs__size--lg .cck-tab.cck-tab--selected){
  font:var(--text-lg-font-semibold);
}