tdesign-react 0.45.6-alpha.1 → 0.45.6-alpha.2

package/es/tabs/style/index.css

@@ -1 +1,362 @@
-.t-tabs{font:var(--td-font-body-medium);color:var(--td-text-color-primary);-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;list-style:none;overflow:hidden;background-color:var(--td-bg-color-container)}.t-tabs .t-icon{font-size:var(--td-font-size-body-large)}.t-tabs__header.t-is-left{float:left}.t-tabs__header.t-is-right{float:right}.t-tabs__nav{position:relative;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.t-tabs__operations{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;position:absolute;border-bottom:1px solid var(--td-component-stroke)}.t-tabs__operations--left{left:0}.t-tabs__operations--right{right:0}.t-tabs__operations--right .t-tabs__btn:first-child{-webkit-box-shadow:-10px 0 20px 5px rgba(0,0,0,.05);box-shadow:-10px 0 20px 5px rgba(0,0,0,.05)}.t-tabs__btn{width:40px;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background-color:var(--td-bg-color-secondarycontainer);border-left:1px solid var(--td-component-stroke);cursor:pointer;color:var(--td-text-color-secondary);font:var(--td-font-body-large);-webkit-transition:all .24s cubic-bezier(.38,0,.24,1);transition:all .24s cubic-bezier(.38,0,.24,1);z-index:1;opacity:1}.t-tabs__btn:hover{background-color:var(--td-bg-color-secondarycontainer-hover)}.t-tabs__btn.t-size-m{height:var(--td-comp-size-xxl);line-height:var(--td-comp-size-xxl)}.t-tabs__btn.t-size-l{height:var(--td-comp-size-xxxxl);line-height:var(--td-comp-size-xxxxl)}.t-tabs__btn--left{border-right:1px solid var(--td-component-stroke);-webkit-box-shadow:10px 0 20px 5px rgba(0,0,0,.05);box-shadow:10px 0 20px 5px rgba(0,0,0,.05)}.t-tabs__btn--left.fade-enter,.t-tabs__btn--left.fade-enter-from,.t-tabs__btn--left.fade-leave-to{-webkit-transform:translateX(-50px);transform:translateX(-50px)}.t-tabs__btn--right.fade-enter,.t-tabs__btn--right.fade-enter-from,.t-tabs__btn--right.fade-leave-to{-webkit-transform:translateX(50px);transform:translateX(50px)}.t-tabs__nav-container{position:relative}.t-tabs__nav-container.t-is-top:after{top:auto;bottom:0}.t-tabs__nav-container.t-is-bottom:after,.t-tabs__nav-container.t-is-top:after{content:"";width:100%;height:1px;position:absolute;right:auto;left:0;background-color:var(--td-bg-color-secondarycontainer)}.t-tabs__nav-container.t-is-bottom:after{top:0;bottom:auto}.t-tabs__nav-container.t-is-left:after{right:0;left:auto}.t-tabs__nav-container.t-is-left:after,.t-tabs__nav-container.t-is-right:after{content:"";width:1px;height:100%;position:absolute;top:0;bottom:auto;background-color:var(--td-bg-color-secondarycontainer)}.t-tabs__nav-container.t-is-right:after{right:auto;left:0}.t-tabs__nav-container.t-is-addable{margin-right:40px}.t-tabs__nav-container.t-tabs__nav--card:after{content:"";background-color:transparent}.t-tabs__scroll-btn{position:absolute;z-index:1;width:40px;height:100%;display:block;background-color:var(--td-bg-color-secondarycontainer);text-align:center;border-bottom:1px solid var(--td-component-stroke);cursor:pointer;color:var(--td-text-color-secondary);font:var(--td-font-body-large)}.t-tabs__scroll-btn.t-size-m{height:var(--td-comp-size-xxl);line-height:var(--td-comp-size-xxl)}.t-tabs__scroll-btn.t-size-l{height:var(--td-comp-size-xxxxl);line-height:var(--td-comp-size-xxxxl)}.t-tabs__nav-scroll{position:relative;display:inline-block;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:auto;flex:auto;-ms-flex-item-align:stretch;align-self:stretch;overflow:hidden;white-space:nowrap;-webkit-transform:translate(0);transform:translate(0)}.t-tabs__nav-wrap{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:0}.t-tabs__nav-wrap.t-is-smooth{-webkit-transition:-webkit-transform .24s cubic-bezier(.38,0,.24,1);transition:-webkit-transform .24s cubic-bezier(.38,0,.24,1);transition:transform .24s cubic-bezier(.38,0,.24,1);transition:transform .24s cubic-bezier(.38,0,.24,1), -webkit-transform .24s cubic-bezier(.38,0,.24,1)}.t-tabs__nav-wrap.t-is-vertical{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.t-tabs__bar{position:absolute;background-color:var(--td-brand-color);z-index:1;-webkit-transition:all .24s cubic-bezier(.38,0,.24,1);transition:all .24s cubic-bezier(.38,0,.24,1);border-radius:var(--td-radius-small)}.t-tabs__bar.t-is-top{bottom:0;left:0;height:3px}.t-tabs__bar.t-is-bottom{top:0;left:0;height:3px}.t-tabs__bar.t-is-left{top:0;right:0;width:3px}.t-tabs__bar.t-is-right{top:0;left:0;width:3px}.t-tabs__nav-item{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font:var(--td-font-body-medium);color:var(--td-text-color-secondary);position:relative;overflow:hidden;z-index:0;cursor:pointer;-ms-flex-negative:0;flex-shrink:0}.t-tabs__nav-item,.t-tabs__nav-item-wrapper{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:background-color .2s cubic-bezier(.38,0,.24,1);transition:background-color .2s cubic-bezier(.38,0,.24,1);--ripple-color:var(--td-bg-color-container-active)}.t-tabs__nav-item-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;height:var(--td-comp-size-m);padding:0 var(--td-comp-paddingLR-s);margin-left:var(--td-comp-margin-s);margin-right:var(--td-comp-margin-s);border-radius:var(--td-radius-default)}.t-tabs__nav-item.t-size-l{font:var(--td-font-body-large)}.t-tabs__nav-item.t-size-l .t-tabs__nav-item-wrapper{height:var(--td-comp-size-xxl);padding:0 var(--td-comp-paddingLR-m)}.t-tabs__nav-item-text-wrapper{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.t-tabs__nav-item:not(.t-is-disabled):not(.t-is-active):hover .t-tabs__nav-item-wrapper{background-color:var(--td-bg-color-container-hover)}.t-tabs__nav-item.t-is-left,.t-tabs__nav-item.t-is-right{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.t-tabs__nav-item.t-size-m{height:var(--td-comp-size-xxl);line-height:var(--td-comp-size-xxl)}.t-tabs__nav-item.t-size-l{height:var(--td-comp-size-xxxxl);line-height:var(--td-comp-size-xxxxl)}.t-tabs__nav-item.t-is-active{color:var(--td-brand-color);text-shadow:0 0 .3px currentcolor}.t-tabs__nav-item.t-is-disabled{color:var(--td-text-color-disabled);cursor:not-allowed}.t-tabs__nav-item>.remove-btn{margin-left:var(--td-comp-margin-s);-webkit-transition:all .3s cubic-bezier(.645,.045,.355,1);transition:all .3s cubic-bezier(.645,.045,.355,1)}.t-tabs__nav--card{background-color:var(--td-bg-color-secondarycontainer)}.t-tabs__nav--card.t-tabs__nav-item{padding-right:var(--td-comp-paddingLR-l);padding-left:var(--td-comp-paddingLR-l);border-bottom:1px solid var(--td-component-stroke)}.t-tabs__nav--card.t-tabs__nav-item:after{display:none}.t-tabs__nav--card.t-tabs__nav-item:not(.t-is-disabled):not(.t-is-active):hover{background-color:var(--td-bg-color-secondarycontainer-hover)}.t-tabs__nav--card.t-tabs__nav-item:not(:first-of-type){border-left:1px solid var(--td-component-stroke)}.t-tabs__nav--card.t-tabs__nav-item:last-of-type{border-right:1px solid var(--td-component-stroke)}.t-tabs__nav--card.t-tabs__nav-item.t-is-active{color:var(--td-brand-color);background-color:var(--td-bg-color-container);border-bottom-color:var(--td-bg-color-container)}.t-tabs__nav--card.t-tabs__nav-item.t-size-l{padding-left:var(--td-comp-paddingLR-xl);padding-right:var(--td-comp-paddingLR-xl)}.t-tabs__nav--card .t-icon-close{color:var(--td-text-color-secondary);-webkit-transition:color .2s cubic-bezier(.38,0,.24,1);transition:color .2s cubic-bezier(.38,0,.24,1)}.t-tabs__nav--card .t-icon-close:hover{color:var(--td-text-color-primary)}.t-tabs__content{overflow:hidden;position:relative}
+.t-tabs {
+  font: var(--td-font-body-medium);
+  color: var(--td-text-color-primary);
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  overflow: hidden;
+  background-color: var(--td-bg-color-container);
+}
+.t-tabs .t-icon {
+  font-size: var(--td-font-size-body-large);
+}
+.t-tabs__header.t-is-left {
+  float: left;
+}
+.t-tabs__header.t-is-right {
+  float: right;
+}
+.t-tabs__nav {
+  position: relative;
+  overflow: hidden;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+}
+.t-tabs__operations {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: row;
+          flex-direction: row;
+  position: absolute;
+  border-bottom: 1px solid var(--td-component-stroke);
+}
+.t-tabs__operations--left {
+  left: 0;
+}
+.t-tabs__operations--right {
+  right: 0;
+}
+.t-tabs__operations--right .t-tabs__btn:first-child {
+  -webkit-box-shadow: -10px 0 20px 5px rgba(0, 0, 0, 0.05);
+          box-shadow: -10px 0 20px 5px rgba(0, 0, 0, 0.05);
+}
+.t-tabs__btn {
+  width: 40px;
+  height: 100%;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  background-color: var(--td-bg-color-secondarycontainer);
+  border-left: 1px solid var(--td-component-stroke);
+  cursor: pointer;
+  color: var(--td-text-color-secondary);
+  font: var(--td-font-body-large);
+  -webkit-transition: all 0.24s cubic-bezier(0.38, 0, 0.24, 1);
+  transition: all 0.24s cubic-bezier(0.38, 0, 0.24, 1);
+  z-index: 1;
+  opacity: 1;
+}
+.t-tabs__btn:hover {
+  background-color: var(--td-bg-color-secondarycontainer-hover);
+}
+.t-tabs__btn.t-size-m {
+  height: var(--td-comp-size-xxl);
+  line-height: var(--td-comp-size-xxl);
+}
+.t-tabs__btn.t-size-l {
+  height: var(--td-comp-size-xxxxl);
+  line-height: var(--td-comp-size-xxxxl);
+}
+.t-tabs__btn--left {
+  border-right: 1px solid var(--td-component-stroke);
+  -webkit-box-shadow: 10px 0px 20px 5px rgba(0, 0, 0, 0.05);
+          box-shadow: 10px 0px 20px 5px rgba(0, 0, 0, 0.05);
+}
+.t-tabs__btn--left.fade-enter,
+.t-tabs__btn--left.fade-enter-from,
+.t-tabs__btn--left.fade-leave-to {
+  -webkit-transform: translateX(-50px);
+          transform: translateX(-50px);
+}
+.t-tabs__btn--right.fade-enter,
+.t-tabs__btn--right.fade-enter-from,
+.t-tabs__btn--right.fade-leave-to {
+  -webkit-transform: translateX(50px);
+          transform: translateX(50px);
+}
+.t-tabs__nav-container {
+  position: relative;
+}
+.t-tabs__nav-container.t-is-top::after {
+  content: "";
+  width: 100%;
+  height: 1px;
+  position: absolute;
+  top: auto;
+  right: auto;
+  bottom: 0;
+  left: 0;
+  background-color: var(--td-bg-color-secondarycontainer);
+}
+.t-tabs__nav-container.t-is-bottom::after {
+  content: "";
+  width: 100%;
+  height: 1px;
+  position: absolute;
+  top: 0;
+  right: auto;
+  bottom: auto;
+  left: 0;
+  background-color: var(--td-bg-color-secondarycontainer);
+}
+.t-tabs__nav-container.t-is-left::after {
+  content: "";
+  width: 1px;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: auto;
+  left: auto;
+  background-color: var(--td-bg-color-secondarycontainer);
+}
+.t-tabs__nav-container.t-is-right::after {
+  content: "";
+  width: 1px;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  right: auto;
+  bottom: auto;
+  left: 0;
+  background-color: var(--td-bg-color-secondarycontainer);
+}
+.t-tabs__nav-container.t-is-addable {
+  margin-right: 40px;
+}
+.t-tabs__nav-container.t-tabs__nav--card::after {
+  content: "";
+  background-color: transparent;
+}
+.t-tabs__scroll-btn {
+  position: absolute;
+  z-index: 1;
+  width: 40px;
+  height: 100%;
+  display: block;
+  background-color: var(--td-bg-color-secondarycontainer);
+  text-align: center;
+  border-bottom: 1px solid var(--td-component-stroke);
+  cursor: pointer;
+  color: var(--td-text-color-secondary);
+  font: var(--td-font-body-large);
+}
+.t-tabs__scroll-btn.t-size-m {
+  height: var(--td-comp-size-xxl);
+  line-height: var(--td-comp-size-xxl);
+}
+.t-tabs__scroll-btn.t-size-l {
+  height: var(--td-comp-size-xxxxl);
+  line-height: var(--td-comp-size-xxxxl);
+}
+.t-tabs__nav-scroll {
+  position: relative;
+  display: inline-block;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex: 1;
+      -ms-flex: auto;
+          flex: auto;
+  -ms-flex-item-align: stretch;
+      align-self: stretch;
+  overflow: hidden;
+  white-space: nowrap;
+  -webkit-transform: translate(0);
+          transform: translate(0);
+}
+.t-tabs__nav-wrap {
+  position: relative;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  font-size: 0;
+}
+.t-tabs__nav-wrap.t-is-smooth {
+  -webkit-transition: -webkit-transform 0.24s cubic-bezier(0.38, 0, 0.24, 1);
+  transition: -webkit-transform 0.24s cubic-bezier(0.38, 0, 0.24, 1);
+  transition: transform 0.24s cubic-bezier(0.38, 0, 0.24, 1);
+  transition: transform 0.24s cubic-bezier(0.38, 0, 0.24, 1), -webkit-transform 0.24s cubic-bezier(0.38, 0, 0.24, 1);
+}
+.t-tabs__nav-wrap.t-is-vertical {
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+}
+.t-tabs__bar {
+  position: absolute;
+  background-color: var(--td-brand-color);
+  z-index: 1;
+  -webkit-transition: all 0.24s cubic-bezier(0.38, 0, 0.24, 1);
+  transition: all 0.24s cubic-bezier(0.38, 0, 0.24, 1);
+  border-radius: var(--td-radius-small);
+}
+.t-tabs__bar.t-is-top {
+  bottom: 0;
+  left: 0;
+  height: 3px;
+}
+.t-tabs__bar.t-is-bottom {
+  top: 0;
+  left: 0;
+  height: 3px;
+}
+.t-tabs__bar.t-is-left {
+  top: 0;
+  right: 0;
+  width: 3px;
+}
+.t-tabs__bar.t-is-right {
+  top: 0;
+  left: 0;
+  width: 3px;
+}
+.t-tabs__nav-item {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  font: var(--td-font-body-medium);
+  color: var(--td-text-color-secondary);
+  position: relative;
+  overflow: hidden;
+  z-index: 0;
+  cursor: pointer;
+  -ms-flex-negative: 0;
+      flex-shrink: 0;
+  -webkit-transition: background-color cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
+  transition: background-color cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
+  --ripple-color: var(--td-bg-color-container-active);
+}
+.t-tabs__nav-item-wrapper {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  height: var(--td-comp-size-m);
+  padding: 0 var(--td-comp-paddingLR-s);
+  margin-left: var(--td-comp-margin-s);
+  margin-right: var(--td-comp-margin-s);
+  border-radius: var(--td-radius-default);
+  -webkit-transition: background-color cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
+  transition: background-color cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
+  --ripple-color: var(--td-bg-color-container-active);
+}
+.t-tabs__nav-item.t-size-l {
+  font: var(--td-font-body-large);
+}
+.t-tabs__nav-item.t-size-l .t-tabs__nav-item-wrapper {
+  height: var(--td-comp-size-xxl);
+  padding: 0 var(--td-comp-paddingLR-m);
+}
+.t-tabs__nav-item-text-wrapper {
+  position: relative;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+}
+.t-tabs__nav-item:not(.t-is-disabled):not(.t-is-active):hover .t-tabs__nav-item-wrapper {
+  background-color: var(--td-bg-color-container-hover);
+}
+.t-tabs__nav-item.t-is-left,
+.t-tabs__nav-item.t-is-right {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+}
+.t-tabs__nav-item.t-size-m {
+  height: var(--td-comp-size-xxl);
+  line-height: var(--td-comp-size-xxl);
+}
+.t-tabs__nav-item.t-size-l {
+  height: var(--td-comp-size-xxxxl);
+  line-height: var(--td-comp-size-xxxxl);
+}
+.t-tabs__nav-item.t-is-active {
+  color: var(--td-brand-color);
+  text-shadow: 0 0 0.3px currentcolor;
+}
+.t-tabs__nav-item.t-is-disabled {
+  color: var(--td-text-color-disabled);
+  cursor: not-allowed;
+}
+.t-tabs__nav-item > .remove-btn {
+  margin-left: var(--td-comp-margin-s);
+  -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+.t-tabs__nav--card {
+  background-color: var(--td-bg-color-secondarycontainer);
+}
+.t-tabs__nav--card.t-tabs__nav-item {
+  padding-right: var(--td-comp-paddingLR-l);
+  padding-left: var(--td-comp-paddingLR-l);
+  border-bottom: 1px solid var(--td-component-stroke);
+}
+.t-tabs__nav--card.t-tabs__nav-item::after {
+  display: none;
+}
+.t-tabs__nav--card.t-tabs__nav-item:not(.t-is-disabled):not(.t-is-active):hover {
+  background-color: var(--td-bg-color-secondarycontainer-hover);
+}
+.t-tabs__nav--card.t-tabs__nav-item:not(:first-of-type) {
+  border-left: 1px solid var(--td-component-stroke);
+}
+.t-tabs__nav--card.t-tabs__nav-item:last-of-type {
+  border-right: 1px solid var(--td-component-stroke);
+}
+.t-tabs__nav--card.t-tabs__nav-item.t-is-active {
+  color: var(--td-brand-color);
+  background-color: var(--td-bg-color-container);
+  border-bottom-color: var(--td-bg-color-container);
+}
+.t-tabs__nav--card.t-tabs__nav-item.t-size-l {
+  padding-left: var(--td-comp-paddingLR-xl);
+  padding-right: var(--td-comp-paddingLR-xl);
+}
+.t-tabs__nav--card .t-icon-close {
+  color: var(--td-text-color-secondary);
+  -webkit-transition: color cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
+  transition: color cubic-bezier(0.38, 0, 0.24, 1) 0.2s;
+}
+.t-tabs__nav--card .t-icon-close:hover {
+  color: var(--td-text-color-primary);
+}
+.t-tabs__content {
+  overflow: hidden;
+  position: relative;
+}

package/es/tag/style/index.css

@@ -1 +1,240 @@
-.t-tag{font:var(--td-font-body-medium);color:var(--td-text-color-primary);-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;list-style:none;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;padding:0 var(--td-comp-paddingLR-s);height:var(--td-comp-size-xs);font:var(--td-font-body-small);color:var(--td-text-color-anti);border-radius:var(--td-radius-default);border:1px solid transparent;white-space:nowrap}.t-tag .t-icon{margin-right:var(--td-comp-margin-xs);width:calc(var(--td-font-size-body-medium) + 2px);height:calc(var(--td-font-size-body-medium) + 2px);-ms-flex-negative:0;flex-shrink:0}.t-tag .t-tag__icon-close{margin-right:0;margin-left:var(--td-comp-margin-s);font:var(--td-font-body-medium);cursor:pointer;-webkit-transition:color .2s cubic-bezier(.38,0,.24,1);transition:color .2s cubic-bezier(.38,0,.24,1)}.t-tag--default{color:var(--td-text-color-primary);background-color:var(--td-bg-color-component)}.t-tag--default .t-tag__icon-close{color:var(--td-text-color-placeholder)}.t-tag--default .t-tag__icon-close:hover{color:var(--td-text-color-primary)}.t-tag--default.t-tag--checked{color:var(--td-text-color-anti);background-color:var(--td-brand-color)}.t-tag--default.t-tag--checked:hover{background-color:var(--td-brand-color-hover)}.t-tag--default:active{cursor:default}.t-tag--default.t-tag--check{-webkit-transition:background-color .2s cubic-bezier(.38,0,.24,1);transition:background-color .2s cubic-bezier(.38,0,.24,1);cursor:pointer}.t-tag--default.t-tag--check:hover:not(.t-tag--checked):not(.t-tag--disabled){background-color:var(--td-bg-color-component-hover)}.t-tag--default.t-tag--disabled{cursor:not-allowed}.t-tag--default.t-tag--disabled,.t-tag--default.t-tag--disabled:hover{color:var(--td-text-color-disabled);background-color:var(--td-bg-color-component-disabled)}.t-tag--default.t-tag--disabled .t-icon:hover{cursor:pointer}.t-tag--default.t-tag--outline{border-color:var(--td-component-border)}.t-tag--default.t-tag--light,.t-tag--default.t-tag--light-outline{background-color:var(--td-bg-color-secondarycontainer)}.t-tag--default.t-tag--light-outline{border-color:var(--td-component-border)}.t-tag--primary{background-color:var(--td-brand-color)}.t-tag--primary.t-tag--outline{border-color:var(--td-brand-color)}.t-tag--primary.t-tag--light,.t-tag--primary.t-tag--light-outline{background-color:var(--td-brand-color-light)}.t-tag--primary.t-tag--light-outline{border-color:var(--td-brand-color)}.t-tag--primary.t-tag--light,.t-tag--primary.t-tag--light-outline,.t-tag--primary.t-tag--outline{color:var(--td-brand-color)}.t-tag--primary.t-tag--light-outline .t-tag__icon-close:hover,.t-tag--primary.t-tag--light .t-tag__icon-close:hover,.t-tag--primary.t-tag--outline .t-tag__icon-close:hover{color:var(--td-brand-color-hover)}.t-tag--success{background-color:var(--td-success-color)}.t-tag--success.t-tag--outline{border-color:var(--td-success-color)}.t-tag--success.t-tag--light,.t-tag--success.t-tag--light-outline{background-color:var(--td-success-color-light)}.t-tag--success.t-tag--light-outline{border-color:var(--td-success-color)}.t-tag--success.t-tag--light,.t-tag--success.t-tag--light-outline,.t-tag--success.t-tag--outline{color:var(--td-success-color)}.t-tag--success.t-tag--light-outline .t-tag__icon-close:hover,.t-tag--success.t-tag--light .t-tag__icon-close:hover,.t-tag--success.t-tag--outline .t-tag__icon-close:hover{color:var(--td-success-color-hover)}.t-tag--warning{background-color:var(--td-warning-color)}.t-tag--warning.t-tag--outline{border-color:var(--td-warning-color)}.t-tag--warning.t-tag--light,.t-tag--warning.t-tag--light-outline{background-color:var(--td-warning-color-light)}.t-tag--warning.t-tag--light-outline{border-color:var(--td-warning-color)}.t-tag--warning.t-tag--light,.t-tag--warning.t-tag--light-outline,.t-tag--warning.t-tag--outline{color:var(--td-warning-color)}.t-tag--warning.t-tag--light-outline .t-tag__icon-close:hover,.t-tag--warning.t-tag--light .t-tag__icon-close:hover,.t-tag--warning.t-tag--outline .t-tag__icon-close:hover{color:var(--td-warning-color-hover)}.t-tag--danger{background-color:var(--td-error-color)}.t-tag--danger.t-tag--outline{border-color:var(--td-error-color)}.t-tag--danger.t-tag--light,.t-tag--danger.t-tag--light-outline{background-color:var(--td-error-color-light)}.t-tag--danger.t-tag--light-outline{border-color:var(--td-error-color)}.t-tag--danger .t-tag__icon-close{fill:var(--td-error-color)}.t-tag--danger .t-tag__icon-close:hover{fill:var(--td-error-color-hover)}.t-tag--danger.t-tag--light,.t-tag--danger.t-tag--light-outline,.t-tag--danger.t-tag--outline{color:var(--td-error-color)}.t-tag--danger.t-tag--light-outline .t-tag__icon-close:hover,.t-tag--danger.t-tag--light .t-tag__icon-close:hover,.t-tag--danger.t-tag--outline .t-tag__icon-close:hover{color:var(--td-error-color-hover)}.t-tag--dark.t-tag:not(.t-tag--default) .t-tag__icon-close{color:var(--td-font-white-2)}.t-tag--dark.t-tag:not(.t-tag--default) .t-tag__icon-close:hover{color:var(--td-font-white-1)}.t-tag.t-tag--outline{background:transparent}.t-tag.t-size-s{padding:0 var(--td-comp-paddingLR-xs);height:var(--td-comp-size-xxs);font:var(--td-font-body-small)}.t-tag.t-size-s .t-icon{font-size:var(--td-font-body-small)}.t-tag.t-size-l{padding:0 var(--td-comp-paddingLR-m);height:var(--td-comp-size-m)}.t-tag.t-size-l,.t-tag.t-size-l .t-icon{font:var(--td-font-body-medium)}.t-tag.t-tag--round{border-radius:var(--td-radius-extraLarge)}.t-tag.t-tag--mark{border-radius:0 var(--td-radius-extraLarge) var(--td-radius-extraLarge) 0}.t-tag.t-tag--ellipsis .t-tag--text{display:inline-block;white-space:nowrap;word-wrap:normal;overflow:hidden;text-overflow:ellipsis}a .t-tag{cursor:pointer;-webkit-transition:all .2s linear;transition:all .2s linear}a .t-tag:hover{color:var(--td-brand-color);background-color:var(--td-bg-color-component-hover)}a .t-tag:active{color:var(--td-brand-color-active);background-color:var(--td-bg-color-component-active)}
+.t-tag {
+  font: var(--td-font-body-medium);
+  color: var(--td-text-color-primary);
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: row;
+          flex-direction: row;
+  padding: 0px var(--td-comp-paddingLR-s);
+  height: var(--td-comp-size-xs);
+  font: var(--td-font-body-small);
+  color: var(--td-text-color-anti);
+  border-radius: var(--td-radius-default);
+  border: 1px solid transparent;
+  white-space: nowrap;
+}
+.t-tag .t-icon {
+  margin-right: var(--td-comp-margin-xs);
+  width: calc(var(--td-font-size-body-medium) + 2px);
+  height: calc(var(--td-font-size-body-medium) + 2px);
+  -ms-flex-negative: 0;
+      flex-shrink: 0;
+}
+.t-tag .t-tag__icon-close {
+  margin-right: 0;
+  margin-left: var(--td-comp-margin-s);
+  font: var(--td-font-body-medium);
+  cursor: pointer;
+  -webkit-transition: color 0.2s cubic-bezier(0.38, 0, 0.24, 1);
+  transition: color 0.2s cubic-bezier(0.38, 0, 0.24, 1);
+}
+.t-tag--default {
+  color: var(--td-text-color-primary);
+  background-color: var(--td-bg-color-component);
+}
+.t-tag--default .t-tag__icon-close {
+  color: var(--td-text-color-placeholder);
+}
+.t-tag--default .t-tag__icon-close:hover {
+  color: var(--td-text-color-primary);
+}
+.t-tag--default.t-tag--checked {
+  color: var(--td-text-color-anti);
+  background-color: var(--td-brand-color);
+}
+.t-tag--default.t-tag--checked:hover {
+  background-color: var(--td-brand-color-hover);
+}
+.t-tag--default:active {
+  cursor: default;
+}
+.t-tag--default.t-tag--check {
+  -webkit-transition: background-color 0.2s cubic-bezier(0.38, 0, 0.24, 1);
+  transition: background-color 0.2s cubic-bezier(0.38, 0, 0.24, 1);
+  cursor: pointer;
+}
+.t-tag--default.t-tag--check:hover:not(.t-tag--checked):not(.t-tag--disabled) {
+  background-color: var(--td-bg-color-component-hover);
+}
+.t-tag--default.t-tag--disabled {
+  color: var(--td-text-color-disabled);
+  background-color: var(--td-bg-color-component-disabled);
+  cursor: not-allowed;
+}
+.t-tag--default.t-tag--disabled:hover {
+  color: var(--td-text-color-disabled);
+  background-color: var(--td-bg-color-component-disabled);
+}
+.t-tag--default.t-tag--disabled .t-icon:hover {
+  cursor: pointer;
+}
+.t-tag--default.t-tag--outline {
+  border-color: var(--td-component-border);
+}
+.t-tag--default.t-tag--light {
+  background-color: var(--td-bg-color-secondarycontainer);
+}
+.t-tag--default.t-tag--light-outline {
+  border-color: var(--td-component-border);
+  background-color: var(--td-bg-color-secondarycontainer);
+}
+.t-tag--primary {
+  background-color: var(--td-brand-color);
+}
+.t-tag--primary.t-tag--outline {
+  border-color: var(--td-brand-color);
+}
+.t-tag--primary.t-tag--light {
+  background-color: var(--td-brand-color-light);
+}
+.t-tag--primary.t-tag--light-outline {
+  border-color: var(--td-brand-color);
+  background-color: var(--td-brand-color-light);
+}
+.t-tag--primary.t-tag--light,
+.t-tag--primary.t-tag--outline,
+.t-tag--primary.t-tag--light-outline {
+  color: var(--td-brand-color);
+}
+.t-tag--primary.t-tag--light .t-tag__icon-close:hover,
+.t-tag--primary.t-tag--outline .t-tag__icon-close:hover,
+.t-tag--primary.t-tag--light-outline .t-tag__icon-close:hover {
+  color: var(--td-brand-color-hover);
+}
+.t-tag--success {
+  background-color: var(--td-success-color);
+}
+.t-tag--success.t-tag--outline {
+  border-color: var(--td-success-color);
+}
+.t-tag--success.t-tag--light {
+  background-color: var(--td-success-color-light);
+}
+.t-tag--success.t-tag--light-outline {
+  border-color: var(--td-success-color);
+  background-color: var(--td-success-color-light);
+}
+.t-tag--success.t-tag--light,
+.t-tag--success.t-tag--outline,
+.t-tag--success.t-tag--light-outline {
+  color: var(--td-success-color);
+}
+.t-tag--success.t-tag--light .t-tag__icon-close:hover,
+.t-tag--success.t-tag--outline .t-tag__icon-close:hover,
+.t-tag--success.t-tag--light-outline .t-tag__icon-close:hover {
+  color: var(--td-success-color-hover);
+}
+.t-tag--warning {
+  background-color: var(--td-warning-color);
+}
+.t-tag--warning.t-tag--outline {
+  border-color: var(--td-warning-color);
+}
+.t-tag--warning.t-tag--light {
+  background-color: var(--td-warning-color-light);
+}
+.t-tag--warning.t-tag--light-outline {
+  border-color: var(--td-warning-color);
+  background-color: var(--td-warning-color-light);
+}
+.t-tag--warning.t-tag--light,
+.t-tag--warning.t-tag--outline,
+.t-tag--warning.t-tag--light-outline {
+  color: var(--td-warning-color);
+}
+.t-tag--warning.t-tag--light .t-tag__icon-close:hover,
+.t-tag--warning.t-tag--outline .t-tag__icon-close:hover,
+.t-tag--warning.t-tag--light-outline .t-tag__icon-close:hover {
+  color: var(--td-warning-color-hover);
+}
+.t-tag--danger {
+  background-color: var(--td-error-color);
+}
+.t-tag--danger.t-tag--outline {
+  border-color: var(--td-error-color);
+}
+.t-tag--danger.t-tag--light {
+  background-color: var(--td-error-color-light);
+}
+.t-tag--danger.t-tag--light-outline {
+  border-color: var(--td-error-color);
+  background-color: var(--td-error-color-light);
+}
+.t-tag--danger .t-tag__icon-close {
+  fill: var(--td-error-color);
+}
+.t-tag--danger .t-tag__icon-close:hover {
+  fill: var(--td-error-color-hover);
+}
+.t-tag--danger.t-tag--light,
+.t-tag--danger.t-tag--outline,
+.t-tag--danger.t-tag--light-outline {
+  color: var(--td-error-color);
+}
+.t-tag--danger.t-tag--light .t-tag__icon-close:hover,
+.t-tag--danger.t-tag--outline .t-tag__icon-close:hover,
+.t-tag--danger.t-tag--light-outline .t-tag__icon-close:hover {
+  color: var(--td-error-color-hover);
+}
+.t-tag--dark.t-tag:not(.t-tag--default) .t-tag__icon-close {
+  color: var(--td-font-white-2);
+}
+.t-tag--dark.t-tag:not(.t-tag--default) .t-tag__icon-close:hover {
+  color: var(--td-font-white-1);
+}
+.t-tag.t-tag--outline {
+  background: transparent;
+}
+.t-tag.t-size-s {
+  padding: 0px var(--td-comp-paddingLR-xs);
+  height: var(--td-comp-size-xxs);
+  font: var(--td-font-body-small);
+}
+.t-tag.t-size-s .t-icon {
+  font-size: var(--td-font-body-small);
+}
+.t-tag.t-size-l {
+  padding: 0px var(--td-comp-paddingLR-m);
+  height: var(--td-comp-size-m);
+  font: var(--td-font-body-medium);
+}
+.t-tag.t-size-l .t-icon {
+  font: var(--td-font-body-medium);
+}
+.t-tag.t-tag--round {
+  border-radius: var(--td-radius-extraLarge);
+}
+.t-tag.t-tag--mark {
+  border-radius: 0 var(--td-radius-extraLarge) var(--td-radius-extraLarge) 0;
+}
+.t-tag.t-tag--ellipsis .t-tag--text {
+  display: inline-block;
+  white-space: nowrap;
+  word-wrap: normal;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+a .t-tag {
+  cursor: pointer;
+  -webkit-transition: all 0.2s linear;
+  transition: all 0.2s linear;
+}
+a .t-tag:hover {
+  color: var(--td-brand-color);
+  background-color: var(--td-bg-color-component-hover);
+}
+a .t-tag:active {
+  color: var(--td-brand-color-active);
+  background-color: var(--td-bg-color-component-active);
+}