@font-face {
  font-family: "Avenir";
  src: url("/common/fonts/4ab86b35-c0c2-42b5-98ad-4b6eba66b197.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "AvenirLight";
  src: url("/common/fonts/57a79aa3-9b06-4ba7-a9a4-2b766d826ecf.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "AvenirMedium";
  src: url("/common/fonts/e91d1bbf-3fea-45e2-b003-a22b12ce6e5f.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "AvenirHeavy";
  src: url("/common/fonts/04d2f223-2786-40c9-8481-be9dd47d8e7f.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
html {
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: visible;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
body {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 100%;
  height: auto;
  line-height: 1;
  position: relative;
  background: #FFFFFF;
  font-family: 'Avenir', Arial, sans-serif;
}
section#main-content {
  flex: 1 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
}
#app {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
}
.noscroll {
  overflow: hidden;
  min-height: 0;
  height: 100%;
}
.noscroll .navbar#subnav {
  overflow-y: scroll;
  overflow-x: hidden;
  pointer-events: all;
}
html,
body,
div,
p,
h1,
h2,
h3,
h4,
h5,
h6,
section,
a,
ol,
ul,
footer,
header,
nav,
input,
button,
blockquote,
fieldset,
article {
  margin: 0;
  padding: 0;
  border: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-weight: normal;
  font-size: inherit;
}
html:focus,
body:focus,
div:focus,
p:focus,
h1:focus,
h2:focus,
h3:focus,
h4:focus,
h5:focus,
h6:focus,
section:focus,
a:focus,
ol:focus,
ul:focus,
footer:focus,
header:focus,
nav:focus,
input:focus,
button:focus,
blockquote:focus,
fieldset:focus,
article:focus {
  outline: none!important;
}
fieldset {
  min-width: 0;
}
a {
  text-decoration: none;
}
ul {
  list-style-type: none;
}
.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}
.clearfix:after {
  clear: both;
}
@keyframes tf-fade-in {
  to {
    opacity: 1;
  }
}
@keyframes tf-slide-up {
  to {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes tf-scale-in {
  to {
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes tf-spin {
  to {
    transform: rotate(360deg);
  }
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
body {
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  color: #333333;
  background-color: #ffffff;
  margin: 0;
}
h1,
h2,
h3 {
  margin: 0;
  font-weight: 600;
}
ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
a {
  text-decoration: none;
  color: inherit;
}
button {
  cursor: pointer;
  border: none;
  background-color: transparent;
  padding: 0;
}
.fDot:after {
  content: '.';
  display: inline;
  color: #FCB434;
}
.l-page-with-sidebar {
  display: grid;
  grid-template-columns: 320px 1fr;
  max-width: 1728px;
  margin: 0 auto;
}
.l-page-with-sidebar__main {
  padding: 24px;
}
.l-page {
  max-width: 1728px;
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
}
.icon:not(.icon-after):not(.icon-before) {
  display: inline-block;
  margin-right: 12px;
  vertical-align: text-bottom;
  background-size: cover;
  background-position: 0 50%;
  background-repeat: no-repeat;
}
.icon.icon-before:before,
.icon.icon-after:after {
  width: 20px;
  height: 20px;
}
.icon.icon-before:before {
  content: '';
  display: inline-block;
  margin-right: 12px;
  vertical-align: text-bottom;
  background-size: cover;
  background-position: 0 50%;
  background-repeat: no-repeat;
}
.icon.icon-after:after {
  content: '';
  display: inline-block;
  margin-right: 12px;
  vertical-align: text-bottom;
  background-size: cover;
  background-position: 0 50%;
  background-repeat: no-repeat;
  margin: 0;
  margin-left: 12px;
}
.icon.icon-color-yellow:before,
.icon.icon-color-yellow:after {
  background-position: 0 0;
}
.icon.icon-color-white:before,
.icon.icon-color-white:after {
  background-position: 0 100%;
}
.icon.icon-close:before,
.icon.icon-close:after,
.icon.icon-close:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/close.svg');
}
.icon.icon-replied:before,
.icon.icon-replied:after,
.icon.icon-replied:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/reply_arrow.svg');
}
.icon.icon-liked:before,
.icon.icon-liked:after,
.icon.icon-liked:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/heart_full.svg');
}
.icon.icon-comment:before,
.icon.icon-comment:after,
.icon.icon-comment:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/icon_comment.svg');
}
.icon.icon-add:before,
.icon.icon-add:after,
.icon.icon-add:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/icon_add.svg');
}
.icon.icon-arrow:before,
.icon.icon-arrow:after,
.icon.icon-arrow:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/cta_arrow.svg');
}
.icon.icon-backarrow:before,
.icon.icon-backarrow:after,
.icon.icon-backarrow:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/cta_arrow.svg');
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
}
.icon.icon-views:before,
.icon.icon-views:after,
.icon.icon-views:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/icon_eye.svg');
}
.icon.icon-ticks:before,
.icon.icon-ticks:after,
.icon.icon-ticks:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/ticks.svg');
}
.icon.icon-remove:before,
.icon.icon-remove:after,
.icon.icon-remove:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/icon_remove.svg');
}
.icon.icon-account:before,
.icon.icon-account:after,
.icon.icon-account:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/icon_account.svg');
}
.icon.icon-refresh:before,
.icon.icon-refresh:after,
.icon.icon-refresh:not(.icon-after):not(.icon-before),
.icon.icon-edit:before,
.icon.icon-edit:after,
.icon.icon-edit:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/icon_refresh.svg');
}
.icon.icon-quote:before,
.icon.icon-quote:after,
.icon.icon-quote:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/form/form-info-quote.svg');
}
.icon.icon-reply:before,
.icon.icon-reply:after,
.icon.icon-reply:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/reply_arrow.svg');
}
.icon.icon-download:before,
.icon.icon-download:after,
.icon.icon-download:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/cta_arrow.svg');
  transform: rotate(90deg);
}
.icon.icon-basket:before,
.icon.icon-basket:after,
.icon.icon-basket:not(.icon-after):not(.icon-before) {
  background-image: url('/common/img/icons/nav_cart.svg');
}
.icon.icon-linux:before {
  background-image: url("/common/img/icons/platforms/sml_linux.png");
  vertical-align: text-top;
}
.icon.icon-win:before {
  background-image: url("/common/img/icons/platforms/sml_win.png");
  vertical-align: text-top;
}
.icon.icon-windows:before {
  background-image: url("/common/img/icons/platforms/sml_win.png");
  vertical-align: text-top;
}
.icon.icon-mac:before {
  background-image: url("/common/img/icons/platforms/sml_osx.png");
  vertical-align: text-top;
}
.tf-container {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
}
.tf-container--centered {
  margin-left: auto !important;
  margin-right: auto !important;
}
.tf-container--padded {
  padding-left: 24px !important;
  padding-right: 24px !important;
}
@media (max-width: 768px) {
  .tf-container--padded {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}
.tf-container:not(.tf-container--padded) {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.tf-container:not(.tf-container--centered) {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.tf-container--small {
  max-width: 640px;
}
@media (max-width: 640px) {
  .tf-container--small {
    max-width: 100%;
  }
}
.tf-container--default {
  max-width: 1600px;
}
@media (max-width: 1600px) {
  .tf-container--default {
    max-width: 100%;
  }
}
.tf-container--large {
  max-width: 1400px;
}
@media (max-width: 1400px) {
  .tf-container--large {
    max-width: 100%;
  }
}
.tf-container--xl {
  max-width: 1800px;
}
@media (max-width: 1800px) {
  .tf-container--xl {
    max-width: 100%;
  }
}
.tf-container--fluid {
  max-width: none;
  width: 100%;
}
@media (max-width: 992px) {
  .tf-container--padded {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media (max-width: 768px) {
  .tf-container--padded {
    padding-left: 16px;
    padding-right: 16px;
  }
}
.tf-container-section {
  width: 100%;
}
.tf-container-section .tf-container {
  position: relative;
}
.tf-page-container {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.tf-page-container .tf-container {
  flex: 1;
}
.tf-content-container .tf-container--padded {
  padding-top: 32px;
  padding-bottom: 32px;
}
@media (max-width: 768px) {
  .tf-content-container .tf-container--padded {
    padding-top: 24px;
    padding-bottom: 24px;
  }
}
.tf-header-container .tf-container--padded,
.tf-footer-container .tf-container--padded {
  padding-top: 16px;
  padding-bottom: 16px;
}
@media (max-width: 768px) {
  .tf-header-container .tf-container--padded,
  .tf-footer-container .tf-container--padded {
    padding-top: 12px;
    padding-bottom: 12px;
  }
}
.tf-container-breakout {
  position: relative;
}
.tf-container-breakout::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 100vw;
  height: 100%;
  transform: translateX(-50%);
  background: inherit;
  z-index: -1;
}
.tf-container-debug .tf-container {
  outline: 2px dashed #FCB434;
  outline-offset: -2px;
  position: relative;
}
.tf-container-debug .tf-container::before {
  content: attr(class);
  position: absolute;
  top: 0;
  left: 0;
  background: #FCB434;
  color: #272727;
  padding: 4px;
  font-size: 12px;
  font-weight: 600;
  z-index: 1000;
}
.tf-grid {
  display: grid;
  width: 100%;
}
.tf-grid--auto {
  grid-template-columns: repeat(auto-fit, minmax(var(--tf-grid-min-width, 280px), 1fr));
}
.tf-grid--cols-1 {
  grid-template-columns: 1fr;
}
.tf-grid--cols-2 {
  grid-template-columns: repeat(2, 1fr);
}
.tf-grid--cols-3 {
  grid-template-columns: repeat(3, 1fr);
}
.tf-grid--cols-4 {
  grid-template-columns: repeat(4, 1fr);
}
.tf-grid--cols-5 {
  grid-template-columns: repeat(5, 1fr);
}
.tf-grid--cols-6 {
  grid-template-columns: repeat(6, 1fr);
}
.tf-grid[style*="--tf-grid-columns"] {
  grid-template-columns: repeat(var(--tf-grid-columns), 1fr);
}
.tf-grid--gap-none {
  gap: 0;
}
.tf-grid--gap-small {
  gap: 8px;
}
.tf-grid--gap-medium {
  gap: 16px;
}
.tf-grid--gap-large {
  gap: 24px;
}
.tf-grid--gap-xl {
  gap: 32px;
}
.tf-grid--align-start {
  align-items: start;
}
.tf-grid--align-end {
  align-items: end;
}
.tf-grid--align-center {
  align-items: center;
}
.tf-grid--align-stretch {
  align-items: stretch;
}
.tf-grid--justify-start {
  justify-items: start;
}
.tf-grid--justify-end {
  justify-items: end;
}
.tf-grid--justify-center {
  justify-items: center;
}
.tf-grid--justify-stretch {
  justify-items: stretch;
}
.tf-grid--align-content-start {
  align-content: start;
}
.tf-grid--align-content-end {
  align-content: end;
}
.tf-grid--align-content-center {
  align-content: center;
}
.tf-grid--align-content-stretch {
  align-content: stretch;
}
.tf-grid--align-content-space-between {
  align-content: space-between;
}
.tf-grid--align-content-space-around {
  align-content: space-around;
}
.tf-grid--align-content-space-evenly {
  align-content: space-evenly;
}
.tf-grid--justify-content-start {
  justify-content: start;
}
.tf-grid--justify-content-end {
  justify-content: end;
}
.tf-grid--justify-content-center {
  justify-content: center;
}
.tf-grid--justify-content-stretch {
  justify-content: stretch;
}
.tf-grid--justify-content-space-between {
  justify-content: space-between;
}
.tf-grid--justify-content-space-around {
  justify-content: space-around;
}
.tf-grid--justify-content-space-evenly {
  justify-content: space-evenly;
}
@media (max-width: 992px) {
  .tf-grid--cols-4,
  .tf-grid--cols-5,
  .tf-grid--cols-6 {
    grid-template-columns: repeat(2, 1fr);
  }
  .tf-grid--cols-3 {
    grid-template-columns: repeat(2, 1fr);
  }
  .tf-grid--gap-large {
    gap: 16px;
  }
  .tf-grid--gap-xl {
    gap: 24px;
  }
}
@media (max-width: 768px) {
  .tf-grid--cols-2,
  .tf-grid--cols-3,
  .tf-grid--cols-4,
  .tf-grid--cols-5,
  .tf-grid--cols-6 {
    grid-template-columns: 1fr;
  }
  .tf-grid--auto {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  }
  .tf-grid--gap-medium {
    gap: 12px;
  }
  .tf-grid--gap-large {
    gap: 16px;
  }
  .tf-grid--gap-xl {
    gap: 20px;
  }
}
.tf-grid-item {
  position: relative;
}
.tf-grid-item--col-span-1 {
  grid-column: span 1;
}
.tf-grid-item--col-span-2 {
  grid-column: span 2;
}
.tf-grid-item--col-span-3 {
  grid-column: span 3;
}
.tf-grid-item--col-span-4 {
  grid-column: span 4;
}
.tf-grid-item--col-span-5 {
  grid-column: span 5;
}
.tf-grid-item--col-span-6 {
  grid-column: span 6;
}
.tf-grid-item--row-span-1 {
  grid-row: span 1;
}
.tf-grid-item--row-span-2 {
  grid-row: span 2;
}
.tf-grid-item--row-span-3 {
  grid-row: span 3;
}
.tf-grid-item--row-span-4 {
  grid-row: span 4;
}
.tf-grid-item--row-span-5 {
  grid-row: span 5;
}
.tf-grid-item--row-span-6 {
  grid-row: span 6;
}
.tf-grid-item--align-start {
  align-self: start;
}
.tf-grid-item--align-end {
  align-self: end;
}
.tf-grid-item--align-center {
  align-self: center;
}
.tf-grid-item--align-stretch {
  align-self: stretch;
}
.tf-grid-item--justify-start {
  justify-self: start;
}
.tf-grid-item--justify-end {
  justify-self: end;
}
.tf-grid-item--justify-center {
  justify-self: center;
}
.tf-grid-item--justify-stretch {
  justify-self: stretch;
}
@media (max-width: 992px) {
  .tf-grid-item--col-span-4,
  .tf-grid-item--col-span-5,
  .tf-grid-item--col-span-6 {
    grid-column: span 2;
  }
  .tf-grid-item--col-span-3 {
    grid-column: span 2;
  }
}
@media (max-width: 768px) {
  .tf-grid-item--col-span-2,
  .tf-grid-item--col-span-3,
  .tf-grid-item--col-span-4,
  .tf-grid-item--col-span-5,
  .tf-grid-item--col-span-6 {
    grid-column: span 1;
  }
}
.tf-grid-gallery .tf-grid {
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 8px;
}
@media (max-width: 768px) {
  .tf-grid-gallery .tf-grid {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }
}
.tf-grid-cards .tf-grid {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
}
@media (max-width: 768px) {
  .tf-grid-cards .tf-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}
.tf-grid-dashboard .tf-grid {
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 24px;
}
@media (max-width: 992px) {
  .tf-grid-dashboard .tf-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}
.tf-grid-form .tf-grid {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
  align-items: start;
}
@media (max-width: 768px) {
  .tf-grid-form .tf-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}
.tf-grid-masonry .tf-grid {
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  grid-template-rows: masonry;
  gap: 16px;
}
@supports not (grid-template-rows: masonry) {
  .tf-grid-masonry .tf-grid {
    column-count: auto;
    column-width: 250px;
    column-gap: 16px;
    display: block;
  }
  .tf-grid-masonry .tf-grid .tf-grid-item {
    break-inside: avoid;
    margin-bottom: 16px;
  }
}
.tf-grid-debug .tf-grid {
  outline: 2px dashed #FCB434;
  outline-offset: -2px;
}
.tf-grid-debug .tf-grid .tf-grid-item {
  outline: 1px solid rgba(252, 180, 52, 0.5);
  outline-offset: -1px;
  position: relative;
}
.tf-grid-debug .tf-grid .tf-grid-item::before {
  content: 'Grid Item';
  position: absolute;
  top: 0;
  left: 0;
  background: #FCB434;
  color: #272727;
  padding: 2px;
  font-size: 10px;
  font-weight: 600;
  z-index: 1000;
  pointer-events: none;
}
@media (prefers-contrast: high) {
  .tf-grid-debug .tf-grid {
    outline-width: 3px;
  }
  .tf-grid-debug .tf-grid .tf-grid-item {
    outline-width: 2px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-grid,
  .tf-grid-item {
    transition: none;
  }
}
.tf-container {
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 24px;
}
.tf-container--fluid {
  max-width: none;
}
.tf-container--narrow {
  max-width: 800px;
}
.tf-container--wide {
  max-width: 1800px;
}
.tf-grid {
  display: grid;
  gap: 16px;
}
.tf-grid--1-col {
  grid-template-columns: 1fr;
}
.tf-grid--2-col {
  grid-template-columns: repeat(2, 1fr);
}
.tf-grid--3-col {
  grid-template-columns: repeat(3, 1fr);
}
.tf-grid--4-col {
  grid-template-columns: repeat(4, 1fr);
}
.tf-grid--auto-fit {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.tf-grid--auto-fill {
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}
.tf-grid--form {
  grid-template-columns: 1fr;
  gap: 24px;
}
@media (min-width: 768px) {
  .tf-grid--form {
    grid-template-columns: 200px 1fr;
    gap: 16px;
    align-items: start;
  }
}
.tf-grid--sidebar {
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .tf-grid--sidebar {
    grid-template-columns: 320px 1fr;
  }
}
@media (max-width: 768px) {
  .tf-grid--2-col,
  .tf-grid--3-col,
  .tf-grid--4-col {
    grid-template-columns: 1fr;
  }
}
.tf-grid-item--span-2 {
  grid-column: span 2;
}
.tf-grid-item--span-3 {
  grid-column: span 3;
}
.tf-grid-item--span-4 {
  grid-column: span 4;
}
.tf-grid-item--full-width {
  grid-column: 1 / -1;
}
.tf-flex {
  display: flex;
}
.tf-flex--row {
  flex-direction: row;
}
.tf-flex--column {
  flex-direction: column;
}
.tf-flex--row-reverse {
  flex-direction: row-reverse;
}
.tf-flex--column-reverse {
  flex-direction: column-reverse;
}
.tf-flex--justify-start {
  justify-content: flex-start;
}
.tf-flex--justify-center {
  justify-content: center;
}
.tf-flex--justify-end {
  justify-content: flex-end;
}
.tf-flex--justify-between {
  justify-content: space-between;
}
.tf-flex--justify-around {
  justify-content: space-around;
}
.tf-flex--justify-evenly {
  justify-content: space-evenly;
}
.tf-flex--align-start {
  align-items: flex-start;
}
.tf-flex--align-center {
  align-items: center;
}
.tf-flex--align-end {
  align-items: flex-end;
}
.tf-flex--align-stretch {
  align-items: stretch;
}
.tf-flex--wrap {
  flex-wrap: wrap;
}
.tf-flex--nowrap {
  flex-wrap: nowrap;
}
.tf-flex--gap-sm {
  gap: 8px;
}
.tf-flex--gap-md {
  gap: 16px;
}
.tf-flex--gap-lg {
  gap: 24px;
}
@media (max-width: 768px) {
  .tf-flex--mobile-column {
    flex-direction: column;
  }
}
.tf-flex-item--grow {
  flex-grow: 1;
}
.tf-flex-item--shrink {
  flex-shrink: 1;
}
.tf-flex-item--no-shrink {
  flex-shrink: 0;
}
.tf-flex-item--auto {
  flex: 1 1 auto;
}
.tf-flex-item--none {
  flex: none;
}
.tf-spacing--m-0 {
  margin: 0;
}
.tf-spacing--m-1 {
  margin: 8px;
}
.tf-spacing--m-2 {
  margin: 16px;
}
.tf-spacing--m-3 {
  margin: 24px;
}
.tf-spacing--m-4 {
  margin: 32px;
}
.tf-spacing--mt-0 {
  margin-top: 0;
}
.tf-spacing--mt-1 {
  margin-top: 8px;
}
.tf-spacing--mt-2 {
  margin-top: 16px;
}
.tf-spacing--mt-3 {
  margin-top: 24px;
}
.tf-spacing--mt-4 {
  margin-top: 32px;
}
.tf-spacing--mb-0 {
  margin-bottom: 0;
}
.tf-spacing--mb-1 {
  margin-bottom: 8px;
}
.tf-spacing--mb-2 {
  margin-bottom: 16px;
}
.tf-spacing--mb-3 {
  margin-bottom: 24px;
}
.tf-spacing--mb-4 {
  margin-bottom: 32px;
}
.tf-spacing--ml-0 {
  margin-left: 0;
}
.tf-spacing--ml-1 {
  margin-left: 8px;
}
.tf-spacing--ml-2 {
  margin-left: 16px;
}
.tf-spacing--ml-auto {
  margin-left: auto;
}
.tf-spacing--mr-0 {
  margin-right: 0;
}
.tf-spacing--mr-1 {
  margin-right: 8px;
}
.tf-spacing--mr-2 {
  margin-right: 16px;
}
.tf-spacing--mr-auto {
  margin-right: auto;
}
.tf-spacing--p-0 {
  padding: 0;
}
.tf-spacing--p-1 {
  padding: 8px;
}
.tf-spacing--p-2 {
  padding: 16px;
}
.tf-spacing--p-3 {
  padding: 24px;
}
.tf-spacing--p-4 {
  padding: 32px;
}
.tf-spacing--pt-0 {
  padding-top: 0;
}
.tf-spacing--pt-1 {
  padding-top: 8px;
}
.tf-spacing--pt-2 {
  padding-top: 16px;
}
.tf-spacing--pt-3 {
  padding-top: 24px;
}
.tf-spacing--pb-0 {
  padding-bottom: 0;
}
.tf-spacing--pb-1 {
  padding-bottom: 8px;
}
.tf-spacing--pb-2 {
  padding-bottom: 16px;
}
.tf-spacing--pb-3 {
  padding-bottom: 24px;
}
@media (max-width: 768px) {
  .tf-hide-mobile {
    display: none !important;
  }
  .tf-show-mobile {
    display: block !important;
  }
}
@media (min-width: 769px) {
  .tf-hide-desktop {
    display: none !important;
  }
  .tf-show-desktop {
    display: block !important;
  }
}
.tf-sidebar {
  background-color: #E6E6E6;
  border-right: 1px solid #dee2e6;
}
.tf-sidebar__content {
  padding: 24px;
}
.tf-sidebar__mobile-header {
  display: none;
}
.tf-sidebar__close-btn {
  font-size: 2rem;
  line-height: 1;
  color: #6c757d;
}
.tf-mobile-controls {
  display: none;
  padding-bottom: 24px;
}
.tf-sidebar-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 999;
}
.tf-sidebar-overlay.is-open {
  display: block;
}
.tf-stack {
  display: flex;
}
.tf-stack--vertical {
  flex-direction: column;
}
.tf-stack--horizontal {
  flex-direction: row;
}
.tf-stack--spacing-none {
  gap: 0;
}
.tf-stack--spacing-xs {
  gap: 4px;
}
.tf-stack--spacing-small {
  gap: 8px;
}
.tf-stack--spacing-medium {
  gap: 16px;
}
.tf-stack--spacing-large {
  gap: 24px;
}
.tf-stack--spacing-xl {
  gap: 32px;
}
.tf-stack--spacing-xxl {
  gap: 48px;
}
.tf-stack--align-start {
  align-items: flex-start;
}
.tf-stack--align-center {
  align-items: center;
}
.tf-stack--align-end {
  align-items: flex-end;
}
.tf-stack--align-stretch {
  align-items: stretch;
}
.tf-stack--align-baseline {
  align-items: baseline;
}
.tf-stack--justify-start {
  justify-content: flex-start;
}
.tf-stack--justify-center {
  justify-content: center;
}
.tf-stack--justify-end {
  justify-content: flex-end;
}
.tf-stack--justify-space-between {
  justify-content: space-between;
}
.tf-stack--justify-space-around {
  justify-content: space-around;
}
.tf-stack--justify-space-evenly {
  justify-content: space-evenly;
}
.tf-stack--wrap {
  flex-wrap: wrap;
}
.tf-stack--divider .tf-stack__divider {
  flex-shrink: 0;
}
.tf-stack--vertical .tf-stack--divider .tf-stack__divider {
  width: 100%;
  height: 1px;
  background-color: #dee2e6;
  margin: 0;
}
.tf-stack--horizontal .tf-stack--divider .tf-stack__divider {
  width: 1px;
  height: 100%;
  background-color: #dee2e6;
  margin: 0;
}
@media (max-width: 992px) {
  .tf-stack--spacing-large {
    gap: 16px;
  }
  .tf-stack--spacing-xl {
    gap: 24px;
  }
  .tf-stack--spacing-xxl {
    gap: 32px;
  }
  .tf-stack--horizontal.tf-stack--responsive {
    flex-direction: column;
  }
}
@media (max-width: 768px) {
  .tf-stack--spacing-medium {
    gap: 12px;
  }
  .tf-stack--spacing-large {
    gap: 16px;
  }
  .tf-stack--spacing-xl {
    gap: 20px;
  }
  .tf-stack--spacing-xxl {
    gap: 24px;
  }
  .tf-stack--horizontal.tf-stack--responsive {
    flex-direction: column;
  }
}
@supports not (gap: 1px) {
  .tf-stack {
    gap: 0;
  }
  .tf-stack--vertical > * + * {
    margin-top: 0;
  }
  .tf-stack--vertical.tf-stack--spacing-xs > * + * {
    margin-top: 4px;
  }
  .tf-stack--vertical.tf-stack--spacing-small > * + * {
    margin-top: 8px;
  }
  .tf-stack--vertical.tf-stack--spacing-medium > * + * {
    margin-top: 16px;
  }
  .tf-stack--vertical.tf-stack--spacing-large > * + * {
    margin-top: 24px;
  }
  .tf-stack--vertical.tf-stack--spacing-xl > * + * {
    margin-top: 32px;
  }
  .tf-stack--vertical.tf-stack--spacing-xxl > * + * {
    margin-top: 48px;
  }
  .tf-stack--horizontal > * + * {
    margin-left: 0;
  }
  .tf-stack--horizontal.tf-stack--spacing-xs > * + * {
    margin-left: 4px;
  }
  .tf-stack--horizontal.tf-stack--spacing-small > * + * {
    margin-left: 8px;
  }
  .tf-stack--horizontal.tf-stack--spacing-medium > * + * {
    margin-left: 16px;
  }
  .tf-stack--horizontal.tf-stack--spacing-large > * + * {
    margin-left: 24px;
  }
  .tf-stack--horizontal.tf-stack--spacing-xl > * + * {
    margin-left: 32px;
  }
  .tf-stack--horizontal.tf-stack--spacing-xxl > * + * {
    margin-left: 48px;
  }
}
.tf-stack-form .tf-stack--vertical .tf-form-field + .tf-form-field {
  margin-top: 16px;
}
.tf-stack-buttons .tf-stack--horizontal .tf-button + .tf-button {
  margin-left: 8px;
}
.tf-stack-buttons .tf-stack--vertical .tf-button + .tf-button {
  margin-top: 8px;
}
.tf-stack-cards .tf-stack--vertical .tf-card + .tf-card {
  margin-top: 24px;
}
.tf-stack-cards .tf-stack--horizontal .tf-card + .tf-card {
  margin-left: 16px;
}
.tf-stack-debug .tf-stack {
  outline: 2px dashed #FCB434;
  outline-offset: -2px;
  position: relative;
}
.tf-stack-debug .tf-stack::before {
  content: 'Stack: ' attr(class);
  position: absolute;
  top: -20px;
  left: 0;
  background: #FCB434;
  color: #272727;
  padding: 2px;
  font-size: 10px;
  font-weight: 600;
  z-index: 1000;
  white-space: nowrap;
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tf-stack-debug .tf-stack > * {
  outline: 1px solid rgba(252, 180, 52, 0.5);
  outline-offset: -1px;
}
@media (prefers-contrast: high) {
  .tf-stack--divider .tf-stack__divider {
    background-color: #272727;
  }
  .tf-stack-debug .tf-stack {
    outline-width: 3px;
  }
  .tf-stack-debug .tf-stack > * {
    outline-width: 2px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-stack,
  .tf-stack > * {
    transition: none;
  }
}
.tf-form-section {
  padding: 24px;
  background-color: #F5F5F5;
  border-radius: 8px;
}
.tf-form-section__header {
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid #E6E6E6;
}
.tf-form-section__title {
  margin: 0 0 6px 0;
  font-size: 18px;
  font-weight: 600;
  color: #333333;
  line-height: 1.3;
}
.tf-form-section__description {
  margin: 0;
  font-size: 13px;
  color: #6c757d;
  line-height: 1.5;
}
.tf-form-section--compact {
  padding: 16px;
}
.tf-form-section--compact .tf-form-section__header {
  margin-bottom: 16px;
  padding-bottom: 12px;
}
.tf-form-section--compact .tf-form-section__title {
  font-size: 16px;
  margin-bottom: 4px;
}
.tf-form-section--borderless {
  padding: 0;
  background-color: transparent;
  border-radius: 0;
}
.tf-form-section--borderless .tf-form-section__header {
  border-bottom: none;
  padding-bottom: 0;
}
.tf-form-row {
  display: flex;
  gap: 16px;
  width: 100%;
}
.tf-form-row--align-start {
  align-items: flex-start;
}
.tf-form-row--align-center {
  align-items: center;
}
.tf-form-row--align-end {
  align-items: flex-end;
}
.tf-form-row--align-stretch {
  align-items: stretch;
}
.tf-form-row--justify-start {
  justify-content: flex-start;
}
.tf-form-row--justify-center {
  justify-content: center;
}
.tf-form-row--justify-end {
  justify-content: flex-end;
}
.tf-form-row--justify-between {
  justify-content: space-between;
}
.tf-form-row--compact {
  gap: 12px;
}
@media (max-width: 768px) {
  .tf-form-row {
    flex-direction: column;
    gap: 0;
  }
}
.tf-form-column {
  flex: 1;
  min-width: 0;
}
@media (max-width: 768px) {
  .tf-form-column {
    width: 100%;
  }
}
.tf-form-actions {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: flex-end;
  padding-top: 32px;
  margin-top: 32px;
  border-top: none;
}
@media (max-width: 768px) {
  .tf-form-actions {
    flex-direction: column-reverse;
  }
  .tf-form-actions button {
    width: 100%;
  }
}
.tf-form-actions--center {
  justify-content: center;
}
.tf-form-actions--start {
  justify-content: flex-start;
}
.tf-form-actions--between {
  justify-content: space-between;
}
.tf-form-actions--borderless {
  border-top: none;
  margin-top: 0;
}
.tf-form-actions--compact {
  padding-top: 16px;
  margin-top: 16px;
}
.tf-form {
  width: 100%;
}
.tf-form__section {
  margin-bottom: 32px;
}
.tf-form__section:last-child {
  margin-bottom: 0;
}
.tf-form__title {
  font-size: 20px;
  font-weight: 600;
  color: #333333;
  margin-bottom: 16px;
}
.tf-form__description {
  color: #6c757d;
  margin-bottom: 24px;
  line-height: 1.5;
}
.tf-form-field {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}
.tf-form-field__label {
  font-weight: bold;
  color: #333333;
  margin-bottom: 8px;
  font-size: 14px;
}
.tf-form-field__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-form-field__input-container {
  position: relative;
}
.tf-form-field__input {
  width: 100%;
}
.tf-form-field__help {
  margin-top: 8px;
  font-size: 14px;
  color: #6c757d;
  line-height: 1.4;
}
.tf-form-field__helper {
  margin-top: 8px;
  font-size: 14px;
  color: #6c757d;
  line-height: 1.4;
}
.tf-form-field__helper--error {
  color: #E53935;
}
.tf-form-field__error {
  margin-top: 8px;
  font-size: 14px;
  color: #E53935;
  line-height: 1.4;
}
.tf-form-field__success {
  margin-top: 8px;
  font-size: 14px;
  color: #5cb85c;
  line-height: 1.4;
}
.tf-form-field--error .tf-form-field__label {
  color: #E53935;
}
.tf-form-field--disabled .tf-form-field__label {
  color: #6c757d;
}
.tf-form-field--horizontal {
  flex-direction: row;
  align-items: center;
  gap: 16px;
}
.tf-form-field--horizontal .tf-form-field__label {
  margin-bottom: 0;
  flex-shrink: 0;
  min-width: 120px;
}
.tf-form-field--horizontal .tf-form-field__input {
  flex: 1;
}
.tf-form-field--horizontal .tf-form-field__helper {
  margin-top: 0;
  margin-left: 16px;
}
@media (max-width: 768px) {
  .tf-form-field--horizontal {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .tf-form-field--horizontal .tf-form-field__label {
    margin-bottom: 8px;
    min-width: auto;
  }
  .tf-form-field--horizontal .tf-form-field__helper {
    margin-top: 8px;
    margin-left: 0;
  }
}
.tf-combobox {
  position: relative;
  display: inline-block;
  width: auto;
}
.tf-combobox--full-width {
  width: 100%;
  display: block;
}
.tf-combobox__label {
  font-weight: bold;
  color: #333333;
  margin-bottom: 8px;
  font-size: 14px;
  display: block;
}
.tf-combobox__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-combobox__control {
  position: relative;
}
.tf-combobox__input-wrapper {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  min-height: 48px;
  padding: 4px 40px 4px 8px;
  background-color: #fff;
  border: 2px solid #dee2e6;
  border-radius: 4px;
  transition: all 0.2s ease;
}
.tf-combobox--open .tf-combobox__input-wrapper {
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.2);
}
.tf-combobox--error .tf-combobox__input-wrapper {
  border-color: #E53935;
}
.tf-combobox--error.tf-combobox--open .tf-combobox__input-wrapper {
  border-color: #E53935;
  box-shadow: 0 0 0 3px rgba(229, 57, 53, 0.2);
}
.tf-combobox--disabled .tf-combobox__input-wrapper {
  background-color: #F1F1F1;
  cursor: not-allowed;
}
.tf-combobox__input {
  flex: 1;
  min-width: 120px;
  padding: 4px;
  border: none;
  background: transparent;
  font-size: 14px;
  line-height: 1.5;
  color: #333333;
  outline: none;
}
.tf-combobox__input::placeholder {
  color: #6c757d;
}
.tf-combobox__input:disabled {
  cursor: not-allowed;
  color: #6c757d;
}
.tf-combobox__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.tf-combobox__tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  background-color: #F1F1F1;
  border: 1px solid #E6E6E6;
  border-radius: 3px;
  font-size: 13px;
  line-height: 1.5;
}
.tf-combobox__tag-label {
  color: #333333;
}
.tf-combobox__tag-remove {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  padding: 0;
  margin-left: 4px;
  background: transparent;
  border: none;
  border-radius: 2px;
  font-size: 16px;
  line-height: 1;
  color: #6c757d;
  cursor: pointer;
  transition: all 0.2s ease;
}
.tf-combobox__tag-remove:hover {
  background-color: #E6E6E6;
  color: #E53935;
}
.tf-combobox__indicators {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: 4px;
}
.tf-combobox__clear,
.tf-combobox__toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 3px;
  color: #6c757d;
  cursor: pointer;
  transition: all 0.2s ease;
}
.tf-combobox__clear:hover:not(:disabled),
.tf-combobox__toggle:hover:not(:disabled) {
  background-color: #F1F1F1;
  color: #333333;
}
.tf-combobox__clear:disabled,
.tf-combobox__toggle:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.tf-combobox__clear svg,
.tf-combobox__toggle svg {
  width: 14px;
  height: 14px;
}
.tf-combobox__clear {
  font-size: 18px;
  line-height: 1;
}
.tf-combobox__toggle {
  transition: transform 0.2s ease;
}
.tf-combobox--open .tf-combobox__toggle {
  transform: rotate(180deg);
}
.tf-combobox__dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 1000;
  max-height: 300px;
  background: #fff;
  border: 1px solid #828282;
  border-radius: 4px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.06);
  overflow: hidden;
}
.tf-combobox__list {
  max-height: 300px;
  margin: 0;
  padding: 4px 0;
  list-style: none;
  overflow-y: auto;
}
.tf-combobox__option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  font-size: 14px;
  color: #333333;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.tf-combobox__option:hover {
  background-color: #F1F1F1;
}
.tf-combobox__option--focused {
  background-color: #F1F1F1;
}
.tf-combobox__option--selected {
  background-color: rgba(252, 180, 52, 0.1);
  color: #333333;
  font-weight: 500;
}
.tf-combobox__option--loading,
.tf-combobox__option--no-results {
  color: #6c757d;
  cursor: default;
}
.tf-combobox__option--loading:hover,
.tf-combobox__option--no-results:hover {
  background-color: transparent;
}
.tf-combobox__option--create {
  color: #FCB434;
  font-weight: 500;
}
.tf-combobox__option--create:hover {
  background-color: rgba(252, 180, 52, 0.1);
}
.tf-combobox__option-checkbox {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border: 1px solid #828282;
  border-radius: 3px;
  font-size: 12px;
  color: #FCB434;
}
.tf-combobox__option-label {
  flex: 1;
}
.tf-combobox__help {
  margin-top: 4px;
  font-size: 13px;
}
.tf-combobox__help-text {
  color: #6c757d;
}
.tf-combobox__error {
  color: #E53935;
}
.tf-combobox--small .tf-combobox__label {
  font-size: 13px;
  margin-bottom: 4px;
}
.tf-combobox--small .tf-combobox__input-wrapper {
  min-height: 40px;
  padding: 2px 36px 2px 6px;
}
.tf-combobox--small .tf-combobox__input {
  font-size: 14px;
}
.tf-combobox--small .tf-combobox__option {
  padding: 6px 10px;
  font-size: 13px;
}
.tf-combobox--small .tf-combobox__help {
  font-size: 12px;
}
.tf-combobox--large .tf-combobox__label {
  font-size: 15px;
  margin-bottom: 8px;
}
.tf-combobox--large .tf-combobox__input-wrapper {
  min-height: 56px;
  padding: 6px 44px 6px 10px;
}
.tf-combobox--large .tf-combobox__input {
  font-size: 16px;
}
.tf-combobox--large .tf-combobox__option {
  padding: 10px 14px;
  font-size: 15px;
}
.tf-combobox--large .tf-combobox__help {
  font-size: 14px;
}
.tf-combobox--filled .tf-combobox__input-wrapper {
  background-color: #F1F1F1;
  border-color: transparent;
}
.tf-combobox--filled.tf-combobox--open .tf-combobox__input-wrapper {
  background-color: #fff;
  border-color: #FCB434;
}
.tf-combobox--outlined .tf-combobox__input-wrapper {
  border-width: 2px;
}
.tf-combobox--outlined.tf-combobox--open .tf-combobox__input-wrapper {
  box-shadow: none;
}
.tf-combobox--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.tf-combobox--readonly .tf-combobox__input {
  cursor: default;
}
.tf-datepicker {
  position: relative;
  display: inline-block;
  width: auto;
}
.tf-datepicker--full-width {
  width: 100%;
  display: block;
}
.tf-datepicker__label {
  font-weight: bold;
  color: #333333;
  margin-bottom: 8px;
  font-size: 14px;
  display: block;
}
.tf-datepicker__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-datepicker__input-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}
.tf-datepicker__input {
  flex: 1;
  min-width: 0;
  padding: 8px 72px 8px 12px;
  font-size: 14px;
  line-height: 1.5;
  color: #333333;
  background-color: #fff;
  border: 2px solid #dee2e6;
  border-radius: 8px;
  transition: all 0.2s ease;
}
.tf-datepicker__input:hover:not(:disabled):not(:read-only) {
  border-color: #c1c8d0;
}
.tf-datepicker__input:focus {
  outline: none;
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.1);
}
.tf-datepicker__input::placeholder {
  color: #6c757d;
}
.tf-datepicker__input:disabled {
  background-color: #F1F1F1;
  color: #272727;
  cursor: not-allowed;
}
.tf-datepicker__input:read-only {
  background-color: #F1F1F1;
  cursor: default;
}
.tf-datepicker--error .tf-datepicker__input {
  border-color: #E53935;
}
.tf-datepicker--error .tf-datepicker__input:focus {
  border-color: #E53935;
  box-shadow: 0 0 0 3px rgba(229, 57, 53, 0.1);
}
.tf-datepicker--small .tf-datepicker__input {
  padding: 6px 68px 6px 10px;
  font-size: 13px;
}
.tf-datepicker--large .tf-datepicker__input {
  padding: 10px 76px 10px 14px;
  font-size: 15px;
}
.tf-datepicker__calendar-button,
.tf-datepicker__clear-button {
  position: absolute;
  right: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 4px;
  color: #272727;
  cursor: pointer;
  transition: all 0.2s ease;
}
.tf-datepicker__calendar-button:hover:not(:disabled),
.tf-datepicker__clear-button:hover:not(:disabled) {
  background-color: #F1F1F1;
  color: #FCB434;
}
.tf-datepicker__calendar-button:active:not(:disabled),
.tf-datepicker__clear-button:active:not(:disabled) {
  background-color: #E6E6E6;
}
.tf-datepicker__calendar-button:disabled,
.tf-datepicker__clear-button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.tf-datepicker__calendar-button svg,
.tf-datepicker__clear-button svg {
  width: 16px;
  height: 16px;
}
.tf-datepicker__clear-button {
  right: 40px;
  font-size: 20px;
  line-height: 1;
}
.tf-datepicker__calendar {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 1000;
  min-width: 280px;
  padding: 12px;
  background: #fff;
  border: 1px solid #828282;
  border-radius: 8px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.06);
}
.tf-datepicker__calendar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.tf-datepicker__month-year {
  font-size: 14px;
  font-weight: 600;
  color: #333333;
}
.tf-datepicker__nav-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 4px;
  color: #272727;
  cursor: pointer;
  transition: all 0.2s ease;
}
.tf-datepicker__nav-button:hover {
  background-color: #F1F1F1;
  color: #FCB434;
}
.tf-datepicker__nav-button:active {
  background-color: #E6E6E6;
}
.tf-datepicker__nav-button svg {
  width: 16px;
  height: 16px;
}
.tf-datepicker__calendar-body {
  margin-bottom: 8px;
}
.tf-datepicker__day-names {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  margin-bottom: 4px;
}
.tf-datepicker__day-name {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  font-size: 12px;
  font-weight: 600;
  color: #272727;
}
.tf-datepicker__days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
}
.tf-datepicker__day {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 4px;
  font-size: 13px;
  color: #333333;
  cursor: pointer;
  transition: all 0.2s ease;
}
.tf-datepicker__day:hover:not(:disabled) {
  background-color: #F1F1F1;
}
.tf-datepicker__day:active:not(:disabled) {
  background-color: #E6E6E6;
}
.tf-datepicker__day--other-month {
  color: #272727;
}
.tf-datepicker__day--today {
  font-weight: 600;
  color: #FCB434;
}
.tf-datepicker__day--today::after {
  content: '';
  position: absolute;
  bottom: 2px;
  left: 50%;
  transform: translateX(-50%);
  width: 4px;
  height: 4px;
  background-color: #FCB434;
  border-radius: 50%;
}
.tf-datepicker__day--selected {
  background-color: #FCB434 !important;
  color: #fff !important;
  font-weight: 600;
}
.tf-datepicker__day--selected::after {
  display: none;
}
.tf-datepicker__day--disabled {
  color: #828282;
  cursor: not-allowed;
}
.tf-datepicker__day--disabled:hover {
  background-color: transparent;
}
.tf-datepicker__calendar-footer {
  display: flex;
  gap: 8px;
  padding-top: 8px;
  border-top: 1px solid #E6E6E6;
}
.tf-datepicker__footer-button {
  flex: 1;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 500;
  color: #FCB434;
  background: transparent;
  border: 1px solid #828282;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.tf-datepicker__footer-button:hover {
  background-color: #F1F1F1;
  border-color: #FCB434;
}
.tf-datepicker__footer-button:active {
  background-color: #E6E6E6;
}
.tf-datepicker__help {
  margin-top: 4px;
  font-size: 13px;
}
.tf-datepicker__help-text {
  color: #272727;
}
.tf-datepicker__error {
  color: #E53935;
}
.tf-datepicker--small .tf-datepicker__label {
  font-size: 13px;
  margin-bottom: 4px;
}
.tf-datepicker--small .tf-datepicker__help {
  font-size: 12px;
}
.tf-datepicker--large .tf-datepicker__label {
  font-size: 15px;
  margin-bottom: 8px;
}
.tf-datepicker--large .tf-datepicker__help {
  font-size: 14px;
}
.tf-datepicker--filled .tf-datepicker__input {
  background-color: #F1F1F1;
  border-color: #F1F1F1;
}
.tf-datepicker--filled .tf-datepicker__input:hover:not(:disabled):not(:read-only) {
  background-color: #E6E6E6;
  border-color: #E6E6E6;
}
.tf-datepicker--filled .tf-datepicker__input:focus {
  background-color: #fff;
  border-color: #FCB434;
}
.tf-datepicker--outlined .tf-datepicker__input {
  border-width: 2px;
}
.tf-datepicker--outlined .tf-datepicker__input:focus {
  box-shadow: none;
}
.tf-datepicker--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.tf-datepicker--readonly .tf-datepicker__input {
  cursor: default;
}
.tf-text-input {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}
.tf-text-input__label {
  font-weight: bold;
  color: #333333;
  margin-bottom: 8px;
  font-size: 14px;
}
.tf-text-input__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-text-input__label--required::after {
  content: ' *';
  color: #E53935;
}
.tf-text-input__input-container {
  position: relative;
  display: flex;
  align-items: center;
  border: 2px solid #dee2e6;
  border-radius: 8px;
  background-color: #FFFFFF;
  transition: all 0.2s ease-in-out;
}
.tf-text-input__input-container:focus-within {
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.2);
}
.tf-text-input__field {
  flex: 1;
  border: none;
  background: transparent;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  color: #333333;
  outline: none;
  padding: 12px 16px;
  width: 100%;
  min-height: 48px;
}
.tf-text-input__field::placeholder {
  color: #6c757d;
  opacity: 1;
}
@media (max-width: 768px) {
  .tf-text-input__field {
    font-size: 16px;
    min-height: 56px;
  }
}
@media (prefers-contrast: high) {
  .tf-text-input__field {
    border-width: 2px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-text-input__field {
    transition: none;
  }
}
.tf-text-input__prefix {
  display: flex;
  align-items: center;
  padding-left: 16px;
  color: #6c757d;
  flex-shrink: 0;
}
.tf-text-input__suffix {
  display: flex;
  align-items: center;
  padding-right: 16px;
  color: #6c757d;
  flex-shrink: 0;
  gap: 4px;
}
.tf-text-input__clear-button {
  background: none;
  border: none;
  font-size: 18px;
  color: #6c757d;
  cursor: pointer;
  padding: 4px;
  line-height: 1;
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tf-text-input__clear-button:hover {
  color: #333333;
  background-color: rgba(230, 230, 230, 0.5);
}
.tf-text-input__clear-button:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-text-input__footer {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-top: 8px;
  min-height: 18px;
}
.tf-text-input__message {
  flex: 1;
  font-size: 14px;
  line-height: 1.4;
}
.tf-text-input__error {
  color: #E53935;
}
.tf-text-input__help {
  color: #6c757d;
}
.tf-text-input__count {
  font-size: 13px;
  color: #6c757d;
  white-space: nowrap;
  flex-shrink: 0;
}
.tf-text-input__count--over-limit {
  color: #E53935;
  font-weight: 500;
}
.tf-text-input--small .tf-text-input__field {
  min-height: 40px;
  padding: 8px 12px;
  font-size: 14px;
}
.tf-text-input--small .tf-text-input__prefix,
.tf-text-input--small .tf-text-input__suffix {
  padding-left: 12px;
  padding-right: 12px;
}
.tf-text-input--large .tf-text-input__field {
  min-height: 56px;
  padding: 16px 20px;
  font-size: 16px;
}
.tf-text-input--large .tf-text-input__prefix,
.tf-text-input--large .tf-text-input__suffix {
  padding-left: 20px;
  padding-right: 20px;
}
.tf-text-input--filled .tf-text-input__input-container {
  background-color: #F1F1F1;
  border-color: transparent;
}
.tf-text-input--filled .tf-text-input__input-container:focus-within {
  background-color: #FFFFFF;
  border-color: #FCB434;
}
.tf-text-input--outlined .tf-text-input__input-container {
  background-color: transparent;
}
.tf-text-input--error .tf-text-input__input-container {
  border-color: #E53935;
}
.tf-text-input--error .tf-text-input__input-container:focus-within {
  border-color: #E53935;
  box-shadow: 0 0 0 3px rgba(229, 57, 53, 0.2);
}
.tf-text-input--error .tf-text-input__label {
  color: #E53935;
}
.tf-text-input--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.tf-text-input--disabled .tf-text-input__input-container {
  background-color: #F1F1F1;
  border-color: #E6E6E6;
}
.tf-text-input--disabled .tf-text-input__field {
  color: #6c757d;
  cursor: not-allowed;
}
.tf-text-input--disabled .tf-text-input__field::placeholder {
  color: rgba(108, 117, 125, 0.6);
}
.tf-text-input--disabled .tf-text-input__label {
  color: #6c757d;
}
.tf-text-input--readonly .tf-text-input__input-container {
  background-color: #F1F1F1;
}
.tf-text-input--readonly .tf-text-input__field {
  cursor: default;
}
.tf-text-input--outlined.tf-text-input--readonly .tf-text-input__input-container {
  background-color: transparent;
}
.tf-text-input--full-width {
  width: 100%;
}
.tf-multiline-input {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}
.tf-multiline-input__label {
  font-weight: bold;
  color: #333333;
  margin-bottom: 8px;
  font-size: 14px;
}
.tf-multiline-input__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-multiline-input__label--required::after {
  content: ' *';
  color: #E53935;
}
.tf-multiline-input__input-container {
  position: relative;
  border: 2px solid #dee2e6;
  border-radius: 8px;
  background-color: #FFFFFF;
  transition: all 0.2s ease-in-out;
}
.tf-multiline-input__input-container:focus-within {
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.2);
}
.tf-multiline-input__field {
  display: block;
  width: 100%;
  border: none;
  background: transparent;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  color: #333333;
  outline: none;
  padding: 12px 16px;
  min-height: 120px;
  resize: vertical;
  line-height: 1.5;
  box-sizing: border-box;
}
.tf-multiline-input__field::placeholder {
  color: #6c757d;
  opacity: 1;
}
@media (max-width: 768px) {
  .tf-multiline-input__field {
    font-size: 16px;
    min-height: 100px;
    line-height: 1.4;
  }
}
@media (prefers-contrast: high) {
  .tf-multiline-input__field {
    border-width: 2px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-multiline-input__field {
    transition: none;
  }
}
.tf-multiline-input__clear-button {
  position: absolute;
  top: 12px;
  right: 12px;
  background: none;
  border: none;
  font-size: 18px;
  color: #6c757d;
  cursor: pointer;
  padding: 4px;
  line-height: 1;
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tf-multiline-input__clear-button:hover {
  color: #333333;
  background-color: rgba(230, 230, 230, 0.5);
}
.tf-multiline-input__clear-button:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-multiline-input__footer {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-top: 8px;
  min-height: 18px;
}
.tf-multiline-input__message {
  flex: 1;
  font-size: 14px;
  line-height: 1.4;
}
.tf-multiline-input__error {
  color: #E53935;
}
.tf-multiline-input__help {
  color: #6c757d;
}
.tf-multiline-input__count {
  font-size: 13px;
  color: #6c757d;
  white-space: nowrap;
  flex-shrink: 0;
}
.tf-multiline-input__count--over-limit {
  color: #E53935;
  font-weight: 500;
}
.tf-multiline-input--small .tf-multiline-input__field {
  min-height: 80px;
  padding: 8px 12px;
  font-size: 14px;
}
.tf-multiline-input--large .tf-multiline-input__field {
  min-height: 160px;
  padding: 16px 20px;
  font-size: 16px;
}
.tf-multiline-input--resize-none .tf-multiline-input__field {
  resize: none;
}
.tf-multiline-input--resize-both .tf-multiline-input__field {
  resize: both;
}
.tf-multiline-input--resize-horizontal .tf-multiline-input__field {
  resize: horizontal;
}
.tf-multiline-input--auto-resize .tf-multiline-input__field {
  overflow: hidden;
  min-height: auto;
  resize: none;
}
.tf-multiline-input--filled .tf-multiline-input__input-container {
  background-color: #F1F1F1;
  border-color: transparent;
}
.tf-multiline-input--filled .tf-multiline-input__input-container:focus-within {
  background-color: #FFFFFF;
  border-color: #FCB434;
}
.tf-multiline-input--outlined .tf-multiline-input__input-container {
  background-color: transparent;
}
.tf-multiline-input--error .tf-multiline-input__input-container {
  border-color: #E53935;
}
.tf-multiline-input--error .tf-multiline-input__input-container:focus-within {
  border-color: #E53935;
  box-shadow: 0 0 0 3px rgba(229, 57, 53, 0.2);
}
.tf-multiline-input--error .tf-multiline-input__label {
  color: #E53935;
}
.tf-multiline-input--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.tf-multiline-input--disabled .tf-multiline-input__input-container {
  background-color: #F1F1F1;
  border-color: #E6E6E6;
}
.tf-multiline-input--disabled .tf-multiline-input__field {
  color: #6c757d;
  cursor: not-allowed;
}
.tf-multiline-input--disabled .tf-multiline-input__field::placeholder {
  color: rgba(108, 117, 125, 0.6);
}
.tf-multiline-input--disabled .tf-multiline-input__label {
  color: #6c757d;
}
.tf-multiline-input--readonly .tf-multiline-input__input-container {
  background-color: #F1F1F1;
}
.tf-multiline-input--readonly .tf-multiline-input__field {
  cursor: default;
  resize: none;
}
.tf-multiline-input--outlined.tf-multiline-input--readonly .tf-multiline-input__input-container {
  background-color: transparent;
}
.tf-multiline-input--full-width {
  width: 100%;
}
.tf-multiline-input--clearable .tf-multiline-input__field {
  padding-right: 40px;
}
.tf-select {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}
.tf-select__label {
  font-weight: bold;
  color: #333333;
  margin-bottom: 8px;
  font-size: 14px;
}
.tf-select__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-select__label--required::after {
  content: ' *';
  color: #E53935;
}
.tf-select__container {
  position: relative;
  display: inline-block;
  width: 100%;
}
.tf-select__field {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 100%;
  border: 2px solid #dee2e6;
  border-radius: 8px;
  background-color: #FFFFFF;
  background-image: none;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  color: #333333;
  outline: none;
  padding: 12px 40px 12px 16px;
  min-height: 48px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.tf-select__field:focus {
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.2);
}
.tf-select__field:invalid {
  color: #6c757d;
}
@media (max-width: 768px) {
  .tf-select__field {
    font-size: 16px;
    min-height: 56px;
  }
}
@media (prefers-contrast: high) {
  .tf-select__field {
    border-width: 2px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-select__field {
    transition: none;
  }
}
.tf-select__field::-ms-expand {
  display: none;
}
.tf-select__icon {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  color: #6c757d;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease-in-out;
}
.tf-select__footer {
  margin-top: 8px;
  min-height: 18px;
}
.tf-select__error {
  color: #E53935;
  font-size: 14px;
  line-height: 1.4;
}
.tf-select__help {
  color: #6c757d;
  font-size: 14px;
  line-height: 1.4;
}
.tf-select--small .tf-select__field {
  min-height: 40px;
  padding: 8px 36px 8px 12px;
  font-size: 14px;
}
.tf-select--small .tf-select__icon {
  right: 12px;
}
.tf-select--large .tf-select__field {
  min-height: 56px;
  padding: 16px 44px 16px 20px;
  font-size: 16px;
}
.tf-select--large .tf-select__icon {
  right: 20px;
}
.tf-select--filled .tf-select__field {
  background-color: #F1F1F1;
  border-color: transparent;
}
.tf-select--filled .tf-select__field:focus {
  background-color: #FFFFFF;
  border-color: #FCB434;
}
.tf-select--outlined .tf-select__field {
  background-color: transparent;
}
.tf-select--error .tf-select__field {
  border-color: #E53935;
}
.tf-select--error .tf-select__field:focus {
  border-color: #E53935;
  box-shadow: 0 0 0 3px rgba(229, 57, 53, 0.2);
}
.tf-select--error .tf-select__label {
  color: #E53935;
}
.tf-select--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.tf-select--disabled .tf-select__field {
  background-color: #F1F1F1;
  border-color: #E6E6E6;
  color: #6c757d;
  cursor: not-allowed;
}
.tf-select--disabled .tf-select__label {
  color: #6c757d;
}
.tf-select--readonly .tf-select__field {
  background-color: #F1F1F1;
  cursor: default;
}
.tf-select--full-width {
  width: 100%;
}
.tf-select__field:focus ~ .tf-select__icon {
  transform: translateY(-50%) rotate(180deg);
}
.tf-checkbox {
  display: inline-block;
}
.tf-checkbox__container {
  display: inline-flex;
  align-items: flex-start;
  gap: 12px;
  position: relative;
  cursor: pointer;
  user-select: none;
}
@media (max-width: 768px) {
  .tf-checkbox__container {
    gap: 16px;
  }
}
.tf-checkbox__input {
  position: absolute;
  opacity: 0;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  cursor: pointer;
  z-index: 1;
}
@media (max-width: 768px) {
  .tf-checkbox__input {
    width: 24px;
    height: 24px;
  }
}
.tf-checkbox__input:focus-visible ~ .tf-checkbox__box {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-checkbox__box {
  position: relative;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  border: 2px solid #dee2e6;
  border-radius: 4px;
  background-color: #FFFFFF;
  transition: all 0.2s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
  pointer-events: none;
}
@media (max-width: 768px) {
  .tf-checkbox__box {
    width: 24px;
    height: 24px;
  }
}
@media (prefers-contrast: high) {
  .tf-checkbox__box {
    border-width: 3px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-checkbox__box {
    transition: none;
  }
}
.tf-checkbox__check,
.tf-checkbox__indeterminate {
  color: #FFFFFF;
  flex-shrink: 0;
  pointer-events: none;
}
.tf-checkbox__label {
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  color: #333333;
  line-height: 1.5;
  cursor: pointer;
}
.tf-checkbox__label--disabled {
  color: #6c757d;
  cursor: not-allowed;
}
.tf-checkbox__required {
  color: #E53935;
}
.tf-checkbox__error,
.tf-checkbox__help {
  margin-top: 8px;
  margin-left: 36px;
  font-size: 14px;
  line-height: 1.4;
}
@media (max-width: 768px) {
  .tf-checkbox__error,
  .tf-checkbox__help {
    margin-left: 44px;
  }
}
.tf-checkbox__error {
  color: #E53935;
}
.tf-checkbox__help {
  color: #6c757d;
}
.tf-checkbox__input:checked ~ .tf-checkbox__box {
  background-color: #FCB434;
  border-color: #FCB434;
}
.tf-checkbox__input:indeterminate ~ .tf-checkbox__box {
  background-color: #FCB434;
  border-color: #FCB434;
}
.tf-checkbox__container:hover .tf-checkbox__box {
  border-color: #FCB434;
}
.tf-checkbox__input:checked ~ .tf-checkbox__box:hover,
.tf-checkbox__input:indeterminate ~ .tf-checkbox__box:hover {
  background-color: #f9a104;
  border-color: #f9a104;
}
.tf-checkbox--error .tf-checkbox__box {
  border-color: #E53935;
}
.tf-checkbox--error .tf-checkbox__label {
  color: #E53935;
}
.tf-checkbox--error .tf-checkbox__input:checked ~ .tf-checkbox__box,
.tf-checkbox--error .tf-checkbox__input:indeterminate ~ .tf-checkbox__box {
  background-color: #E53935;
  border-color: #E53935;
}
.tf-checkbox--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.tf-checkbox--disabled .tf-checkbox__container {
  cursor: not-allowed;
}
.tf-checkbox--disabled .tf-checkbox__box {
  background-color: #F1F1F1;
  border-color: #E6E6E6;
}
.tf-checkbox--disabled .tf-checkbox__label {
  cursor: not-allowed;
}
.tf-checkbox--disabled .tf-checkbox__input:checked ~ .tf-checkbox__box,
.tf-checkbox--disabled .tf-checkbox__input:indeterminate ~ .tf-checkbox__box {
  background-color: #E6E6E6;
  border-color: #E6E6E6;
}
.tf-checkbox--readonly .tf-checkbox__container {
  cursor: default;
}
.tf-checkbox--readonly .tf-checkbox__label {
  cursor: default;
}
.tf-radio-group {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}
.tf-radio-group__label {
  font-weight: bold;
  color: #333333;
  margin-bottom: 8px;
  font-size: 14px;
  margin-bottom: 12px;
}
.tf-radio-group__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-radio-group__label--required::after {
  content: ' *';
  color: #E53935;
}
.tf-radio-group__required {
  color: #E53935;
}
.tf-radio-group__options {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tf-radio-group__option {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  cursor: pointer;
  user-select: none;
}
.tf-radio-group__option--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
@media (max-width: 768px) {
  .tf-radio-group__option {
    gap: 16px;
  }
}
.tf-radio-group__input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
}
.tf-radio-group__input:focus-visible ~ .tf-radio-group__radio {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-radio-group__radio {
  position: relative;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  border: 2px solid #dee2e6;
  border-radius: 4px;
  background-color: #FFFFFF;
  transition: all 0.2s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
  pointer-events: none;
}
@media (max-width: 768px) {
  .tf-radio-group__radio {
    width: 24px;
    height: 24px;
  }
}
@media (prefers-contrast: high) {
  .tf-radio-group__radio {
    border-width: 3px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-radio-group__radio {
    transition: none;
  }
}
.tf-radio-group__radio-dot {
  width: 10px;
  height: 10px;
  border-radius: 2px;
  background-color: #FFFFFF;
  transform: scale(0);
  transition: transform 0.2s ease-in-out;
  pointer-events: none;
}
@media (max-width: 768px) {
  .tf-radio-group__radio-dot {
    width: 12px;
    height: 12px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-radio-group__radio-dot {
    transition: none;
  }
}
.tf-radio-group__option-label {
  flex: 1;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.tf-radio-group__option-text {
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  color: #333333;
  line-height: 1.5;
}
.tf-radio-group__option-description {
  font-size: 14px;
  color: #6c757d;
  line-height: 1.4;
}
.tf-radio-group__error,
.tf-radio-group__help {
  margin-top: 12px;
  font-size: 14px;
  line-height: 1.4;
}
.tf-radio-group__error {
  color: #E53935;
}
.tf-radio-group__help {
  color: #6c757d;
}
.tf-radio-group__input:checked ~ .tf-radio-group__radio {
  background-color: #FCB434;
  border-color: #FCB434;
}
.tf-radio-group__input:checked ~ .tf-radio-group__radio .tf-radio-group__radio-dot {
  transform: scale(1);
}
.tf-radio-group__option:hover .tf-radio-group__radio {
  border-color: #FCB434;
}
.tf-radio-group__input:checked ~ .tf-radio-group__radio:hover {
  background-color: #f9a104;
  border-color: #f9a104;
}
.tf-radio-group--horizontal .tf-radio-group__options {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 24px;
}
.tf-radio-group--error .tf-radio-group__radio {
  border-color: #E53935;
}
.tf-radio-group--error .tf-radio-group__label {
  color: #E53935;
}
.tf-radio-group--error .tf-radio-group__input:checked ~ .tf-radio-group__radio {
  background-color: #E53935;
  border-color: #E53935;
}
.tf-radio-group--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.tf-radio-group--disabled .tf-radio-group__option {
  cursor: not-allowed;
}
.tf-radio-group--disabled .tf-radio-group__radio {
  background-color: #F1F1F1;
  border-color: #E6E6E6;
}
.tf-radio-group--disabled .tf-radio-group__option-label {
  cursor: not-allowed;
}
.tf-radio-group--disabled .tf-radio-group__option-text {
  color: #6c757d;
}
.tf-radio-group--disabled .tf-radio-group__input:checked ~ .tf-radio-group__radio {
  background-color: #E6E6E6;
  border-color: #E6E6E6;
}
.tf-radio-group--readonly .tf-radio-group__option {
  cursor: default;
}
.tf-radio-group--readonly .tf-radio-group__option-label {
  cursor: default;
}
.tf-checkbox-group {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}
.tf-checkbox-group__label {
  font-weight: bold;
  color: #333333;
  margin-bottom: 8px;
  font-size: 14px;
  margin-bottom: 12px;
}
.tf-checkbox-group__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-checkbox-group__label--required::after {
  content: ' *';
  color: #E53935;
}
.tf-checkbox-group__required {
  color: #E53935;
}
.tf-checkbox-group__options {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tf-checkbox-group__option {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  cursor: pointer;
  user-select: none;
}
.tf-checkbox-group__option--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
@media (max-width: 768px) {
  .tf-checkbox-group__option {
    gap: 16px;
  }
}
.tf-checkbox-group__input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
}
.tf-checkbox-group__input:focus-visible ~ .tf-checkbox-group__box {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-checkbox-group__box {
  position: relative;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  border: 2px solid #dee2e6;
  border-radius: 4px;
  background-color: #FFFFFF;
  transition: all 0.2s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
  pointer-events: none;
}
@media (max-width: 768px) {
  .tf-checkbox-group__box {
    width: 24px;
    height: 24px;
  }
}
@media (prefers-contrast: high) {
  .tf-checkbox-group__box {
    border-width: 3px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-checkbox-group__box {
    transition: none;
  }
}
.tf-checkbox-group__check {
  color: #FFFFFF;
  flex-shrink: 0;
  pointer-events: none;
}
.tf-checkbox-group__option-label {
  flex: 1;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.tf-checkbox-group__option-text {
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  color: #333333;
  line-height: 1.5;
}
.tf-checkbox-group__option-description {
  font-size: 14px;
  color: #6c757d;
  line-height: 1.4;
}
.tf-checkbox-group__error,
.tf-checkbox-group__help {
  margin-top: 12px;
  font-size: 14px;
  line-height: 1.4;
}
.tf-checkbox-group__error {
  color: #E53935;
}
.tf-checkbox-group__help {
  color: #6c757d;
}
.tf-checkbox-group__input:checked ~ .tf-checkbox-group__box {
  background-color: #FCB434;
  border-color: #FCB434;
}
.tf-checkbox-group__option:hover .tf-checkbox-group__box {
  border-color: #FCB434;
}
.tf-checkbox-group__input:checked ~ .tf-checkbox-group__box:hover {
  background-color: #f9a104;
  border-color: #f9a104;
}
.tf-checkbox-group--horizontal .tf-checkbox-group__options {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 24px;
}
.tf-checkbox-group--error .tf-checkbox-group__box {
  border-color: #E53935;
}
.tf-checkbox-group--error .tf-checkbox-group__label {
  color: #E53935;
}
.tf-checkbox-group--error .tf-checkbox-group__input:checked ~ .tf-checkbox-group__box {
  background-color: #E53935;
  border-color: #E53935;
}
.tf-checkbox-group--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.tf-checkbox-group--disabled .tf-checkbox-group__option {
  cursor: not-allowed;
}
.tf-checkbox-group--disabled .tf-checkbox-group__box {
  background-color: #F1F1F1;
  border-color: #E6E6E6;
}
.tf-checkbox-group--disabled .tf-checkbox-group__option-label {
  cursor: not-allowed;
}
.tf-checkbox-group--disabled .tf-checkbox-group__option-text {
  color: #6c757d;
}
.tf-checkbox-group--disabled .tf-checkbox-group__input:checked ~ .tf-checkbox-group__box {
  background-color: #E6E6E6;
  border-color: #E6E6E6;
}
.tf-checkbox-group--readonly .tf-checkbox-group__option {
  cursor: default;
}
.tf-checkbox-group--readonly .tf-checkbox-group__option-label {
  cursor: default;
}
.tf-rangeslider {
  position: relative;
  display: inline-block;
  width: auto;
}
.tf-rangeslider--full-width {
  width: 100%;
  display: block;
}
.tf-rangeslider__label {
  font-weight: bold;
  color: #333333;
  margin-bottom: 8px;
  font-size: 14px;
  display: block;
}
.tf-rangeslider__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-rangeslider__container {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 200px;
}
.tf-rangeslider__value {
  font-size: 14px;
  font-weight: 600;
  color: #FCB434;
  text-align: center;
}
.tf-rangeslider__track {
  position: relative;
  height: 6px;
  background-color: #E6E6E6;
  border-radius: 3px;
  cursor: pointer;
}
.tf-rangeslider--disabled .tf-rangeslider__track,
.tf-rangeslider--readonly .tf-rangeslider__track {
  cursor: not-allowed;
}
.tf-rangeslider--small .tf-rangeslider__track {
  height: 4px;
}
.tf-rangeslider--large .tf-rangeslider__track {
  height: 8px;
}
.tf-rangeslider__range {
  position: absolute;
  top: 0;
  height: 100%;
  background-color: #FCB434;
  border-radius: 3px;
  transition: background-color 0.2s ease;
}
.tf-rangeslider--disabled .tf-rangeslider__range {
  background-color: #272727;
}
.tf-rangeslider__handle {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 20px;
  height: 20px;
  background-color: #fff;
  border: 2px solid #FCB434;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  cursor: grab;
  transition: all 0.2s ease;
}
.tf-rangeslider__handle:hover {
  transform: translate(-50%, -50%) scale(1.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}
.tf-rangeslider__handle:focus {
  outline: none;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-rangeslider__handle--active {
  cursor: grabbing;
  transform: translate(-50%, -50%) scale(1.15);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  z-index: 2;
}
.tf-rangeslider--disabled .tf-rangeslider__handle,
.tf-rangeslider--readonly .tf-rangeslider__handle {
  border-color: #272727;
  cursor: not-allowed;
}
.tf-rangeslider--disabled .tf-rangeslider__handle:hover,
.tf-rangeslider--readonly .tf-rangeslider__handle:hover {
  transform: translate(-50%, -50%);
}
.tf-rangeslider--small .tf-rangeslider__handle {
  width: 16px;
  height: 16px;
}
.tf-rangeslider--large .tf-rangeslider__handle {
  width: 24px;
  height: 24px;
}
.tf-rangeslider__tooltip {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  padding: 4px 8px;
  background-color: #333333;
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  border-radius: 4px;
  white-space: nowrap;
  pointer-events: none;
}
.tf-rangeslider__tooltip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 4px solid transparent;
  border-top-color: #333333;
}
.tf-rangeslider__marks {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.tf-rangeslider__mark {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}
.tf-rangeslider__mark-dot {
  width: 6px;
  height: 6px;
  background-color: #272727;
  border-radius: 50%;
}
.tf-rangeslider--small .tf-rangeslider__mark-dot {
  width: 4px;
  height: 4px;
}
.tf-rangeslider--large .tf-rangeslider__mark-dot {
  width: 8px;
  height: 8px;
}
.tf-rangeslider__mark-label {
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  font-size: 11px;
  color: #272727;
  white-space: nowrap;
}
.tf-rangeslider__labels {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #272727;
}
.tf-rangeslider__label-min,
.tf-rangeslider__label-max {
  font-weight: 500;
}
.tf-rangeslider__help {
  margin-top: 4px;
  font-size: 13px;
}
.tf-rangeslider__help-text {
  color: #272727;
}
.tf-rangeslider__error {
  color: #E53935;
}
.tf-rangeslider--small .tf-rangeslider__label {
  font-size: 13px;
  margin-bottom: 4px;
}
.tf-rangeslider--small .tf-rangeslider__value {
  font-size: 13px;
}
.tf-rangeslider--small .tf-rangeslider__help {
  font-size: 12px;
}
.tf-rangeslider--small .tf-rangeslider__labels {
  font-size: 11px;
}
.tf-rangeslider--large .tf-rangeslider__label {
  font-size: 15px;
  margin-bottom: 8px;
}
.tf-rangeslider--large .tf-rangeslider__value {
  font-size: 15px;
}
.tf-rangeslider--large .tf-rangeslider__help {
  font-size: 14px;
}
.tf-rangeslider--large .tf-rangeslider__labels {
  font-size: 13px;
}
.tf-rangeslider--filled .tf-rangeslider__track {
  background-color: #828282;
}
.tf-rangeslider--outlined .tf-rangeslider__track {
  border: 2px solid #dee2e6;
  background-color: #fff;
}
.tf-rangeslider--outlined .tf-rangeslider__range {
  border-radius: 1px;
}
.tf-rangeslider--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.tf-rangeslider--readonly .tf-rangeslider__handle {
  cursor: default;
}
.tf-rangeslider--error .tf-rangeslider__range {
  background-color: #E53935;
}
.tf-rangeslider--error .tf-rangeslider__handle {
  border-color: #E53935;
}
.tf-rangeslider--dragging {
  user-select: none;
}
.tf-alert {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 16px;
  border-radius: 8px;
  border: 1px solid;
  font-size: 14px;
  line-height: 1.5;
  margin-bottom: 16px;
}
.tf-alert:last-child {
  margin-bottom: 0;
}
.tf-alert__content {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  flex: 1;
  min-width: 0;
}
.tf-alert__icon {
  font-size: 18px;
  line-height: 1;
  flex-shrink: 0;
  margin-top: 1px;
}
.tf-alert__body {
  flex: 1;
  min-width: 0;
}
.tf-alert__title {
  font-weight: 600;
  font-size: 15px;
  margin-bottom: 8px / 2;
  color: inherit;
}
.tf-alert__title a {
  color: inherit;
  font-weight: 700;
  text-decoration: underline;
}
.tf-alert__title a:hover {
  text-decoration: none;
  opacity: 0.85;
}
.tf-alert__title a:focus {
  outline: 2px solid currentColor;
  outline-offset: 2px;
  border-radius: 2px;
}
.tf-alert__message {
  color: inherit;
}
.tf-alert__message a {
  color: inherit;
  font-weight: 600;
  text-decoration: underline;
}
.tf-alert__message a:hover {
  text-decoration: none;
  opacity: 0.85;
}
.tf-alert__message a:focus {
  outline: 2px solid currentColor;
  outline-offset: 2px;
  border-radius: 2px;
}
.tf-alert__close {
  background: none;
  border: none;
  padding: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  color: inherit;
  opacity: 0.6;
  flex-shrink: 0;
  margin-left: 8px;
  border-radius: 8px / 2;
  transition: opacity 0.2s ease, background-color 0.2s ease;
}
.tf-alert__close:hover {
  opacity: 1;
  background-color: rgba(0, 0, 0, 0.05);
}
.tf-alert__close:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1);
}
.tf-alert__close:active {
  background-color: rgba(0, 0, 0, 0.1);
}
.tf-alert--success {
  background-color: #d4edda;
  border-color: #c3e6cb;
  color: #155724;
}
.tf-alert--success .tf-alert__icon {
  color: #28a745;
}
.tf-alert--error {
  background-color: #f8d7da;
  border-color: #f5c6cb;
  color: #721c24;
}
.tf-alert--error .tf-alert__icon {
  color: #dc3545;
}
.tf-alert--warning {
  background-color: #fff3cd;
  border-color: #ffeaa7;
  color: #856404;
}
.tf-alert--warning .tf-alert__icon {
  color: #ffc107;
}
.tf-alert--info {
  background-color: #d1ecf1;
  border-color: #bee5eb;
  color: #0c5460;
}
.tf-alert--info .tf-alert__icon {
  color: #17a2b8;
}
@media (max-width: 768px) {
  .tf-alert {
    padding: 12px;
    font-size: 13px;
  }
  .tf-alert__content {
    gap: 8px;
  }
  .tf-alert__icon {
    font-size: 16px;
  }
  .tf-alert__title {
    font-size: 14px;
  }
  .tf-alert__close {
    width: 20px;
    height: 20px;
    font-size: 20px;
  }
}
@media (prefers-contrast: high) {
  .tf-alert {
    border-width: 2px;
  }
  .tf-alert__close:focus {
    outline: 2px solid currentColor;
    outline-offset: 2px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-alert__close {
    transition: none;
  }
}
.tf-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 24px;
  margin: 0;
  border: 2px solid transparent;
  border-radius: 8px;
  background: none;
  color: #333333;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  user-select: none;
  white-space: nowrap;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.tf-button svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}
.tf-button:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-button:disabled,
.tf-button--disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}
.tf-button--loading {
  position: relative;
  color: transparent;
}
.tf-button--loading::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 16px;
  margin: -8px 0 0 -8px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: tf-button-spin 0.8s linear infinite;
}
@keyframes tf-button-spin {
  to {
    transform: rotate(360deg);
  }
}
.tf-button--primary {
  background-color: #FCB434;
  border-color: #FCB434;
  color: #000000;
}
.tf-button--primary:hover:not(:disabled) {
  background-color: #D6931E;
  border-color: #D6931E;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.tf-button--primary:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-button--secondary {
  background-color: #E6E6E6;
  border-color: #E6E6E6;
  color: #333333;
}
.tf-button--secondary:hover:not(:disabled) {
  background-color: #828282;
  border-color: #828282;
  color: #FFFFFF;
}
.tf-button--outline {
  background-color: transparent;
  border-color: #dee2e6;
  color: #333333;
}
.tf-button--outline:hover:not(:disabled) {
  background-color: #FCB434;
  border-color: #FCB434;
  color: #000000;
}
.tf-button--danger {
  background-color: #E53935;
  border-color: #E53935;
  color: #FFFFFF;
}
.tf-button--danger:hover:not(:disabled) {
  background-color: #cd1e1a;
  border-color: #cd1e1a;
}
.tf-button--success {
  background-color: #5cb85c;
  border-color: #5cb85c;
  color: #FFFFFF;
}
.tf-button--success:hover:not(:disabled) {
  background-color: #449d44;
  border-color: #449d44;
}
.tf-button--ghost {
  background-color: transparent;
  border-color: transparent;
  color: #333333;
}
.tf-button--ghost:hover:not(:disabled) {
  background-color: #F1F1F1;
}
.tf-button--white {
  background-color: #FFFFFF;
  border-color: #dee2e6;
  color: #333333;
}
.tf-button--white:hover:not(:disabled) {
  background-color: #F1F1F1;
  border-color: #E6E6E6;
}
.tf-button--link {
  background-color: transparent;
  border-color: transparent;
  color: #FCB434;
  text-decoration: underline;
  padding: 8px;
}
.tf-button--link:hover:not(:disabled) {
  color: #D6931E;
  background-color: transparent;
}
.tf-button--small {
  padding: 8px 16px;
  font-size: 14px;
}
.tf-button--small.tf-button--loading::after {
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -6px;
}
.tf-button--medium {
  padding: 12px 24px;
  font-size: 16px;
}
.tf-button--medium.tf-button--loading::after {
  width: 16px;
  height: 16px;
  margin: -8px 0 0 -8px;
}
.tf-button--large {
  padding: 16px 32px;
  font-size: 18px;
  font-weight: 600;
}
.tf-button--large.tf-button--loading::after {
  width: 20px;
  height: 20px;
  margin: -10px 0 0 -10px;
}
.tf-button--xl {
  padding: 20px 40px;
  font-size: 20px;
  font-weight: 600;
}
.tf-button--xl.tf-button--loading::after {
  width: 24px;
  height: 24px;
  margin: -12px 0 0 -12px;
}
.tf-button--full,
.tf-button--full-width {
  width: 100%;
}
.tf-button-group {
  display: inline-flex;
}
.tf-button-group .tf-button {
  border-radius: 0;
  margin-right: -2px;
}
.tf-button-group .tf-button:first-child {
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}
.tf-button-group .tf-button:last-child {
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
  margin-right: 0;
}
.tf-button-group .tf-button:hover,
.tf-button-group .tf-button:focus {
  z-index: 1;
}
.tf-button-group--vertical {
  flex-direction: column;
}
.tf-button-group--vertical .tf-button {
  margin-right: 0;
  margin-bottom: -2px;
}
.tf-button-group--vertical .tf-button:first-child {
  border-radius: 8px 8px 0 0;
}
.tf-button-group--vertical .tf-button:last-child {
  border-radius: 0 0 8px 8px;
  margin-bottom: 0;
}
.tf-button--icon {
  padding: 8px;
  width: auto;
  min-width: auto;
}
.tf-button--icon-only {
  width: 40px;
  height: 40px;
  padding: 0;
}
.tf-button--icon--small {
  padding: 6px;
}
.tf-button--icon--small.tf-button--icon-only {
  width: 32px;
  height: 32px;
}
.tf-button--icon--large {
  padding: 12px;
}
.tf-button--icon--large.tf-button--icon-only {
  width: 48px;
  height: 48px;
}
.tf-button__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
}
.tf-button__icon svg {
  width: 100%;
  height: 100%;
  display: block;
}
.tf-button--icon-right .tf-button__icon {
  order: 1;
}
.tf-button--large .tf-button__icon {
  width: 20px;
  height: 20px;
}
.tf-button--small .tf-button__icon {
  width: 14px;
  height: 14px;
}
.tf-button__content {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.tf-button__content > svg {
  width: 16px;
  height: 16px;
  display: block;
  flex-shrink: 0;
}
.tf-button--large .tf-button__content > svg {
  width: 20px;
  height: 20px;
}
.tf-button--small .tf-button__content > svg {
  width: 14px;
  height: 14px;
}
@media (max-width: 768px) {
  .tf-button {
    min-height: 44px;
    padding: 12px 16px;
  }
  .tf-button--small {
    min-height: 36px;
    padding: 8px 12px;
  }
  .tf-button--medium {
    min-height: 44px;
    padding: 12px 16px;
  }
  .tf-button--large {
    min-height: 52px;
    padding: 16px 24px;
  }
  .tf-button-group--mobile-stack {
    flex-direction: column;
    width: 100%;
  }
  .tf-button-group--mobile-stack .tf-button {
    width: 100%;
    border-radius: 8px;
    margin-right: 0;
    margin-bottom: 8px;
  }
  .tf-button-group--mobile-stack .tf-button:last-child {
    margin-bottom: 0;
  }
}
.tf-card {
  display: flex;
  flex-direction: column;
  position: relative;
  background-color: #FFFFFF;
  border-radius: 8px;
  overflow: hidden;
  transition: all 0.2s ease-in-out;
  text-decoration: none;
  color: inherit;
  border: none;
  padding: 0;
  font-family: inherit;
  cursor: default;
  border: 1px solid #dee2e6;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}
.tf-card--border {
  border: 1px solid #dee2e6;
  box-shadow: none;
}
.tf-card--shadow {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.tf-card .tf-card__body {
  padding: 24px;
}
.tf-card .tf-card__header,
.tf-card .tf-card__footer {
  padding: 16px 24px;
}
.tf-card--small .tf-card__body {
  padding: 16px;
}
.tf-card--small .tf-card__header,
.tf-card--small .tf-card__footer {
  padding: 12px 16px;
}
.tf-card--medium .tf-card__body {
  padding: 24px;
}
.tf-card--medium .tf-card__header,
.tf-card--medium .tf-card__footer {
  padding: 16px 24px;
}
.tf-card--large .tf-card__body {
  padding: 32px;
}
.tf-card--large .tf-card__header,
.tf-card--large .tf-card__footer {
  padding: 24px 32px;
}
.tf-card--outlined {
  background-color: #FFFFFF;
  border: 1px solid #dee2e6;
  box-shadow: none;
}
.tf-card--elevated {
  border: none;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
}
.tf-card--elevated.tf-card--hover:hover {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}
.tf-card--filled {
  background-color: #E6E6E6;
  border: 1px solid #828282;
  box-shadow: none;
}
.tf-card--filled .tf-card__header,
.tf-card--filled .tf-card__footer {
  background-color: #F1F1F1;
}
.tf-card--filled .tf-card__body {
  background-color: #E6E6E6;
}
.tf-card--default {
  background-color: #FFFFFF;
  border: 1px solid #dee2e6;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}
.tf-card--interactive {
  cursor: pointer;
}
.tf-card--interactive:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-card--interactive:focus-visible {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-card--hover:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}
.tf-card--selected {
  border-color: #FCB434;
  box-shadow: 0 0 0 2px rgba(252, 180, 52, 0.3);
}
.tf-card--disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}
.tf-card__header {
  flex-shrink: 0;
  border-bottom: 1px solid #dee2e6;
  background-color: #FFFFFF;
}
.tf-card__header:first-child {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.tf-card__header:last-child {
  border-bottom: none;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
.tf-card__body {
  flex: 1;
}
.tf-card__body h1,
.tf-card__body h2,
.tf-card__body h3,
.tf-card__body h4,
.tf-card__body h5,
.tf-card__body h6 {
  margin-top: 0;
  margin-bottom: 8px;
  color: #333333;
  font-weight: 600;
  line-height: 1.3;
}
.tf-card__body h1:last-child,
.tf-card__body h2:last-child,
.tf-card__body h3:last-child,
.tf-card__body h4:last-child,
.tf-card__body h5:last-child,
.tf-card__body h6:last-child {
  margin-bottom: 0;
}
.tf-card__body p {
  margin: 0 0 12px 0;
  line-height: 1.6;
  color: #6c757d;
}
.tf-card__body p:last-child {
  margin-bottom: 0;
}
.tf-card__body ul,
.tf-card__body ol {
  margin-bottom: 16px;
  padding-left: 24px;
}
.tf-card__body ul:last-child,
.tf-card__body ol:last-child {
  margin-bottom: 0;
}
.tf-card__footer {
  flex-shrink: 0;
  border-top: 1px solid #dee2e6;
  background-color: #FFFFFF;
  display: flex;
  gap: 8px;
}
.tf-card__footer:first-child {
  border-top: none;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.tf-card__footer:last-child {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
.tf-card__footer .tf-button + .tf-button {
  margin-left: 8px;
}
.tf-card__footer--actions-right {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.tf-card__footer--actions-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.tf-card__image-container {
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}
.tf-card__image-container:first-child {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.tf-card__image-container:last-child {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
.tf-card__image {
  width: 100%;
  height: 100%;
  display: block;
  transition: transform 0.3s ease-in-out;
}
.tf-card--interactive:hover .tf-card__image {
  transform: scale(1.05);
}
.tf-card__overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(to bottom, transparent 0%, transparent 60%, rgba(0, 0, 0, 0.7) 100%);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 16px;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  color: #FFFFFF;
}
.tf-card--interactive:hover .tf-card__overlay {
  opacity: 1;
}
.tf-card__overlay--visible {
  opacity: 1;
}
.tf-card__overlay h1,
.tf-card__overlay h2,
.tf-card__overlay h3,
.tf-card__overlay h4,
.tf-card__overlay h5,
.tf-card__overlay h6 {
  color: #FFFFFF;
  margin: 0;
}
.tf-card__overlay p {
  color: rgba(255, 255, 255, 0.9);
  margin: 0;
}
.tf-card__badge {
  position: absolute;
  top: 8px;
  right: 8px;
  background-color: #FCB434;
  color: #272727;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  z-index: 2;
}
.tf-card__badge--success {
  background-color: #5cb85c;
  color: #FFFFFF;
}
.tf-card__badge--error {
  background-color: #E53935;
  color: #FFFFFF;
}
.tf-card__badge--trending {
  background-color: #FCB434;
  color: #272727;
  display: flex;
  align-items: center;
  gap: 4px;
}
.tf-card__badge--trending svg {
  width: 12px;
  height: 12px;
}
@media (max-width: 768px) {
  .tf-card--small .tf-card__body,
  .tf-card--medium .tf-card__body,
  .tf-card--large .tf-card__body {
    padding: 16px;
  }
  .tf-card--small .tf-card__header,
  .tf-card--medium .tf-card__header,
  .tf-card--large .tf-card__header,
  .tf-card--small .tf-card__footer,
  .tf-card--medium .tf-card__footer,
  .tf-card--large .tf-card__footer {
    padding: 12px 16px;
  }
  .tf-card .tf-card__footer--actions-right,
  .tf-card .tf-card__footer--actions-between {
    flex-direction: column;
    gap: 8px;
  }
  .tf-card .tf-card__footer--actions-right .tf-button,
  .tf-card .tf-card__footer--actions-between .tf-button {
    width: 100%;
    margin-left: 0;
  }
  .tf-card--hover:hover {
    transform: none;
  }
  .tf-card--interactive:hover .tf-card__image {
    transform: none;
  }
  .tf-card--interactive:hover .tf-card__overlay {
    opacity: 0;
  }
  .tf-card__overlay--visible {
    opacity: 1;
  }
}
@media (prefers-contrast: high) {
  .tf-card {
    border-width: 2px;
  }
  .tf-card--outlined {
    border-width: 3px;
  }
  .tf-card--selected {
    border-width: 3px;
  }
  .tf-card .tf-card__header,
  .tf-card .tf-card__footer {
    border-width: 2px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-card {
    transition: none;
  }
  .tf-card--hover:hover {
    transform: none;
  }
  .tf-card .tf-card__image,
  .tf-card .tf-card__overlay {
    transition: none;
  }
  .tf-card--interactive:hover .tf-card .tf-card__image {
    transform: none;
  }
}
.tf-card-grid {
  display: grid;
  gap: 24px;
}
.tf-card-grid--auto {
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
.tf-card-grid--2-col {
  grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 768px) {
  .tf-card-grid--2-col {
    grid-template-columns: 1fr;
  }
}
.tf-card-grid--3-col {
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 992px) {
  .tf-card-grid--3-col {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 768px) {
  .tf-card-grid--3-col {
    grid-template-columns: 1fr;
  }
}
.tf-card-grid--4-col {
  grid-template-columns: repeat(4, 1fr);
}
@media (max-width: 992px) {
  .tf-card-grid--4-col {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 768px) {
  .tf-card-grid--4-col {
    grid-template-columns: 1fr;
  }
}
.tf-help-block {
  display: inline-block;
  font-size: 14px;
  line-height: 1.4;
  margin: 0;
  padding: 4px 0;
  color: #6c757d;
}
.tf-help-block--info {
  color: #6c757d;
}
.tf-help-block--error {
  color: #E53935;
  font-weight: 500;
}
.tf-help-block--warning {
  color: #D6931E;
  font-weight: 500;
}
.tf-help-block--success {
  color: #5cb85c;
  font-weight: 500;
}
@media (max-width: 768px) {
  .tf-help-block {
    font-size: 13px;
    line-height: 1.3;
  }
}
.tf-info-card {
  display: block;
  position: relative;
  padding: 0;
}
h3.tf-info-card__title {
  position: relative;
  margin: 0 0 0 -45px !important;
  padding: 20px 40px !important;
  background-color: #FCB434 !important;
  color: #FFFFFF !important;
  font-size: 32px !important;
  font-weight: 400 !important;
  font-family: 'Avenir', Arial, sans-serif !important;
  line-height: 1.2 !important;
  display: inline-block;
  z-index: 1;
}
h3.tf-info-card__title::before {
  content: '';
  display: block;
  position: absolute;
  background-color: #FCB434;
  width: 40px;
  height: 40px;
  transform: rotate(45deg);
  bottom: -16px;
  left: 25px;
  z-index: -1;
}
.tf-info-card__content {
  position: relative;
  padding: 40px 40px 24px 40px;
  background-color: #F5F5F5;
  border: 1px solid #E6E6E6;
  margin-top: -1px;
  z-index: 2;
  color: #828282;
  font-size: 16px;
  line-height: 1.6;
}
.tf-info-card__content p {
  margin: 0 0 16px 0;
}
.tf-info-card__content p:last-child {
  margin-bottom: 0;
}
.tf-info-card__content a {
  color: #828282;
  text-decoration: underline;
  transition: color 0.2s ease-in-out;
}
.tf-info-card__content a:hover {
  color: #272727;
}
.tf-info-card__content a:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  border-radius: 2px;
}
.tf-info-card__content ul,
.tf-info-card__content ol {
  margin: 0 0 16px 0;
  padding-left: 24px;
}
.tf-info-card__content ul:last-child,
.tf-info-card__content ol:last-child {
  margin-bottom: 0;
}
.tf-info-card__content ul li,
.tf-info-card__content ol li {
  margin-bottom: 8px;
  line-height: 1.6;
}
.tf-info-card__content ul li:last-child,
.tf-info-card__content ol li:last-child {
  margin-bottom: 0;
}
.tf-info-card__content h4,
.tf-info-card__content h5,
.tf-info-card__content h6 {
  margin: 24px 0 12px 0;
  color: #272727;
  font-family: 'AvenirMedium', 'Avenir', Arial, sans-serif;
  font-weight: 600;
  line-height: 1.3;
}
.tf-info-card__content h4:first-child,
.tf-info-card__content h5:first-child,
.tf-info-card__content h6:first-child {
  margin-top: 0;
}
.tf-info-card__content h4:last-child,
.tf-info-card__content h5:last-child,
.tf-info-card__content h6:last-child {
  margin-bottom: 0;
}
.tf-info-card__content h4 {
  font-size: 20px;
}
.tf-info-card__content h5 {
  font-size: 18px;
}
.tf-info-card__content h6 {
  font-size: 16px;
}
.tf-info-card__content code {
  background-color: #F1F1F1;
  padding: 4px 8px;
  border-radius: 4px;
  font-family: 'Courier New', monospace;
  font-size: 14px;
}
.tf-info-card__content pre {
  background-color: #F1F1F1;
  padding: 16px;
  border-radius: 4px;
  overflow-x: auto;
  margin: 0 0 16px 0;
}
.tf-info-card__content pre:last-child {
  margin-bottom: 0;
}
.tf-info-card__content pre code {
  background: none;
  padding: 0;
}
.tf-info-card__content strong,
.tf-info-card__content b {
  font-family: 'AvenirHeavy', 'Avenir', Arial, sans-serif;
  font-weight: 600;
  color: #272727;
}
.tf-info-card__content em,
.tf-info-card__content i {
  font-style: italic;
}
@media (max-width: 768px) {
  h3.tf-info-card__title {
    font-size: 20px !important;
    padding: 16px 24px 16px 48px !important;
    max-width: 100%;
  }
  h3.tf-info-card__title::before {
    width: 32px;
    height: 32px;
    bottom: 16px;
    left: -16px;
  }
  .tf-info-card__content {
    padding: 16px 20px;
    font-size: 15px;
  }
}
@media (prefers-contrast: high) {
  .tf-info-card {
    border-width: 2px;
  }
  .tf-info-card .tf-info-card__title {
    border: 2px solid #dee2e6;
  }
  .tf-info-card .tf-info-card__title::before {
    border: 2px solid #FCB434;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-info-card .tf-info-card__content a {
    transition: none;
  }
}
.tf-info-card-grid {
  display: grid;
  gap: 24px;
}
.tf-info-card-grid--2-col {
  grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 992px) {
  .tf-info-card-grid--2-col {
    grid-template-columns: 1fr;
  }
}
.tf-info-card-grid--3-col {
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 1200px) {
  .tf-info-card-grid--3-col {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 768px) {
  .tf-info-card-grid--3-col {
    grid-template-columns: 1fr;
  }
}
.tf-info-card-grid .tf-info-card {
  margin-bottom: 0;
}
.tf-loader {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.tf-loader__container {
  position: relative;
  display: flex;
  flex-wrap: wrap;
}
.tf-loader__square-container {
  display: block;
  background: transparent;
  float: left;
}
.tf-loader__square {
  display: block;
  width: 100%;
  height: 100%;
  background: #FCB434;
  transition: opacity 0.5s ease-in-out;
}
.tf-loader--small {
  padding: 16px;
}
.tf-loader--small .tf-loader__container {
  width: 24px;
  height: 24px;
}
.tf-loader--small .tf-loader__square-container {
  width: 12px;
  height: 12px;
}
.tf-loader--medium {
  padding: 32px;
}
.tf-loader--medium .tf-loader__container {
  width: 40px;
  height: 40px;
}
.tf-loader--medium .tf-loader__square-container {
  width: 20px;
  height: 20px;
}
.tf-loader--large {
  padding: 48px;
}
.tf-loader--large .tf-loader__container {
  width: 60px;
  height: 60px;
}
.tf-loader--large .tf-loader__square-container {
  width: 30px;
  height: 30px;
}
.tf-loader--primary .tf-loader__square {
  background: #FCB434;
}
.tf-loader--secondary .tf-loader__square {
  background: #828282;
}
.tf-loader--light .tf-loader__square {
  background: #FFFFFF;
}
.tf-modal {
  display: flex;
  flex-direction: column;
  background-color: #FFFFFF;
  border-radius: 8px;
  box-shadow: 0 16px 64px rgba(0, 0, 0, 0.2);
  max-height: 90vh;
  overflow: hidden;
  animation: modalSlideIn 0.2s ease-out;
}
.tf-modal__dialog {
  display: flex;
  flex-direction: column;
  height: 100%;
  outline: none;
}
.tf-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px;
  border-bottom: 1px solid #dee2e6;
  flex-shrink: 0;
  min-height: auto;
}
.tf-modal__title {
  font-size: 20px;
  font-weight: 600;
  color: #333333;
  margin: 0;
  line-height: 1.3;
  flex: 1;
  word-wrap: break-word;
  hyphens: auto;
}
.tf-modal__close {
  margin-left: 16px;
  flex-shrink: 0;
}
.tf-modal__close.tf-button {
  padding: 8px !important;
  min-width: auto !important;
}
.tf-modal__close.tf-button svg {
  width: 16px;
  height: 16px;
}
.tf-modal__body {
  flex: 1;
  padding: 24px 32px;
  overflow-y: auto;
}
.tf-modal__body::-webkit-scrollbar {
  width: 8px;
}
.tf-modal__body::-webkit-scrollbar-track {
  background: #F1F1F1;
  border-radius: 4px;
}
.tf-modal__body::-webkit-scrollbar-thumb {
  background: #828282;
  border-radius: 4px;
}
.tf-modal__body::-webkit-scrollbar-thumb:hover {
  background: #272727;
}
.tf-modal__body p {
  margin-bottom: 16px;
  line-height: 1.5;
}
.tf-modal__body p:last-child {
  margin-bottom: 0;
}
.tf-modal__body .tf-text-input,
.tf-modal__body .tf-multiline-input,
.tf-modal__body .tf-select,
.tf-modal__body .tf-radio-group {
  margin-bottom: 24px;
}
.tf-modal__body .tf-text-input:last-child,
.tf-modal__body .tf-multiline-input:last-child,
.tf-modal__body .tf-select:last-child,
.tf-modal__body .tf-radio-group:last-child {
  margin-bottom: 0;
}
.tf-modal__footer {
  display: flex;
  align-items: center;
  gap: 16px;
}
.tf-modal__footer--left {
  justify-content: flex-start;
}
.tf-modal__footer--center {
  justify-content: center;
}
.tf-modal__footer--right {
  justify-content: flex-end;
}
.tf-modal__footer--space-between {
  justify-content: space-between;
}
.tf-modal__footer--sticky {
  padding: 16px 32px 32px;
  border-top: 1px solid #dee2e6;
  flex-shrink: 0;
}
.tf-modal__footer--inline {
  padding: 32px 0 0 0;
  border-top: 1px solid #dee2e6;
  margin-top: 32px;
}
.tf-modal__footer .tf-button + .tf-button {
  margin-left: 0;
}
.tf-modal--small {
  width: 400px;
  max-width: 90vw;
}
.tf-modal--medium {
  width: 600px;
  max-width: 90vw;
}
.tf-modal--large {
  width: 900px;
  max-width: 95vw;
}
.tf-modal--fullwidth {
  width: 95vw;
  max-width: 1200px;
}
.tf-modal--confirm .tf-modal__header {
  background-color: rgba(252, 180, 52, 0.1);
  border-bottom-color: rgba(252, 180, 52, 0.3);
}
.tf-modal--confirm .tf-modal__title {
  color: #333333;
}
.tf-modal--alert .tf-modal__header {
  background-color: rgba(229, 57, 53, 0.1);
  border-bottom-color: rgba(229, 57, 53, 0.3);
}
.tf-modal--alert .tf-modal__title {
  color: #E53935;
}
.tf-modal--form .tf-modal__body {
  padding: 32px;
}
.tf-modal--custom .tf-modal__header,
.tf-modal--custom .tf-modal__body,
.tf-modal--custom .tf-modal__footer {
  padding: 0;
  border: none;
  background: none;
}
@media (max-width: 992px) {
  .tf-modal {
    width: 95vw !important;
    max-width: 95vw !important;
    margin: 16px;
  }
  .tf-modal__header {
    padding: 24px 24px 16px;
  }
  .tf-modal__body {
    padding: 16px 24px;
  }
  .tf-modal__footer {
    flex-direction: column;
    gap: 8px;
  }
  .tf-modal__footer--sticky {
    padding: 16px 24px 24px;
  }
  .tf-modal__footer--inline {
    padding: 24px 0 0 0;
    margin-top: 24px;
  }
  .tf-modal__footer .tf-button {
    width: 100%;
  }
  .tf-modal__title {
    font-size: 18px;
  }
}
@media (max-width: 768px) {
  .tf-modal {
    width: 100vw !important;
    height: 100vh !important;
    max-width: 100vw !important;
    max-height: 100vh !important;
    margin: 0;
    border-radius: 0;
  }
  .tf-modal__header {
    padding: 16px;
  }
  .tf-modal__body {
    padding: 16px;
  }
  .tf-modal__footer--sticky {
    padding: 16px;
  }
  .tf-modal__footer--inline {
    padding: 16px 0 0 0;
    margin-top: 16px;
  }
}
@media (prefers-contrast: high) {
  .tf-modal {
    border: 2px solid #333333;
  }
  .tf-modal .tf-modal__header,
  .tf-modal .tf-modal__footer {
    border-width: 2px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-modal {
    animation: none;
  }
}
@keyframes modalSlideIn {
  from {
    opacity: 0;
    transform: translateY(-20px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
.tf-modal__dialog:focus {
  outline: none;
}
.tf-overlay .tf-modal {
  position: relative;
  z-index: 1;
}
.tf-overlay--modal {
  background-color: rgba(0, 0, 0, 0.6);
}
.tf-overlay--modal .tf-overlay-container {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 16px;
}
.tf-overlay--modal .tf-overlay-content {
  background: none;
  padding: 0;
  box-shadow: none;
  border-radius: 0;
  max-width: none;
  max-height: none;
  overflow: visible;
}
.tf-options-menu {
  position: relative;
  display: inline-flex;
}
.tf-options-menu__trigger {
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 4px;
  border-radius: 4px;
  background-color: rgba(0, 0, 0, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #FFFFFF;
  transition: all 0.2s ease-in-out;
  flex-shrink: 0;
}
.tf-options-menu__trigger:hover,
.tf-options-menu__trigger:focus {
  background-color: rgba(0, 0, 0, 0.8);
  border-color: rgba(255, 255, 255, 0.4);
  outline: none;
}
.tf-options-menu__trigger svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  transition: transform 0.2s ease-in-out;
  flex-shrink: 0;
}
.tf-options-menu__dropdown {
  position: absolute;
  top: calc(100% + 4px);
  background-color: #FFFFFF;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15), 0 4px 8px rgba(0, 0, 0, 0.1);
  padding: 4px 0;
  min-width: 160px;
  z-index: 1050;
  list-style: none;
  margin: 0;
}
.tf-options-menu__dropdown--right {
  right: 0;
}
.tf-options-menu__dropdown--left {
  left: 0;
}
.tf-options-menu__item {
  display: block;
  margin: 0;
  padding: 0;
  list-style: none;
}
.tf-options-menu__item > * {
  display: flex !important;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 12px;
  color: #333333;
  text-decoration: none;
  white-space: nowrap;
  transition: all 0.15s ease-in-out;
  cursor: pointer;
  border: none;
  background: none;
  text-align: left;
  font-size: 14px;
  line-height: 1.4;
}
.tf-options-menu__item > * svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  stroke: currentColor;
}
.tf-options-menu__item > *:hover,
.tf-options-menu__item > *:focus {
  background-color: #F5F5F5;
  color: #333333;
  text-decoration: none;
  outline: none;
}
.tf-options-menu__item--focused > * {
  background-color: #F5F5F5;
}
.tf-options-menu--open .tf-options-menu__trigger {
  background-color: rgba(0, 0, 0, 0.8);
  border-color: rgba(255, 255, 255, 0.4);
}
.tf-options-menu--overlay .tf-options-menu__trigger {
  background-color: rgba(0, 0, 0, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.3);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
.tf-options-menu--overlay .tf-options-menu__trigger:hover,
.tf-options-menu--overlay .tf-options-menu__trigger:focus {
  background-color: rgba(0, 0, 0, 0.9);
  border-color: rgba(255, 255, 255, 0.5);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
}
.tf-options-menu--overlay .tf-options-menu__trigger svg {
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.5));
}
.tf-options-menu--overlay.tf-options-menu--open .tf-options-menu__trigger {
  background-color: rgba(0, 0, 0, 0.9);
  border-color: rgba(255, 255, 255, 0.5);
}
.tf-options-menu--card .tf-options-menu__trigger {
  background-color: #FFFFFF;
  border: 1px solid #dee2e6;
  color: #333333;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.tf-options-menu--card .tf-options-menu__trigger:hover,
.tf-options-menu--card .tf-options-menu__trigger:focus {
  background-color: #F5F5F5;
  border-color: #828282;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-options-menu--card.tf-options-menu--open .tf-options-menu__trigger {
  background-color: #F5F5F5;
  border-color: #FCB434;
}
.tf-options-menu__item > .tf-options-menu__action--delete:hover,
.tf-options-menu__item > .tf-options-menu__action--danger:hover,
.tf-options-menu__item > .tf-options-menu__action--delete:focus,
.tf-options-menu__item > .tf-options-menu__action--danger:focus {
  background-color: rgba(229, 57, 53, 0.1);
  color: #E53935;
}
.tf-overlay {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  overflow-y: scroll;
  border: 0 none;
  z-index: 202;
  background-color: rgba(27, 27, 27, 0.99);
}
.tf-overlay-container {
  padding: 40px 30px 40px 30px;
  display: flex;
  justify-content: center;
}
.tf-overlay-content {
  max-width: 1600px;
  max-height: calc(100vh - 80px);
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  position: relative;
  border-radius: 8px;
}
.tf-overlay-content--modal {
  background-color: #FFFFFF;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}
.tf-overlay-content--transparent {
  background-color: transparent;
  box-shadow: none;
}
.tf-overlay-content--fullscreen {
  max-width: 100vw;
  max-height: 100vh;
  width: 100vw;
  height: 100vh;
  border-radius: 0;
}
.tf-overlay-content--small {
  max-width: 400px;
}
.tf-overlay-content--large {
  max-width: 1200px;
}
.tf-overlay-content--fullwidth {
  max-width: 100%;
  width: 100%;
}
.tf-overlay div.close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 302;
}
.tf-overlay div.close span.close-hint {
  color: rgba(255, 255, 255, 0.5);
  font-size: 12px;
  line-height: 18px;
  padding-right: 10px;
  vertical-align: middle;
}
.tf-overlay div.close span.close-hint span.key {
  padding: 3px 2px 0;
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.5);
}
.tf-overlay div.close button {
  vertical-align: middle;
}
@media screen and (max-width: 1023px) and (min-width: 768px), screen and (max-width: 767px) {
  .tf-overlay div.close span.close-hint {
    display: none;
  }
}
.tf-overlay-dialog {
  width: 60%;
  padding: 40px;
  background-color: #fff;
  border-radius: 10px;
}
@media screen and (max-width: 767px) {
  .tf-overlay-dialog {
    width: 100%;
    padding: 10px;
  }
}
.tf-overlay-dialog h2 {
  font-size: 24px;
  color: #272727;
}
.overlay-select {
  width: 100%;
  padding: 40px;
  background-color: #fff;
}
.tf-progress-bar {
  margin-bottom: 16px;
}
.tf-progress-bar__label {
  font-size: 14px;
  color: #333333;
  font-weight: 500;
  margin-bottom: 4px;
}
.tf-progress-bar__label--top {
  margin-bottom: 8px;
}
.tf-progress-bar__container {
  position: relative;
  width: 100%;
}
.tf-progress-bar__track {
  width: 100%;
  background-color: #F1F1F1;
  border-radius: 4px;
  overflow: hidden;
  position: relative;
}
.tf-progress-bar__fill {
  height: 100%;
  background-color: #FCB434;
  border-radius: 4px;
  transition: width 0.3s ease-in-out;
  position: relative;
}
.tf-progress-bar__fill::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.2) 50%, transparent 100%);
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}
.tf-progress-bar__info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 4px;
  font-size: 12px;
  color: #6c757d;
}
.tf-progress-bar__percentage {
  font-weight: 600;
  color: #333333;
}
.tf-progress-bar--small .tf-progress-bar__track {
  height: 4px;
}
.tf-progress-bar--small .tf-progress-bar__label {
  font-size: 12px;
}
.tf-progress-bar--small .tf-progress-bar__info {
  font-size: 11px;
}
.tf-progress-bar--medium .tf-progress-bar__track {
  height: 8px;
}
.tf-progress-bar--medium .tf-progress-bar__label {
  font-size: 14px;
}
.tf-progress-bar--medium .tf-progress-bar__info {
  font-size: 13px;
}
.tf-progress-bar--large .tf-progress-bar__track {
  height: 12px;
}
.tf-progress-bar--large .tf-progress-bar__label {
  font-size: 16px;
}
.tf-progress-bar--large .tf-progress-bar__info {
  font-size: 14px;
}
.tf-progress-bar--primary .tf-progress-bar__fill {
  background-color: #FCB434;
}
.tf-progress-bar--secondary .tf-progress-bar__fill {
  background-color: #828282;
}
.tf-progress-bar--success .tf-progress-bar__fill {
  background-color: #5cb85c;
}
.tf-progress-bar--warning .tf-progress-bar__fill {
  background-color: #ffc107;
}
.tf-progress-bar--error .tf-progress-bar__fill {
  background-color: #E53935;
}
.tf-progress-bar--animated .tf-progress-bar__fill::after {
  opacity: 1;
  animation: tf-progress-shimmer 2s infinite;
}
.tf-progress-bar:hover .tf-progress-bar__fill::after {
  opacity: 0.3;
}
@keyframes tf-progress-shimmer {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(100%);
  }
}
.tf-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 12px;
  background-color: #F5F5F5;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.2;
  color: #333333;
  text-decoration: none;
  font-weight: 400;
  font-family: 'Avenir', Arial, sans-serif;
  white-space: nowrap;
}
.tf-tag[type="button"] {
  cursor: pointer;
}
.tf-tag__text {
  display: inline-block;
}
.tf-tag__remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  padding: 0;
  margin: 0;
  background: none;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  color: #828282;
  line-height: 1;
  transition: all 0.15s ease-in-out;
  flex-shrink: 0;
}
.tf-tag__remove:hover {
  background-color: rgba(0, 0, 0, 0.1);
  color: #272727;
}
.tf-tag__remove:active {
  background-color: rgba(0, 0, 0, 0.15);
}
.tf-tag__remove svg {
  width: 12px;
  height: 12px;
  display: block;
}
.tf-tag--interactive {
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.tf-tag--interactive:hover {
  background-color: #FCB434;
  border-color: #FCB434;
  color: #000000;
  text-decoration: none;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-tag--interactive:active {
  transform: translateY(0);
}
.tf-tag--interactive:focus-visible {
  outline: 2px solid #ffc107;
  outline-offset: 2px;
}
.tf-tag--display {
  cursor: default;
}
.tf-tag--editable {
  padding-right: 4px;
}
.tf-tag--primary {
  background-color: #FCB434;
  border-color: #FCB434;
  color: #000000;
}
.tf-tag--primary.tf-tag--interactive:hover {
  background-color: #D6931E;
  border-color: #D6931E;
}
.tf-tag--secondary {
  background-color: #E6E6E6;
  border-color: #E6E6E6;
  color: #333333;
}
.tf-tag--secondary.tf-tag--interactive:hover {
  background-color: #828282;
  border-color: #828282;
  color: #FFFFFF;
}
.tf-tag--success {
  background-color: #d4edda;
  border-color: #c3e6cb;
  color: #155724;
}
.tf-tag--success.tf-tag--interactive:hover {
  background-color: #c3e6cb;
  border-color: #b1dfbb;
}
.tf-tag--warning {
  background-color: #fff3cd;
  border-color: #ffeaa7;
  color: #856404;
}
.tf-tag--warning.tf-tag--interactive:hover {
  background-color: #ffeaa7;
  border-color: #ffd700;
}
.tf-tag--danger {
  background-color: #f8d7da;
  border-color: #f5c6cb;
  color: #721c24;
}
.tf-tag--danger.tf-tag--interactive:hover {
  background-color: #f5c6cb;
  border-color: #f1b0b7;
}
.tf-tag--info {
  background-color: #d1ecf1;
  border-color: #bee5eb;
  color: #0c5460;
}
.tf-tag--info.tf-tag--interactive:hover {
  background-color: #bee5eb;
  border-color: #abdde5;
}
.tf-tag--small {
  padding: 2.66666667px 8px;
  font-size: 12px;
}
.tf-tag--small .tf-tag__remove {
  width: 14px;
  height: 14px;
}
.tf-tag--small .tf-tag__remove svg {
  width: 10px;
  height: 10px;
}
.tf-tag--large {
  padding: 6px 16px;
  font-size: 16px;
}
.tf-tag--large .tf-tag__remove {
  width: 20px;
  height: 20px;
}
.tf-tag--large .tf-tag__remove svg {
  width: 14px;
  height: 14px;
}
.tf-tag-container {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.tf-tag-container:empty::after {
  content: "No items to display";
  color: #6c757d;
  font-style: italic;
  font-size: 14px;
}
.tf-tag-container--compact {
  gap: 2px;
}
.tf-tag-container--spaced {
  gap: 8px;
}
.tf-tag-section__label {
  font-weight: bold;
  margin-bottom: 8px;
  margin-bottom: 12px;
  font-size: 14px;
  font-weight: 500;
  color: #333333;
}
.tf-tag-section__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-tag-section__container {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.tf-tag-section__empty {
  color: #6c757d;
  font-style: italic;
  font-size: 14px;
}
.tf-tag-section--compact .tf-tag-section__label {
  font-size: 16px;
  margin-bottom: 8px;
}
.tf-tag-section--compact .tf-tag-section__container {
  gap: 2px;
}
.tf-tag-section--inline {
  display: flex;
  align-items: center;
  gap: 12px;
}
.tf-tag-section--inline .tf-tag-section__label {
  margin-bottom: 0;
  flex-shrink: 0;
}
.tf-tag-section--inline .tf-tag-section__container {
  flex: 1;
}
.tf-toast-container {
  position: fixed;
  z-index: 252;
  pointer-events: none;
}
.tf-toast-container--top-left {
  top: 24px;
  left: 24px;
}
.tf-toast-container--top-center {
  top: 24px;
  left: 50%;
  transform: translateX(-50%);
}
.tf-toast-container--top-right {
  top: 24px;
  right: 24px;
}
.tf-toast-container--bottom-left {
  bottom: 24px;
  left: 24px;
}
.tf-toast-container--bottom-center {
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
}
.tf-toast-container--bottom-right {
  bottom: 24px;
  right: 24px;
}
@media (max-width: 768px) {
  .tf-toast-container--top-left,
  .tf-toast-container--top-center,
  .tf-toast-container--top-right {
    top: 16px;
    left: 16px;
    right: 16px;
    transform: none;
  }
  .tf-toast-container--bottom-left,
  .tf-toast-container--bottom-center,
  .tf-toast-container--bottom-right {
    bottom: 16px;
    left: 16px;
    right: 16px;
    transform: none;
  }
}
.tf-toast {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  min-width: 320px;
  max-width: 480px;
  margin-bottom: 16px;
  padding: 24px;
  background-color: #FFFFFF;
  border-radius: 8px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
  border-left: 4px solid #828282;
  pointer-events: auto;
  opacity: 0;
  transform: translateX(100%);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.tf-toast--visible {
  opacity: 1;
  transform: translateX(0);
}
.tf-toast--removing {
  opacity: 0;
  transform: translateX(100%);
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
  max-height: 0;
  overflow: hidden;
}
.tf-toast--success {
  border-left-color: #5cb85c;
}
.tf-toast--success .tf-toast__icon {
  color: #5cb85c;
}
.tf-toast--error {
  border-left-color: #E53935;
}
.tf-toast--error .tf-toast__icon {
  color: #E53935;
}
.tf-toast--warning {
  border-left-color: #FCB434;
}
.tf-toast--warning .tf-toast__icon {
  color: #FCB434;
}
.tf-toast--info {
  border-left-color: #3b82f6;
}
.tf-toast--info .tf-toast__icon {
  color: #3b82f6;
}
.tf-toast__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
}
.tf-toast__icon svg {
  width: 20px;
  height: 20px;
}
.tf-toast__content {
  flex: 1;
  min-width: 0;
}
.tf-toast__title {
  font-weight: 600;
  font-size: 14px;
  line-height: 1.4;
  color: #333333;
  margin-bottom: 4px;
}
.tf-toast__message {
  font-size: 14px;
  line-height: 1.5;
  color: #333;
  word-wrap: break-word;
}
.tf-toast__close {
  flex-shrink: 0;
  margin-left: 8px;
}
.tf-toast__close.tf-button {
  padding: 4px !important;
  min-width: auto !important;
  opacity: 0.7;
}
.tf-toast__close.tf-button:hover {
  opacity: 1;
}
.tf-toast__close.tf-button svg {
  width: 16px;
  height: 16px;
}
@media (max-width: 768px) {
  .tf-toast {
    min-width: auto;
    max-width: none;
    margin-bottom: 8px;
    padding: 16px;
  }
  .tf-toast__title {
    font-size: 13px;
  }
  .tf-toast__message {
    font-size: 13px;
  }
  .tf-toast:not(.tf-toast--visible) {
    transform: translateY(-100%);
  }
  .tf-toast--removing {
    transform: translateY(-100%);
  }
}
@media (prefers-contrast: high) {
  .tf-toast {
    border-width: 2px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-toast {
    transition: opacity 0.2s ease-in-out;
  }
  .tf-toast:not(.tf-toast--visible) {
    transform: none;
  }
  .tf-toast--removing {
    transform: none;
  }
}
.tf-toast-container .tf-toast:nth-child(1) {
  animation-delay: 0ms;
}
.tf-toast-container .tf-toast:nth-child(2) {
  animation-delay: 100ms;
}
.tf-toast-container .tf-toast:nth-child(3) {
  animation-delay: 200ms;
}
.tf-toast-container .tf-toast:nth-child(4) {
  animation-delay: 300ms;
}
.tf-toast-container .tf-toast:nth-child(5) {
  animation-delay: 400ms;
}
@keyframes toastSlideIn {
  from {
    opacity: 0;
    transform: translateX(100%);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes toastSlideOut {
  from {
    opacity: 1;
    transform: translateX(0);
  }
  to {
    opacity: 0;
    transform: translateX(100%);
  }
}
@media (max-width: 768px) {
  @keyframes toastSlideInMobile {
    from {
      opacity: 0;
      transform: translateY(-100%);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  @keyframes toastSlideOutMobile {
    from {
      opacity: 1;
      transform: translateY(0);
    }
    to {
      opacity: 0;
      transform: translateY(-100%);
    }
  }
}
.tf-tooltip {
  background-color: #272727;
  color: #FFFFFF;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
  z-index: 9999;
  opacity: 0;
  transform: scale(0.8);
  animation: tooltipFadeIn 0.2s ease-out forwards;
}
.tf-tooltip__content {
  padding: 8px 12px;
  font-size: 13px;
  line-height: 1.4;
  font-weight: 400;
  text-align: center;
  word-wrap: break-word;
  hyphens: auto;
}
.tf-tooltip__arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
}
.tf-tooltip--top {
  animation: tooltipSlideUp 0.2s ease-out forwards;
}
.tf-tooltip--top .tf-tooltip__arrow {
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
  border-width: 6px 6px 0 6px;
  border-color: #272727 transparent transparent transparent;
}
.tf-tooltip--bottom {
  animation: tooltipSlideDown 0.2s ease-out forwards;
}
.tf-tooltip--bottom .tf-tooltip__arrow {
  top: -6px;
  left: 50%;
  transform: translateX(-50%);
  border-width: 0 6px 6px 6px;
  border-color: transparent transparent #272727 transparent;
}
.tf-tooltip--left {
  animation: tooltipSlideLeft 0.2s ease-out forwards;
}
.tf-tooltip--left .tf-tooltip__arrow {
  right: -6px;
  top: 50%;
  transform: translateY(-50%);
  border-width: 6px 0 6px 6px;
  border-color: transparent transparent transparent #272727;
}
.tf-tooltip--right {
  animation: tooltipSlideRight 0.2s ease-out forwards;
}
.tf-tooltip--right .tf-tooltip__arrow {
  left: -6px;
  top: 50%;
  transform: translateY(-50%);
  border-width: 6px 6px 6px 0;
  border-color: transparent #272727 transparent transparent;
}
@media (max-width: 768px) {
  .tf-tooltip {
    max-width: 200px !important;
  }
  .tf-tooltip__content {
    padding: 6px 10px;
    font-size: 12px;
  }
  .tf-tooltip__arrow[style*="border-width: 6px"] {
    border-width: 5px !important;
  }
}
@media (prefers-contrast: high) {
  .tf-tooltip {
    background-color: #000000;
    border: 2px solid #FFFFFF;
  }
  .tf-tooltip .tf-tooltip__arrow[style*="@greyFour"] {
    border-color: #000000 !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-tooltip {
    animation: tooltipFadeInSimple 0.1s ease-out forwards !important;
  }
}
@keyframes tooltipFadeIn {
  from {
    opacity: 0;
    transform: scale(0.8);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes tooltipSlideUp {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.9);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes tooltipSlideDown {
  from {
    opacity: 0;
    transform: translateY(-8px) scale(0.9);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes tooltipSlideLeft {
  from {
    opacity: 0;
    transform: translateX(8px) scale(0.9);
  }
  to {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}
@keyframes tooltipSlideRight {
  from {
    opacity: 0;
    transform: translateX(-8px) scale(0.9);
  }
  to {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}
@keyframes tooltipFadeInSimple {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
[aria-describedby] {
  cursor: help;
}
[aria-describedby]:not(button):not(input):not(select):not(textarea) {
  text-decoration: underline;
  text-decoration-style: dotted;
  text-decoration-color: #828282;
}
[aria-describedby]:not(button):not(input):not(select):not(textarea):hover,
[aria-describedby]:not(button):not(input):not(select):not(textarea):focus {
  text-decoration-color: #333333;
}
[aria-describedby]:is(button, input, select, textarea) {
  position: relative;
}
[aria-describedby]:is(button, input, select, textarea)::after {
  content: '';
  position: absolute;
  top: 2px;
  right: 2px;
  width: 4px;
  height: 4px;
  background-color: #FCB434;
  border-radius: 50%;
  opacity: 0.6;
  pointer-events: none;
}
[aria-describedby]:is(button, input, select, textarea):hover::after,
[aria-describedby]:is(button, input, select, textarea):focus::after {
  opacity: 1;
}
.tf-tooltip--error {
  background-color: #E53935;
}
.tf-tooltip--error .tf-tooltip__arrow[style*="border-color"] {
  border-color: #E53935 transparent transparent transparent;
}
.tf-tooltip--error.tf-tooltip--bottom .tf-tooltip__arrow {
  border-color: transparent transparent #E53935 transparent;
}
.tf-tooltip--error.tf-tooltip--left .tf-tooltip__arrow {
  border-color: transparent transparent transparent #E53935;
}
.tf-tooltip--error.tf-tooltip--right .tf-tooltip__arrow {
  border-color: transparent #E53935 transparent transparent;
}
.tf-tooltip--success {
  background-color: #5cb85c;
}
.tf-tooltip--success .tf-tooltip__arrow[style*="border-color"] {
  border-color: #5cb85c transparent transparent transparent;
}
.tf-tooltip--success.tf-tooltip--bottom .tf-tooltip__arrow {
  border-color: transparent transparent #5cb85c transparent;
}
.tf-tooltip--success.tf-tooltip--left .tf-tooltip__arrow {
  border-color: transparent transparent transparent #5cb85c;
}
.tf-tooltip--success.tf-tooltip--right .tf-tooltip__arrow {
  border-color: transparent #5cb85c transparent transparent;
}
.tf-tooltip--warning {
  background-color: #FCB434;
  color: #272727;
}
.tf-tooltip--warning .tf-tooltip__arrow[style*="border-color"] {
  border-color: #FCB434 transparent transparent transparent;
}
.tf-tooltip--warning.tf-tooltip--bottom .tf-tooltip__arrow {
  border-color: transparent transparent #FCB434 transparent;
}
.tf-tooltip--warning.tf-tooltip--left .tf-tooltip__arrow {
  border-color: transparent transparent transparent #FCB434;
}
.tf-tooltip--warning.tf-tooltip--right .tf-tooltip__arrow {
  border-color: transparent #FCB434 transparent transparent;
}
.tf-dropdown {
  position: relative;
  display: inline-block;
}
.tf-dropdown__toggle {
  display: inline-flex;
  justify-content: center;
  padding: 12px 24px;
  margin: 0;
  border: 2px solid transparent;
  border-radius: 8px;
  background: none;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  user-select: none;
  white-space: nowrap;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #FFFFFF;
  border: 1px solid #dee2e6;
  color: #333333;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  min-width: 120px;
  text-align: left;
  transition: all 0.2s ease-in-out;
}
@media (max-width: 768px) {
  .tf-dropdown__toggle {
    padding: 16px 24px;
    font-size: 16px;
    min-height: 48px;
  }
}
.tf-dropdown__toggle:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-dropdown__toggle:focus-visible {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-dropdown__toggle:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.tf-dropdown__toggle:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}
.tf-dropdown__toggle:hover {
  border-color: #FCB434;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-dropdown__toggle:focus {
  border-color: #FCB434;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  outline: none;
}
.tf-dropdown__toggle--link {
  background: transparent;
  border: none;
  color: #FCB434;
  padding: 4px 0;
  min-width: auto;
}
.tf-dropdown__toggle--link:hover {
  color: #D6931E;
  background: transparent;
  box-shadow: none;
}
.tf-dropdown__toggle--default {
  background-color: #F1F1F1;
  border-color: #dee2e6;
}
.tf-dropdown__toggle--default:hover {
  background-color: #E6E6E6;
}
.tf-dropdown__toggle svg {
  flex-shrink: 0;
  transition: transform 0.2s ease-in-out;
}
.tf-dropdown__menu {
  position: absolute;
  top: 100%;
  left: 0;
  background-color: #FFFFFF;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.08);
  padding: 4px 0;
  min-width: 140px;
  z-index: 1050;
  margin-top: 2px;
}
.tf-dropdown__menu--right {
  left: auto;
  right: 0;
}
.tf-dropdown__menu--up {
  top: auto;
  bottom: 100%;
  margin-top: 0;
  margin-bottom: 2px;
}
.tf-dropdown__item {
  display: block;
  padding: 4px 8px;
  color: #333333;
  text-decoration: none;
  white-space: nowrap;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
  border: none;
  background: none;
  width: 100%;
  text-align: left;
  font-size: 14px;
  line-height: 1.4;
}
.tf-dropdown__item:hover {
  background-color: #F5F5F5;
  color: #333333;
  text-decoration: none;
}
.tf-dropdown__item:focus {
  background-color: #F5F5F5;
  color: #333333;
  text-decoration: none;
  outline: none;
}
.tf-dropdown__item--danger:hover,
.tf-dropdown__item--danger:focus {
  background-color: rgba(229, 57, 53, 0.1);
  color: #E53935;
}
.tf-dropdown__item--disabled {
  color: #6c757d;
  cursor: not-allowed;
}
.tf-dropdown__item--disabled:hover,
.tf-dropdown__item--disabled:focus {
  background-color: transparent;
  color: #6c757d;
}
.tf-dropdown__item--focused {
  background-color: #F5F5F5;
  color: #333333;
}
.tf-dropdown--open .tf-dropdown__toggle {
  border-color: #FCB434;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-dropdown--open .tf-dropdown__toggle svg {
  transform: rotate(180deg);
}
.tf-dropdown--disabled .tf-dropdown__toggle {
  background-color: #F1F1F1;
  color: #6c757d;
  cursor: not-allowed;
}
.tf-dropdown--disabled .tf-dropdown__toggle:hover,
.tf-dropdown--disabled .tf-dropdown__toggle:focus {
  border-color: #dee2e6;
  box-shadow: none;
}
.tf-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 48px 32px;
  background-color: #FFFFFF;
  border-radius: 8px;
}
.tf-empty-state__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  margin-bottom: 24px;
  border-radius: 50%;
  background: linear-gradient(135deg, #ffffff 0%, #F1F1F1 100%);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05);
}
.tf-empty-state__icon span {
  font-size: 32px;
  line-height: 1;
}
.tf-empty-state__icon svg {
  width: 32px;
  height: 32px;
  stroke: #696969;
}
.tf-empty-state__illustration {
  margin-bottom: 24px;
  max-width: 200px;
}
.tf-empty-state__illustration img {
  width: 100%;
  height: auto;
  max-height: 160px;
  object-fit: contain;
}
.tf-empty-state__title {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
  color: #333333;
  line-height: 1.3;
}
.tf-empty-state__description {
  margin: 0;
  font-size: 16px;
  color: #6c757d;
  line-height: 1.5;
  max-width: 400px;
}
.tf-empty-state__content {
  width: 100%;
  max-width: 500px;
}
.tf-empty-state--no-data .tf-empty-state__icon {
  background: linear-gradient(135deg, #ffffff 0%, #E6E6E6 100%);
}
.tf-empty-state--no-data .tf-empty-state__icon span {
  color: #696969;
}
.tf-empty-state--no-data .tf-empty-state__icon svg {
  stroke: #696969;
}
.tf-empty-state--no-results .tf-empty-state__icon {
  background: linear-gradient(135deg, #fffefd 0%, #fdd999 100%);
}
.tf-empty-state--no-results .tf-empty-state__icon span {
  color: #c78003;
}
.tf-empty-state--no-results .tf-empty-state__icon svg {
  stroke: #c78003;
}
.tf-empty-state--no-content .tf-empty-state__icon {
  background: linear-gradient(135deg, #ffffff 0%, #ffffff 100%);
}
.tf-empty-state--no-content .tf-empty-state__icon span {
  color: #828282;
}
.tf-empty-state--no-content .tf-empty-state__icon svg {
  stroke: #828282;
}
.tf-empty-state--error .tf-empty-state__icon {
  background: linear-gradient(135deg, #fceaea 0%, #f1928f 100%);
}
.tf-empty-state--error .tf-empty-state__icon span {
  color: #cd1e1a;
}
.tf-empty-state--error .tf-empty-state__icon svg {
  stroke: #cd1e1a;
}
.tf-empty-state--error .tf-empty-state__title {
  color: #e2231e;
}
.tf-empty-state--offline .tf-empty-state__icon {
  background: linear-gradient(135deg, #e8e8e8 0%, #b5b5b5 100%);
}
.tf-empty-state--offline .tf-empty-state__icon span {
  color: #696969;
}
.tf-empty-state--offline .tf-empty-state__icon svg {
  stroke: #696969;
}
.tf-empty-state--unauthorized .tf-empty-state__icon {
  background: linear-gradient(135deg, #ffffff 0%, #f4a8a6 100%);
}
.tf-empty-state--unauthorized .tf-empty-state__icon span {
  color: #e2231e;
}
.tf-empty-state--unauthorized .tf-empty-state__icon svg {
  stroke: #e2231e;
}
.tf-empty-state--unauthorized .tf-empty-state__title {
  color: #cd1e1a;
}
.tf-empty-state--maintenance .tf-empty-state__icon {
  background: linear-gradient(135deg, #fff5e4 0%, #fdd07f 100%);
}
.tf-empty-state--maintenance .tf-empty-state__icon span {
  color: #e09103;
}
.tf-empty-state--maintenance .tf-empty-state__icon svg {
  stroke: #e09103;
}
.tf-empty-state--maintenance .tf-empty-state__title {
  color: #f9a104;
}
.tf-empty-state--coming-soon .tf-empty-state__icon {
  background: linear-gradient(135deg, #eaf6ea 0%, #a3d7a3 100%);
}
.tf-empty-state--coming-soon .tf-empty-state__icon span {
  color: #449d44;
}
.tf-empty-state--coming-soon .tf-empty-state__icon svg {
  stroke: #449d44;
}
.tf-empty-state--coming-soon .tf-empty-state__title {
  color: #4cae4c;
}
.tf-empty-state--small {
  padding: 32px 24px;
}
.tf-empty-state--small .tf-empty-state__icon {
  width: 60px;
  height: 60px;
  margin-bottom: 16px;
}
.tf-empty-state--small .tf-empty-state__icon span {
  font-size: 24px;
}
.tf-empty-state--small .tf-empty-state__icon svg {
  width: 24px;
  height: 24px;
}
.tf-empty-state--small .tf-empty-state__illustration {
  margin-bottom: 16px;
  max-width: 120px;
}
.tf-empty-state--small .tf-empty-state__illustration img {
  max-height: 100px;
}
.tf-empty-state--small .tf-empty-state__title {
  font-size: 16px;
}
.tf-empty-state--small .tf-empty-state__description {
  font-size: 14px;
  max-width: 300px;
}
.tf-empty-state--large {
  padding: 64px 48px;
}
.tf-empty-state--large .tf-empty-state__icon {
  width: 120px;
  height: 120px;
  margin-bottom: 32px;
}
.tf-empty-state--large .tf-empty-state__icon span {
  font-size: 48px;
}
.tf-empty-state--large .tf-empty-state__icon svg {
  width: 48px;
  height: 48px;
}
.tf-empty-state--large .tf-empty-state__illustration {
  margin-bottom: 32px;
  max-width: 300px;
}
.tf-empty-state--large .tf-empty-state__illustration img {
  max-height: 240px;
}
.tf-empty-state--large .tf-empty-state__title {
  font-size: 28px;
  margin-bottom: 16px;
}
.tf-empty-state--large .tf-empty-state__description {
  font-size: 18px;
  max-width: 500px;
}
@media (max-width: 992px) {
  .tf-empty-state {
    padding: 32px 24px;
  }
  .tf-empty-state__icon {
    width: 70px;
    height: 70px;
  }
  .tf-empty-state__icon span {
    font-size: 28px;
  }
  .tf-empty-state__icon svg {
    width: 28px;
    height: 28px;
  }
  .tf-empty-state__illustration {
    max-width: 160px;
  }
  .tf-empty-state__illustration img {
    max-height: 120px;
  }
  .tf-empty-state__title {
    font-size: 18px;
  }
  .tf-empty-state__description {
    font-size: 15px;
    max-width: 350px;
  }
  .tf-empty-state--large {
    padding: 48px 32px;
  }
  .tf-empty-state--large .tf-empty-state__icon {
    width: 100px;
    height: 100px;
  }
  .tf-empty-state--large .tf-empty-state__icon span {
    font-size: 40px;
  }
  .tf-empty-state--large .tf-empty-state__icon svg {
    width: 40px;
    height: 40px;
  }
  .tf-empty-state--large .tf-empty-state__title {
    font-size: 24px;
  }
  .tf-empty-state--large .tf-empty-state__description {
    font-size: 16px;
  }
}
@media (max-width: 768px) {
  .tf-empty-state {
    padding: 24px 16px;
  }
  .tf-empty-state__icon {
    width: 60px;
    height: 60px;
    margin-bottom: 16px;
  }
  .tf-empty-state__icon span {
    font-size: 24px;
  }
  .tf-empty-state__icon svg {
    width: 24px;
    height: 24px;
  }
  .tf-empty-state__illustration {
    margin-bottom: 16px;
    max-width: 140px;
  }
  .tf-empty-state__illustration img {
    max-height: 100px;
  }
  .tf-empty-state__title {
    font-size: 16px;
  }
  .tf-empty-state__description {
    font-size: 14px;
    max-width: 280px;
  }
  .tf-empty-state--small {
    padding: 16px 12px;
  }
  .tf-empty-state--small .tf-empty-state__icon {
    width: 50px;
    height: 50px;
  }
  .tf-empty-state--small .tf-empty-state__icon span {
    font-size: 20px;
  }
  .tf-empty-state--small .tf-empty-state__icon svg {
    width: 20px;
    height: 20px;
  }
  .tf-empty-state--small .tf-empty-state__title {
    font-size: 14px;
  }
  .tf-empty-state--small .tf-empty-state__description {
    font-size: 13px;
    max-width: 250px;
  }
  .tf-empty-state--large {
    padding: 32px 24px;
  }
  .tf-empty-state--large .tf-empty-state__icon {
    width: 80px;
    height: 80px;
  }
  .tf-empty-state--large .tf-empty-state__icon span {
    font-size: 32px;
  }
  .tf-empty-state--large .tf-empty-state__icon svg {
    width: 32px;
    height: 32px;
  }
  .tf-empty-state--large .tf-empty-state__title {
    font-size: 20px;
  }
  .tf-empty-state--large .tf-empty-state__description {
    font-size: 15px;
    max-width: 300px;
  }
}
.tf-empty-state:focus-within {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-empty-state__title {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.tf-empty-state__description {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
@media (prefers-contrast: high) {
  .tf-empty-state {
    border: 2px solid #333333;
  }
  .tf-empty-state__icon {
    background: #FFFFFF;
    border: 2px solid #333333;
  }
  .tf-empty-state__icon span {
    color: #333333;
  }
  .tf-empty-state__icon svg {
    stroke: #333333;
  }
  .tf-empty-state__title {
    color: #333333;
  }
  .tf-empty-state__description {
    color: #333333;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-empty-state__icon,
  .tf-empty-state__illustration {
    transition: none;
  }
}
@media print {
  .tf-empty-state {
    background: transparent;
    box-shadow: none;
    border: 1px solid #333333;
  }
  .tf-empty-state__icon {
    background: transparent;
    border: 1px solid #333333;
  }
}
.tf-skeleton {
  display: block;
  background: linear-gradient(90deg, #fafafa 0%, #f7f7f7 50%, #fafafa 100%);
  border-radius: 4px;
  position: relative;
  overflow: hidden;
  min-height: 1em;
  transition: all 0.2s ease;
  animation: tf-skeleton-pulse 1.5s ease-in-out infinite;
}
.tf-skeleton::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: inherit;
  border-radius: inherit;
}
.tf-skeleton--text {
  height: 1em;
  border-radius: 4px;
}
.tf-skeleton--text:empty::before {
  content: '\00a0';
}
.tf-skeleton--rectangular {
  border-radius: 8px;
}
.tf-skeleton--rounded {
  border-radius: 16px;
}
.tf-skeleton--circular {
  border-radius: 50%;
  aspect-ratio: 1;
}
.tf-skeleton--pulse {
  animation: tf-skeleton-pulse 1.5s ease-in-out infinite;
}
@keyframes tf-skeleton-pulse {
  0% {
    opacity: 0.6;
  }
  50% {
    opacity: 0.3;
  }
  100% {
    opacity: 0.6;
  }
}
.tf-skeleton--wave {
  background: linear-gradient(90deg, #fafafa 0%, #fafafa 40%, #eeeeee 50%, #fafafa 60%, #fafafa 100%);
  background-size: 200% 100%;
  animation: tf-skeleton-wave 1.5s ease-in-out infinite;
}
@keyframes tf-skeleton-wave {
  0% {
    background-position: 100% 0;
  }
  100% {
    background-position: -100% 0;
  }
}
.tf-skeleton--none {
  animation: none;
}
.tf-skeleton-group {
  width: 100%;
}
.tf-skeleton-card {
  padding: 16px;
  background-color: #FFFFFF;
  border: 1px solid #ffffff;
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}
.tf-skeleton-table {
  width: 100%;
  background-color: #FFFFFF;
  border: 1px solid #ffffff;
  border-radius: 8px;
  padding: 16px;
}
.tf-skeleton-table .tf-stack > *:not(:last-child) {
  padding-bottom: 8px;
  border-bottom: 1px solid #ffffff;
  margin-bottom: 8px;
}
.tf-skeleton-list {
  background-color: #FFFFFF;
  border: 1px solid #ffffff;
  border-radius: 8px;
  padding: 16px;
}
.tf-skeleton-list .tf-stack > *:not(:last-child) {
  padding-bottom: 12px;
  border-bottom: 1px solid #ffffff;
  margin-bottom: 12px;
}
.tf-skeleton-profile {
  padding: 32px;
  background-color: #FFFFFF;
  border: 1px solid #ffffff;
  border-radius: 8px;
  text-align: center;
}
.tf-skeleton-gallery .tf-grid-item .tf-skeleton--rectangular {
  aspect-ratio: 4/3;
}
@media (max-width: 992px) {
  .tf-skeleton-card {
    padding: 12px;
  }
  .tf-skeleton-table,
  .tf-skeleton-list {
    padding: 12px;
  }
  .tf-skeleton-profile {
    padding: 24px;
  }
  .tf-skeleton-gallery .tf-grid {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }
}
@media (max-width: 768px) {
  .tf-skeleton-card,
  .tf-skeleton-table,
  .tf-skeleton-list {
    padding: 8px;
  }
  .tf-skeleton-profile {
    padding: 16px;
  }
  .tf-skeleton-gallery .tf-grid {
    grid-template-columns: 1fr;
  }
  .tf-skeleton--text {
    height: 0.9em;
  }
}
.tf-skeleton-loading {
  position: relative;
}
.tf-skeleton-loading::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  margin: -10px 0 0 -10px;
  border: 2px solid #cfcfcf;
  border-top: 2px solid #828282;
  border-radius: 50%;
  animation: tf-skeleton-spin 1s linear infinite;
}
@keyframes tf-skeleton-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.tf-skeleton-error {
  background: linear-gradient(90deg, #ffffff 0%, #f9d4d3 50%, #ffffff 100%);
}
.tf-skeleton-error::before {
  content: '⚠️';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 16px;
  opacity: 0.7;
}
.tf-skeleton[aria-label]::before {
  content: attr(aria-label);
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.tf-skeleton:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
@media (prefers-contrast: high) {
  .tf-skeleton {
    background: repeating-linear-gradient(45deg, #E6E6E6, #E6E6E6 10px, #ffffff 10px, #ffffff 20px);
    border: 1px solid #333333;
  }
  .tf-skeleton--wave {
    background: linear-gradient(90deg, #E6E6E6 25%, #ffffff 50%, #E6E6E6 75%);
    background-size: 400% 100%;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-skeleton {
    animation: none;
  }
  .tf-skeleton--pulse,
  .tf-skeleton--wave {
    animation: none;
  }
  .tf-skeleton-loading::after {
    animation: none;
    border: 2px solid #828282;
    border-top: 2px solid #b5b5b5;
  }
}
@media print {
  .tf-skeleton {
    background: transparent;
    border: 1px dashed #333333;
    animation: none;
  }
  .tf-skeleton::before {
    content: '[Loading...]';
    position: static;
    display: block;
    text-align: center;
    color: #333333;
    font-size: 12px;
    padding: 8px;
  }
  .tf-skeleton-card,
  .tf-skeleton-table,
  .tf-skeleton-list,
  .tf-skeleton-profile {
    background: transparent;
    border: 1px solid #333333;
    box-shadow: none;
  }
}
@media (prefers-color-scheme: dark) {
  .tf-skeleton {
    background: linear-gradient(90deg, #404040 0%, #383838 50%, #404040 100%) !important;
  }
  @keyframes tf-skeleton-pulse {
    0% {
      opacity: 0.5;
    }
    50% {
      opacity: 0.2;
    }
    100% {
      opacity: 0.5;
    }
  }
  .tf-skeleton--wave {
    background: linear-gradient(90deg, #404040 0%, #404040 40%, #353535 50%, #404040 60%, #404040 100%) !important;
    background-size: 400% 100%;
  }
  .tf-skeleton-card,
  .tf-skeleton-table,
  .tf-skeleton-list,
  .tf-skeleton-profile {
    background-color: #272727;
    border-color: #5a5a5a;
  }
}
.tf-skeleton--pulse,
.tf-skeleton--wave {
  transform: translateZ(0);
  will-change: opacity, background-position;
}
.tf-skeleton {
  contain: layout style;
}
.tf-skeleton-list,
.tf-skeleton-table,
.tf-skeleton-gallery {
  contain: layout;
}
.tf-skeleton-list .tf-skeleton:nth-child(n+20),
.tf-skeleton-table .tf-skeleton:nth-child(n+20),
.tf-skeleton-gallery .tf-skeleton:nth-child(n+20) {
  animation-delay: calc(var(--index, 0) * 0.1s);
}
.tf-table {
  width: 100%;
  background-color: #FFFFFF;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  border: 1px solid #ffffff;
}
.tf-table__container {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 8px;
}
.tf-table__table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 14px;
  line-height: 1.6;
  font-family: 'Avenir', Arial, sans-serif;
}
.tf-table__head {
  background: linear-gradient(135deg, #ffffff 0%, #F1F1F1 100%);
  border-bottom: 2px solid #c1c8d0;
}
.tf-table__body {
  background-color: #FFFFFF;
}
.tf-table__row {
  border-bottom: 1px solid #ffffff;
  transition: all 0.2s ease;
}
.tf-table__row:last-child {
  border-bottom: none;
}
.tf-table__header {
  padding: 20px 16px;
  text-align: left;
  font-weight: 700;
  color: #1a1a1a;
  background: transparent;
  border-right: 1px solid #ffffff;
  white-space: nowrap;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.tf-table__header:last-child {
  border-right: none;
}
.tf-table__header--sortable {
  cursor: pointer;
  user-select: none;
  transition: all 0.2s ease;
  position: relative;
}
.tf-table__header--sortable:hover {
  background-color: rgba(255, 255, 255, 0.3);
  color: #FCB434;
  transform: translateY(-1px);
}
.tf-table__header--sortable:active {
  transform: translateY(0);
  background-color: rgba(255, 255, 255, 0.5);
}
.tf-table__cell {
  padding: 16px 16px;
  vertical-align: middle;
  color: #333333;
  border-right: 1px solid #ffffff;
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.tf-table__cell:last-child {
  border-right: none;
}
.tf-table__sort-indicator {
  color: #6c757d;
  font-size: 14px;
  opacity: 0.5;
  transition: all 0.2s ease;
  margin-left: 4px;
  font-weight: normal;
}
.tf-table__sort-indicator--active {
  opacity: 1;
  color: #FCB434;
  font-weight: bold;
  transform: scale(1.1);
}
.tf-table--bordered {
  border: 2px solid #cfd5db;
}
.tf-table--bordered .tf-table__header,
.tf-table--bordered .tf-table__cell {
  border-right: 1px solid #dee2e6;
}
.tf-table--bordered .tf-table__header:last-child,
.tf-table--bordered .tf-table__cell:last-child {
  border-right: none;
}
.tf-table--bordered .tf-table__row {
  border-bottom: 1px solid #dee2e6;
}
.tf-table--bordered .tf-table__head {
  border-bottom: 2px solid #cfd5db;
}
.tf-table--minimal {
  box-shadow: none;
  border: none;
}
.tf-table--minimal .tf-table__head {
  background-color: transparent;
  border-bottom: 1px solid #dee2e6;
}
.tf-table--minimal .tf-table__header {
  background-color: transparent;
  border-bottom: 1px solid #dee2e6;
  padding-top: 8px;
  padding-bottom: 8px;
}
.tf-table--minimal .tf-table__row {
  border-bottom: 1px solid #ffffff;
}
.tf-table--small .tf-table__table {
  font-size: 12px;
}
.tf-table--small .tf-table__header {
  padding: 8px 8px;
}
.tf-table--small .tf-table__cell {
  padding: 8px 8px;
}
.tf-table--large .tf-table__table {
  font-size: 16px;
}
.tf-table--large .tf-table__header {
  padding: 20px 16px;
}
.tf-table--large .tf-table__cell {
  padding: 16px 16px;
}
.tf-table--striped .tf-table__body .tf-table__row:nth-child(even) {
  background-color: #ffffff;
}
.tf-table--hover .tf-table__body .tf-table__row:hover {
  background-color: #ffffff;
  box-shadow: inset 0 0 0 1px #feeccb;
}
.tf-table--hover .tf-table__body .tf-table__row:hover .tf-table__cell {
  color: #262626;
}
.tf-table--clickable .tf-table__body .tf-table__row {
  cursor: pointer;
  transition: all 0.2s ease;
}
.tf-table--clickable .tf-table__body .tf-table__row:hover {
  background-color: #ffffff;
  box-shadow: inset 0 0 0 1px #feeccb;
  transform: translateY(-1px);
}
.tf-table--clickable .tf-table__body .tf-table__row:hover .tf-table__cell {
  color: #262626;
}
.tf-table--clickable .tf-table__body .tf-table__row:active {
  transform: translateY(0);
  background-color: #ffffff;
  box-shadow: inset 0 0 0 1px #fee2b2;
}
.tf-table--loading .tf-table__loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 32px;
  color: #6c757d;
  background: linear-gradient(135deg, #ffffff 0%, #FFFFFF 100%);
  border-radius: 8px;
}
.tf-table--loading .tf-table__loading p {
  margin: 24px 0 0 0;
  font-size: 16px;
  font-weight: 500;
  color: #494f54;
}
.tf-table--loading .tf-table__loading-spinner {
  width: 40px;
  height: 40px;
  border: 4px solid #fff5e4;
  border-top: 4px solid #FCB434;
  border-radius: 50%;
  animation: tf-table-spin 1s linear infinite;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
@keyframes tf-table-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.tf-table__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 32px;
  color: #6c757d;
  background: linear-gradient(135deg, #ffffff 0%, #FFFFFF 100%);
  border-radius: 8px;
}
.tf-table__empty::before {
  content: "📊";
  font-size: 48px;
  opacity: 0.3;
  margin-bottom: 16px;
}
.tf-table__empty p {
  margin: 0;
  font-size: 16px;
  text-align: center;
  font-weight: 500;
  color: #494f54;
}
.tf-table__filter {
  padding: 20px 16px;
  background: linear-gradient(135deg, #ffffff 0%, #ffffff 100%);
  border-bottom: 1px solid #cfd5db;
  display: flex;
  align-items: center;
  gap: 8px;
}
.tf-table__filter::before {
  content: "🔍";
  font-size: 16px;
  opacity: 0.6;
}
.tf-table__filter-input {
  flex: 1;
  max-width: 400px;
  padding: 10px 12px;
  border: 1px solid #fbfbfc;
  border-radius: 12px;
  font-size: 14px;
  background-color: #FFFFFF;
  transition: all 0.2s ease;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
}
.tf-table__filter-input:focus {
  outline: none;
  border-color: #FCB434;
  box-shadow: 0 0 0 3px #fffefd, inset 0 1px 3px rgba(0, 0, 0, 0.05);
  transform: translateY(-1px);
}
.tf-table__filter-input::placeholder {
  color: #6c757d;
  font-style: italic;
}
.tf-table__pagination {
  padding: 20px 16px;
  background: linear-gradient(135deg, #ffffff 0%, #ffffff 100%);
  border-top: 1px solid #cfd5db;
}
.tf-table__pagination-info {
  font-size: 13px;
  color: #545b62;
  margin: 0;
  font-weight: 500;
}
.tf-table__pagination-pages {
  font-size: 14px;
  color: #333333;
  font-weight: 600;
  padding: 6px 12px;
  background-color: #FFFFFF;
  border: 1px solid #fbfbfc;
  border-radius: 8px;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
}
@media (max-width: 992px) {
  .tf-table__table {
    font-size: 13px;
  }
  .tf-table__header,
  .tf-table__cell {
    padding: 8px 6px;
  }
  .tf-table__pagination .tf-stack--horizontal {
    flex-direction: column;
    gap: 16px;
    align-items: stretch;
  }
}
@media (max-width: 768px) {
  .tf-table__table {
    font-size: 12px;
  }
  .tf-table__header,
  .tf-table__cell {
    padding: 6px 4px;
  }
  .tf-table__sort-indicator {
    display: none;
  }
  .tf-table__filter {
    padding: 12px;
  }
  .tf-table__filter-input {
    max-width: 100%;
    font-size: 16px;
  }
  .tf-table__pagination {
    padding: 12px;
  }
  .tf-table__pagination-info {
    font-size: 12px;
    text-align: center;
  }
  .tf-table__pagination-pages {
    font-size: 12px;
  }
  .tf-table__loading,
  .tf-table__empty {
    padding: 32px 16px;
  }
  .tf-table__loading p,
  .tf-table__empty p {
    font-size: 14px;
  }
}
.tf-table__header:focus,
.tf-table__row:focus {
  outline: 2px solid #FCB434;
  outline-offset: -2px;
}
.tf-table__sort-indicator[aria-label] {
  speak: literal-punctuation;
}
@media (prefers-contrast: high) {
  .tf-table {
    border: 2px solid #333333;
  }
  .tf-table__header,
  .tf-table__cell {
    border-color: #333333;
  }
  .tf-table--hover .tf-table__row:hover {
    background-color: #333333;
    color: #FFFFFF;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tf-table__row,
  .tf-table__header--sortable,
  .tf-table__sort-indicator {
    transition: none;
  }
  .tf-table__loading-spinner {
    animation: none;
  }
  .tf-table--clickable .tf-table__row {
    transform: none;
  }
  .tf-table--clickable .tf-table__row:hover,
  .tf-table--clickable .tf-table__row:active {
    transform: none;
  }
}
.tf-multiselect-editor {
  display: flex;
  flex-direction: column;
}
.tf-multiselect-editor__selected {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 8px;
}
.tf-selected-options-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.tf-selected-options-list__item {
  display: flex;
  align-items: center;
  background-color: #F1F1F1;
  border: 1px solid #E6E6E6;
  border-radius: 8px;
  padding: 8px 12px;
  gap: 8px;
  transition: all 0.2s ease-in-out;
  cursor: move;
}
.tf-selected-options-list__item:hover {
  background-color: #f6f6f6;
  border-color: #828282;
}
.tf-selected-options-list__item:active {
  background-color: #E6E6E6;
}
.tf-selected-options-list__item--dragging {
  opacity: 0.6 !important;
  background-color: #fff5e4 !important;
  border-color: #FCB434 !important;
  transform: scale(1.01) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
  z-index: 1000 !important;
  transition: all 0.1s ease-out !important;
}
.tf-selected-options-list__item--hidden {
  display: none !important;
}
.tf-selected-options-list__drag-handle {
  color: #828282;
  cursor: grab;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2px;
}
.tf-selected-options-list__drag-handle:hover {
  color: #333333;
}
.tf-selected-options-list__drag-handle:active {
  cursor: grabbing;
}
.tf-selected-options-list__drag-handle svg {
  width: 12px;
  height: 12px;
}
.tf-selected-options-list__text {
  flex: 1;
  font-size: 14px;
  color: #333333;
  line-height: 1.4;
}
.tf-selected-options-list__remove {
  background: none;
  border: none;
  color: #828282;
  cursor: pointer;
  padding: 2px;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 14px;
  line-height: 1;
  transition: all 0.2s ease-in-out;
}
.tf-selected-options-list__remove:hover {
  background-color: #E53935;
  color: #FFFFFF;
}
.tf-selected-options-list__remove:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-selected-options-list .placeholder {
  background-color: #feeccb;
  border: 2px dashed #FCB434;
  height: 40px;
  border-radius: 8px;
  opacity: 0.7;
}
.tf-confirmation-button__confirmation {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  background-color: #F5F5F5;
  font-size: 14px;
  animation: tf-confirmation-appear 0.2s ease-out;
}
.tf-confirmation-button__message {
  color: #333333;
  font-weight: 500;
  white-space: nowrap;
}
.tf-confirmation-button__actions {
  display: flex;
  gap: 4px;
}
@keyframes tf-confirmation-appear {
  0% {
    opacity: 0;
    transform: scale(0.95);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
.tf-tag-editor {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}
.tf-tag-editor__label {
  font-weight: bold;
  color: #333333;
  margin-bottom: 8px;
  font-size: 14px;
}
.tf-tag-editor__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-tag-editor__label--required::after {
  content: ' *';
  color: #E53935;
}
.tf-tag-editor__container {
  border: 2px solid #dee2e6;
  border-radius: 8px;
  background-color: #FFFFFF;
  transition: all 0.2s ease-in-out;
}
.tf-tag-editor__container:focus-within {
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.1);
}
.tf-tag-editor__tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  padding: 8px 12px;
  min-height: 44px;
}
.tf-tag-editor__input {
  border: none;
  outline: none;
  background: transparent;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  color: #333333;
  flex: 1;
  min-width: 120px;
  margin-left: 8px;
}
.tf-tag-editor__input::placeholder {
  color: #6c757d;
}
.tf-tag-editor__help {
  margin-top: 8px;
  font-size: 14px;
  color: #6c757d;
  line-height: 1.4;
}
.tf-tag-editor--focused .tf-tag-editor__container {
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.1);
}
.tf-tag-editor--error .tf-tag-editor__container {
  border-color: #E53935;
}
.tf-tag-editor--error .tf-tag-editor__container:focus {
  border-color: #E53935;
  box-shadow: 0 0 0 3px rgba(229, 57, 53, 0.1);
}
.tf-tag-editor--error .tf-tag-editor__label {
  color: #E53935;
}
.tf-tag-editor--error .tf-tag-editor__help {
  color: #E53935;
}
.tf-tag-editor--readonly .tf-tag-editor__container {
  background-color: #F1F1F1;
  cursor: not-allowed;
}
.tf-tag-editor--readonly .tf-tag-editor__input {
  cursor: not-allowed;
}
.tf-tag-editor .tf-tag.highlight {
  background-color: #FCB434;
  border-color: #D6931E;
  color: #000000;
  animation: highlight-pulse 1s ease-in-out;
}
@keyframes highlight-pulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
}
.tf-toggle-button-group {
  display: inline-flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 2px;
}
.tf-toggle-button-group__label {
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #333333;
}
.tf-toggle-button-group__buttons {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
}
.tf-toggle-button-group--disabled {
  pointer-events: none;
  opacity: 0.6;
}
.tf-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 16px 0;
}
.tf-pagination:first-of-type {
  margin-bottom: 24px;
}
.tf-pagination:last-of-type {
  margin-top: 24px;
}
.tf-pagination__list {
  display: flex;
  align-items: center;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.tf-pagination__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 36px;
  height: 36px;
  padding: 0 8px;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  background-color: #ffffff;
  color: #333333;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out, transform 0.2s ease-in-out;
  user-select: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.tf-pagination__item:hover:not(:disabled) {
  background-color: #E6E6E6;
  border-color: #828282;
  transform: translateY(-1px);
}
.tf-pagination__item:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  z-index: 1;
}
.tf-pagination__item:disabled:not(.tf-pagination__item--active) {
  color: #6c757d;
  background-color: #F1F1F1;
  border-color: #dee2e6;
  cursor: not-allowed;
  opacity: 0.6;
  transform: none;
}
.tf-pagination__item--active {
  background-color: #FCB434;
  color: #333333;
  border-color: #FCB434;
  font-weight: 700;
  cursor: default;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-pagination__item--active:hover {
  transform: none;
  background-color: #FCB434;
}
.tf-pagination__item--number {
  min-width: 36px;
}
.tf-pagination__item--prev,
.tf-pagination__item--next {
  padding: 0 12px;
}
.tf-pagination__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.tf-pagination__icon svg {
  width: 100%;
  height: 100%;
}
.tf-pagination__label {
  line-height: 1;
  white-space: nowrap;
}
.tf-pagination__ellipsis {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  color: #333333;
  font-weight: 600;
  user-select: none;
}
.tf-pagination__ellipsis span {
  line-height: 1;
}
@media (max-width: 768px) {
  .tf-pagination {
    padding: 8px 0;
  }
  .tf-pagination__list {
    gap: 4px;
  }
  .tf-pagination__item {
    min-width: 32px;
    height: 32px;
    font-size: 14px;
  }
  .tf-pagination__item--number {
    display: none;
  }
  .tf-pagination__item--prev,
  .tf-pagination__item--next {
    padding: 0 8px;
    min-width: auto;
  }
  .tf-pagination__ellipsis {
    display: none;
  }
}
@media (max-width: 768px) and (min-width: 480px) {
  .tf-pagination__item--number {
    display: inline-flex;
  }
}
.tf-pagination--compact {
  padding: 8px 0;
}
.tf-pagination--compact .tf-pagination__item {
  min-width: 32px;
  height: 32px;
  padding: 0 4px;
  font-size: 14px;
}
.tf-pagination--compact .tf-pagination__list {
  gap: 4px;
}
.tf-like-control__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: 'AvenirMedium', 'Avenir', Arial, sans-serif;
  background-color: #E6E6E6;
  border-radius: 24px;
  padding: 8px 16px;
  cursor: pointer;
  transition: color 0.2s, background-color 0.2s, border-color 0.2s;
}
.tf-like-control__button .tf-icon {
  width: 25px;
  height: 24px;
}
.tf-like-control__button .tf-icon svg {
  width: 100%;
  height: 100%;
  stroke: #272727;
  stroke-width: 1.5px;
  fill: none;
  transition: stroke 0.2s, fill 0.2s;
}
.tf-like-control__button .tf-like-control__metric {
  font-size: 14px;
  font-weight: 600;
  color: #272727;
  min-width: auto;
}
.tf-like-control__button:hover {
  border-color: #E6E6E6;
}
.tf-like-control__button:hover .tf-icon svg {
  stroke: #E6E6E6;
}
.tf-like-control__button.is-liked {
  background-color: #FCB434;
  border-color: #FCB434;
}
.tf-like-control__button.is-liked .tf-icon svg {
  stroke: #000000;
  fill: none;
}
.tf-like-control__button.is-liked .tf-like-control__metric {
  color: #000000;
}
.tf-like-control__button.is-liked:hover {
  background-color: #D6931E;
  border-color: #D6931E;
}
.tf-like-control__button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.tf-content-cover-editor {
  width: 350px;
  min-width: 350px;
}
.tf-content-cover-editor__preview {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  background-color: #F1F1F1;
  border: 2px solid #dee2e6;
  aspect-ratio: 1;
}
.tf-content-cover-editor__preview:hover .tf-content-cover-editor__overlay {
  opacity: 1;
}
.tf-content-cover-editor__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.tf-content-cover-editor__overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.2s ease-in-out;
}
.tf-content-cover-editor__actions {
  padding: 8px;
  text-align: center;
}
.tf-project-thumbnail-editor {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}
.tf-project-thumbnail-editor__label {
  font-weight: bold;
  color: #333333;
  margin-bottom: 8px;
  font-size: 14px;
  margin-bottom: 16px;
}
.tf-project-thumbnail-editor__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-project-thumbnail-editor__label--required::after {
  content: ' *';
  color: #E53935;
}
.tf-project-thumbnail-editor__content {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
@media (max-width: 768px) {
  .tf-project-thumbnail-editor__content {
    flex-direction: column;
    gap: 8px;
  }
}
.tf-project-thumbnail-editor__preview {
  flex-shrink: 0;
  border: 2px solid #dee2e6;
  border-radius: 8px;
  overflow: hidden;
  background-color: #F5F5F5;
  position: relative;
}
.tf-project-thumbnail-editor__preview--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #6c757d;
  font-size: 14px;
  text-align: center;
}
.tf-project-thumbnail-editor__preview--empty::before {
  content: "No thumbnail selected";
}
.tf-project-thumbnail-editor__preview--loading {
  background: linear-gradient(90deg, #F5F5F5 25%, #F1F1F1 50%, #F5F5F5 75%);
  background-size: 200% 100%;
  animation: tf-thumbnail-shimmer 2s infinite;
}
.tf-project-thumbnail-editor__preview--error {
  background-color: rgba(229, 57, 53, 0.1);
  border-color: #E53935;
}
.tf-project-thumbnail-editor__preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity 0.3s ease-in-out;
}
.tf-project-thumbnail-editor__loading-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(245, 245, 245, 0.8);
  backdrop-filter: blur(2px);
}
.tf-project-thumbnail-editor__error-message {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #E53935;
  font-size: 12px;
  text-align: center;
  padding: 4px;
  background-color: rgba(255, 255, 255, 0.9);
  border-radius: 4px;
  border: 1px solid #E53935;
}
.tf-project-thumbnail-editor__controls {
  flex: 1;
  min-width: 0;
}
.tf-project-thumbnail-editor__controls-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tf-project-thumbnail-editor__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  margin: 0;
  border: 2px solid transparent;
  border-radius: 8px;
  background: none;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  user-select: none;
  white-space: nowrap;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #E6E6E6;
  border-color: #E6E6E6;
  color: #333333;
}
@media (max-width: 768px) {
  .tf-project-thumbnail-editor__button {
    padding: 16px 24px;
    font-size: 16px;
    min-height: 48px;
  }
}
.tf-project-thumbnail-editor__button:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-project-thumbnail-editor__button:focus-visible {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-project-thumbnail-editor__button:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.tf-project-thumbnail-editor__button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}
.tf-project-thumbnail-editor__button:hover:not(:disabled) {
  background-color: #cdcdcd;
  border-color: #cdcdcd;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.tf-project-thumbnail-editor__button:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-project-thumbnail-editor__button--primary {
  background-color: #FCB434;
  border-color: #FCB434;
  color: #000000;
}
.tf-project-thumbnail-editor__button--primary:hover:not(:disabled) {
  background-color: #f9a104;
  border-color: #f9a104;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.tf-project-thumbnail-editor__button--primary:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-project-thumbnail-editor__help {
  margin-top: 8px;
  font-size: 14px;
  color: #6c757d;
  line-height: 1.4;
}
.tf-project-thumbnail-editor__error {
  margin-top: 8px;
}
.tf-project-thumbnail-editor__error .tf-help-block {
  color: #E53935;
}
.tf-project-thumbnail-editor__thumbnail-dropdown .tf-dropdown__toggle svg {
  width: 16px;
  height: 16px;
}
.tf-project-thumbnail-editor__thumbnail-dropdown .tf-dropdown__menu {
  max-width: 400px;
  padding: 8px;
  display: flex;
  flex-direction: row;
  gap: 8px;
  overflow-x: auto;
  overflow-y: hidden;
}
.tf-project-thumbnail-editor__thumbnail-dropdown .tf-dropdown__menu::-webkit-scrollbar {
  height: 6px;
}
.tf-project-thumbnail-editor__thumbnail-dropdown .tf-dropdown__menu::-webkit-scrollbar-track {
  background: #F1F1F1;
  border-radius: 3px;
}
.tf-project-thumbnail-editor__thumbnail-dropdown .tf-dropdown__menu::-webkit-scrollbar-thumb {
  background: #828282;
  border-radius: 3px;
}
.tf-project-thumbnail-editor__thumbnail-dropdown .tf-dropdown__menu::-webkit-scrollbar-thumb:hover {
  background: #272727;
}
.tf-project-thumbnail-editor__thumbnail-dropdown .tf-dropdown__menu .tf-dropdown__item {
  flex-shrink: 0;
  width: 150px;
  height: 112px;
  padding: 0;
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  border: 2px solid transparent;
}
.tf-project-thumbnail-editor__thumbnail-dropdown .tf-dropdown__menu .tf-dropdown__item:hover {
  transform: translateY(-2px);
  border-color: #FCB434;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.08);
}
.tf-project-thumbnail-editor__thumbnail-dropdown .tf-dropdown__menu .tf-dropdown__item:active {
  transform: translateY(0);
}
.tf-project-thumbnail-editor__thumbnail-dropdown .tf-dropdown__menu .tf-dropdown__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.tf-project-thumbnail-editor--has-image .tf-project-thumbnail-editor__preview {
  border-color: #FCB434;
}
.tf-project-thumbnail-editor--required .tf-project-thumbnail-editor__label::after {
  content: ' *';
  color: #E53935;
}
.tf-project-thumbnail-editor--error .tf-project-thumbnail-editor__preview {
  border-color: #E53935;
}
.tf-project-thumbnail-editor--error .tf-project-thumbnail-editor__label {
  color: #E53935;
}
@keyframes tf-thumbnail-shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}
.tf-filter-group__title {
  font-size: 13px;
  font-weight: 800;
  color: #333;
  margin-bottom: 12px;
}
.tf-filter-group .tf-radio-group {
  margin-bottom: 0;
}
.tf-filter-group .tf-radio-group__label {
  font-size: 14px;
  font-weight: 800;
  color: #333;
}
.tf-filter-group .tf-radio-group__options {
  gap: 0;
  margin-left: 16px;
}
.tf-filter-group .tf-radio-group__options .tf-radio-group__radio {
  width: 20px;
  height: 20px;
}
.tf-filter-group .tf-radio-group__options .tf-radio-group__radio-dot {
  width: 12px;
  height: 12px;
}
.tf-filter-group .tf-radio-group__options .tf-radio-group__option-text {
  font-size: 15px;
  line-height: normal;
}
.tf-filter-group .tf-select {
  margin-bottom: 0;
  width: 100%;
}
.tf-filter-group .tf-select__label {
  font-size: 14px;
  font-weight: 800;
  color: #333;
}
.tf-filter-group .tf-select__container {
  width: 100%;
  margin-left: 16px;
}
.tf-filter-group .tf-select__field {
  font-size: 15px;
  width: 100%;
}
.tf-filter-group .tf-tag {
  margin-left: 16px;
}
.tf-filter-group .tf-tag--large {
  font-size: 15px;
}
.tf-filter-query {
  display: flex;
  align-items: center;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  background-color: #FFFFFF;
}
.tf-filter-query:focus-within {
  border-color: #ffc107;
  box-shadow: 0 0 0 2px rgba(255, 193, 7, 0.25);
}
.tf-filter-query input[type="search"] {
  flex-grow: 1;
  border: none;
  outline: none;
  padding: 12px 8px;
  font-size: 16px;
  font-family: 'Avenir', Arial, sans-serif;
  color: #333333;
  background-color: transparent;
  min-width: 0;
}
.tf-filter-query input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
}
.tf-filter-query > div {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.tf-filter-query button {
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #828282;
  transition: color 0.2s ease;
}
.tf-filter-query button svg {
  width: 16px;
  height: 16px;
}
.tf-filter-query button:hover:not(:disabled) {
  color: #272727;
}
.tf-filter-query__clear svg {
  width: 14px;
  height: 14px;
}
.tf-filter-query__submit {
  padding-right: 12px;
}
.tf-filter-query__submit:disabled {
  cursor: not-allowed;
  color: #828282;
  opacity: 0.7;
}
.tf-filter-query__submit svg {
  width: 18px;
  height: 18px;
}
.c-asset-card {
  font-family: 'Avenir', Arial, sans-serif;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: transform 0.18s cubic-bezier(0.4, 0.2, 0.2, 1);
}
.c-asset-card:hover {
  transform: scale(1.025);
  z-index: 2;
}
.c-asset-card__image-container {
  position: relative;
  width: 100%;
  aspect-ratio: 280 / 259;
  background-color: #E6E6E6;
  border-radius: 12px;
  overflow: hidden;
}
.c-asset-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.c-asset-card__overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 24px;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.c-asset-card__spacer {
  flex-grow: 1;
}
.c-asset-card__badge {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 12px;
  font-family: 'Avenir', Arial, sans-serif;
  line-height: 22px;
  font-size: 16px;
  font-weight: 800;
}
.c-asset-card__badge span {
  margin-left: 5px;
}
.c-asset-card__badge--trending {
  background-color: #FFC74D;
  color: #000000;
}
.c-asset-card__add-button {
  width: 30px;
  height: 30px;
  background-color: #FFFFFF;
  border-radius: 6px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  color: #000000;
  transition: transform 0.2s ease;
  flex-shrink: 0;
}
.c-asset-card__add-button:hover {
  transform: scale(1.05);
}
.c-asset-card__name {
  margin: 0;
  padding-top: 10px;
  font-size: 15px;
  color: #333333;
  text-align: center;
  font-weight: 400;
  overflow-wrap: break-word;
  word-break: break-word;
}
.c-dashboard-asset-card {
  font-family: 'Avenir', Arial, sans-serif;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: transform 0.18s cubic-bezier(0.4, 0.2, 0.2, 1);
}
.c-dashboard-asset-card:hover {
  transform: scale(1.025);
  z-index: 2;
}
.c-dashboard-asset-card__image-container {
  position: relative;
  width: 100%;
  aspect-ratio: 280 / 259;
  background-color: #E6E6E6;
  border-radius: 12px;
  overflow: hidden;
}
.c-dashboard-asset-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.c-dashboard-asset-card__status-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border-radius: 8px;
  font-family: 'Avenir', Arial, sans-serif;
  line-height: 18px;
  font-size: 12px;
  font-weight: 600;
  z-index: 2;
}
.c-dashboard-asset-card__status-badge--draft {
  background-color: #9CA3AF;
  color: #FFFFFF;
}
.c-dashboard-asset-card__status-badge--pending {
  background-color: #FCD34D;
  color: #000000;
}
.c-dashboard-asset-card__status-badge--published {
  background-color: #10B981;
  color: #FFFFFF;
}
.c-dashboard-asset-card__status-badge--rejected {
  background-color: #EF4444;
  color: #FFFFFF;
}
.c-dashboard-asset-card__status-badge--closed {
  background-color: #4B5563;
  color: #FFFFFF;
}
.c-dashboard-asset-card__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 16px;
  box-sizing: border-box;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  opacity: 0;
  transition: opacity 0.2s ease;
  z-index: 1;
}
.c-dashboard-asset-card:hover .c-dashboard-asset-card__overlay {
  opacity: 1;
}
.c-dashboard-asset-card__name {
  margin: 0;
  padding-top: 10px;
  font-size: 15px;
  color: #333333;
  text-align: center;
  font-weight: 400;
  overflow-wrap: break-word;
  word-break: break-word;
}
.tf-stage-nav {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 32px;
  padding: 0 16px;
}
.tf-stage-nav__stages {
  display: flex;
  align-items: center;
  list-style: none;
  padding: 0;
  margin: 0;
  flex: 1;
  justify-content: space-between;
  max-width: 600px;
}
.tf-stage-nav__stage {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  flex: 1;
}
.tf-stage-nav__stage:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 15px;
  left: calc(50% + 15px);
  width: calc(100% - 15px);
  height: 2px;
  background-color: #E6E6E6;
  z-index: 1;
}
.tf-stage-nav__stage-indicator {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #E6E6E6;
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 8px;
  position: relative;
  z-index: 2;
  transition: all 0.2s ease-in-out;
}
.tf-stage-nav__stage-title {
  font-size: 14px;
  color: #828282;
  text-align: center;
  font-weight: 400;
  white-space: nowrap;
  transition: color 0.2s ease-in-out;
}
.tf-stage-nav__stage--active .tf-stage-nav__stage-indicator {
  background-color: #FCB434;
  color: #000000;
}
.tf-stage-nav__stage--active .tf-stage-nav__stage-title {
  color: #333333;
  font-weight: 500;
}
.tf-stage-nav__stage--active:not(:last-child)::after {
  background-color: #FCB434;
}
.tf-stage-nav__stage--completed .tf-stage-nav__stage-indicator {
  background-color: #FCB434;
  color: #000000;
}
.tf-stage-nav__stage--completed .tf-stage-nav__stage-title {
  color: #333333;
}
.tf-stage-nav__stage--completed:not(:last-child)::after {
  background-color: #FCB434;
}
.tf-stage-nav__stage--pending .tf-stage-nav__stage-indicator {
  background-color: #E6E6E6;
  color: #828282;
}
.tf-stage-nav__stage--pending .tf-stage-nav__stage-title {
  color: #828282;
}
.tf-stage-nav__stage--clickable {
  transition: all 0.2s ease-in-out;
}
.tf-stage-nav__stage--clickable:hover .tf-stage-nav__stage-indicator {
  transform: scale(1.1);
  box-shadow: 0 2px 8px rgba(252, 180, 52, 0.3);
}
.tf-stage-nav__stage--clickable:hover .tf-stage-nav__stage-title {
  color: #FCB434;
}
.tf-stage-nav__stage--error .tf-stage-nav__stage-indicator {
  background-color: #E53935;
  color: #FFFFFF;
}
.tf-stage-nav__stage--error .tf-stage-nav__stage-title {
  color: #E53935;
}
.tf-stage-nav__stage--error:not(:last-child)::after {
  background-color: #E53935;
}
@media (max-width: 992px) {
  .tf-stage-nav {
    padding: 0 8px;
  }
  .tf-stage-nav__stages {
    max-width: 500px;
  }
  .tf-stage-nav__stage-title {
    font-size: 13px;
  }
}
@media (max-width: 768px) {
  .tf-stage-nav {
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 0 8px;
  }
  .tf-stage-nav__stages {
    order: 1;
    flex-wrap: wrap;
    justify-content: space-between;
    max-width: 100%;
    width: 100%;
    gap: 8px;
  }
  .tf-stage-nav__stage {
    flex: 1;
    margin-bottom: 16px;
    min-width: 0;
  }
  .tf-stage-nav__stage:not(:last-child)::after {
    display: none;
  }
  .tf-stage-nav__stage-indicator {
    width: 36px;
    height: 36px;
    font-size: 16px;
    margin-bottom: 4px;
  }
  .tf-stage-nav__stage-title {
    font-size: 12px;
    line-height: 1.2;
    max-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .tf-stage-nav__controls {
    order: 2;
    width: 100%;
  }
}
@media (max-width: 480px) {
  .tf-stage-nav__stage-title {
    font-size: 11px;
    max-width: 60px;
  }
  .tf-stage-nav__stage-indicator {
    width: 32px;
    height: 32px;
    font-size: 14px;
  }
  .tf-stage-nav__stages {
    gap: 4px;
  }
}
.tf-embedded-gallery {
  display: flex;
  gap: 16px;
  flex: 2;
  background: #F1F1F1;
  max-height: 850px;
  height: 100%;
}
.tf-embedded-gallery__list-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.tf-embedded-gallery__list {
  list-style: none;
  padding: 0;
  margin: 0;
  transition: opacity 0.3s;
}
.tf-embedded-gallery__item {
  margin-bottom: 8px;
  transition: opacity 1s, transform 1s;
  opacity: 1;
  transform: translateY(0);
}
.tf-embedded-gallery__item:last-child {
  margin-bottom: 0;
}
.tf-embedded-gallery__item--enter {
  opacity: 0;
  transform: translateY(50px);
}
.tf-embedded-gallery__item--enter-active {
  opacity: 1;
  transform: translateY(0);
}
.tf-embedded-gallery__item--exit {
  opacity: 1;
  transform: translateY(0);
}
.tf-embedded-gallery__item--exit-active {
  opacity: 0;
  transform: translateY(-50px);
}
.tf-embedded-gallery__button {
  border: 2px solid transparent;
  padding: 0;
  background: none;
  cursor: pointer;
  display: block;
  border-radius: 8px;
  position: relative;
  overflow: hidden;
  transition: border-color 0.2s;
}
.tf-embedded-gallery__button--active {
  border-color: #FCB434;
}
.tf-embedded-gallery__thumbnail-img {
  display: block;
  width: 150px;
  height: 150px;
  object-fit: cover;
}
.tf-embedded-gallery__play-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 24px;
  color: white;
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.7);
  pointer-events: none;
}
.tf-embedded-gallery__scroll-button {
  border: none;
  background: none;
  cursor: pointer;
  color: #828282;
  font-size: 18px;
  padding: 8px / 2;
}
.tf-embedded-gallery__scroll-button--invisible {
  opacity: 0;
  pointer-events: none;
}
.tf-embedded-gallery__main-image-container {
  flex: 1 1 0;
  min-height: 0;
  margin: 0;
  min-width: 0;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  max-height: 100%;
  padding-top: 24px;
}
.tf-embedded-gallery__main-image-container .image-element,
.tf-embedded-gallery__main-image-container .video-element {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tf-embedded-gallery__main-image-container img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  border-radius: 16px;
  object-fit: contain;
  display: block;
}
.tf-embedded-gallery__fullscreen-btn {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  top: -30px;
  right: 0;
  padding: 10px;
  background: transparent;
  border: none;
  color: #272727;
  opacity: 0.5;
  z-index: 100;
  cursor: pointer;
}
.tf-embedded-gallery__fullscreen-btn:hover {
  opacity: 0.8;
}
.tf-embedded-gallery__fullscreen-btn:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-embedded-gallery__fullscreen-btn svg {
  width: 24px;
  height: 24px;
}
.tf-embedded-gallery .nav,
.tf-embedded-gallery__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0.5;
  padding: 16px;
  color: #828282;
  background: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tf-embedded-gallery .nav.left,
.tf-embedded-gallery__nav.left,
.tf-embedded-gallery .nav--left,
.tf-embedded-gallery__nav--left {
  left: 0;
}
.tf-embedded-gallery .nav.right,
.tf-embedded-gallery__nav.right,
.tf-embedded-gallery .nav--right,
.tf-embedded-gallery__nav--right {
  right: 0;
}
.tf-embedded-gallery .nav:hover,
.tf-embedded-gallery__nav:hover {
  color: #ffffff;
  opacity: 0.8;
  transform: translateY(-50%) scale(1.2);
}
.tf-embedded-gallery .nav:focus,
.tf-embedded-gallery__nav:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-embedded-gallery .nav:disabled,
.tf-embedded-gallery__nav:disabled {
  opacity: 0.2;
  cursor: not-allowed;
}
.tf-embedded-gallery .nav:disabled:hover,
.tf-embedded-gallery__nav:disabled:hover {
  transform: translateY(-50%);
  opacity: 0.2;
}
.tf-embedded-gallery .nav svg,
.tf-embedded-gallery__nav svg {
  width: 24px;
  height: 24px;
}
.tf-embedded-gallery__main-image {
  width: 100%;
  height: auto;
  max-height: 500px;
  object-fit: contain;
  border-radius: 8px;
}
.tf-embedded-gallery--overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  max-width: none;
  max-height: none;
  background: transparent;
  z-index: 1;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: center;
  gap: 16px;
  padding: 40px;
}
.tf-embedded-gallery--overlay__main-image-container {
  max-width: 100%;
  max-height: 100%;
  padding-top: 0;
}
.tf-embedded-gallery--overlay__main-image {
  max-height: 80vh;
}
.tf-embedded-gallery--overlay__list-container {
  max-height: 90vh;
}
@media screen and (max-width: 767px) {
  .tf-embedded-gallery {
    display: none !important;
  }
}
.tf-embedded-gallery-item {
  list-style: none !important;
}
.tf-embedded-gallery-item::before,
.tf-embedded-gallery-item::after {
  display: none !important;
}
.tf-embedded-gallery-editor {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}
.tf-embedded-gallery-editor__label {
  font-weight: bold;
  color: #333333;
  margin-bottom: 8px;
  font-size: 14px;
}
.tf-embedded-gallery-editor__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-embedded-gallery-editor__label--required::after {
  content: ' *';
  color: #E53935;
}
.tf-embedded-gallery-editor__grid {
  margin-bottom: 24px;
}
.tf-embedded-gallery-editor__help {
  margin-top: 8px;
  font-size: 14px;
  color: #6c757d;
  line-height: 1.4;
}
.tf-embedded-gallery-editor__error {
  margin-top: 8px;
}
.tf-embedded-gallery-editor__error .tf-help-block {
  color: #E53935;
}
.tf-embedded-gallery-editor--error .tf-embedded-gallery-editor__label {
  color: #E53935;
}
.tf-embedded-gallery-grid {
  list-style: none;
  padding: 24px;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 16px;
  background-color: #F5F5F5;
  border-radius: 8px;
  border: 1px solid #dee2e6;
  min-height: 200px;
}
.tf-embedded-gallery-grid li {
  list-style: none !important;
  margin: 0;
  padding: 0;
}
.tf-embedded-gallery-grid:empty::before {
  content: "No gallery items yet. Upload images or videos to get started.";
  display: flex;
  align-items: center;
  justify-content: center;
  grid-column: 1 / -1;
  color: #6c757d;
  font-size: 14px;
  text-align: center;
  font-style: italic;
}
@media (max-width: 768px) {
  .tf-embedded-gallery-grid {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 8px;
    padding: 16px;
  }
}
.tf-embedded-gallery-item {
  position: relative;
  list-style: none !important;
}
.tf-embedded-gallery-item__preview {
  position: relative;
  aspect-ratio: 1;
  border-radius: 8px;
  overflow: hidden;
  background-color: #F1F1F1;
  border: 2px solid #dee2e6;
  transition: all 0.2s ease-in-out;
}
.tf-embedded-gallery-item__preview:hover {
  border-color: #FCB434;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.08);
}
.tf-embedded-gallery-item__preview:hover .tf-embedded-gallery-item__overlay {
  opacity: 1;
}
.tf-embedded-gallery-item__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.tf-embedded-gallery-item__overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.3) 100%);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 8px;
  opacity: 0;
  transition: opacity 0.2s ease-in-out;
}
.tf-embedded-gallery-item__drag-handle {
  color: #FFFFFF;
  cursor: grab;
  padding: 4px;
  border-radius: 4px;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
}
.tf-embedded-gallery-item__drag-handle:hover {
  background-color: rgba(0, 0, 0, 0.7);
}
.tf-embedded-gallery-item__drag-handle:active {
  cursor: grabbing;
}
.tf-embedded-gallery-item__drag-handle svg {
  width: 12px;
  height: 12px;
}
.tf-embedded-gallery-item.tf-embedded-gallery-item--dragging {
  opacity: 0.5;
  transform: rotate(2deg);
  z-index: 1000;
  list-style: none !important;
}
.tf-embedded-gallery {
  margin-bottom: 16px;
}
.tf-mobile-gallery-strip {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  background: #F1F1F1;
  padding: 8px 0;
}
.tf-mobile-gallery-strip__list {
  display: flex;
  flex-direction: row;
  gap: 8px;
  margin: 0;
  padding: 0 8px;
  list-style: none;
  height: 150px;
  align-items: center;
}
.tf-mobile-gallery-strip__item {
  flex: 0 0 auto;
  height: 150px;
  width: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  overflow: hidden;
  background: #FFFFFF;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}
.tf-mobile-gallery-strip__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media screen and (min-width: 1280px) {
  .tf-mobile-gallery-strip {
    display: none !important;
  }
}
.eula.license-agreement {
  display: flex;
  flex-direction: column;
  height: 100%;
  position: relative;
}
.eula.license-agreement .license-content {
  flex: 1;
  overflow-y: auto;
  padding-bottom: 40px;
  margin-bottom: 80px;
  border-bottom: 1px solid #eee;
}
.eula.license-agreement .license-content .license-view {
  border: none;
  margin-bottom: 0;
}
.eula.license-agreement .license-controls {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: white;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  text-align: right;
}
.license-agreement > h1 {
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 20px;
}
.license-agreement .license-view {
  padding: 30px;
  margin-bottom: 20px;
  overflow-y: auto;
  border: 1px solid #eee;
}
.license-agreement .license-view h1 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 20px;
}
.license-agreement .license-view p,
.license-agreement .license-view h2,
.license-agreement .license-view li {
  font-size: 14px;
  line-height: 18px;
  margin-bottom: 15px;
}
.license-agreement .license-view ol {
  margin-left: 25px;
  margin-top: 15px;
  margin-bottom: 15px;
}
.license-agreement .license-view h3 {
  font-size: 14px;
  font-weight: bold;
  line-height: 18px;
  margin-bottom: 15px;
}
.license-agreement .license-view h4 {
  font-size: 14px;
  font-weight: bold;
  line-height: 18px;
  margin-bottom: 15px;
}
.license-agreement .license-action {
  margin-bottom: 20px;
}
.license-agreement .license-action p {
  color: #303030;
  font-size: 18px;
  line-height: 22px;
  margin-bottom: 20px;
  font-family: 'AvenirLight', Arial, sans-serif;
}
.license-agreement .license-action p a {
  text-decoration: underline;
}
.license-smalltext-view {
  font-size: 12px;
  color: #828282;
}
.license-smalltext-view li + li {
  margin-top: 10px;
}
.license-smalltext-view__link {
  background: none;
  border: none;
  padding: 0;
  color: inherit;
  font-size: inherit;
  font-family: inherit;
  text-decoration: none;
  cursor: pointer;
}
.license-smalltext-view__link:hover {
  color: #272727;
}
.c-download-cart--inline {
  display: inline-block;
  position: absolute;
  right: 4px;
  top: 0;
  z-index: 1;
}
.c-download-cart .c-download-cart__show-btn {
  position: relative;
  cursor: pointer;
  transition: opacity 0.2s ease;
}
.c-download-cart .c-download-cart__show-btn:hover {
  opacity: 0.7;
}
.c-download-cart .c-download-cart__show-btn .c-download-cart__icon-wrap {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}
.c-download-cart .c-download-cart__show-btn .c-download-cart__icon-wrap .c-download-cart__count {
  display: block;
  position: absolute;
  top: -10px;
  right: -10px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background-color: #F1F1F1;
  border: 1px solid black;
  color: black;
  font-size: 10px;
  line-height: 14px;
}
.c-download-cart .c-download-cart__show-btn .c-download-cart__icon-wrap .c-download-cart__count--highlight {
  background-color: #5cb85c;
  border: 1px solid #5cb85c;
  color: white;
}
@media screen and (max-width: 767px) {
  .c-download-cart--inline {
    position: relative;
  }
}
.c-download-cart__contents {
  padding: 20px;
}
.c-download-cart__contents .c-download-cart__item {
  padding: 10px;
  border: 1px solid #E6E6E6;
  background-color: #F1F1F1;
  margin-bottom: 10px;
  position: relative;
}
.c-download-cart__contents .c-download-cart__item .c-download-cart__info {
  display: flex;
  align-items: flex-start;
  margin-bottom: 3px;
  font-family: 'Avenir', Arial, sans-serif;
  padding-right: 20px;
}
.c-download-cart__contents .c-download-cart__item .c-download-cart__info img {
  width: 100px;
  height: 100px;
  margin-right: 10px;
}
.c-download-cart__contents .c-download-cart__item .c-download-cart__info .c-download-cart__title {
  display: block;
  color: rgba(0, 0, 0, 0.7);
  font-size: 18px;
  font-family: 'AvenirHeavy', Arial, sans-serif;
  margin-bottom: 10px;
}
.c-download-cart__contents .c-download-cart__item .c-download-cart__info .c-download-cart__format {
  display: inline-block;
  background-color: #DDD;
  border: 1px solid rgba(0, 0, 0, 0.2);
  font-family: 'AvenirLight', Arial, sans-serif;
  font-size: 14px;
  padding: 6px 10px 4px;
  margin-bottom: 10px;
}
.c-download-cart__contents .c-download-cart__item .c-download-cart__info .c-download-cart__filesize {
  display: block;
  font-size: 12px;
  font-family: 'AvenirLight', Arial, sans-serif;
}
.c-download-cart__contents .c-download-cart__item .c-download-cart__remove {
  position: absolute;
  top: 0;
  right: 0;
  width: 20px;
  height: 20px;
  padding: 0;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.5);
  background-color: transparent;
}
.c-download-cart__contents .c-download-cart__item .c-download-cart__remove:hover {
  color: rgba(0, 0, 0, 0.25);
}
.c-download-cart__contents .c-download-cart__buttons button {
  width: 100%;
}
.c-download-cart__contents .c-download-cart__buttons button:hover {
  background-color: #cdcdcd;
}
.c-download-cart__contents .c-download-cart__buttons button + button {
  margin-left: 5px;
}
.c-download-cart__contents .c-download-cart__empty {
  padding: 60px;
}
@media screen and (max-width: 767px) {
  .c-download-cart__contents {
    padding: 10px;
  }
  .c-download-cart__contents .c-download-cart__buttons button {
    margin-bottom: 10px;
    width: 100%;
  }
  .c-download-cart__contents .c-download-cart__buttons button + button {
    margin-left: 0;
  }
}
.tf-download-cart-view {
  margin: 0 auto;
  font-family: 'Avenir', Arial, sans-serif;
  color: #272727;
  min-height: 600px;
  max-width: 1728px;
  width: 100%;
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
}
.tf-download-cart-view__container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 48px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
@media screen and (max-width: 767px) {
  .tf-download-cart-view__container {
    padding: 24px;
    gap: 16px;
  }
}
.tf-download-cart-view__breadcrumbs {
  margin-bottom: 8px;
}
.tf-download-cart-view__breadcrumbs a {
  color: #333;
  text-decoration: none;
  font-size: 22px;
  font-weight: 800;
}
.tf-download-cart-view__breadcrumbs a:hover {
  text-decoration: underline;
}
@media screen and (max-width: 767px) {
  .tf-download-cart-view__breadcrumbs {
    margin-bottom: 0;
  }
}
.tf-download-cart-view__header {
  display: flex;
  align-items: baseline;
  gap: 16px;
  flex-wrap: wrap;
}
.tf-download-cart-view__header h1 {
  font-size: 42px;
  font-weight: 800;
  color: #272727;
  margin: 0;
  font-family: 'Avenir', Arial, sans-serif;
}
@media screen and (max-width: 767px) {
  .tf-download-cart-view__header h1 {
    font-size: 32px;
  }
}
.tf-download-cart-view__count {
  font-size: 18px;
  color: rgba(0, 0, 0, 0.6);
  margin: 0;
  font-family: 'AvenirLight', Arial, sans-serif;
}
.tf-download-cart-view__content {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.tf-download-cart-view__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 0;
  border-bottom: 1px solid #E6E6E6;
  margin-bottom: 8px;
}
@media screen and (max-width: 767px) {
  .tf-download-cart-view__toolbar {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .tf-download-cart-view__toolbar button {
    width: 100%;
  }
}
.tf-download-cart-view__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}
@media screen and (max-width: 1279px) {
  .tf-download-cart-view__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media screen and (max-width: 1023px) and (min-width: 768px) {
  .tf-download-cart-view__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (max-width: 767px) {
  .tf-download-cart-view__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
}
.tf-download-cart-view__item {
  display: flex;
  flex-direction: column;
  background: #FFFFFF;
  border: 1px solid #E6E6E6;
  border-radius: 8px;
  overflow: hidden;
  transition: box-shadow 0.15s ease;
}
.tf-download-cart-view__item:hover {
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
}
.tf-download-cart-view__item--selected {
  border-color: #FCB434;
  box-shadow: 0 0 0 2px #FCB434;
}
.tf-download-cart-view__item--selected:hover {
  box-shadow: 0 0 0 2px #FCB434;
}
.tf-download-cart-view__item-thumbnail-wrap {
  position: relative;
  width: 100%;
  padding-top: 100%;
  background: #F1F1F1;
  flex-shrink: 0;
}
.tf-download-cart-view__item-thumbnail {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tf-download-cart-view__item-checkbox {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 1;
  border-radius: 8px / 2;
  padding: 2px;
}
.tf-download-cart-view__item-details {
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1;
}
.tf-download-cart-view__item-title {
  font-weight: 600;
  color: #272727;
  font-size: 13px;
  font-family: 'Avenir', Arial, sans-serif;
  margin: 0;
  word-wrap: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.tf-download-cart-view__item-format {
  display: inline-block;
  font-size: 11px;
  color: #828282;
  font-family: 'Avenir', Arial, sans-serif;
}
.tf-download-cart-view__item-filesize {
  display: block;
  font-size: 11px;
  color: #828282;
  font-family: 'Avenir', Arial, sans-serif;
}
.tf-download-cart-view__actions {
  margin-top: 16px;
  display: flex;
  justify-content: center;
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .tf-download-cart-view__actions {
    margin-top: 8px;
  }
}
.tf-download-cart-view__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 64px 16px;
  text-align: center;
  gap: 24px;
}
.tf-download-cart-view__empty p {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.5);
  margin: 0;
  font-family: 'AvenirLight', Arial, sans-serif;
}
@media screen and (max-width: 767px) {
  .tf-download-cart-view__empty {
    padding: 32px 16px;
    gap: 16px;
  }
  .tf-download-cart-view__empty p {
    font-size: 18px;
  }
}
.tf-download-cart-view__downloading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 64px 16px;
  text-align: center;
  gap: 16px;
}
@media screen and (max-width: 767px) {
  .tf-download-cart-view__downloading {
    padding: 32px 16px;
  }
}
.tf-download-cart-view__downloading-title {
  font-size: 20px;
  font-weight: 600;
  color: #272727;
  margin: 0;
  font-family: 'Avenir', Arial, sans-serif;
}
.tf-download-cart-view__downloading-message {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.5);
  margin: 0;
  font-family: 'AvenirLight', Arial, sans-serif;
  max-width: 400px;
}
.tf-image-crop-editor {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.tf-image-crop-editor__actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 16px;
  border-top: 1px solid #dee2e6;
}
.ReactCrop {
  position: relative;
  display: inline-block;
  cursor: crosshair;
  overflow: hidden;
  max-width: 100%;
}
.ReactCrop.ReactCrop--disabled {
  cursor: inherit;
}
.ReactCrop:focus {
  outline: none;
}
.ReactCrop--image {
  display: block;
  max-width: 100%;
}
.ReactCrop--image-copy {
  position: absolute;
  top: 0;
  left: 0;
  max-width: 100%;
}
.ReactCrop--crop-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.6);
}
.ReactCrop--crop-selection {
  position: absolute;
  top: 0;
  left: 0;
  transform: translate3d(0, 0, 0);
  box-sizing: border-box;
  cursor: move;
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.7) 50%, rgba(0, 0, 0, 0.7) 50%), linear-gradient(to right, rgba(255, 255, 255, 0.7) 50%, rgba(0, 0, 0, 0.7) 50%), linear-gradient(to bottom, rgba(255, 255, 255, 0.7) 50%, rgba(0, 0, 0, 0.7) 50%), linear-gradient(to bottom, rgba(255, 255, 255, 0.7) 50%, rgba(0, 0, 0, 0.7) 50%);
  padding: 1px;
  background-size: 10px 1px, 10px 1px, 1px 10px, 1px 10px;
  background-position: 0 0, 0 100%, 0 0, 100% 0;
  background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
  animation: marching-ants 2s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-play-state: running;
}
.ReactCrop--disabled .ReactCrop--crop-selection {
  cursor: inherit;
}
.ReactCrop-ellipse .ReactCrop--crop-selection {
  background-image: none;
  border: 1px dashed rgba(255, 255, 255, 0.7);
  border-radius: 100%;
}
@keyframes marching-ants {
  0% {
    background-position: 0 0, 0 100%, 0 0, 100% 0;
  }
  100% {
    background-position: 40px 0, -40px 100%, 0 -40px, 100% 40px;
  }
}
.ReactCrop--drag-handle {
  position: absolute;
  width: 9px;
  height: 9px;
  background-color: rgba(0, 0, 0, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.7);
  box-sizing: border-box;
  outline: 1px solid transparent;
}
.ReactCrop .ord-nw {
  top: 0;
  left: 0;
  margin-top: -4px;
  margin-left: -4px;
  cursor: nw-resize;
}
.ReactCrop .ord-n {
  top: 0;
  left: 50%;
  margin-top: -4px;
  margin-left: -4px;
  cursor: n-resize;
}
.ReactCrop .ord-ne {
  top: 0;
  right: 0;
  margin-top: -4px;
  margin-right: -4px;
  cursor: ne-resize;
}
.ReactCrop .ord-e {
  top: 50%;
  right: 0;
  margin-top: -4px;
  margin-right: -4px;
  cursor: e-resize;
}
.ReactCrop .ord-se {
  bottom: 0;
  right: 0;
  margin-bottom: -4px;
  margin-right: -4px;
  cursor: se-resize;
}
.ReactCrop .ord-s {
  bottom: 0;
  left: 50%;
  margin-bottom: -4px;
  margin-left: -4px;
  cursor: s-resize;
}
.ReactCrop .ord-sw {
  bottom: 0;
  left: 0;
  margin-bottom: -4px;
  margin-left: -4px;
  cursor: sw-resize;
}
.ReactCrop .ord-w {
  top: 50%;
  left: 0;
  margin-top: -4px;
  margin-left: -4px;
  cursor: w-resize;
}
.ReactCrop--disabled .ReactCrop--drag-handle {
  cursor: inherit;
}
.ReactCrop--drag-bar {
  position: absolute;
}
.ReactCrop--drag-bar.ord-n {
  top: 0;
  left: 0;
  width: 100%;
  height: 6px;
  margin-top: -4px;
}
.ReactCrop--drag-bar.ord-e {
  right: 0;
  top: 0;
  width: 6px;
  height: 100%;
  margin-right: -4px;
}
.ReactCrop--drag-bar.ord-s {
  bottom: 0;
  left: 0;
  width: 100%;
  height: 6px;
  margin-bottom: -4px;
}
.ReactCrop--drag-bar.ord-w {
  top: 0;
  left: 0;
  width: 6px;
  height: 100%;
  margin-left: -4px;
}
.ReactCrop-ellipse .ReactCrop--drag-bar,
.ReactCrop-new-crop .ReactCrop--drag-bar,
.ReactCrop-new-crop .ReactCrop--drag-handle,
.ReactCrop-fixed-aspect .ReactCrop--drag-bar {
  display: none;
}
@media (max-width: 768px) {
  .ReactCrop--drag-handle {
    width: 17px;
    height: 17px;
  }
  .ReactCrop .ord-nw {
    margin-top: -8px;
    margin-left: -8px;
  }
  .ReactCrop .ord-n {
    margin-top: -8px;
    margin-left: -8px;
  }
  .ReactCrop .ord-ne {
    margin-top: -8px;
    margin-right: -8px;
  }
  .ReactCrop .ord-e {
    margin-top: -8px;
    margin-right: -8px;
  }
  .ReactCrop .ord-se {
    margin-bottom: -8px;
    margin-right: -8px;
  }
  .ReactCrop .ord-s {
    margin-bottom: -8px;
    margin-left: -8px;
  }
  .ReactCrop .ord-sw {
    margin-bottom: -8px;
    margin-left: -8px;
  }
  .ReactCrop .ord-w {
    margin-top: -8px;
    margin-left: -8px;
  }
  .ReactCrop--drag-bar.ord-n {
    height: 14px;
    margin-top: -12px;
  }
  .ReactCrop--drag-bar.ord-e {
    width: 14px;
    margin-right: -12px;
  }
  .ReactCrop--drag-bar.ord-s {
    height: 14px;
    margin-bottom: -12px;
  }
  .ReactCrop--drag-bar.ord-w {
    width: 14px;
    margin-left: -12px;
  }
}
.tf-content-staging .tf-staging-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid #dee2e6;
}
.tf-asset-upload {
  border: 3px dashed #E6E6E6;
  border-radius: 8px;
  padding: 64px 32px;
  text-align: center;
  background-color: #FFFFFF;
  transition: all 0.2s ease-in-out;
  min-height: 400px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.tf-asset-upload:hover {
  border-color: #FCB434;
  background-color: #ffffff;
}
.tf-asset-upload--dragover {
  border-color: #FCB434 !important;
  background-color: #fffefd !important;
  border-style: solid !important;
}
.tf-asset-upload__content {
  max-width: 400px;
}
.tf-asset-upload__text {
  font-size: 18px;
  color: #333333;
  margin-bottom: 24px;
  font-weight: 400;
}
.tf-asset-upload__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  margin: 0;
  border: 2px solid transparent;
  border-radius: 8px;
  background: none;
  color: #333333;
  font-family: 'Avenir', Arial, sans-serif;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  user-select: none;
  white-space: nowrap;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #FCB434;
  border-color: #FCB434;
  color: #000000;
  padding: 12px 32px;
  font-size: 16px;
  font-weight: 500;
}
@media (max-width: 768px) {
  .tf-asset-upload__button {
    padding: 16px 24px;
    font-size: 16px;
    min-height: 48px;
  }
}
.tf-asset-upload__button:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-asset-upload__button:focus-visible {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-asset-upload__button:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.tf-asset-upload__button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}
.tf-asset-upload__button:hover:not(:disabled) {
  background-color: #f9a104;
  border-color: #f9a104;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.tf-asset-upload__button:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-asset-upload__button::before {
  content: '🔍';
  margin-right: 8px;
}
.tf-asset-upload__icon {
  margin-bottom: 16px;
  color: #FCB434;
}
.tf-asset-upload__icon .tf-upload-arrow {
  display: inline-block;
  animation: tf-upload-bounce 1s ease-in-out infinite alternate;
  color: #FCB434;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}
.tf-asset-upload__icon .tf-upload-arrow svg {
  width: 48px;
  height: 48px;
  display: block;
}
.tf-asset-upload__icon .tf-upload-arrow.bounce {
  animation: tf-upload-bounce 0.5s ease-in-out infinite alternate;
}
@media (max-width: 768px) {
  .tf-asset-upload {
    padding: 32px 16px;
    min-height: 300px;
  }
  .tf-asset-upload__text {
    font-size: 16px;
    margin-bottom: 16px;
  }
  .tf-asset-upload__button {
    padding: 16px 24px;
    font-size: 16px;
    min-height: 44px;
  }
  .tf-asset-upload__icon .tf-upload-arrow svg {
    width: 40px;
    height: 40px;
  }
  .tf-asset-upload:hover {
    background-color: #FFFFFF;
    border-color: #E6E6E6;
  }
}
.tf-resource-list {
  margin-top: 24px;
  margin-bottom: 24px;
}
.tf-resource-list__items {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.tf-resource-list__item {
  position: relative;
}
.tf-resource-item {
  background-color: #FFFFFF;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  overflow: hidden;
  transition: all 0.2s ease-in-out;
}
.tf-resource-item:hover {
  border-color: #828282;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-resource-item__header {
  padding: 16px;
  cursor: pointer;
}
.tf-resource-item__media {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.tf-resource-item__thumb {
  width: 60px;
  height: 60px;
  object-fit: cover;
  border-radius: 4px;
  flex-shrink: 0;
  border: 1px solid #dee2e6;
}
.tf-resource-item__content {
  flex: 1;
  min-width: 0;
}
.tf-resource-item__title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.tf-resource-item__type {
  display: inline-block;
  background-color: #303030;
  color: #FFFFFF;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  flex-shrink: 0;
}
.tf-resource-item__name {
  font-size: 16px;
  font-weight: 600;
  color: #333333;
  margin: 0;
  line-height: 1.3;
  word-break: break-word;
}
.tf-resource-item__message {
  color: #6c757d;
  font-size: 14px;
  line-height: 1.4;
}
.tf-resource-item__message p {
  margin: 0;
}
.tf-resource-item__edit-panel {
  border-top: 1px solid #dee2e6;
  background-color: #F5F5F5;
  padding: 16px;
}
.tf-resource-item__children {
  border-top: 1px solid #dee2e6;
  background-color: #F1F1F1;
  padding: 16px;
}
.tf-resource-item--selected {
  border-color: #FCB434;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.08);
}
.tf-resource-item--attention {
  border-color: #E53935;
}
.tf-resource-item--attention .tf-resource-item__message {
  color: #E53935;
  font-weight: 500;
}
.tf-resource-item--attention .tf-resource-item__type {
  background-color: #E53935;
}
.tf-resource-child-item {
  padding: 12px;
  background-color: #FFFFFF;
  border: 1px solid #dee2e6;
  border-radius: 4px;
  margin-bottom: 8px;
  transition: all 0.2s ease-in-out;
}
.tf-resource-child-item:last-child {
  margin-bottom: 0;
}
.tf-resource-child-item:hover {
  border-color: #828282;
  background-color: #F5F5F5;
}
.tf-resource-child-item__media {
  display: flex;
  align-items: center;
  gap: 12px;
}
.tf-resource-child-item__thumb {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 4px;
  flex-shrink: 0;
  border: 1px solid #dee2e6;
}
.tf-resource-child-item__content {
  flex: 1;
  min-width: 0;
}
.tf-resource-child-item__title {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.tf-resource-child-item__type {
  display: inline-block;
  background-color: #828282;
  color: #FFFFFF;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  flex-shrink: 0;
}
.tf-resource-child-item__name {
  font-size: 14px;
  font-weight: 500;
  color: #333333;
  line-height: 1.3;
  word-break: break-word;
}
.tf-resource-child-item--attention {
  border-color: #E53935;
  background-color: #ffffff;
}
.tf-resource-child-item--attention .tf-resource-child-item__type {
  background-color: #E53935;
}
.tf-resource-child-item--attention .tf-resource-child-item__name {
  color: #E53935;
  font-weight: 600;
}
.tf-resource-edit-panel__section {
  margin-bottom: 16px;
}
.tf-resource-edit-panel__section:last-of-type {
  margin-bottom: 0;
}
.tf-resource-edit-panel__section ~ .tf-resource-edit-panel__actions {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #dee2e6;
}
.tf-resource-edit-panel__actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.tf-resource-edit-panel__overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}
.tf-rename-input {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}
.tf-rename-input__label {
  font-weight: bold;
  color: #333333;
  font-size: 14px;
  margin-bottom: 8px;
}
.tf-rename-input__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-rename-input__container {
  display: flex;
  border: 2px solid #dee2e6;
  border-radius: 8px;
  overflow: hidden;
  background-color: #FFFFFF;
  transition: all 0.2s ease-in-out;
}
.tf-rename-input__container:focus-within {
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.1);
}
.tf-rename-input__field {
  width: 100%;
  padding: 12px 16px;
  border: 2px solid #dee2e6;
  border-radius: 8px;
  background-color: #FFFFFF;
  color: #333333;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.4;
  transition: all 0.2s ease-in-out;
  border: none;
  border-radius: 0;
  flex: 1;
  margin: 0;
}
.tf-rename-input__field::placeholder {
  color: #6c757d;
}
.tf-rename-input__field:focus {
  outline: none;
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.1);
}
.tf-rename-input__field:disabled {
  background-color: #F1F1F1;
  color: #6c757d;
  cursor: not-allowed;
}
.tf-rename-input__field:focus {
  box-shadow: none;
  border-color: transparent;
}
.tf-rename-input__extension {
  display: flex;
  align-items: center;
  padding: 0 12px;
  background-color: #F1F1F1;
  border-left: 1px solid #dee2e6;
  color: #6c757d;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
}
.tf-rename-input--success .tf-rename-input__container {
  border-color: #5cb85c;
}
.tf-rename-input--success .tf-rename-input__container:focus-within {
  border-color: #5cb85c;
  box-shadow: 0 0 0 3px rgba(92, 184, 92, 0.1);
}
.tf-rename-input--success .tf-rename-input__extension {
  background-color: #fcfefc;
  border-left-color: #5cb85c;
  color: #449d44;
}
.tf-rename-input--error .tf-rename-input__container {
  border-color: #E53935;
}
.tf-rename-input--error .tf-rename-input__container:focus {
  border-color: #E53935;
  box-shadow: 0 0 0 3px rgba(229, 57, 53, 0.1);
}
.tf-rename-input--error .tf-rename-input__container:focus-within {
  border-color: #E53935;
  box-shadow: 0 0 0 3px rgba(229, 57, 53, 0.1);
}
.tf-rename-input--error .tf-rename-input__extension {
  background-color: #ffffff;
  border-left-color: #E53935;
  color: #E53935;
}
.tf-rename-input--error .tf-rename-input__label {
  color: #E53935;
}
.tf-upload-panel {
  background-color: #F5F5F5;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  padding: 24px;
  margin-bottom: 24px;
}
.tf-upload-panel__methods {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.tf-upload-panel__method .tf-asset-upload {
  background-color: #FFFFFF;
  border: 2px dashed #E6E6E6;
  margin-bottom: 0;
}
.tf-upload-panel__method .tf-asset-upload:hover {
  border-color: #FCB434;
  background-color: #ffffff;
}
.tf-upload-panel__method .tf-asset-upload--dragover {
  border-color: #FCB434 !important;
  background-color: #fffefd !important;
  border-style: solid !important;
}
.tf-upload-panel__method .tf-hosted-content {
  background-color: transparent;
  border: none;
  padding: 0;
  margin-bottom: 0;
}
.tf-upload-panel__divider {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  margin: 8px 0;
}
.tf-upload-panel__divider::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background-color: #dee2e6;
  z-index: 1;
}
.tf-upload-panel__divider-text {
  background-color: #F5F5F5;
  padding: 0 16px;
  color: #6c757d;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  z-index: 2;
  position: relative;
}
.tf-hosted-content {
  background-color: #F5F5F5;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  padding: 24px;
  margin-bottom: 24px;
}
.tf-hosted-content__header {
  text-align: center;
  margin-bottom: 24px;
}
.tf-hosted-content__title {
  font-size: 18px;
  font-weight: 600;
  color: #333333;
  margin: 0 0 8px 0;
  line-height: 1.3;
}
.tf-hosted-content__description {
  font-size: 14px;
  color: #6c757d;
  margin: 0;
  line-height: 1.4;
}
.tf-hosted-content .tf-stack--horizontal .tf-text-input {
  margin-bottom: 0;
}
.tf-hosted-content__input {
  width: 100%;
  padding: 12px 16px;
  border: 2px solid #dee2e6;
  border-radius: 8px;
  background-color: #FFFFFF;
  color: #333333;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.4;
  transition: all 0.2s ease-in-out;
  flex: 1;
  min-width: 0;
}
.tf-hosted-content__input::placeholder {
  color: #6c757d;
}
.tf-hosted-content__input:focus {
  outline: none;
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.1);
}
.tf-hosted-content__input:disabled {
  background-color: #F1F1F1;
  color: #6c757d;
  cursor: not-allowed;
}
.tf-hosted-content__input::placeholder {
  color: #6c757d;
}
.tf-hosted-content__input:focus {
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.2);
}
.tf-hosted-content__submit {
  display: inline-flex;
  justify-content: center;
  padding: 12px 24px;
  margin: 0;
  border: 2px solid transparent;
  border-radius: 8px;
  background: none;
  color: #333333;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  user-select: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 12px 16px;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
}
@media (max-width: 768px) {
  .tf-hosted-content__submit {
    padding: 16px 24px;
    font-size: 16px;
    min-height: 48px;
  }
}
.tf-hosted-content__submit:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-hosted-content__submit:focus-visible {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-hosted-content__submit:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.tf-hosted-content__submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}
.tf-hosted-content__submit svg {
  width: 16px;
  height: 16px;
}
.tf-hosted-content__submit--enabled {
  background-color: #FCB434;
  border-color: #FCB434;
  color: #000000;
}
.tf-hosted-content__submit--enabled:hover:not(:disabled) {
  background-color: #f9a104;
  border-color: #f9a104;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.tf-hosted-content__submit--enabled:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-hosted-content__submit--enabled:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.08);
}
.tf-hosted-content__submit--disabled {
  background-color: #E6E6E6;
  border-color: #E6E6E6;
  color: #6c757d;
  cursor: not-allowed;
}
.tf-hosted-content__submit--disabled:hover:not(:disabled) {
  background-color: #cdcdcd;
  border-color: #cdcdcd;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.tf-hosted-content__submit--disabled:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-hosted-content__submit--disabled:hover {
  transform: none;
  box-shadow: none;
}
@media (max-width: 768px) {
  .tf-hosted-content__submit {
    justify-content: center;
    width: 100%;
  }
}
.tf-hosted-content__help {
  font-size: 12px;
  color: #6c757d;
  text-align: center;
  line-height: 1.4;
  padding: 8px 16px;
}
@keyframes tf-upload-bounce {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-6px);
  }
}
.tf-hosted-file-form {
  padding: 24px;
  background-color: #F5F5F5;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  margin-bottom: 24px;
}
.tf-hosted-file-form__title {
  font-size: 18px;
  font-weight: 600;
  color: #333333;
  margin: 0 0 24px 0;
  line-height: 1.3;
}
.tf-hosted-file-form__controls {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 24px;
}
@media (max-width: 768px) {
  .tf-hosted-file-form__controls {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}
.tf-hosted-file-form__url-input {
  display: flex;
  gap: 8px;
  align-items: flex-end;
}
@media (max-width: 768px) {
  .tf-hosted-file-form__url-input {
    flex-direction: column;
    align-items: stretch;
  }
}
.tf-hosted-file-form__url-field {
  width: 100%;
  padding: 12px 16px;
  border: 2px solid #dee2e6;
  border-radius: 8px;
  background-color: #FFFFFF;
  color: #333333;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.4;
  transition: all 0.2s ease-in-out;
  flex: 1;
  min-height: 48px;
}
.tf-hosted-file-form__url-field::placeholder {
  color: #6c757d;
}
.tf-hosted-file-form__url-field:focus {
  outline: none;
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.1);
}
.tf-hosted-file-form__url-field:disabled {
  background-color: #F1F1F1;
  color: #6c757d;
  cursor: not-allowed;
}
.tf-hosted-file-form__url-field::placeholder {
  color: #6c757d;
  opacity: 1;
}
.tf-content-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 16px;
}
@media (max-width: 768px) {
  .tf-content-list {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}
.tf-upload-list {
  list-style: none;
  padding: 0;
  margin: 16px 0 0 0;
}
.tf-upload-list:empty {
  display: none;
}
.tf-upload-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  margin-bottom: 4px;
  background-color: #FFFFFF;
  border: 1px solid #E6E6E6;
  border-radius: 8px;
  transition: all 0.2s ease-in-out;
}
.tf-upload-item:hover {
  border-color: #828282;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-upload-item__content {
  flex: 1;
  min-width: 0;
}
.tf-upload-item__filename {
  display: block;
  font-weight: 500;
  color: #333333;
  margin-bottom: 2px;
  word-break: break-all;
}
.tf-upload-item__status {
  display: block;
  font-size: 14px;
  color: #6c757d;
}
.tf-upload-item__registering {
  display: flex;
  align-items: center;
  gap: 4px;
}
.tf-upload-item__registering .tf-upload-item__status {
  display: inline;
}
.tf-upload-item__delete {
  background: none;
  border: none;
  color: #828282;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: all 0.2s ease-in-out;
  margin-left: 8px;
  flex-shrink: 0;
}
.tf-upload-item__delete:hover {
  color: #E53935;
  background-color: rgba(229, 57, 53, 0.1);
}
.tf-upload-item__delete:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-upload-item__delete svg {
  display: block;
}
.tf-notification-list {
  margin-bottom: 16px;
}
.tf-notification-list:empty {
  display: none;
}
.tf-notification {
  display: flex;
  align-items: flex-start;
  padding: 16px;
  margin-bottom: 8px;
  border-radius: 8px;
  border: 1px solid;
  background-color: #FFFFFF;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease-in-out;
  position: relative;
  animation: tf-notification-slide-in 0.3s ease-out;
}
.tf-notification:hover {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}
.tf-notification__icon {
  flex-shrink: 0;
  margin-right: 12px;
  margin-top: 2px;
}
.tf-notification__content {
  flex: 1;
  min-width: 0;
}
.tf-notification__title {
  font-weight: 600;
  font-size: 16px;
  margin-bottom: 4px;
  line-height: 1.4;
}
.tf-notification__message {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: #333333;
}
.tf-notification__message-list {
  margin: 0;
  padding-left: 16px;
  list-style-type: disc;
}
.tf-notification__message-item {
  font-size: 14px;
  line-height: 1.5;
  color: #333333;
  margin-bottom: 2px;
}
.tf-notification__message-item:last-child {
  margin-bottom: 0;
}
.tf-notification__close {
  background: none;
  border: none;
  color: #828282;
  cursor: pointer;
  padding: 2px;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 14px;
  line-height: 1;
  transition: all 0.2s ease-in-out;
  margin-left: 8px;
  flex-shrink: 0;
}
.tf-notification__close:hover {
  background-color: #E53935;
  color: #FFFFFF;
}
.tf-notification__close:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-notification__close span {
  display: block;
}
.tf-notification--error {
  border-color: #E53935;
  background-color: #ffffff;
  color: #cd1e1a;
}
.tf-notification--error .tf-notification__icon {
  color: #E53935;
}
.tf-notification--error .tf-notification__title {
  color: #b61b17;
}
.tf-notification--warning {
  border-color: #FCB434;
  background-color: #fffefd;
  color: #956002;
}
.tf-notification--warning .tf-notification__icon {
  color: #D6931E;
}
.tf-notification--warning .tf-notification__title {
  color: #7c5002;
}
.tf-notification--success {
  border-color: #5cb85c;
  background-color: #ffffff;
  color: #449d44;
}
.tf-notification--success .tf-notification__icon {
  color: #5cb85c;
}
.tf-notification--success .tf-notification__title {
  color: #3d8b3d;
}
.tf-notification--info {
  border-color: #828282;
  background-color: #F5F5F5;
  color: #333333;
}
.tf-notification--info .tf-notification__icon {
  color: #828282;
}
.tf-notification--info .tf-notification__title {
  color: #333333;
}
@keyframes tf-notification-slide-in {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.tf-external-asset-form {
  padding: 24px;
  background-color: #F5F5F5;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  margin-bottom: 24px;
}
.tf-external-asset-form__title {
  font-size: 18px;
  font-weight: 600;
  color: #333333;
  margin: 0 0 8px 0;
  line-height: 1.3;
}
.tf-external-asset-form__description {
  font-size: 14px;
  color: #6c757d;
  margin: 0 0 24px 0;
  line-height: 1.5;
  padding: 12px 16px;
  background-color: #f9f9f9;
  border-radius: 4px;
  border-left: 3px solid #FCB434;
}
.tf-external-asset-form__thumbnail {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}
.tf-external-asset-form__thumbnail input[type="file"] {
  width: 100%;
  padding: 12px 16px;
  border: 2px solid #dee2e6;
  border-radius: 8px;
  background-color: #FFFFFF;
  color: #333333;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.4;
  transition: all 0.2s ease-in-out;
  padding: 12px;
  cursor: pointer;
}
.tf-external-asset-form__thumbnail input[type="file"]::placeholder {
  color: #6c757d;
}
.tf-external-asset-form__thumbnail input[type="file"]:focus {
  outline: none;
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.1);
}
.tf-external-asset-form__thumbnail input[type="file"]:disabled {
  background-color: #F1F1F1;
  color: #6c757d;
  cursor: not-allowed;
}
.tf-external-asset-form__thumbnail input[type="file"]::-webkit-file-upload-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  margin: 0;
  border: 2px solid transparent;
  border-radius: 8px;
  background: none;
  color: #333333;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  transition: all 0.2s ease-in-out;
  user-select: none;
  white-space: nowrap;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #FCB434;
  border-color: #FCB434;
  color: #000000;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  margin-right: 12px;
  cursor: pointer;
}
@media (max-width: 768px) {
  .tf-external-asset-form__thumbnail input[type="file"]::-webkit-file-upload-button {
    padding: 16px 24px;
    font-size: 16px;
    min-height: 48px;
  }
}
.tf-external-asset-form__thumbnail input[type="file"]::-webkit-file-upload-button:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-external-asset-form__thumbnail input[type="file"]::-webkit-file-upload-button:focus-visible {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-external-asset-form__thumbnail input[type="file"]::-webkit-file-upload-button:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.tf-external-asset-form__thumbnail input[type="file"]::-webkit-file-upload-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}
.tf-external-asset-form__thumbnail input[type="file"]::-webkit-file-upload-button:hover:not(:disabled) {
  background-color: #f9a104;
  border-color: #f9a104;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.tf-external-asset-form__thumbnail input[type="file"]::-webkit-file-upload-button:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-external-asset-form__thumbnail input[type="file"]::-ms-browse {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  margin: 0;
  border: 2px solid transparent;
  border-radius: 8px;
  background: none;
  color: #333333;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  transition: all 0.2s ease-in-out;
  user-select: none;
  white-space: nowrap;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #FCB434;
  border-color: #FCB434;
  color: #000000;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
}
@media (max-width: 768px) {
  .tf-external-asset-form__thumbnail input[type="file"]::-ms-browse {
    padding: 16px 24px;
    font-size: 16px;
    min-height: 48px;
  }
}
.tf-external-asset-form__thumbnail input[type="file"]::-ms-browse:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-external-asset-form__thumbnail input[type="file"]::-ms-browse:focus-visible {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-external-asset-form__thumbnail input[type="file"]::-ms-browse:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.tf-external-asset-form__thumbnail input[type="file"]::-ms-browse:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}
.tf-external-asset-form__thumbnail input[type="file"]::-ms-browse:hover:not(:disabled) {
  background-color: #f9a104;
  border-color: #f9a104;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.tf-external-asset-form__thumbnail input[type="file"]::-ms-browse:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-external-asset-form__thumbnail input[type="file"]::file-selector-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  margin: 0;
  border: 2px solid transparent;
  border-radius: 8px;
  background: none;
  color: #333333;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  transition: all 0.2s ease-in-out;
  user-select: none;
  white-space: nowrap;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #FCB434;
  border-color: #FCB434;
  color: #000000;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  margin-right: 12px;
  cursor: pointer;
}
@media (max-width: 768px) {
  .tf-external-asset-form__thumbnail input[type="file"]::file-selector-button {
    padding: 16px 24px;
    font-size: 16px;
    min-height: 48px;
  }
}
.tf-external-asset-form__thumbnail input[type="file"]::file-selector-button:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-external-asset-form__thumbnail input[type="file"]::file-selector-button:focus-visible {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(252, 180, 52, 0.2);
}
.tf-external-asset-form__thumbnail input[type="file"]::file-selector-button:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.tf-external-asset-form__thumbnail input[type="file"]::file-selector-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}
.tf-external-asset-form__thumbnail input[type="file"]::file-selector-button:hover:not(:disabled) {
  background-color: #f9a104;
  border-color: #f9a104;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.tf-external-asset-form__thumbnail input[type="file"]::file-selector-button:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tf-external-asset-form__thumbnail input[type="file"]:focus {
  border-color: #FCB434;
  box-shadow: 0 0 0 3px rgba(252, 180, 52, 0.2);
}
.tf-external-asset-form__label {
  font-weight: bold;
  color: #333333;
  font-size: 14px;
  margin-bottom: 8px;
  display: block;
}
.tf-external-asset-form__label.required::after {
  content: ' *';
  color: #E53935;
}
.tf-external-asset-form__label .tf-required {
  color: #E53935;
  margin-left: 2px;
}
.tf-external-asset-form__file-name {
  font-size: 14px;
  color: #5cb85c;
  margin: 8px 0 0 0;
  padding: 8px 12px;
  background-color: #ffffff;
  border: 1px solid #d8eed8;
  border-radius: 4px;
  display: flex;
  align-items: center;
}
.tf-external-asset-form__file-name::before {
  content: '?';
  margin-right: 8px;
  font-weight: bold;
  color: #5cb85c;
}
@media (max-width: 768px) {
  .tf-external-asset-form {
    padding: 16px;
  }
  .tf-external-asset-form__title {
    font-size: 16px;
  }
  .tf-external-asset-form__description {
    font-size: 13px;
    padding: 8px 12px;
  }
  .tf-external-asset-form__thumbnail input[type="file"] {
    font-size: 14px;
    padding: 8px;
  }
  .tf-external-asset-form__thumbnail input[type="file"]::-webkit-file-upload-button,
  .tf-external-asset-form__thumbnail input[type="file"]::-ms-browse,
  .tf-external-asset-form__thumbnail input[type="file"]::file-selector-button {
    padding: 6px 12px;
    font-size: 13px;
  }
}
.tf-project-editor {
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 24px;
  min-height: 100vh;
  background-color: #FFFFFF;
  margin-top: 140px;
  display: flex;
  flex-direction: column;
}
.tf-project-editor--centered {
  margin-left: auto !important;
  margin-right: auto !important;
}
.tf-project-editor--padded {
  padding-left: 24px !important;
  padding-right: 24px !important;
}
@media (max-width: 768px) {
  .tf-project-editor--padded {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}
.tf-project-editor:not(.tf-container--padded) {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.tf-project-editor:not(.tf-container--centered) {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.tf-project-editor--small {
  max-width: 640px;
}
@media (max-width: 640px) {
  .tf-project-editor--small {
    max-width: 100%;
  }
}
.tf-project-editor--default {
  max-width: 1600px;
}
@media (max-width: 1600px) {
  .tf-project-editor--default {
    max-width: 100%;
  }
}
.tf-project-editor--large {
  max-width: 1400px;
}
@media (max-width: 1400px) {
  .tf-project-editor--large {
    max-width: 100%;
  }
}
.tf-project-editor--xl {
  max-width: 1800px;
}
@media (max-width: 1800px) {
  .tf-project-editor--xl {
    max-width: 100%;
  }
}
.tf-project-editor--fluid {
  max-width: none;
  width: 100%;
}
@media (max-width: 992px) {
  .tf-project-editor--padded {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media (max-width: 768px) {
  .tf-project-editor--padded {
    padding-left: 16px;
    padding-right: 16px;
  }
}
.tf-project-editor--fluid {
  max-width: none;
}
.tf-project-editor--narrow {
  max-width: 800px;
}
.tf-project-editor--wide {
  max-width: 1800px;
}
.tf-project-editor__header {
  text-align: center;
  padding: 32px 0 24px 0;
}
.tf-project-editor__header-title {
  font-size: 28px;
  font-weight: 400;
  color: #333333;
  margin: 0;
  font-family: 'Avenir', Arial, sans-serif;
}
@media (max-width: 992px) {
  .tf-project-editor__header-title {
    font-size: 24px;
  }
}
@media (max-width: 768px) {
  .tf-project-editor__header-title {
    font-size: 20px;
  }
}
@media (max-width: 768px) {
  .tf-project-editor__header {
    padding: 16px 8px 16px 8px;
  }
}
.tf-project-editor__content {
  padding: 0 24px 48px 24px;
  max-width: 1400px;
  margin: 0 auto;
  flex: 1;
  width: 100%;
}
@media (max-width: 992px) {
  .tf-project-editor__content {
    padding: 0 16px 32px 16px;
  }
}
@media (max-width: 768px) {
  .tf-project-editor__content {
    padding: 0 8px 24px 8px;
  }
}
.tf-project-editor__stage {
  margin-top: 32px;
}
@media (max-width: 768px) {
  .tf-project-editor__stage {
    margin-top: 16px;
  }
}
@media (max-width: 768px) {
  .tf-project-editor {
    margin-top: 80px;
  }
}
.tf-project-editor__stage--asset__header {
  margin-bottom: 32px;
  text-align: center;
}
.tf-project-editor__stage--asset__title {
  font-size: 28px;
  font-weight: 600;
  color: #333333;
  margin: 0 0 16px 0;
  line-height: 1.3;
}
.tf-project-editor__stage--asset__description {
  font-size: 16px;
  color: #6c757d;
  margin: 0 0 32px 0;
  line-height: 1.5;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}
.tf-project-editor__stage--asset .tf-content-editor {
  margin-top: 16px;
}
@media (max-width: 768px) {
  .tf-project-editor__stage--asset__title {
    font-size: 24px;
  }
  .tf-project-editor__stage--asset__description {
    font-size: 15px;
    padding: 0 8px;
  }
}
.tf-asset-edit-panel {
  background-color: #F5F5F5;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  padding: 24px;
}
.tf-asset-edit-panel__header {
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid #dee2e6;
}
.tf-asset-edit-panel__title {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.tf-asset-edit-panel__type {
  display: inline-flex;
  align-items: center;
  background-color: #303030;
  color: #FFFFFF;
  padding: 6px 12px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  flex-shrink: 0;
}
.tf-asset-edit-panel__name {
  font-size: 20px;
  font-weight: 600;
  color: #333333;
  margin: 0;
  line-height: 1.3;
  flex: 1;
  min-width: 0;
}
.tf-asset-edit-panel__controls {
  flex-shrink: 0;
  margin-left: auto;
}
.tf-asset-edit-panel__content {
  display: grid;
  grid-template-columns: 350px 1fr;
  gap: 32px;
  align-items: flex-start;
}
@media (max-width: 768px) {
  .tf-asset-edit-panel__content {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}
.tf-asset-edit-panel__form {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.tf-gallery-stage__header {
  margin-bottom: 32px;
  text-align: center;
}
.tf-gallery-stage__title {
  font-size: 28px;
  font-weight: 600;
  color: #333333;
  margin: 0 0 16px 0;
  line-height: 1.3;
}
.tf-gallery-stage__description {
  font-size: 16px;
  color: #6c757d;
  margin: 0;
  line-height: 1.5;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 768px) {
  .tf-gallery-stage__title {
    font-size: 24px;
  }
  .tf-gallery-stage__description {
    font-size: 15px;
    padding: 0 8px;
  }
}
.tf-info-stage__header {
  margin-bottom: 32px;
  text-align: center;
}
.tf-info-stage__title {
  font-size: 28px;
  font-weight: 600;
  color: #333333;
  margin: 0 0 16px 0;
  line-height: 1.3;
}
.tf-info-stage__description {
  font-size: 16px;
  color: #6c757d;
  margin: 0;
  line-height: 1.5;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}
.tf-info-stage__form {
  margin: 0 auto;
}
@media (max-width: 768px) {
  .tf-info-stage__title {
    font-size: 24px;
  }
  .tf-info-stage__description {
    font-size: 15px;
    padding: 0 8px;
  }
  .tf-info-stage__form {
    padding: 0 8px;
  }
}
@media (max-width: 1200px) {
  .tf-info-stage__form {
    max-width: 700px;
  }
}
.tf-project-editor__stage--publish {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  padding: 32px 0;
  text-align: center;
}
.tf-project-editor__stage--publish .tf-publish-stage {
  width: 100%;
}
.tf-project-editor__stage--publish .tf-publish-stage__status {
  margin-bottom: 32px;
  padding: 24px;
  background: linear-gradient(135deg, #F5F5F5 0%, #fafafa 100%);
  border-radius: 8px;
  border: 1px solid #dee2e6;
  color: #333333;
  font-size: 16px;
  line-height: 1.4;
  position: relative;
}
.tf-project-editor__stage--publish .tf-publish-stage__status::before {
  content: '📋';
  font-size: 24px;
  display: block;
  margin-bottom: 8px;
}
.tf-project-editor__stage--publish .tf-publish-stage__actions {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
}
.tf-project-editor__stage--publish .tf-publish-stage__action-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 24px;
  background-color: #FFFFFF;
  border-radius: 8px;
  border: 1px solid #dee2e6;
  width: 100%;
  transition: transform 0.2s ease-in-out;
}
.tf-project-editor__stage--publish .tf-publish-stage__action-group .tf-button {
  min-width: 200px;
  padding: 16px 32px;
  font-size: 16px;
  font-weight: 600;
}
.tf-project-editor__stage--publish .tf-publish-stage__action-group .tf-button--primary {
  background-color: #FCB434;
  border-color: #FCB434;
  color: #000000;
}
.tf-project-editor__stage--publish .tf-publish-stage__action-group .tf-button--primary:hover {
  background-color: #fba50c;
  border-color: #fba50c;
}
.tf-project-editor__stage--publish .tf-publish-stage__action-group .tf-button--secondary {
  background-color: #F1F1F1;
  border-color: #E6E6E6;
  color: #333333;
}
.tf-project-editor__stage--publish .tf-publish-stage__action-group .tf-button--secondary:hover {
  background-color: #E6E6E6;
  border-color: #828282;
}
.tf-project-editor__stage--publish .tf-publish-stage__action-group-description {
  max-width: 400px;
  color: #6c757d;
  font-size: 14px;
  line-height: 1.5;
  margin: 8px 0 0 0;
}
@media (max-width: 768px) {
  .tf-project-editor__stage--publish .tf-publish-stage {
    padding: 16px;
  }
  .tf-project-editor__stage--publish .tf-publish-stage__actions {
    gap: 24px;
  }
  .tf-project-editor__stage--publish .tf-publish-stage__action-group {
    gap: 12px;
  }
  .tf-project-editor__stage--publish .tf-publish-stage__action-group .tf-button {
    min-width: 180px;
    padding: 12px 24px;
    font-size: 15px;
  }
  .tf-project-editor__stage--publish .tf-publish-stage__action-group-description {
    font-size: 13px;
  }
}
.tf-project-editor .tf-text-input__error,
.tf-project-editor .tf-multiline-input__error {
  margin-top: 4px;
}
.tf-project-editor .tf-text-input__error .tf-help-block,
.tf-project-editor .tf-multiline-input__error .tf-help-block {
  font-size: 14px;
  line-height: 1.3;
}
.tf-project-editor .tf-text-input--required .tf-text-input__label,
.tf-project-editor .tf-multiline-input--required .tf-text-input__label,
.tf-project-editor .tf-text-input--required .tf-multiline-input__label,
.tf-project-editor .tf-multiline-input--required .tf-multiline-input__label {
  position: relative;
}
.tf-project-editor .tf-text-input--required .tf-text-input__label::after,
.tf-project-editor .tf-multiline-input--required .tf-text-input__label::after,
.tf-project-editor .tf-text-input--required .tf-multiline-input__label::after,
.tf-project-editor .tf-multiline-input--required .tf-multiline-input__label::after {
  content: ' *';
  color: #E53935;
  font-weight: 600;
  margin-left: 2px;
}
.tf-project-editor .tf-text-input__help,
.tf-project-editor .tf-multiline-input__help {
  font-size: 13px;
  color: #6c757d;
  line-height: 1.4;
  margin-top: 4px;
  padding-left: 4px;
  border-left: 2px solid #E6E6E6;
}
.tf-project-editor .tf-content-editor {
  border: 1px solid #dee2e6;
  border-radius: 8px;
  background-color: #FFFFFF;
}
.tf-project-editor .tf-content-editor__toolbar {
  background-color: #F5F5F5;
  padding: 12px;
  border-bottom: 1px solid #dee2e6;
  border-radius: 8px 8px 0 0;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.tf-project-editor .tf-content-editor__content {
  padding: 24px;
  min-height: 200px;
}
@media (max-width: 768px) {
  .tf-project-editor .tf-content-editor__toolbar {
    padding: 8px;
    gap: 4px;
  }
  .tf-project-editor .tf-content-editor__content {
    padding: 16px;
    min-height: 150px;
  }
}
.tf-project-editor .tf-tag-section__label {
  color: #333333;
  font-weight: 500;
  margin-bottom: 8px;
}
.tf-project-editor .tf-tag-section__container:empty::after {
  color: #6c757d;
  font-style: italic;
  padding: 8px 0;
}
@media (max-width: 768px) {
  .tf-project-editor .tf-tag-section {
    padding: 12px;
  }
}
.tf-content-node-controls {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.tf-content-node-controls__button--delete {
  color: #333333;
}
.tf-content-node-controls__button--delete:hover,
.tf-content-node-controls__button--delete:focus {
  background-color: rgba(229, 57, 53, 0.1);
  color: #E53935;
  border-color: rgba(229, 57, 53, 0.2);
}
@media (max-width: 768px) {
  .tf-content-node-controls {
    gap: 4px;
  }
  .tf-content-node-controls__button {
    font-size: 14px;
    padding: 8px 12px;
  }
}
@media (max-width: 768px) {
  .tf-project-editor {
    margin-top: 80px;
  }
  .tf-project-editor__header {
    padding: 16px 0;
  }
  .tf-project-editor__header-title {
    font-size: 24px;
  }
  .tf-project-editor__content {
    padding: 0 16px 32px 16px;
  }
  .tf-project-editor__stage {
    margin-top: 16px;
  }
}
@media (max-width: 1200px) {
  .tf-project-editor {
    margin-top: 100px;
  }
  .tf-project-editor__content {
    padding: 0 16px 40px 16px;
  }
  .tf-project-editor__header-title {
    font-size: 26px;
  }
}
.tf-notification-bell {
  position: relative;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  color: #333;
  transition: color 0.2s ease;
}
.tf-notification-bell:hover {
  color: #FCB434;
}
.tf-notification-bell__badge {
  position: absolute;
  top: 4px;
  right: 4px;
  background: #E53935;
  color: #FFFFFF;
  font-size: 10px;
  font-weight: 600;
  padding: 2px 5px;
  border-radius: 10px;
  min-width: 18px;
  text-align: center;
}
.tf-notification-list {
  background: #FFFFFF;
  border-radius: 8px;
}
.tf-notification-list--compact {
  max-height: 400px;
  overflow-y: auto;
}
.tf-notification-list__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px;
  border-bottom: 1px solid #dee2e6;
}
.tf-notification-list__header h2 {
  margin: 0;
  font-size: 20px;
}
.tf-notification-list__filters {
  display: flex;
  gap: 8px;
  padding: 8px 16px;
  border-bottom: 1px solid #dee2e6;
}
.tf-notification-list__filters button {
  background: none;
  border: none;
  padding: 8px 8px;
  cursor: pointer;
  color: #6c757d;
  font-size: 14px;
  border-radius: 4px;
  transition: all 0.2s ease;
}
.tf-notification-list__filters button:hover {
  background: #F5F5F5;
  color: #333;
}
.tf-notification-list__filters button.active {
  background: #fee2b2;
  color: #FCB434;
  font-weight: 600;
}
.tf-notification-list__footer {
  padding: 16px;
  text-align: center;
  border-top: 1px solid #dee2e6;
}
.tf-notification-list__error {
  padding: 24px;
  text-align: center;
  color: #E53935;
}
.tf-notification-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 16px;
  border-bottom: 1px solid #dee2e6;
  transition: background 0.2s ease;
  position: relative;
}
.tf-notification-item:hover {
  background: #F5F5F5;
}
.tf-notification-item--unread {
  background: #fff5e4;
}
.tf-notification-item--unread::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: #FCB434;
}
.tf-notification-item--read {
  opacity: 0.7;
}
.tf-notification-item__icon {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  background: #E6E6E6;
}
.tf-notification-item__icon svg {
  width: 18px;
  height: 18px;
}
.tf-notification-item--category-moderation .tf-notification-item__icon {
  background: #fee2b2;
  color: #FCB434;
}
.tf-notification-item--category-social .tf-notification-item__icon {
  background: #c7e6c7;
  color: #5cb85c;
}
.tf-notification-item--category-achievement .tf-notification-item__icon {
  background: #fee2b2;
  color: #FCB434;
}
.tf-notification-item--category-system .tf-notification-item__icon {
  background: #c2c2c2;
  color: #828282;
}
.tf-notification-item__content {
  flex: 1;
  min-width: 0;
}
.tf-notification-item__title {
  margin: 0 0 8px 0;
  font-size: 16px;
  font-weight: 600;
  color: #333;
}
.tf-notification-item__message {
  margin: 0 0 8px 0;
  font-size: 14px;
  color: #6c757d;
  line-height: 1.4;
}
.tf-notification-item__time {
  font-size: 12px;
  color: #828282;
}
.tf-notification-item__dismiss {
  flex-shrink: 0;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  color: #828282;
  opacity: 1;
  transition: all 0.2s ease;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
}
.tf-notification-item__dismiss svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  stroke-width: 2;
}
.tf-notification-item__dismiss:hover {
  color: #000000;
  background: #F1F1F1;
}
.tf-notification-item__dismiss:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  color: #000000;
}
.tf-notification-item__dismiss:focus-visible {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
}
.tf-notification-item__link {
  text-decoration: none;
  color: inherit;
  display: block;
}
.tf-notification-banner {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px;
  border-radius: 8px;
}
.tf-notification-banner--success {
  background: #eaf6ea;
  border: 1px solid #c7e6c7;
  color: #3d8b3d;
}
.tf-notification-banner--error {
  background: #f9d4d3;
  border: 1px solid #f4a8a6;
  color: #b61b17;
}
.tf-notification-banner--info {
  background: #e8e8e8;
  border: 1px solid #cfcfcf;
  color: #424242;
}
.tf-notification-banner__icon {
  flex-shrink: 0;
  font-size: 24px;
}
.tf-notification-banner__content {
  flex: 1;
  min-width: 0;
}
.tf-notification-banner__title {
  margin: 0 0 8px 0;
  font-size: 16px;
  font-weight: 600;
}
.tf-notification-banner__message {
  margin: 0;
  font-size: 14px;
}
.tf-notification-banner__close {
  flex-shrink: 0;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  color: #828282;
  opacity: 1;
  transition: all 0.2s ease;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
}
.tf-notification-banner__close svg {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  stroke-width: 2;
}
.tf-notification-banner__close:hover {
  color: #000000;
  background: rgba(0, 0, 0, 0.05);
  opacity: 1;
}
.tf-notification-banner__close:focus {
  outline: 2px solid #FCB434;
  outline-offset: 2px;
  color: #000000;
}
.foundryNav__local {
  display: none;
  background-color: #e6e6e6;
}
.foundryNav__navbar__tertiary__dropdown {
  display: none;
  position: absolute;
  top: -8px;
  left: 85%;
  padding: 0.5em;
  background: white;
  z-index: 101;
  width: 180px;
  -webkit-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.3);
}
.foundryNav__navbar__tertiary__dropdown:hover {
  display: block;
}
@media screen and (max-width: 1279px) and (min-width: 1024px), screen and (max-width: 1023px) and (min-width: 768px), screen and (max-width: 767px) {
  .foundryNav__navbar__tertiary__dropdown {
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100vh - 5rem);
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    transform: translateX(-100vw);
    -webkit-transform: translateX(-100vw);
    transition: transform 0.1s ease;
    -webkit-transition: transform 0.1s ease;
  }
  .foundryNav__navbar__tertiary__dropdown.open {
    transform: translateX(0vw);
    -webkit-transform: translateX(0vw);
  }
}
@keyframes delay-overflow {
  from {
    overflow: hidden;
  }
}
.foundryNav__navbar div.foundryNav__navbar__icons div.nav-link-wrapper button.nav-link.nav-link--search.nav-link--icon {
  display: none !important;
}
.foundryNav__navbar button {
  padding: 0;
  border-radius: 0 !important;
}
.foundryNav__navbar a.nav-link--search--local {
  animation: fadeIn 0.3s;
}
.foundryNav__navbar a.nav-link--search--local::before {
  font-family: "FoundryProductsKit";
  content: "\f035";
  color: white;
  display: inline-block;
  -webkit-transition: 0.2s color;
  transition: 0.2s color;
}
.foundryNav__navbar a.nav-link--search--local:hover::before {
  color: #FCB434;
}
.foundryNav__navbar > .foundryNav__local__container.foundryNav__local__container__fixed {
  background-color: #e6e6e6;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local {
  display: block;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .nav-link--icon {
  font-size: 1.6rem;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown.open {
  overflow: visible;
  animation: 1.6s delay-overflow;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown.open.discuss {
  width: 170px;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown.open.my-community {
  width: 200px;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown.open.admin {
  width: 230px;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown.open.skillpaths {
  width: 350px;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown .foundryNav__dropdown-menu .subnav-link.product-icon {
  padding: 0.8em 1.35em 0.8em;
  font-weight: normal;
  font-size: inherit;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown .foundryNav__dropdown-menu .subnav-link.product-icon .nav-link__title i {
  font-size: 1.6rem;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown .foundryNav__dropdown-menu .subnav-link .nav-link__title.nav-link__text {
  font-size: 17px;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown .subnav-link-wrapper {
  position: relative;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown .subnav-link-wrapper > button {
  width: 100%;
  background-color: white;
  font-family: 'AvenirMedium', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
@media screen and (max-width: 1279px) and (min-width: 1024px), screen and (max-width: 1023px) and (min-width: 768px), screen and (max-width: 767px) {
  .foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown .subnav-link-wrapper {
    position: static;
  }
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown .subnav-link--with-children span::after {
  font-family: "FoundryProductsKit";
  content: "\f03a";
  display: inline-block;
  padding-left: 3px;
  vertical-align: middle;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown .subnav-link--with-children:hover + div.foundryNav__navbar__tertiary__dropdown {
  display: block;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local #asset-download-cart {
  display: inline-block;
  vertical-align: middle;
  margin-right: 16px;
  margin-top: 8px;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .avatar {
  width: 36px;
  height: 36px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
}
.foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .avatar img {
  width: 100%;
  height: auto;
}
@media screen and (max-width: 1279px) and (min-width: 1024px), screen and (max-width: 1023px) and (min-width: 768px), screen and (max-width: 767px) {
  .foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown.open.discuss {
    width: 100%;
  }
  .foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown.open.my-community {
    width: 100%;
  }
  .foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown.open.admin {
    width: 100%;
  }
  .foundryNav__navbar > .foundryNav__local__container > .foundryNav__local .foundryNav__navbar__secondary__dropdown.open.skillpaths {
    width: 100%;
  }
}
.navbar#navbar {
  position: fixed;
  width: 100%;
  top: 0;
  z-index: 101;
  border-color: #272727;
  transition: border 0.2s ease 0.3s;
}
.navbar#navbar.expanded {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.navbar#navbar.expanded:before {
  display: none;
}
.navbar#navbar.account-nav-visible {
  border-bottom: 1px solid #828282;
}
.navbar#subnav {
  position: fixed;
  width: 100%;
  top: 70px;
  height: 100%;
  margin-bottom: 100px;
  z-index: 100;
  pointer-events: none;
}
.navbar#subnav::-webkit-scrollbar {
  width: 0 !important;
}
.navbar#subnav a {
  pointer-events: all;
}
.navbar nav {
  padding: 0 30px;
}
.navbar nav.primary {
  background: transparent;
  padding-right: 20px;
  height: 70px;
  overflow: hidden;
  position: relative;
  -webkit-transition: height 200ms linear;
  -moz-transition: height 200ms linear;
  -ms-transition: height 200ms linear;
  -o-transition: height 200ms linear;
}
.navbar nav.primary.scroll {
  background: #272727;
  -webkit-box-shadow: 0 0 8px 0 rgba(0,0,0, .1), 0 0 4px 0 rgba(0,0,0,.2);
  -moz-box-shadow: 0 0 8px 0 rgba(0,0,0, .1), 0 0 4px 0 rgba(0,0,0,.2);
  box-shadow: 0 0 8px 0 rgba(0,0,0, .1), 0 0 4px 0 rgba(0,0,0,.2);
  -webkit-transition: background 450ms linear;
  -moz-transition: background 450ms linear;
  -ms-transition: background 450ms linear;
  -o-transition: background 450ms linear;
}
.navbar nav.primary.expanded {
  background: #272727;
}
.navbar nav.primary a {
  padding: 26px 0;
  text-transform: uppercase;
  color: #FFFFFF;
  display: inline-block;
  font-family: 'AvenirHeavy';
  font-size: 14px;
  line-height: 14px;
  letter-spacing: 0.26px;
  margin: 0 20px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border-top: 3px solid transparent;
}
.navbar nav.primary a.logo {
  display: block;
  text-indent: -9999px;
  width: 98px;
  height: 14px;
  background-image: url('/common/img/logos/foundry_logo.svg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 0;
  padding: 0;
  margin: 26px 0;
  float: left;
  border: none;
}
.navbar nav.primary a.icon {
  padding: 20px 0;
  vertical-align: top;
  margin: 0 10px;
  position: relative;
}
.navbar nav.primary a.icon:before,
.navbar nav.primary a.icon:after {
  content: none;
}
.navbar nav.primary a.icon .ic {
  display: block;
  text-indent: -9999px;
  width: 21px;
  height: 25px;
  background-image: url('/common/img/icons/nav_cart.svg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 100%;
}
.navbar nav.primary a.icon .ic.login {
  background-image: url('/common/img/icons/icon_account.svg');
}
.navbar nav.primary a.icon .ic.search {
  width: 24px;
  background-image: url('/common/img/icons/nav_search.svg');
}
.navbar nav.primary a.icon .avatar {
  width: 36px;
  height: 36px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  overflow: hidden;
  display: none;
}
.navbar nav.primary a.icon .avatar img {
  width: 100%;
  height: auto;
}
.navbar nav.primary a.icon .item-count {
  position: absolute;
  font-size: 14px;
  font-family: 'AvenirHeavy';
  color: #FFFFFF;
  top: 10px;
  left: 21px;
}
@media screen and (max-width: 1023px) and (min-width: 768px) {
  .navbar nav.primary a.icon.basket {
    display: none;
  }
}
.navbar nav.primary a:not(.logo).active {
  border-top-color: #FCB434;
  color: #FCB434;
}
.navbar nav.primary a:not(.logo).active.icon .ic {
  background-position: 50% 0;
}
.navbar nav.primary a:not(.logo).active.icon .item-count {
  color: #FCB434;
}
.navbar nav.primary a:not(.logo):hover:not(.active),
.navbar nav.primary a:not(.logo).selected:not(.active) {
  border-top-color: #828282;
}
.navbar nav.primary .right-align {
  float: right;
}
.navbar nav.primary-sub {
  width: 100%;
  height: auto;
  background: #272727;
  padding: 25px 0;
}
.navbar nav.primary-sub a {
  display: block;
  text-transform: uppercase;
  color: #FFFFFF;
  font-family: 'AvenirHeavy';
  font-size: 14px;
  letter-spacing: 0.26px;
  padding: 15px 20px;
}
.navbar nav.primary-sub:not(.special-sub) a.active {
  color: #FCB434;
}
.navbar nav.primary-sub:not(.special-sub) a:not(.active):hover {
  -webkit-opacity: 0.5;
  -moz-opacity: 0.5;
  opacity: 0.5;
}
.navbar nav.primary-sub.special-sub {
  padding: 0;
  position: relative;
  padding-bottom: 157px;
}
.navbar nav.primary-sub.special-sub.extend {
  min-height: 100%;
}
.navbar nav.primary-sub.special-sub a {
  position: relative;
  padding: 0;
}
.navbar nav.primary-sub.special-sub a .product-background {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-opacity: 0.1;
  -moz-opacity: 0.1;
  opacity: 0.1;
  -webkit-transition: opacity 200ms linear;
  -moz-transition: opacity 200ms linear;
  -ms-transition: opacity 200ms linear;
  -o-transition: opacity 200ms linear;
}
.navbar nav.primary-sub.special-sub a .product-wrapper {
  padding: 40px 30px;
  position: relative;
  border-left: 3px solid transparent;
  -webkit-transition: padding 200ms linear;
  -moz-transition: padding 200ms linear;
  -ms-transition: padding 200ms linear;
  -o-transition: padding 200ms linear;
}
.navbar nav.primary-sub.special-sub a .product-wrapper h3 {
  font-size: 24px;
  font-family: 'AvenirHeavy';
  line-height: 40px;
  display: inline-block;
}
.navbar nav.primary-sub.special-sub a .product-wrapper h3 img {
  height: 35px;
  width: auto;
  display: block;
}
.navbar nav.primary-sub.special-sub a .product-wrapper .caption {
  float: right;
  text-transform: none;
  font-family: 'AvenirLight';
  font-size: 16px;
  vertical-align: middle;
  display: inline-block;
  padding: 10px 0;
}
.navbar nav.primary-sub.special-sub a .product-wrapper .caption.new-release:after {
  content: 'new release';
  text-transform: uppercase;
  color: #FCB434;
  display: inline-block;
  margin-left: 10px;
  font-size: 12px;
  font-family: 'AvenirHeavy';
}
.navbar nav.primary-sub.special-sub a.active .product-wrapper {
  border-left-color: #FCB434;
}
.navbar nav.primary-sub.special-sub a:hover .product-background {
  -webkit-opacity: 0.6;
  -moz-opacity: 0.6;
  opacity: 0.6;
  -webkit-transition: opacity 200ms linear;
  -moz-transition: opacity 200ms linear;
  -ms-transition: opacity 200ms linear;
  -o-transition: opacity 200ms linear;
}
.navbar nav.primary-sub.special-sub a:hover .product-wrapper {
  padding: 60px 30px;
  -webkit-transition: padding 200ms linear;
  -moz-transition: padding 200ms linear;
  -ms-transition: padding 200ms linear;
  -o-transition: padding 200ms linear;
}
.navbar nav.primary-sub.special-sub .plugins {
  position: fixed;
  bottom: 0;
  width: 100%;
  background: #303030;
  padding: 30px;
  pointer-events: all;
}
.navbar nav.primary-sub.special-sub .plugins a {
  float: right;
  -webkit-opacity: 0.6;
  -moz-opacity: 0.6;
  opacity: 0.6;
  margin-left: 50px;
  font-size: 17px;
  line-height: 28px;
}
.navbar nav.primary-sub.special-sub .plugins a img {
  display: block;
  height: 28px;
  width: auto;
}
.navbar nav.primary-sub.special-sub .plugins h4 {
  color: #FFFFFF;
  -webkit-opacity: 0.2;
  -moz-opacity: 0.2;
  opacity: 0.2;
  font-size: 20px;
  display: inline-block;
}
.navbar.logged-in nav.primary a.account {
  padding: 15px 0;
  width: 36px;
}
.navbar.logged-in nav.primary a.account .login {
  display: none;
}
.navbar.logged-in nav.primary a.account .avatar {
  display: block;
}
@media screen and (max-width: 767px) {
  .navbar {
    display: none;
  }
}
#mobileHeader {
  position: fixed;
  width: 100%;
  padding: 20px;
  display: none;
  z-index: 100;
  top: 0;
}
#mobileHeader.scroll {
  background: #272727;
  -webkit-box-shadow: 0 0 8px 0 rgba(0,0,0, .1), 0 0 4px 0 rgba(0,0,0,.2);
  -moz-box-shadow: 0 0 8px 0 rgba(0,0,0, .1), 0 0 4px 0 rgba(0,0,0,.2);
  box-shadow: 0 0 8px 0 rgba(0,0,0, .1), 0 0 4px 0 rgba(0,0,0,.2);
  -webkit-transition: background 450ms linear;
  -moz-transition: background 450ms linear;
  -ms-transition: background 450ms linear;
  -o-transition: background 450ms linear;
}
#mobileHeader h1 {
  display: inline-block;
  vertical-align: middle;
}
#mobileHeader h1 a.logo-small {
  display: block;
  width: 31px;
  height: 31px;
  text-indent: -9999px;
  background: url('/common/img/logos/foundry_logo_small.svg') no-repeat;
  background-size: cover;
  background-position: 50% 0;
}
#mobileHeader h2 {
  display: inline-block;
  width: calc(100% - 65px);
  text-align: center;
  padding: 0 20px;
  vertical-align: middle;
  font-family: 'AvenirHeavy';
  font-size: 16px;
  color: #FFFFFF;
  letter-spacing: 0.34px;
  text-transform: uppercase;
}
#mobileHeader h2 img {
  display: block;
  margin: 0 auto;
  height: 30px;
  width: auto;
}
#mobileHeader a.menu-open {
  display: inline-block;
  width: 24px;
  height: 17px;
  background: url('/common/img/icons/mobile_menu.svg') no-repeat;
  background-size: cover;
  background-position: 50% 100%;
  text-indent: -9999px;
  vertical-align: middle;
}
@media screen and (max-width: 767px) {
  #mobileHeader {
    display: block;
    -webkit-transition: height 200ms linear;
    -moz-transition: height 200ms linear;
    -ms-transition: height 200ms linear;
    -o-transition: height 200ms linear;
  }
}
#mobileMenu {
  display: none;
  width: 100%;
  height: 100%;
  min-height: 100%;
  position: absolute;
  top: 0;
  left: -100%;
  background: #272727;
  -webkit-transition: left 300ms cubic-bezier(0.25, 0.1, 0.25, 1);
  -moz-transition: left 300ms cubic-bezier(0.25, 0.1, 0.25, 1);
  -ms-transition: left 300ms cubic-bezier(0.25, 0.1, 0.25, 1);
  -o-transition: left 300ms cubic-bezier(0.25, 0.1, 0.25, 1);
  z-index: 102;
}
#mobileMenu.open {
  left: 0;
  -webkit-transition: left 300ms cubic-bezier(0.25, 0.1, 0.25, 1);
  -moz-transition: left 300ms cubic-bezier(0.25, 0.1, 0.25, 1);
  -ms-transition: left 300ms cubic-bezier(0.25, 0.1, 0.25, 1);
  -o-transition: left 300ms cubic-bezier(0.25, 0.1, 0.25, 1);
}
#mobileMenu nav.menu {
  width: 100%;
  position: absolute;
  top: 82px;
  height: calc(100% - 224px);
  padding-bottom: 0;
  overflow-y: scroll;
}
#mobileMenu nav.menu::-webkit-scrollbar {
  width: 0 !important;
}
#mobileMenu a {
  color: #FFFFFF;
  text-transform: uppercase;
  font-size: 14px;
  font-family: 'AvenirHeavy';
}
#mobileMenu a.active {
  color: #FCB434;
}
#mobileMenu a img {
  height: 22px;
  width: auto;
}
#mobileMenu h1 {
  padding: 25px 20px;
  position: absolute;
  top: 0;
  width: 100%;
  background: #272727;
}
#mobileMenu h1 a.logo {
  display: inline-block;
  text-indent: -9999px;
  width: 98px;
  height: 14px;
  background-image: url('/common/img/logos/foundry_logo.svg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 0;
  padding: 0;
  border: none;
  vertical-align: middle;
}
#mobileMenu h1 a.close {
  float: right;
  text-indent: -9999px;
  width: 18px;
  height: 18px;
  overflow: hidden;
  background: url('/common/img/icons/mobile_nav_close.svg') no-repeat;
  background-size: cover;
  background-position: 50% 100%;
}
#mobileMenu h2 {
  font-size: 16px;
  font-family: 'AvenirHeavy';
  letter-spacing: 0.34px;
  padding: 16px 20px;
}
#mobileMenu ul {
  padding-bottom: 15px;
}
#mobileMenu ul.deselect-others li a:not(.active) {
  -webkit-opacity: 0.5;
  -moz-opacity: 0.5;
  opacity: 0.5;
}
#mobileMenu ul li {
  padding: 5px 0;
}
#mobileMenu ul li a {
  display: block;
  padding: 10px 40px;
  border-left: 3px solid transparent;
}
#mobileMenu ul li a.active {
  border-left-color: #FCB434;
  color: #FFFFFF;
}
#mobileMenu footer {
  position: absolute;
  bottom: 0;
  background-color: #272727;
  width: 100%;
}
#mobileMenu footer a {
  display: block;
  padding: 20px;
}
#mobileMenu footer a.search:before {
  content: '';
  display: inline-block;
  width: 24px;
  height: 25px;
  background: url('/common/img/icons/nav_search.svg') no-repeat;
  background-size: cover;
  background-position: 50% 100%;
}
#mobileMenu footer a.user {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
#mobileMenu footer a.user:before {
  content: '';
  display: inline-block;
  width: 21px;
  height: 25px;
  background: url('/common/img/icons/icon_account.svg') no-repeat;
  background-size: cover;
  background-position: 50% 100%;
}
#mobileMenu footer a .user-info {
  display: none;
  font-size: 16px;
  text-transform: none;
}
#mobileMenu footer a .user-info .user-name {
  vertical-align: middle;
}
#mobileMenu footer a .avatar {
  width: 36px;
  height: 36px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  overflow: hidden;
  display: inline-block;
  margin-right: 12px;
  vertical-align: middle;
}
#mobileMenu footer a .avatar img {
  width: 100%;
  height: auto;
}
#mobileMenu.logged-in footer a.user:before {
  display: none;
}
#mobileMenu.logged-in footer a .user-info {
  display: inline-block;
}
@media screen and (max-width: 767px) {
  #mobileMenu {
    display: block;
  }
}
#account {
  position: fixed;
  top: 0;
  background: #272727;
  width: 100%;
  display: block;
  z-index: 50;
  padding: 90px 30px 30px 30px;
  text-align: right;
  text-transform: uppercase;
  transition: transform 0.2s ease;
  transform: translateY(-100%);
}
#account.in-view {
  display: block;
  transform: translateY(0);
}
#account a {
  font-family: 'AvenirHeavy';
  font-size: 13px;
  color: #fff;
}
#account a.sign-out {
  color: #828282;
}
#globalFooter {
  padding: 40px 30px 54px;
  background: #272727;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
}
#globalFooter .top {
  margin-bottom: 35px;
}
#globalFooter .top .logo {
  display: inline-block;
  text-indent: -9999px;
  width: 36px;
  height: 36px;
  background: url('/common/img/logos/foundry_logo_small.svg') no-repeat;
  background-size: cover;
  background-position: 50% 100%;
  -webkit-opacity: 0.3;
  -moz-opacity: 0.3;
  opacity: 0.3;
  vertical-align: middle;
  margin-right: 40px;
}
#globalFooter .top .credits {
  vertical-align: middle;
}
#globalFooter .social {
  float: right;
}
#globalFooter .social a {
  padding: 8px 13px;
  display: inline-block;
  color: rgba(255, 255, 255, 0);
}
#globalFooter .social a span {
  display: block;
  height: 24px;
  text-indent: -9999px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 100%;
  -webkit-opacity: 0.5;
  -moz-opacity: 0.5;
  opacity: 0.5;
}
#globalFooter .social a span.facebook {
  width: 13px;
  background-image: url('/common/img/icons/social/facebook.svg');
}
#globalFooter .social a span.x {
  width: 24px;
  background-image: url('/common/img/icons/social/x2.svg');
}
#globalFooter .social a span.twitter {
  width: 24px;
  background-image: url('/common/img/icons/social/twitter.svg');
}
#globalFooter .social a span.youtube {
  width: 30px;
  background-image: url('/common/img/icons/social/youtube.svg');
}
#globalFooter .social a span.vimeo {
  width: 25px;
  background-image: url('/common/img/icons/social/vimeo.svg');
}
#globalFooter .social a span.google {
  width: 35px;
  background-image: url('/common/img/icons/social/google.svg');
}
#globalFooter .social a span.linkedin {
  width: 24px;
  background-image: url('/common/img/icons/social/linkedin.svg');
}
#globalFooter .social a:last-child {
  padding-right: 0;
}
#globalFooter .footer-nav {
  display: inline-block;
  vertical-align: top;
  margin-right: 100px;
}
#globalFooter .footer-nav:last-child {
  margin-right: 0;
}
#globalFooter .footer-nav h4 {
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.75);
  font-family: 'AvenirHeavy', Arial, sans-serif;
  line-height: 30px;
}
#globalFooter .footer-nav a {
  display: block;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
  line-height: 30px;
}
#globalFooter .footer-nav a.location span {
  vertical-align: top;
}
#globalFooter .footer-nav a.location:before {
  content: '';
  display: inline-block;
  vertical-align: top;
  margin-right: 10px;
  width: 12px;
  height: 12px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  background: rgba(255, 255, 255, 0.5);
  margin-top: 8px;
}
@media screen and (max-width: 767px) {
  #globalFooter {
    padding: 40px 20px;
  }
  #globalFooter .top .logo,
  #globalFooter .top .credits,
  #globalFooter .top .social {
    display: block;
  }
  #globalFooter .top .credits {
    margin: 35px 0;
  }
  #globalFooter .top .social {
    float: none;
  }
  #globalFooter .top .social a {
    padding: 8px;
  }
  #globalFooter .top .social a:first-child {
    padding-left: 0;
  }
  #globalFooter .footer-nav {
    margin-bottom: 40px;
  }
  #globalFooter .footer-nav:last-child {
    margin-bottom: 0;
  }
}
.forum #globalFooter {
  margin-top: 0;
}
.search-control {
  position: relative;
}
.search-control input {
  width: 100%;
  border-bottom: 2px solid rgba(255, 255, 255, 0.5);
  margin-top: 30px;
  font-size: 38px;
  line-height: 45px;
  position: relative;
  background-color: transparent;
  color: white;
  display: block;
  padding: 10px 0 10px 20px;
  font-family: 'AvenirLight', Arial, sans-serif;
}
.search-control input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.4);
}
.search-control input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.4);
}
.search-control input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.4);
}
.search-control input:hover:not(:focus) {
  border-bottom-color: rgba(255, 255, 255, 0.3);
}
.search-control input:focus {
  border-bottom-color: #FCB434;
}
.search-control .search-cta {
  position: absolute;
  top: 40px;
  right: 0;
  color: #FFFFFF;
}
.search-control .search-cta .hint {
  color: rgba(255, 255, 255, 0.5);
  font-size: 12px;
  line-height: 16px;
  padding-right: 5px;
}
.search-control .search-cta .hint .key {
  padding: 3px 2px 0;
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.5);
}
.search-control .search-cta .search-submit {
  color: #FCB434;
  display: block;
  font-size: 20px;
  display: inline-block;
}
.search-control .search-cta .search-submit:after {
  content: '';
  display: inline-block;
  margin-left: 12px;
  width: 18px;
  height: 19px;
  background: url('/common/img/icons/cta_arrow.svg') no-repeat;
  background-size: cover;
  background-position: 50% 0%;
  vertical-align: text-bottom;
}
.search-control div.search-submit {
  padding: 20px;
  text-align: center;
}
.search-control div.search-submit a {
  color: #FCB434;
  display: block;
  font-size: 20px;
  display: inline-block;
}
.search-control div.search-submit a:after {
  content: '';
  display: inline-block;
  margin-left: 12px;
  width: 18px;
  height: 19px;
  background: url('/common/img/icons/cta_arrow.svg') no-repeat;
  background-size: cover;
  background-position: 50% 0%;
  vertical-align: text-bottom;
}
@media screen and (max-width: 1279px) and (min-width: 1024px), screen and (max-width: 1023px) and (min-width: 768px), screen and (max-width: 767px) {
  .search-control .search-cta .hint {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .search-control .search-cta {
    position: relative;
    text-align: center;
    top: 0;
    margin-top: 15px;
    margin-bottom: 15px;
  }
  .search-control .search-cta .hint {
    display: none;
  }
}
.no-search-results {
  width: 100%;
  padding: 40px;
  text-align: center;
  font-size: 20px;
  font-family: 'AvenirLight', Arial, sans-serif;
}
.no-search-results p {
  margin-bottom: 20px;
}
.no-search-results a:hover {
  text-decoration: underline;
}
.search-x {
  max-width: 1440px;
  margin: 10px auto;
  display: flex;
}
.search-x .search-filters {
  margin-right: 20px;
  min-width: 325px;
}
.search-x .search-filters h5 {
  color: #272727;
  text-transform: capitalize;
}
.search-x .search-filters .doctype-filter {
  margin-bottom: 20px;
}
.search-x .search-filters .doctype-filter li {
  margin-bottom: 10px;
}
.search-x .search-filters .doctype-filter li a,
.search-x .search-filters .doctype-filter li span {
  color: #272727;
  font-size: 14px;
  text-transform: uppercase;
  display: inline-block;
  border-bottom: 1px solid #E6E6E6;
  padding-bottom: 10px;
}
.search-x .search-filters .doctype-filter li a:hover {
  cursor: pointer;
  color: #FCB434;
}
.search-x .search-filters .doctype-filter li span {
  color: #828282;
}
.search-x .search-filters .doctype-filter li span.selected {
  color: #FCB434;
}
.search-x .search-filters .sort-filter {
  margin-bottom: 20px;
}
.search-x .search-filters .sort-filter select {
  font-size: 14px;
  font-family: 'AvenirLight', Arial, sans-serif;
  color: #272727;
  padding: 10px 0 10px;
}
.search-x .search-filters .multi-filter h5 a {
  margin-left: 10px;
  font-size: 12px;
  color: black;
  cursor: pointer;
}
.search-x .search-filters .multi-filter ul {
  margin-top: 10px;
}
.search-x .search-filters .multi-filter label {
  font-size: 14px;
  font-family: 'AvenirLight', Arial, sans-serif;
  color: #272727;
  margin-bottom: 8px;
}
.search-x .search-filters .multi-filter label input {
  display: inline;
  width: auto;
  margin-right: 5px;
}
.search-x .search-filters .multi-filter label + ul {
  margin-left: 15px;
}
.search-x .search-filters .multi-filter li {
  margin-bottom: 8px;
}
.search-x .search-results {
  width: 100%;
}
.search-x .search-results .search-results-container {
  margin-bottom: 40px;
}
.search-x .search-results .search-results-container > div {
  margin-bottom: 15px;
}
.search-x .search-results .search-results-container > div h5 {
  float: left;
  text-transform: uppercase;
}
.search-x .search-results .search-results-container > div a {
  float: right;
  cursor: pointer;
}
.search-x .search-results .search-results-container > div a:hover {
  text-decoration: underline;
}
.search-x .search-results .search-results-container ul.search-results-project,
.search-x .search-results .search-results-container ul.search-results-profile {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.search-x .search-results .search-results-container ul.search-results-profile > li {
  display: inline-block;
  width: 200px;
  text-align: center;
  margin-bottom: 20px;
}
.search-x .search-results .search-results-container ul.search-results-profile > li a.profile-image {
  display: inline-block;
  width: 150px;
  height: 150px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  margin-bottom: 10px;
}
.search-x .search-results .search-results-container ul.search-results-profile > li a.text-container {
  font-size: 14px;
}
.search-x .search-results .search-results-container ul.search-results-card > li {
  display: inline-block;
  width: calc(25% - 8px);
  padding: 0;
  margin-left: 4px;
  margin-right: 4px;
  margin-bottom: 8px;
  background: #272727;
  color: #FFFFFF;
  position: relative;
}
.search-x .search-results .search-results-container ul.search-results-card > li .card-image {
  width: 100%;
  max-height: 250px;
  overflow: hidden;
  background: #E6E6E6;
  display: block;
}
.search-x .search-results .search-results-container ul.search-results-card > li .card-image img {
  width: 100%;
  height: auto;
  display: block;
}
.search-x .search-results .search-results-container ul.search-results-card > li .text-container {
  padding: 20px;
  display: block;
  color: #FFFFFF;
}
.search-x .search-results .search-results-container ul.search-results-card > li .text-container h4 {
  font-size: 14px;
  line-height: 18px;
  margin-bottom: 10px;
  color: #FFFFFF;
}
.search-x .search-results .search-results-container ul.search-results-card > li .text-container h4.video:before {
  content: '';
  display: inline-block;
  width: 16px;
  height: 18px;
  line-height: 24px;
  background: url('/common/img/icons/play.svg') no-repeat;
  background-size: cover;
  background-position: 50% 100%;
  margin-right: 8px;
}
.search-x .search-results .search-results-container ul.search-results-card > li .text-container ul {
  display: flex;
  align-items: center;
}
.search-x .search-results .search-results-container ul.search-results-card > li .text-container ul li {
  display: inline-block;
  padding: 3px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  font-family: 'AvenirLight', Arial, sans-serif;
  font-size: 12px;
  margin: 0 3px 0 0;
  color: #F1F1F1;
}
.search-x .search-results .search-results-container ul.search-results-card > li.course {
  width: calc(25% - 10px);
  background-color: #FFFFFF;
  border: 1px solid #E6E6E6;
}
.search-x .search-results .search-results-container ul.search-results-card > li.course .text-container h4 {
  color: #222;
}
.search-x .search-results .search-results-container ul.search-results-card > li.course .text-container ul li {
  color: #272727;
  border-color: rgba(0, 0, 0, 0.2);
}
.search-x .search-results .search-results-container ul.search-results-list {
  list-style-type: none;
  padding: 0;
  width: 100%;
}
.search-x .search-results .search-results-container ul.search-results-list > li {
  position: relative;
  background-color: #E6E6E6;
  margin-bottom: 10px;
  font-family: 'AvenirLight', Arial, sans-serif;
}
.search-x .search-results .search-results-container ul.search-results-list > li a.thumb {
  position: absolute;
  display: block;
  overflow: hidden;
  top: 0;
  left: 0;
  bottom: 0;
  width: 150px;
  background-size: cover;
  background-position: center center;
}
.search-x .search-results .search-results-container ul.search-results-list > li a.thumb + div.title {
  min-height: 60px;
}
.search-x .search-results .search-results-container ul.search-results-list > li a.thumb + div.title,
.search-x .search-results .search-results-container ul.search-results-list > li a.thumb + div.title + div.highlights,
.search-x .search-results .search-results-container ul.search-results-list > li a.thumb + div.title + div.highlights + div.support {
  margin-left: 150px;
}
.search-x .search-results .search-results-container ul.search-results-list > li > div.title {
  display: flex;
  position: relative;
  align-items: center;
  padding: 10px 20px;
  cursor: pointer;
  background-color: #272727;
}
.search-x .search-results .search-results-container ul.search-results-list > li > div.title a.info {
  flex-grow: 1;
  display: block;
  color: #ffffff;
  font-family: 'AvenirLight', Arial, sans-serif;
}
.search-x .search-results .search-results-container ul.search-results-list > li > div.title a.info h4 {
  font-size: 14px;
  line-height: 18px;
  font-weight: bold;
}
.search-x .search-results .search-results-container ul.search-results-list > li > div.title a.info span.path {
  display: block;
  font-size: 12px;
  line-height: 16px;
  color: #aaa;
}
.search-x .search-results .search-results-container ul.search-results-list > li > div.title ul {
  display: flex;
  align-items: center;
}
.search-x .search-results .search-results-container ul.search-results-list > li > div.title ul li {
  display: inline-block;
  padding: 3px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  font-family: 'AvenirLight', Arial, sans-serif;
  font-size: 12px;
  margin: 0 0 0 3px;
  color: #F1F1F1;
}
.search-x .search-results .search-results-container ul.search-results-list > li > div.title ul li.product {
  border-radius: 3px;
  color: #000000;
  background-color: #E6E6E6;
  border-color: #E6E6E6;
}
.search-x .search-results .search-results-container ul.search-results-list > li > div.title ul li:first-child {
  margin-left: 0;
}
.search-x .search-results .search-results-container ul.search-results-list > li div.highlights {
  display: block;
  padding: 10px 20px;
}
.search-x .search-results .search-results-container ul.search-results-list > li div.highlights > p {
  display: block;
  font-size: 14px;
  font-weight: normal;
  line-height: 18px;
  margin: 10px 0 20px 0;
  overflow: hidden;
}
.search-x .search-results .search-results-container ul.search-results-list > li div.highlights > p span.highlight {
  font-weight: bold;
}
.search-x .search-results .search-results-container ul.search-results-list > li div.highlights > p::after {
  content: "...";
}
.search-x .search-results .search-results-container ul.search-results-list > li div.highlights > p:last-child {
  margin-bottom: 0;
}
.search-x .search-results .search-results-container ul.search-results-list > li div.support {
  display: block;
  padding: 10px 20px;
  font-size: 12px;
}
.search-x .search-results .search-results-container ul.search-results-list > li div.support span {
  margin-left: 15px;
}
@media screen and (max-width: 1279px) and (min-width: 1024px) {
  .search-x {
    margin: 10px 20px;
  }
}
@media screen and (max-width: 1023px) and (min-width: 768px), screen and (max-width: 767px) {
  .search-x {
    margin: 10px 20px;
    display: block;
  }
  .search-x .search-filters {
    width: auto;
    min-width: 0;
    margin-right: 0;
  }
  .search-x .search-results {
    width: auto;
  }
  .search-x .search-results .search-results-container ul.search-results-project > li {
    width: calc(33% - 8px);
  }
}
@media screen and (max-width: 767px) {
  .search-x .search-results .search-results-container ul.search-results-project > li {
    width: 100%;
  }
  .search-x .search-results .search-results-container ul.search-results-profile > li {
    width: 100%;
  }
  .search-x .search-results .search-results-container ul.search-results-list > li a.thumb {
    position: relative;
    height: 200px;
    width: auto;
  }
  .search-x .search-results .search-results-container ul.search-results-list > li a.thumb + div.title,
  .search-x .search-results .search-results-container ul.search-results-list > li a.thumb + div.title + div.highlights,
  .search-x .search-results .search-results-container ul.search-results-list > li a.thumb + div.title + div.highlights + div.support {
    margin-left: 0;
  }
  .search-x .search-results .search-results-container ul.search-results-list > li > div.title {
    display: block;
  }
  .search-x .search-results .search-results-container ul.search-results-list > li > div.title a.info {
    margin-bottom: 3px;
  }
  .search-x .search-results .search-results-container ul.search-results-list > li > div.title a.info span.path + ul {
    margin-top: 3px;
  }
}
.quicksearch-results {
  list-style-type: none;
  padding: 0;
}
.quicksearch-results > li {
  display: flex;
  position: relative;
  background: #272727;
  margin-bottom: 1px;
  font-family: 'AvenirLight', Arial, sans-serif;
  padding: 10px 20px;
  cursor: pointer;
  border-left: 3px solid transparent;
}
.quicksearch-results > li a.thumb {
  position: absolute;
  display: block;
  overflow: hidden;
  top: 0;
  left: -3px;
  bottom: 0;
  width: 100px;
  background-size: cover;
  background-position: center center;
  border-left: 3px solid transparent;
}
.quicksearch-results > li a.thumb + a.title {
  margin-left: 100px;
}
.quicksearch-results > li a.title {
  flex-grow: 1;
  display: block;
  margin-bottom: 5px;
  font-size: 20px;
  line-height: 24px;
  color: #ffffff;
  font-family: 'AvenirLight', Arial, sans-serif;
}
.quicksearch-results > li a.title span {
  display: block;
  font-size: 12px;
  line-height: 16px;
  color: #aaa;
  margin-bottom: 3px;
}
.quicksearch-results > li ul {
  display: flex;
  align-items: center;
}
.quicksearch-results > li ul li {
  display: inline-block;
  padding: 3px;
  border: 1px solid #828282;
  font-size: 12px;
  margin: 0 0 0 3px;
  color: rgba(255, 255, 255, 0.6);
}
.quicksearch-results > li ul li.product {
  border-radius: 3px;
  color: #000000;
  background-color: #E6E6E6;
  border-color: #E6E6E6;
  font-family: 'Avenir', Arial, sans-serif;
}
.quicksearch-results > li:hover {
  background: #222;
  border-left-color: #828282;
}
.quicksearch-results > li:hover a.thumb {
  border-left-color: #828282;
}
@media screen and (max-width: 767px) {
  .quicksearch-results {
    margin: 0 20px;
  }
  .quicksearch-results > li {
    display: block;
  }
  .quicksearch-results > li a.thumb + a.title + ul {
    margin-left: 100px;
  }
}
.tf-main-header {
  background-color: #E6E6E6;
  color: #ffffff;
  padding: 24px;
}
.tf-main-header__container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1600px;
  margin: 0 auto;
}
.tf-main-header__nav {
  margin-left: auto;
  display: flex;
  align-items: center;
  height: 100%;
}
.tf-main-header__nav ul {
  display: flex;
  gap: 24px;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}
.tf-main-header__nav ul li a,
.tf-main-header__nav ul li button {
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 15px;
  font-weight: 800;
  color: #333;
  line-height: normal;
}
.tf-main-header__nav ul li button {
  display: flex;
  align-items: center;
  justify-content: center;
}
.tf-main-header__nav ul li button svg {
  width: 28px;
  height: 24px;
  margin-right: 8px;
}
.tf-hero {
  position: relative;
  height: 270px;
  background: url('/common/img/assets/headers/mari_header.jpg') no-repeat center center;
  background-size: cover;
  color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.tf-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.5);
}
.tf-hero__content {
  position: relative;
  z-index: 1;
  padding: 0 24px;
  width: 100%;
  max-width: 800px;
}
.tf-hero__title {
  font-size: 42px;
  font-weight: 800;
  margin-bottom: 24px;
}
.tf-hero__quick-filters {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
}
.tf-hero__quick-filters button {
  width: 40px;
  height: 40px;
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  transition: background-color 0.2s;
}
.tf-hero__quick-filters button:hover {
  background-color: rgba(255, 255, 255, 0.4);
}
@media screen and (max-width: 767px) {
  .tf-hero {
    height: 150px;
  }
  .tf-hero__title {
    font-size: 24px;
    margin-bottom: 16px;
  }
}
.tf-search-form {
  display: flex;
  align-items: center;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  background-color: #FFFFFF;
}
.tf-search-form:focus-within {
  border-color: #ffc107;
  box-shadow: 0 0 0 2px rgba(255, 193, 7, 0.25);
}
.tf-search-form__input {
  flex-grow: 1;
  border: none;
  outline: none;
  padding: 12px 8px 12px 16px;
  font-size: 16px;
  font-family: 'Avenir', Arial, sans-serif;
  color: #333333;
  background-color: transparent;
  min-width: 0;
}
.tf-search-form__input::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
}
.tf-search-form__buttons {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.tf-search-form button {
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #828282;
  transition: color 0.2s ease;
}
.tf-search-form button svg {
  width: 16px;
  height: 16px;
}
.tf-search-form button:hover:not(:disabled) {
  color: #272727;
}
.tf-search-form__clear svg {
  width: 14px;
  height: 14px;
}
.tf-search-form__submit {
  padding-right: 12px;
}
.tf-search-form__submit:disabled {
  cursor: not-allowed;
  color: #828282;
  opacity: 0.7;
}
.tf-search-form__submit svg {
  width: 18px;
  height: 18px;
}
.tf-gallery-section {
  margin-bottom: 32px;
  width: 100%;
  box-sizing: border-box;
}
.tf-asset-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 24px;
  width: 100%;
  box-sizing: border-box;
}
.tf-asset-grid:has(.tf-empty-state) {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 400px;
}
.tf-share-page {
  margin-top: 140px;
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
}
.tf-share-page .tf-sidebar__content .tf-button__upload {
  margin-bottom: 24px;
}
.tf-share-page .tf-sidebar__content .tf-button__upload[aria-busy="true"] {
  background-color: #FCB434;
  border-color: #D6931E;
  color: #000000;
}
.tf-share-page .tf-sidebar__content .tf-stack.nav-links {
  margin-bottom: 24px;
}
.tf-share-page .tf-sidebar__content .tf-sidebar__license-footer {
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid #cdcdcd;
  display: flex;
  justify-content: center;
}
.tf-share-page .tf-sidebar__content .tf-sidebar__license-link {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 14px;
  color: #828282;
  text-align: left;
  transition: color 0.2s ease;
}
.tf-share-page .tf-sidebar__content .tf-sidebar__license-link svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.tf-share-page .tf-sidebar__content .tf-sidebar__license-link:hover {
  color: #272727;
}
.tf-share-page .tf-sidebar__content .tf-filter {
  margin-bottom: 24px;
}
.tf-share-page .tf-sidebar__content .tf-sidebar__nav-link {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  color: #000000;
  text-decoration: none;
  transition: color 0.2s ease;
}
.tf-share-page .tf-sidebar__content .tf-sidebar__nav-link:hover {
  color: #FCB434;
  text-decoration: none;
}
.tf-share-page .tf-sidebar__content .tf-sidebar__nav-link--active {
  color: #FCB434;
  font-weight: 600;
}
.tf-share-page .tf-sidebar__content .tf-sidebar__nav-link svg {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .tf-share-page {
    margin-top: 114px;
  }
  .tf-share-page .l-page-with-sidebar {
    display: block;
  }
  .tf-share-page .l-page-with-sidebar__main {
    padding-top: 24px / 2;
  }
  .tf-share-page .tf-mobile-controls {
    display: block;
  }
  .tf-share-page .tf-sidebar {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 300px;
    z-index: 1000;
    transform: translateX(-100%);
    transition: transform 0.3s ease-in-out;
    overflow-y: auto;
  }
  .tf-share-page .tf-sidebar.is-open {
    transform: translateX(0);
  }
  .tf-share-page .tf-sidebar__mobile-header {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 16px 24px;
    border-bottom: 1px solid #dee2e6;
  }
  .tf-share-page .tf-button__upload {
    display: none !important;
  }
}
.tf-asset-view-page {
  margin: 0 auto;
  font-family: 'Avenir', Arial, sans-serif;
  color: #272727;
  min-height: 600px;
  max-width: 1728px;
  width: 100%;
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
}
.tf-asset-view-page__breadcrumbs {
  margin-bottom: 16px;
}
.tf-asset-view-page__breadcrumbs a {
  color: #333;
  text-decoration: none;
  font-size: 15px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.tf-asset-view-page__breadcrumbs a:hover {
  text-decoration: underline;
}
.tf-asset-view-page__breadcrumbs a svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.tf-asset-view-page__main-content {
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
  width: 100%;
}
@media (min-width: 768px) {
  .tf-asset-view-page__main-content {
    flex-direction: row;
  }
}
.tf-asset-view-page__main-content > section {
  background: #f1f1f1;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  padding: 40px;
  min-width: 0;
}
.tf-asset-view-page__main-content > aside {
  background: #fff;
  flex: 0 0 500px;
  width: 500px;
  border-bottom: 1px solid #E6E6E6;
  border-right: 1px solid #E6E6E6;
}
@media screen and (max-width: 767px) {
  .tf-asset-view-page .tf-asset-view-page__main-content {
    flex-direction: column;
  }
  .tf-asset-view-page .tf-asset-view-page__main-content section,
  .tf-asset-view-page .tf-asset-view-page__main-content aside {
    min-width: 0;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .tf-asset-view-page .tf-asset-view-page__main-content .embedded-gallery {
    display: none !important;
  }
}
.tf-asset-view-page__container {
  width: 100%;
  margin: 0 auto;
  padding: 48px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media screen and (max-width: 767px) {
  .tf-asset-view-page__container {
    padding: 24px;
    gap: 8px;
  }
}
.tf-asset-view-page__caption {
  background-color: #F1F1F1;
  padding: 24px;
  margin-bottom: 32px;
  border-radius: 8px;
}
.tf-asset-view-page__caption h3 {
  margin-top: 0;
  font-size: 16px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #828282;
}
.tf-asset-view-page__caption p {
  margin-bottom: 0;
  line-height: 1.6;
}
.tf-asset-details {
  padding: 32px 40px;
}
.tf-asset-details__title {
  font-size: 24px;
  font-weight: 800;
  margin: 0;
  overflow-wrap: break-word;
  min-width: 0;
}
.tf-asset-details__actions .tf-options-menu__trigger {
  background-color: transparent;
  color: #272727;
}
.tf-asset-details__description {
  line-height: 1.6;
  color: #828282;
  margin: 0;
}
.tf-options-menu__item {
  padding: 4px;
}
.tf-options-menu__item a {
  display: block;
  padding: 8px 16px;
  border-radius: 8px;
  text-decoration: none;
  background-color: transparent;
  color: #333333;
  font-size: 16px;
}
.tf-options-menu__item a svg {
  width: 18px;
  height: 18px;
}
.tf-options-menu__item a:hover {
  background-color: #F1F1F1;
  color: #333333;
}
.profile-info {
  text-decoration: none;
  color: inherit;
}
.profile-info__avatar {
  margin: 0;
  width: 67px;
  height: 67px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
}
.profile-info__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.profile-info__text {
  font-size: 15px;
  font-weight: 800;
}
.profile-info__text--date {
  color: #828282;
}
.profile-info--provider .profile-info__avatar {
  border-radius: 8px;
}
.profile-info--provider .profile-info__avatar img {
  object-fit: contain;
}
.asset-download__thumbnail {
  width: 80px;
  height: 80px;
  flex-shrink: 0;
  border-radius: 8px;
  object-fit: cover;
}
.asset-download__details-title {
  font-weight: 600;
  color: #272727;
  margin: 0;
  overflow-wrap: break-word;
}
.asset-download__details-format {
  font-size: 14px;
  color: #828282;
}
.asset-download__details-filesize {
  font-size: 14px;
  color: #828282;
}
.asset-download__hosting-disclaimer {
  font-size: 13px;
  color: #828282;
  margin: 0;
  font-style: italic;
}
.asset-download__attribution {
  font-size: 13px;
  color: #828282;
  margin: 0;
}
.asset-download .download-cart-wrap {
  position: relative;
  display: inline-flex;
}
.asset-download .download-cart-wrap:after {
  content: '+';
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -5px;
  right: 3px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #F1F1F1;
  border: 1px solid #000;
  color: #000;
  font-size: 12px;
  font-weight: bold;
  line-height: 14px;
  z-index: 2;
  pointer-events: none;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}
.asset-download__license-link {
  display: block;
  text-align: center;
  font-size: 12px;
  font-weight: 400;
  color: black;
}
.c-asset-card__provider-badge {
  position: absolute;
  bottom: 8px;
  left: 24px;
  display: flex;
  align-items: center;
  gap: 8px;
  background-color: rgba(0, 0, 0, 0.65);
  color: #FFFFFF;
  padding: 4px 8px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  pointer-events: none;
}
.c-asset-card__provider-badge-logo {
  width: 16px;
  height: 16px;
  object-fit: contain;
  flex-shrink: 0;
}
.tf-trending-asset-grid__title {
  font-size: 30px;
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  font-weight: 600;
}
.tf-trending-asset-grid__title .icon {
  margin-right: 16px;
  width: 24px;
  height: 24px;
  color: #828282;
}
.tf-trending-asset-grid__container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 24px;
}
.tf-trending-asset-grid__item-link {
  display: block;
  text-decoration: none;
}
.tf-trending-asset-grid__item {
  margin: 0;
  border-radius: 8px;
  overflow: hidden;
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.tf-trending-asset-grid__item:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
}
.tf-trending-asset-grid__image {
  width: 100%;
  height: auto;
  display: block;
}
.tf-dashboard__title {
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #000000;
  margin: 32px 0 24px 0;
  padding: 0;
}
.tf-dashboard-metrics {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin: 32px 0;
  padding: 0;
}
.tf-dashboard-metrics__period-selector {
  display: flex;
  gap: 8px;
  justify-content: flex-start;
  align-items: center;
}
.tf-dashboard-metrics__cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
  width: 100%;
}
.tf-metric-card {
  background-color: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 12px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: box-shadow 0.2s ease;
}
.tf-metric-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.tf-metric-card__header {
  display: flex;
  align-items: center;
  gap: 12px;
}
.tf-metric-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background-color: #F3F4F6;
  border-radius: 8px;
  color: #6B7280;
  flex-shrink: 0;
}
.tf-metric-card__icon svg {
  width: 24px;
  height: 24px;
}
.tf-metric-card__label {
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #6B7280;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.tf-metric-card__body {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
}
.tf-metric-card__value {
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 28px;
  font-weight: 700;
  color: #000000;
  line-height: 1;
}
.tf-metric-card__trend {
  display: flex;
  align-items: center;
  gap: 4px;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 14px;
  font-weight: 600;
  padding: 4px 8px;
  border-radius: 6px;
}
.tf-metric-card__trend--positive {
  color: #10B981;
  background-color: #D1FAE5;
}
.tf-metric-card__trend--negative {
  color: #EF4444;
  background-color: #FEE2E2;
}
.tf-metric-card__trend-arrow {
  font-size: 16px;
  line-height: 1;
}
.tf-metric-card__trend-value {
  line-height: 1;
}
@media (max-width: 768px) {
  .tf-dashboard__title {
    font-size: 18px;
    margin: 24px 0 16px 0;
  }
  .tf-dashboard-metrics {
    margin: 24px 0;
    gap: 16px;
  }
  .tf-dashboard-metrics__cards {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .tf-metric-card {
    padding: 20px;
  }
  .tf-metric-card__value {
    font-size: 28px;
  }
}