.ai-script-popup-loader {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: none;
}
.ai-script-popup-loader .popup-loader-load-text {
    position: relative;
    top: 52%;
    left: 0;
    font-weight: bold;
    text-transform: uppercase;
    color: var(--primary-color);
}

.ai-script-popup-loader #loading-ai-script{
    margin: 0 auto;
    height: 40px;
    width: 40px;
    animation: rotate .8s infinite linear;
    border: 5px solid var(--primary-color);
    border-right-color: #fff;
    border-radius: 50%;
    position: absolute;
    top: 40%;
    left: 48%;
    z-index: 1;
    transform: translate(-50%,-50%);
    margin-top: -10px;
}

.script-create-btn .ajax-progress.ajax-progress-throbber {
    display: none !important;
}

.ui-dialog-buttonpane {
  display: none;
}

.button.dialog-cancel {
  position: relative;
  padding: 10px 18px;
  box-shadow: none !important;
  display: inline-block;
  text-align: center;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  background-color: var(--primary-color);
  border: 0;
  line-height: 1.5;
  color: #f26419;
  background-color: rgb(242 100 25/15%);
  transition: all 500ms ease;
}

.button.dialog-cancel:hover {
  background-color: rgb(242 100 25/35%);
  color: #f26419;
}

.mobilebox:before {
  position: absolute;
  content: unset !important;
  background-image: url(../images/mobile-button.png);
  width: 30px;
  height: 30px;
  bottom: 20px;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 1;
}

.mobilebox:after {
  position: absolute;
  content: unset !important;
  left: 0;
  right: 0;
  background: #fff;
  bottom: 10px;
  height: 52px;
  border-bottom-left-radius: 140px;
  border-bottom-right-radius: 140px;
  width: 343px;
  margin: auto;
}

.create-tokens-form .accordion-header .ms-auto {
  position: unset;
}

div#do-next-root .img-figure img {
  border-radius: 8px;
}

#achievement-root #center-btn {
  margin-top: 20px;
}

#achievement-root #achieved-value {
  display: none;
}

/* set minimum height for recent project image wrapper */
.card-recent-project .imgbx {
  min-height: 74px;
}

.mb-3 .sec-my-recent-project .card-recent-project .imgbx img {
  object-fit: contain;
}

.mb-3 .sec-my-recent-project .card-recent-project .edit-icon {
  margin-top: 1px;
}

/* set minimum height for recent project image wrapper end */

/* video script  */
.video-script-selection-toolbar .tool-btn {
  border: none;
  background: unset;
}

.video-script-selection-toolbar {
  display: flex;
  flex-direction: column;
  padding: 6px 8px 2px;
  border-radius: 6px;
  background: #f2eef8;
  gap: 8px;
}

.page-node-type-video-script-template .script-wrapper .ele_content_section {
  display: flex;
  flex-direction: row;
}

.video-script-selection-toolbar .tool-btn {
  border: none;
  background: unset;
}
.video-scripting .paragraph-script {
  height: 100%;
  width: 100%;
}

.video-script-selection-toolbar .tool-btn-wrapper .tool-btn {
  position: relative;
  display: inline-block;
}

.video-script-selection-toolbar .tone-options {
  position: absolute;
  top: 100%;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  padding: 5px 0;
  width: 130px;
  z-index: 1000;
  visibility: visible;
  visibility: hidden;
  opacity: 0;
  right: -8px;
  transition: all 0.3s;
}

.video-script-selection-toolbar
  .tool-btn-wrapper
  .tool-btn:hover
  .tone-options {
  visibility: visible;
  opacity: 1;
}

.video-script-selection-toolbar .tone-option {
  padding: 8px 10px;
  cursor: pointer;
  font-size: 14px;
}

.video-script-selection-toolbar .tone-option:hover {
  background: #f5f5f5;
}

.Estimated-clone-edit .clock-icons.key-icons {
  margin-right: 16px;
}
.key-icons .script-elements-modal {
  width: var(--modal-width);
  border-radius: var(--modal-radius);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18);
  padding: 0;
  position: absolute;
  top: 100%;
  z-index: 1200;
  border-top: 4px solid var(--panel-border);
  visibility: hidden;
  opacity: 0;
  min-width: 280px;
  background: #fff;
  border-radius: 10px;
  transition: all 0.3s;
}
.key-icons .modal-close {
  position: absolute;
  right: 10px;
  top: 8px;
  background: transparent;
  border: none;
  font-size: 18px;
  cursor: pointer;
  color: #666;
  width: 34px;
  height: 34px;
  border-radius: 50%;
}
.key-icons .script-elements-inner {
  padding: 8px 8px 8px 8px;
}
.key-icons .script-elements-grid {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  align-items: center;
}
.key-icons .script-element {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
}
.key-icons .swatch {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: inline-block;
  position: relative;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}
.key-icons .label {
  font-size: 14px;
  color: #5b2a6f;
  font-weight: 600;
}
.key-icons img.normal {
  width: 17px;
  height: 17px;
  margin-left: 5px;
}
/* small responsive tweak */
@media (max-width: 520px) {
  .key-icons .script-elements-grid {
    grid-template-columns: repeat(1, 1fr);
  }
  .onbd-extension-wrapper .not-you {
    font-size: unset;
  }
}

.Estimated-clone-edit .clock-icons.key-icons:hover .script-elements-modal {
  visibility: visible;
  opacity: 1;
}

.Estimated-clone-edit .clock-icons.key-icons {
  position: relative;
}

.script-export-btn:hover .export-buttons-group {
  visibility: visible;
  opacity: 1;
}
.export-buttons-group {
  position: absolute;
  top: 82%;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  padding: 5px 0;
  width: 130px;
  z-index: 1000;
  visibility: visible;
  visibility: hidden;
  opacity: 0;
  right: 0;
  transition: all 0.3s;
}
.script-export-btn {
  position: relative;
}
.script-export-btn .export-doc:hover {
  color: #000 !important;
}
.export-buttons-group a {
  background: unset;
}
.export-buttons-group a:hover {
  color: #000;
}
.head-wrap-main {
  z-index: 1;
}
.script-page-button-wrapper .script-export-btn .export-buttons-group a.custom-print-video-script {
  text-align: center;
  justify-content: center;
  padding: 8px 10px;
  cursor: pointer;
  font-size: 13px;
  margin-bottom: unset !important;
  color: #3e2155
}

.script-export-btn .export-buttons-group a:hover {
  color: #f26419;
  background: #f5f5f5;
}
.script-export-btn .btn.btn-sm.btn-primary {
  border-radius: 8px;
  width: 100%;
  font-size: 12px;
  padding: 6px;
  text-align: start;
  padding-left: 10px;
  color: var(--primary-light);
  font-weight: 500;
}
.script-export-btn .btn.btn-sm.btn-primary img {
  margin-right: 5px;
}
.script-export-btn .export-buttons-group a::before {
  display: none;
}
.export-buttons-group a {
  display: block;
  text-align: center;
  color: #000;
}
.paragraph-script-wrapper.section-add-button{
  width: 100%;
}
.ai-script-loader.generate-ai-result-loader{
  background: unset;
}
.ai-script-loader.generate-ai-result-loader .load-text{
  color: var(--primary-color);
}


/* video script end */

/* notifications */
/* The tabs sit ABOVE the panel, they do not merge into it.
 *
 * This wrapper used margin-bottom: -2px to pull the tabs down onto the panel so
 * a flat-bottomed active tab (border-radius: 6px 6px 0 0) could join it - the
 * usual connected-tab trick, which needs a flat-topped panel underneath.
 *
 * The panel is .notification-section-wrapper.card, and /notifications is a glass
 * page, so glass.css gives every card the house signature radius
 * 14px 14px 14px 3px. A square tab bottom then overhung a 14px curve and left a
 * notch at the top left, with the tab reading as detached rather than joined.
 *
 * Rather than square off the card on this one page and fight a deliberate house
 * shape, the tabs are pills above it. */
.ts-notifications-form .notification-tabs-wrapper {
    margin-bottom: 8px;
}

/* Shared box for both tabs. The active one carried no bottom margin while the
   inactive one had 4px, so the pair sat on different baselines. */
.ts-notifications-form .notification-tabs-wrapper .notification_active_btn,
.ts-notifications-form .notification-tabs-wrapper .notification_btn {
    margin: 0;
    border-radius: 6px;
    padding: 5px 12px;
    background-color: #fff;
    min-width: 128px;
}

.ts-notifications-form .notification-tabs-wrapper .notification_active_btn {
    border: 0px;
    color: #3e2155;
    font-weight: 600;
}
.ts-notifications-form .notification-tabs-wrapper .notification_btn{
    /* #858B98 is 3.42:1 on white, below the 4.5 a label needs. These read as
       tabs, and an unselected tab receding is fine, but receding is a job for
       weight and fill rather than for making the word hard to read. Same
       replacement as the SEO Tools tabs took. */
    color: #5b5872;
    font-weight: 500;
    z-index: 3;
    position: relative;
}
/*notification*/

/* tubespanner token */
.new-template-submit {
  display: none !important;
}

.path-my-smart-descriptions .card .plus-monthly-text,
.path-description-templates .card .plus-monthly-text {
  color: var(--paragraph);
}
.script-page-button-wrapper a:hover {
  color: var(--primary-light);
}
/* tubespanner token */

@font-face {
  font-family: "objektiv-mk1";
  src: url("../fonts/objektiv-mk1.woff") format("woff");
}

.getFormData .button--small .add-item {
  color: #fff;
}

.path-user-script
  .views-form
  [data-drupal-selector="edit-header"]
  [name="action"] {
  display: none;
}

.my-promo-page .video-box.script-box {
  border-radius: 18px;
  padding-top: unset;
}
.field--name-field-social-media table tr td:nth-child(2) {
  padding-left: 15px;
}
.field--name-field-social-media td.field-multiple-drag {
  display: none;
}
.my-promo-page .video-box.script-box img {
  /*   object-fit: fill; */
}

.removal-confirmation {
  position: absolute;
  right: 4px;
}

.removal-confirmation li.dropbutton-toggle {
  display: none;
}

.node-video-script-template-create-script-form
  .field--name-field-bullet-script {
  display: none;
}
/*.removal-confirmation li.confirm-remove button::after {*/
.removal-confirmation li.restore button::after {
  content: "";
  font-family: bootstrap-icons !important;
  width: 18px;
  height: 18px;
  margin-left: 8px;
  display: flex;
  position: relative;
  background-image: url("/themes/custom/tubespanner_purple/images/ic-delete-02.svg");
  background-size: cover;
}

.removal-confirmation .dropbutton-wrapper div.dropbutton-widget {
  padding-right: unset;
}

.js
  .field--widget-entity-reference-paragraphs
  td
  .js-form-wrapper.form-wrapper.mb-3
  .dropbutton-wrapper
  .dropbutton-toggle
  button {
  height: 28px;
  width: 28px;
}

.script-card-box .text-box {
  min-height: 140px;
}

.user-register-form .form-required .fieldset-legend {
  display: none;
}

.alert {
  border-radius: 12px !important;
}

/* #my-smart-text .plus-monthly-text.welcome-para,
#smart-description .plus-monthly-text.welcome-para{
    min-height: 120px;
} */
.custom-checkout-cls
  .js-form-item.form-item.js-form-type-textfield.form-item-sidebar-coupon-redemption-form-code.js-form-item-sidebar-coupon-redemption-form-code.form-group.control-field {
  flex: 1;
  display: inline-block;
  width: 200px;
  max-width: 100%;
}
.checkout-pane-coupon-redemption .coupon-redemption-form__coupons--multiple h3 {
  display: none;
}
.checkout-pane-coupon-redemption
  .coupon-redemption-form__coupons--multiple
  table {
  width: 100%;
}
.checkout-pane-coupon-redemption
  .coupon-redemption-form__coupons--multiple
  table
  button,
.checkout-pane-coupon-redemption button {
  float: right;
}
.checkout-pane-coupon-redemption
  .form-item-sidebar-coupon-redemption-form-code
  label {
  display: none;
}

.show-discounted .order-total-line.order-total-line__total,
.show-discounted .order-total-line.order-total-line__subtotal,
.show-discounted
  .order-total-line__adjustment--promotion
  .order-total-line-label {
  display: none;
}
.show-discounted .order-total-line {
  padding: 0;
}
.show-discounted span.btn.btn-primary.remove-coupon-btn {
  background-color: #f2641926;
  color: var(--secondary-color);
  min-width: auto;
  margin-left: 20px;
}
.checkout-pane-coupon-redemption .coupon-discount-wrapper {
  display: inline-block;
}
.text-purple {
  color: var(--title);
}
.custom-checkout-cls .custom-checkout-heading h3 {
  font-size: 16px;
  font-weight: bold;
  color: var(--title);
}

.top-tag-list .tags .control-field .form-label {
  padding: 5px 13px;
}

.top-tag-list .tags .control-field .form-label:hover {
  color: var(--bs-white);
}

.top-tag-list .tags {
  padding: unset !important;
}

.title-generator-form-wrapper
  .top-tag-list
  .control-field
  .form-control.form-radio {
  display: none;
}

/* landing page css */

.hero-banner .head-banner {
  background-size: cover;
  border-radius: 30px;
  overflow: hidden;
  max-width: 1270px;
  margin: auto;
  padding: 50px;
  background-position: center center;
  margin-bottom: 40px;
  text-align: center;
}

.hero-banner .head-banner .content-area p {
  font-weight: 500;
  font-size: 16px;
  color: #fff;
}

.style-container {
  width: 1170px;
  margin: 0 auto;
  max-width: 100%;
}

section.inner-pages .inner-pages-content h2 {
  line-height: 45px;
  font-weight: 700;
  font-size: 32px;
  color: #000;
}

.hero-banner .head-banner .content-area h2 {
  color: #fff;
  margin-bottom: 20px;
}

.connect-box {
  display: flex;
  background: #fff;
  padding: 20px;
  border-radius: 10px;
}

.connect-content {
  padding: 10px;
  flex: 1;
}

.connect-box .connect-img {
  flex: 0 0 330px;
  max-width: 330px;
}

.connect-content h2 {
  font-size: 18px;
  font-weight: bold;
  color: var(--title);
  margin-bottom: 18px;
}

.connect-content p {
  display: flex;
}

.connect-content p .list-tick {
  flex: 0 0 20px;
  max-width: 20px;
}

body.page-node-type-link-hub
  form.node-link-hub-edit-form
  #edit-field-social-media-links-wrapper
  div.js-form-wrapper.form-wrapper
  em {
  display: none;
}

body.page-node-type-link-hub
  form.node-link-hub-edit-form
  table
  thead
  tr
  th:nth-of-type(2) {
  display: none;
}

body.node-add-link_hub
  form.node-link-hub-form
  #edit-field-social-media-links-wrapper
  div.js-form-wrapper.form-wrapper
  em {
  display: none;
}

body.node-add-link_hub
  form.node-link-hub-form
  table
  thead
  tr
  th:nth-of-type(2) {
  display: none;
}

.path-user-script .views-form .card.ts-empty-state.no-result {
  margin-top: 82px;
}

.path-notes #views-exposed-form-notes-page-1 #edit-actions {
  margin-top: 10px !important;
}

.menuicon img {
  width: 25px;
}

.page-forbidden
  #block-views-block-guided-search-guided-search-block-2
  .mb-3
  input[type="text"] {
  background-color: #fff;
  font-size: 12px;
  font-weight: 500;
  border-radius: 8px;
  border-color: var(--primary-light);
  background-position: center left 16px;
  color: #b1b7c5;
  padding-left: 40px;
}

.page-forbidden h3.result-page-title {
  display: none;
}

.dashboard-video-suggestions-ai .top-tag-list .tags.checkedlabel {
  background-color: var(--primary-color);
}

.dashboard-video-suggestions-ai .top-tag-list .tags.checkedlabel label {
  color: var(--bs-white);
}

.dashboard-video-suggestions .top-tag-list .tags.checkedlabel {
  background-color: var(--primary-color);
}

.dashboard-video-suggestions .top-tag-list .tags.checkedlabel label {
  color: var(--bs-white);
}

.dashboard-video-suggestions .card-generate-ai-script .btn.btn-fill {
  max-width: 180px;
}

.dashboard-video-suggestions
  .top-tag-list
  .control-field
  .form-control.form-radio {
  display: none;
}

.path-notes #views-exposed-form-notes-page-1 .control-field .form-select {
  text-transform: unset;
}

body.path-thumbnail-library.administrator-user
  .dashaboard-inner
  div.text-box
  li.d-none {
  display: block !important;
}

#calendar-add-event {
  display: none;
}

.custom-twitter-msg {
  margin-bottom: unset;
}

.path-notes .card-title a {
  font-size: 14px;
  font-weight: 700;
  color: #3e2155;
  margin-bottom: 5px;
}

.page-node-type-notes .dashaboard-inner h2.notes-title {
  line-height: 45px;
  font-weight: 700;
  font-size: 24px;
  text-align: center;
  color: #3e2155;
  margin: 0 0 25px;
}
.header-accordian-toggle-btn {
  text-align: center;
  font-size: 24px;
  font-style: normal;
  line-height: inherit;
  background: var(--primary-color);
  width: 50px;
  height: 50px;
  border-radius: 50px;
  position: fixed;
  bottom: 15px;
  right: 15px;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 9999;
}
/* achievement canvas */
#canvas-modal .ts-loader {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  overflow: hidden;
  right: 0%;
  top: 0;
  left: 0px;
  bottom: 0;
  background: rgba(0, 0, 0, 0.25);
  height: 30px;
  border-radius: 12px;
}

#canvas-modal .dot-floating::before,
.dot-floating::after {
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #ffffff;
  color: #ffffff;
}

#canvas-modal .dot-floating {
  position: relative;
  animation: dot-floating 3s infinite cubic-bezier(0.15, 0.6, 0.9, 0.1);
}

#canvas-modal .dot-floating::before,
#canvas-modal .dot-floating::after {
  content: "";
  position: absolute;
  display: inline-block;
  top: 0;
}

#canvas-modal .dot-floating::before {
  left: -12px;
  animation: dot-floating-before 3s infinite ease-in-out;
}

#canvas-modal .dot-floating::after {
  left: -24px;
  animation: dot-floating-after 3s infinite cubic-bezier(0.4, 0, 1, 1);
}

.path-hall-of-fame .author-box .img-box .author-bg img {
  object-fit: cover;
}

#canvas-modal .dot-floating,
#canvas-modal .dot-floating::before,
#canvas-modal .dot-floating::after {
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #ffffff;
  color: #ffffff;
  z-index: 99999999999;
}

@keyframes dot-floating {
  0% {
    left: calc(-50% - 5px);
  }

  75% {
    left: calc(50% + 105px);
  }

  100% {
    left: calc(50% + 105px);
  }
}

@keyframes dot-floating-before {
  0% {
    left: -50px;
  }

  ts_video_script 50% {
    left: -12px;
  }

  75% {
    left: -50px;
  }

  100% {
    left: -50px;
  }
}

@keyframes dot-floating-after {
  0% {
    left: -100px;
  }

  50% {
    left: -24px;
  }

  75% {
    left: -100px;
  }

  100% {
    left: -100px;
  }
}

#dashboard-download-latest-achievement option {
  text-align: left;
}

.path-user-achievements.achived-achievements-wrapper.card {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: end;
}

.path-user-achievements
  .achived-achievements-wrapper.card
  fieldset
  .legend {
  margin-bottom: 8px;
}

.path-user-achievements
  .achived-achievements-wrapper.card
  fieldset
  .legend::first-letter {
  text-transform: capitalize;
}

.path-user-achievements
  .latest_milestone_wrapper
  .download_wrapper
  .selectbxAchivement {
  top: inherit;
}

/* achievement canvas end */
.smart-token-modal .editable-token-label-field {
  margin-top: 5px !important;
}

.ui-dialog.script-modal {
  position: absolute !important;
}

html.no-touchevents.js,
html.js {
  overflow: auto !important;
}

.script-modal .create-script-popup .form-actions button:last-child {
  display: none;
}

.node-event-form .js-filter-wrapper,
.node-event-edit-form .js-filter-wrapper {
  display: none;
}

.node-add-descriptions .project-custom-tag.containerOuter.xyz {
  display: flex;
  justify-content: space-between;
}

.app-sidebar .list-unstyled li.active .menuicon path {
  fill: unset !important;
}

.page-node-type-notes.administrator-user .dashaboard-inner {
  padding-top: 0px !important;
}

.show-image-on-over {
  width: 180px;
  height: 120px;
  display: none;
  position: fixed;
  z-index: 999;
}

.ajax-progress-throbber .message {
  display: none;
}

.path-title-ideas #video-title-ideas-form .ajax-progress-throbber,
.script-create-btn .ajax-progress-throbber,
.video-script-loader.ajax-progress-throbber {
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.path-title-ideas #video-title-ideas-form .ajax-progress-throbber .message,
.script-create-btn .ajax-progress-throbber .message,
.video-script-loader.ajax-progress-throbber .message {
  display: block;
  color: #fff;
  font-weight: 500;
}

.card-generate-ai-script {
  padding-top: 16px !important;
}

.card-generate-ai-script p {
  font-size: 14px !important;
  font-weight: 400 !important;
}

.menu-arrow {
  cursor: pointer;
}

.app-sidebar .nav-item .btn-toggle-nav .btn-toggle-nav {
  padding: 0px 10px;
}

.btn-toggle-nav li a .menu-arrow {
  right: 0;
}

.modal-background-image {
  background: #f2eef8;
}

.node-audience-avatar-form.form-create-audience-avatar
  .field_avatar_goals_and_values-delta-order {
  display: none;
}

.path-scheduled-posts .custom-table td p {
  margin: 0;
  padding: 2px;
}

body.toolbar-tray-open {
  padding-top: 82px !important;
}
.do-next-background-wrapper {
  background: #f3d2cb;
  padding: 8px;
  border-radius: 15px;
}
body.subscription-plans .alert.alert-warning {
  background: #ed6c02;
  color: #fff;
  max-width: 1170px;
  margin: 0 auto;
  text-align: center;
  font-size: 18px;
  margin-bottom: 1rem;
}

div.modal-video-script.video-script-popup .modal-body {
  padding: 10px 24px 24px 24px;
}

div.modal-video-script.video-script-popup .modal-body .caution-text {
  color: #481e4d;
}

ul.help-support-menu li a {
  /* TS-5243 item 3. This was `5px 0px`, so the Help item had NO right padding
     while every other sidebar link has 5px 17px 5px 22px. Its label is also
     the longest in the menu, "Feedback and support", so it was the one item
     whose text ran to the panel edge. Matching the other links rather than
     inventing a value, because the complaint is inconsistency: the Help
     section looked different from the menu it sits in. */
  padding: 5px 17px 5px 22px !important;
}

ul.help-support-menu .menuicon {
  margin-right: 0px;
}

.app-sidebar div.sidebar-footer span.upgrade-link {
  display: flex;
  flex-wrap: nowrap;
}

.app-sidebar .list-unstyled.help-support-menu .btn_grey {
  position: relative;
  min-height: inherit;
  /* 22px to match the other sidebar links, was 24px. */
  padding-left: 22px !important;
  justify-content: start;
}

.list-unstyled.help-support-menu .btn_grey .menuicon img {
  position: absolute;
  left: 0;
  top: 8px;
  width: 18px !important;
}

body.page-node-type-descriptions .field--name-body textarea.form-textarea,
body.node-add-descriptions .field--name-body textarea.form-textarea {
  resize: vertical;
}

.app-sidebar .list-unstyled.help-support-menu .btn_grey .menuicon {
  min-width: inherit;
}

body.path-content-ideas .form-item-is-new-audience {
  padding-bottom: 15px;
}

body.path-content-ideas .no-uppercase {
  text-transform: none !important;
}

div#new-audience-field--description {
  display: block;
  font-size: 11px;
  font-weight: 500;
}

.form-item-new-audience label.form-label {
  font-size: 12px;
  font-weight: 500;
  margin-bottom: 5px;
  position: relative;
}

.form-item-is-new-audience label.option.form-label {
  font-size: 12px;
  font-weight: 500 !important;
  margin-bottom: 5px !important;
  position: relative;
}

.form-item-users-audience div#remove-nid--description {
  display: none;
}

.page-node-type-landing-pages .dashaboard-content {
  margin-left: 0px;
}

.page-node-type-link-hub .dashaboard-content {
  margin-left: 0;
}

body[class^="node-"].page-node-type-link-hub .dashaboard-content {
  margin-left: 250px;
}

.path-promo .dashaboard-content,
.path-b .dashaboard-content,
.user-login .dashaboard-content,
.user-register .dashaboard-content,
.user-password .dashaboard-content,
.path-guided-search .dashaboard-content,
[class^="script-print-"] .dashaboard-content {
  margin-left: 0;
}

form.custom-msg-prompt .form-actions.js-form-wrapper.form-wrapper {
  position: unset;
}

form.custom-msg-prompt .checkout-pane-stripe-review {
  padding-bottom: 0;
}

p.custom-msg-prompt {
  font-size: 16px;
  color: #22142d;
  font-weight: 700;
}
.checkout-pane.checkout-pane-payment-information
  .payment-method-wrapper
  legend
  span {
  font-size: 16px;
  color: #22142d;
  font-weight: normal;
}
.path-user-reply-library div#drupal-modal #preview-btn {
  margin-top: 20px !important;
  color: white;
  margin-right: 10px !important;
}

.dashboard-promo-pages .inner-button .btn-preview span,
.dashboard-user-pages .inner-button .btn-preview span,
.path-user-script .inner-button .btn-preview span,
.path-my-smart-descriptions .inner-button .btn-preview span,
.path-video-tree-template .inner-button .btn-preview span,
.path-user-video-tree .inner-button .btn-preview span {
  font-weight: 700;
  color: unset;
  padding-left: 4px;
}

.btn.btn-fill.go-to-youtube {
  color: var(--secondary-color);
  background: #fde8dd;
}

.ac-edit-button {
  font-weight: 700 !important;
  background: rgb(103 44 114 / 15%) !important;
}
.icon-size {
  height: 40px;
  width: 40px;
}
/* social post css */
#edit-field-post-content-wrapper #edit-field-post-content-0-format {
  display: none;
}
.path-scheduled-posts .view-is-empty .block-header {
  padding-right: 0;
}
.facebook-std-img,
.social-iconbox img.facebook-std-img {
  border-radius: 50%;
}
.view-social-post .custom-table th a {
  color: var(--paragraph);
  position: relative;
}
.view-social-post .custom-table th a:after {
  background: url(/core/misc/icons/787878/twistie-up.svg);
  content: "";
  width: 16px;
  height: 16px;
  position: absolute;
  display: inline-block;
  right: -20px;
  top: -3px;
}
.view-social-post .custom-table th[aria-sort="ascending"] a:after,
.view-social-post .custom-table th[aria-sort="descending"] a:after {
  display: none;
}

.view-social-post.view-id-social_post table.views-table thead th:first-child {
  padding-right: 02px;
  max-width: 30px;
  padding-left: 10px;
}
.view-social-post.view-id-social_post table.views-table tbody td:first-child {
  max-width: 30px;
  padding-left: 10px;
  padding-right: 02px;
}
.view-social-post.view-id-social_post table.views-table thead th:nth-child(2) {
  width: 22%;
  min-width: 120px;
}
.view-social-post.view-id-social_post table.views-table thead th:nth-child(3) {
  width: 15%;
  min-width: 80px;
}
.view-social-post.view-id-social_post
  table.views-table
  tbody
  td:first-child
  input {
  margin: 0;
}
.view-social-post.view-id-social_post table.views-table tbody td:nth-child(2) {
  width: 22%;
  min-width: 120px;
}
.view-social-post.view-id-social_post table.views-table tbody td:nth-child(3) {
  width: 15%;
  min-width: 80px;
}
.view-social-post.view-id-social_post
  table.views-table
  thead
  th:first-child
  input.form-checkbox {
  margin: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  width: 17px;
  height: 17px;
  cursor: pointer;
  box-shadow: none;
  background-clip: padding-box;
  border: 1px solid #d2c7e3;
  background-color: #f2eef8;
  vertical-align: top;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.view-social-post.view-id-social_post
  table.views-table
  thead
  th:first-child
  input.form-checkbox:checked {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
  vertical-align: top;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/** Social post end **/
.thumbnail_img_wrap {
  margin: 0 0 15px;
  padding: 0;
  position: relative;
  padding-top: 56.25%;
}

.thumbnail_img_wrap img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

.smart-token-modal a.ac-edit-button {
  color: var(--primary-color);
}

.smart-token-modal a.ac-save-button {
  color: var(--secondary-color);
}

.card-recent-project:hover {
  cursor: default;
}

.card-recent-project .imgbx img:hover {
  cursor: pointer;
}

.create-tokens-form
  .form-smart-description
  .group-col-box
  .js-form-type-textarea
  ~ .js-form-type-textarea {
  border-left: 1px solid var(--primary-color) !important;
}

.sec-channel-obj .control-field .form-label .text-end {
  color: var(--primary-color);
}

.path-user-reply-library .ui-dialog form.new-comment-form button {
  margin-top: 20px;
}
.path-user-reply-library .ui-widget-content .label-text {
  font-weight: bold;
  color: #3e2155;
  width: 120px;
  text-align: right;
}
.path-user-reply-library .ui-widget-content .item-text {
  flex: 1;
  text-align: left;
}
.path-user-reply-library .ui-widget-content .spin-text-div {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
.path-tubespanner-tokens .ac-edit-button.disabled {
  display: none !important;
}
.disabled-link {
  pointer-events: none;
  opacity: 0.65;
  cursor: not-allowed;
}
#do-next-root .do-next-col .img-figure {
  min-height: unset;
}
.node-add-link_hub #edit-body-wrapper .ck-editor .ck-editor__editable,
.page-node-type-link-hub
  #edit-body-wrapper
  .ck-editor
  .ck-editor__editable {
  font-weight: 500;
  font-size: 14px;
  color: #313234;
}
body.bio #edit-body-wrapper .ck-editor .ck-editor__editable {
  font-weight: 500;
  font-size: 14px;
  color: #313234;
}
.page-node-type-descriptions .ui-widget-content .ac-edit-button.disabled {
  display: none !important;
}
.notification-sec .btn.notification_active_btn {
/*  display: none;*/
}
.legend-video-title {
  font-size: 18px;
  font-family: "Satoshi";
}
.legend-video-description {
  margin-top: 20px;
  font-size: 14px;
  font-weight: 400;
  font-family: "Satoshi";
  line-height: 20px;
}
/* Social bio page css start*/

.node-add-link_hub .group-ts-tabs ul.horizontal-tabs-list,
.page-node-type-link-hub .group-ts-tabs ul.horizontal-tabs-list {
  display: flex;
  justify-content: space-between;
  border: none;
  background: 0 0;
  padding: 8px;
  border-radius: 6px;
  max-width: 420px;
  margin: auto;
}
.node-add-link_hub .group-ts-tabs ul.horizontal-tabs-list:before,
.page-node-type-link-hub .group-ts-tabs ul.horizontal-tabs-list:before {
  content: "";
  position: absolute;
  width: calc(100% - 323px);
  left: 138px;
  top: 38px;
  height: 2px;
  background: linear-gradient(45deg, var(--primary-color), transparent);
}
.node-add-link_hub .group-ts-tabs .horizontal-tabs,
.page-node-type-link-hub .group-ts-tabs .horizontal-tabs {
  border: none;
}
.node-add-link_hub .group-ts-tabs .ui-tabs-panel,
.page-node-type-link-hub .group-ts-tabs .ui-tabs-panel {
  padding: 30px 0 0 0;
}
.node-add-link_hub .group-ts-tabs .ui-state-default,
.page-node-type-link-hub .group-ts-tabs .ui-state-default {
  border: none;
  background: 0 0;
  margin: 0;
  border: 0 !important;
  padding: 0 5px;
  min-width: inherit;
}
.node-add-link_hub .group-ts-tabs.ui-widget.ui-widget-content,
.page-node-type-link-hub .group-ts-tabs.ui-widget.ui-widget-content {
  box-shadow: none;
}
.node-add-link_hub .group-ts-tabs .ui-tabs-nav li.ui-tabs-active a,
.page-node-type-link-hub .group-ts-tabs .ui-tabs-nav li.ui-tabs-active a {
  padding: 0.5em 1em;
  font-size: 16px;
  color: var(--primary-color);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 10px;
  border: 0 !important;
  isolation: inherit !important;
  position: relative;
}
.node-add-link_hub .group-ts-tabs .ui-tabs-nav li.selected a,
.page-node-type-link-hub .group-ts-tabs .ui-tabs-nav li.selected a {
  padding: 0 10px;
}

.node-add-link_hub
  .group-ts-tabs
  .ui-tabs-nav
  li.ui-tabs-active
  .ui-tabs-anchor
  strong,
.page-node-type-link-hub
  .group-ts-tabs
  .ui-tabs-nav
  li.ui-tabs-active
  .ui-tabs-anchor
  strong {
  font-size: 16px;
  font-weight: 500;
  border-radius: 6px;
  cursor: pointer;
  font-family: satoshi;
}
.node-add-link_hub .group-ts-tabs .ui-tabs-nav .ui-tabs-anchor strong,
.page-node-type-link-hub
  .group-ts-tabs
  .ui-tabs-nav
  .ui-tabs-anchor
  strong {
  font-size: 16px;
  font-weight: 500;
  border-radius: 6px;
  cursor: pointer;
  font-family: satoshi;
}
.node-add-link_hub .group-ts-tabs .ui-state-active,
.page-node-type-link-hub .group-ts-tabs .ui-state-active {
  background: 0 0 !important;
  color: var(--title) !important;
}
.node-add-link_hub .group-ts-tabs .ui-state-default a,
.page-node-type-link-hub .group-ts-tabs .ui-state-default a {
  font-size: 16px;
  color: var(--paragraph);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 10px;
  border: 0 !important;
  isolation: inherit !important;
  position: relative;
  color: var(--paragraph);
}
.node-add-link_hub
  .group-ts-tabs
  .ui-tabs-nav
  li.horizontal-tab-button.ui-tabs-active
  .ui-tabs-anchor
  .summary,
.page-node-type-link-hub
  .group-ts-tabs
  .ui-tabs-nav
  li.horizontal-tab-button.ui-tabs-active
  .ui-tabs-anchor
  .summary {
  border: 2px solid var(--primary-color);
}
.node-add-link_hub
  .group-ts-tabs
  .ui-tabs-nav
  li.horizontal-tab-button
  .ui-tabs-anchor
  .summary,
.page-node-type-link-hub
  .group-ts-tabs
  .ui-tabs-nav
  li.horizontal-tab-button
  .ui-tabs-anchor
  .summary {
  display: block;
  line-height: normal;
  margin-bottom: 0;
  position: absolute;
  right: 0;
  left: 0;
  bottom: -16px;
  width: 12px;
  height: 12px;
  margin: 0 auto;
  border-radius: 50%;
  border: 2px solid #858b98;
  content: "";
  background-color: #fff;
}

@media only screen and (max-width: 768px) {
  .node-add-link_hub .group-ts-tabs ul.horizontal-tabs-list:before,
  .page-node-type-link-hub .group-ts-tabs ul.horizontal-tabs-list:before {
    width: calc(100% - 180px);
    left: 70px;
  }
}
@media only screen and (max-width: 425px) {
  .node-add-link_hub .group-ts-tabs ul.horizontal-tabs-list:before,
  .page-node-type-link-hub .group-ts-tabs ul.horizontal-tabs-list:before {
    width: calc(100% - 140px);
    left: 64px;
  }
}
@media only screen and (max-width: 425px) {
  .node-add-link_hub .group-ts-tabs ul.horizontal-tabs-list:before,
  .page-node-type-link-hub .group-ts-tabs ul.horizontal-tabs-list:before {
    width: calc(100% - 140px);
    left: 64px;
  }
}
@media only screen and (min-width: 768px) {
  .menu-toggle-btn {
    display: none;
  }
}
@media (max-width: 320px) {
  .webform-submission-cancel-subscription-feedback-for-form a.skip-feedback {
    margin-top: 10px;
  }
}

/* Social bio page css end */

/* user register page*/
.user-register
  .email-field-wrapper
  #block-tubespanner-purple-registerloginlink
  p {
  text-align: center;
}
/* user register page end*/

.alert .placeholder a {
  color: #0f5132;
  pointer-events: none;
}
#drupal-modal
  .node-event-form
  .field--name-field-link
  fieldset
  .fieldset-wrapper {
  padding: 0px 5px;
}

.node-descriptions-form a.tabledrag-handle .handle,
.node-descriptions-edit-form a.tabledrag-handle .handle {
  background: unset;
}
/* TS-5237: the My Recent Projects typography did not match the dashboard.
 *
 * This block bumps a group of dashboard elements up a step. For most of them
 * that is presumably intended, so they are left alone. For the recent-project
 * card it produced a hierarchy inversion that is wrong on its own terms:
 *
 *   card title  h5  18px/700   <- LARGER than the section heading above it
 *   section     h2  16px/700
 *   card body   p   16px/400   <- the same size as that heading
 *
 * A card title should not outrank the section that contains it, and body copy
 * should not match a heading. The neighbouring dashboard panels sit at 14px
 * titles and 12.8px body, so the recent-project card was also the loudest
 * thing on a screen it shares with them.
 *
 * The two recent-project selectors are removed rather than given new values,
 * so the card falls back to the theme's own sizes in style.css:889-890,
 * 14px title and 11px body. That restores the hierarchy and matches the
 * panels beside it without inventing a scale.
 */
.dashboard .title,
.dashboard .card-info h4,
.dashboard .card-info p,
.dashboard .card-milestone p,
.dashboard .link-view-all {
  font-size: 16px;
}
.dashboard .toolbox-main p,
.dashboard .card-smiple-title {
  font-size: 18px;
}
.notify-msg {
  color: #121212;
  font-weight: 500;
}
.notify-msg a:hover,
.notify-msg a {
  color: #f26419;
}
.dashboard .btn.btn-secondary.do-next-open {
  color: #f26419;
  background: #fef7f3;
}
.dashboard .btn.btn-primary.btn-light.btn-skip {
  min-width: unset;
}
.block-views-blocklibrary-assets-recent-projects .block-header {
  margin-top: 3px;
}
.block-views-blocklibrary-assets-recent-projects .sec-group .block-header {
  min-height: 21px;
}
.dashboard .view-toolbox-dashboard .swiper svg {
  width: 35px;
  height: 35px;
  filter: brightness(0) saturate(100%) invert(53%) sepia(6%) saturate(383%)
    hue-rotate(184deg) brightness(94%) contrast(87%);
}
.dashboard .view-toolbox-dashboard .swiper a:hover svg {
  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%)
    hue-rotate(0deg) brightness(103%) contrast(103%);
}
.view-toolbox-dashboard .gear-setting-wrapper {
  min-width: 0;
}
.view-toolbox-dashboard .gear-setting-wrapper .title {
  overflow-wrap: break-word;
  word-break: break-word;
}
@media (max-width: 576px) {
  .view-toolbox-dashboard .gear-setting-wrapper .title {
    width: 60%;
  }
}
.sec-my-recent-project .card-recent-project .flex-grow-1 {
  padding-right: unset;
}
.view-social-post .custom-table th,
.view-social-post .custom-table td {
  padding: 8px 15px 8px 15px;
}
.path-scheduled-posts .social-post-form .js-form-wrapper.form-wrapper {
  height: 0px;
}
#left-container,
#right-container {
  transition: all 0.4s ease-in-out; /* smooth animation */
}

/* Expanded state */
#left-container.expanded,
#right-container.expanded {
  flex: 0 0 100%; /* full width */
  max-width: 100%;
}

/* Default 50/50 layout */
#left-container.default,
#right-container.default {
  flex: 0 0 50%;
  max-width: 50%;
}
/* onboarding */
.onboarding_progressbar {
  max-width: 500px;
  width: 100%;
  margin: 0 auto;
  padding: 30px 0;
  z-index: 9;
}

.onBoard_steps {
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.progress_step.active p {
  color: #7a2b7a;
  font-weight: bold;
}

.progress_step p {
  margin-top: 8px;
  font-size: 14px;
  color: #777;
  margin: 0 0 10px;
}

.progress_step {
  display: flex;
  justify-content: center;
  flex: 1;
}

.circle_dot {
  width: 18px;
  height: 18px;
  background: #fff;
  border: 3px solid #858b98;
  border-radius: 50%;
  z-index: 1;
}

.onBoard_steps_circle {
  display: flex;
  position: relative;
  margin: 0 80px;
}

.circle_box {
  flex: 1;
  display: flex;
  justify-content: center;
}

.progress_lineElements {
  content: "";
  position: absolute;
  top: 50%;
  left: 10%;
  height: 4px;
  z-index: -1;
  transform: translateY(-50%);
  border-radius: 50px;
  background: linear-gradient(45deg, var(--primary-color), transparent);
  max-width: 82%;
}

.circle_box.circle_first {
  justify-content: start;
}

.circle_box.circle_last {
  justify-content: flex-end;
}

.circle_box.circle_last {
  margin-right: -5px;
}

.circle_box.circle_first .circle_dot {
  margin-left: -10px;
}

.circle_box.active .circle_dot {
  background: #7a2b7a;
  border-color: var(--primary-color);
}
.onboarding_progressbar_controle .onBoard_steps_circle {
  margin: 0 auto;
}
.onboarding_progressbar_controle .circle_box {
  flex-direction: column;
  align-items: center;
}
 
.onboarding_progressbar_controle .progress_lineElements {
  top: auto;
  bottom: 5px;
}

.onbd-extension-wrapper .extension-logo {
  width: 50px; /* adjust size as needed */
  height: auto;
}
.onbd-extension-wrapper .internet-explorer-funny {
  position: relative;
}
.onbd-extension-wrapper .not-you{
  position: absolute;
  color: #EA2E2E;
  transform: rotate(316deg);
  font-weight: 700;
  font-size: 18px;
  text-transform: uppercase;
  left: 10px;
  line-height: 100%;
  top: 7px;
  left: 6px;
  text-shadow: 2px 2px 4px rgb(0, 0, 0);
}
.w-fit-content {
  width: fit-content;
}

@media screen and (max-width: 767px) {
  .onBoard_steps_circle {
    margin: 0 50px;
  }
  .step3-wrapper .step3-flex {
    flex-wrap: wrap;
  }
}
/* onboarding  end*/
/****** Maintenance page css begin ******/

.maintenance-page .main-box {
  background-image: url(/themes/custom/tubespanner_purple/custom-images/bg.png);
  background-repeat: no-repeat;
  background-position: center;
  height: 100vh;
  width: auto;
  position: relative;
  background-size: cover;
}

.maintenance-page .inner-tittle h2 {
  font-size: 35px;
  line-height: 40px;
  color: #fff;
  font-family: satoshi;
  margin-top: 60px;
  margin-bottom: 25px;
}
.maintenance-page .inner-tittle p {
  font-size: 35px;
}
.maintenance-page .inner-page {
  z-index: 999999;
  background: #000000a8;
  width: 100%;
  max-width: 80%;
  margin: 0 auto;
  height: 80vh;
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.maintenance-page .inner-text {
  padding: 60px;
}
.maintenance-page .inner-tittle p {
  font-size: 24px;
  color: #fff;
  padding: 20px 0px 0px;
  line-height: 1.3;
  font-family: satoshi;
  font-weight: 400;
}
.maintenance-page .tube-logo img {
  width: 430px;
}
.maintenance-page .image-left img {
  width: 90%;
}
.maintenance-page .image-left {
  width: 660px;
  display: flex;
  align-items: end;
  margin-bottom: 20px;
}
.maintenance-page .inner-content {
  margin: 20px 0;
}
@media screen and (max-width: 991px) {
  .maintenance-page .inner-page {
    flex-wrap: wrap;
    height: 90%;
    max-width: 90%;
  }
  .maintenance-page .inner-text {
    padding: 30px;
  }
  .maintenance-page .image-left {
    margin: 0;
    width: 100%;
    padding: 20px;
    text-align: end;
    justify-content: end;
  }
  .maintenance-page .image-left img {
    width: 250px;
    height: 100%;
  }
  .maintenance-page .inner-tittle p {
    font-size: 24px;
  }
  .maintenance-page .tube-logo img {
    width: 100%;
    max-width: 60%;
  }
}
@media screen and (min-width: 991px) {
  .maintenance-page .inner-text .tube-logo img {
    margin-left: -30px;
    margin-top: -30px;
  }
}
@media screen and (max-width: 560px) {
  .maintenance-page .inner-tittle h2 {
    font-size: 28px;
    color: #fff;
    line-height: 26px;
    margin-top: 15px;
  }
  .maintenance-page .inner-tittle p {
    font-size: 16px;
    line-height: 20px;
    padding-bottom: 15px;
  }
}
/****** Maintenance page css end ******/

body:not(.user-logged-in) .dashaboard-content#hall-of-fame {
  margin-left: 0px;
}
.auth-button.hall-of-legends-btn .btn .icon-text {
  display: inline-block;
  padding: 2px 10px;
  margin: 0;
}
/* hide burger menu for anonymous user */
.user-logged-out .menu-toggle-btn {
  display: none;
}

/* Smart description templates css */
.card-recent-project .imgbx img {
  cursor: default !important;
}
.card-recent-project .action-tool a {
  cursor: pointer;
}
/* Smart description templates css */
.node-event-form span.fieldset-legend {
  font-size: 14px;
  font-weight: 700;
  color: var(--title);
}
.node-event-form legend {
  margin-bottom: 0px;
}
.path-user-channels .ui-dialog .channelgenreform h3 {
  font-size: 14px;
  font-weight: 700;
  color: var(--title);
  padding-bottom: 8px;
}
#node-delete-multiple-confirm-form .button.dialog-cancel {
  font-size: 13px;
}
/* Dashboard calender issue fix css */
.fc-daygrid-day-top + .fc-daygrid-day-events {
  display: none !important;
}
body.dashboard .fc-daygrid-day-frame {
  pointer-events: none !important;
}
body.dashboard .render-wrapper {
  pointer-events: all !important;
}
body.dashboard .fc-daygrid-event-harness a.fc-event {
  padding-top: 5px;
  padding-bottom: 10px;
}
.card.card-connected-channel.social-platform-card {
  min-height: 200px;
}
/* Dashboard calender issue fix css end */
/** SEO page **/
.progressbarpatter .bar-bg {
  height: 15px;
  border-radius: 25px;
  background: #abe56b;
}
.progressbarpatter .progressbar-marker svg path {
  fill: #abe56b;
}
.progressbarpatter .pattern-bg {
  opacity: 0.6;
  background: repeating-linear-gradient(
    -45deg,
    rgb(222, 234, 210),
    rgb(222, 234, 210) 2px,
    transparent 2px,
    transparent 10px
  );
  height: 15px;
}
.trending-headlines .video-item {
  background: #f8f9fa;
  padding: 15px;
  border-radius: 10px;
  margin-bottom: 10px;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
}

.trending-headlines .circle {
  width: 40px;
  height: 40px;
  background-color: var(--primary-color);
  color: white;
  font-weight: bold;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  margin: auto;
}

.trending-headlines .percentage {
  margin-top: 5px;
  font-size: 14px;
  font-weight: bold;
  color: var(--primary-color);
}

.trending-headlines .video-title {
  font-size: 16px;
  font-weight: bold;
  color: #007bff;
  text-decoration: none;
}

.trending-headlines .video-title:hover {
  text-decoration: underline;
}

.comp-ranking-tabs .nav-item .nav-link {
  background-color: var(--primary-color);
  color: #fff;
  border-radius: 0;
  //font-family: Satoshi;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 16px;
  border-radius: 5px 5px 0px 0px;
  opacity: 0.7;
}

.comp-ranking-tabs .nav-item .nav-link.active {
  background-color: var(--primary-color);
  color: #fff;
  border-radius: 0;
  //font-family: Satoshi;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 16px;
  border-radius: 5px 5px 0px 0px;
  opacity: unset;
}

.comp-ranking-tabs .nav-item {
  margin-left: 1px;
}
.lp-free .menu-toggle-btn {
  display: none;
}
#block-tubespanner-purple-notification div {
  margin-left: unset;
}
/** SEO page end**/

.path-user-reply-library a.add-tubespanner-custom-reply-comment {
  margin-top: 15px;
}
#views-exposed-form-guided-search-guided-search-block {
  margin-bottom: 0px;
}
.seo-tools-wrapper.user-projects table.table th:nth-child(1) {
  min-width: 500px;
}
.seo-tools-wrapper.user-projects table.table th:nth-child(2) {
  min-width: 300px;
}
.bluesky-connect-blue-sky-connect .description {
  display: block;
}
.bluesky-connect-blue-sky-connect .description a {
  color: var(--secondary-color);
}
@media (max-width: 1024px) {
  .seo-tools-wrapper.user-projects table.table th:nth-child(1) {
    min-width: 300px;
  }
}
@media screen and (max-width: 1440px) and (min-width: 1400px) {
  .path-description-templates.administrator-user
    .view-smart-description
    .card.my-promo-page {
    padding: 12px;
  }
}
@media (min-width: 1200px) and (max-width: 1399px) {
  .path-description-templates.administrator-user .customization-btn {
    padding: 5px;
  }
}
@media (min-width: 1400px) {
  .path-description-templates.administrator-user .customization-btn {
    padding: 5px 2px;
  }
}
@media screen and (max-width: 1420px) and (min-width: 1199px) {
  .path-mailing-lists .d-xl-flex,
  .path-content-ideas .d-xl-flex,
  .path-title-ideas .d-xl-flex {
    display: block !important;
  }
  .path-mailing-lists .d-xl-flex .column-box-half,
  .path-content-ideas .d-xl-flex .column-box-half,
  .path-title-ideas .d-xl-flex .column-box-half {
    margin-top: 20px;
    max-width: 99%;
  }
}
@media screen and (max-width: 1440px) and (min-width: 991px) {
  .path-user-thumbnails .thumbnails-btn-group a.btn {
    padding: 10px;
  }
}
@media screen and (max-width: 1024px) and (min-width: 600px) {
  .page-node-type-hall-of-fame .creator-wrapper {
    display: block;
  }

  .page-node-type-hall-of-fame .creator-wrapper .creator-img {
    margin: 20px auto;
  }
}
@media only screen and (max-width: 991px) {
  body.page-node-type-link-hub
    .cont-detail-bg.site-content.main-content.region--dark-typography.region--white-background {
    min-height: calc(100vh - 1px) !important;
  }
  .sec-my-recent-project .project-parent {
    flex-wrap: wrap;
  }
  .sec-my-recent-project .project-col {
    width: 100%;
  }
  .sec-my-recent-project .project-parent .project-col .imgbx {
    width: 100%;
    flex: 1;
  }
}
@media only screen and (max-width: 767px) {
  .connect-box {
    flex-direction: column;
    align-items: center;
  }
  .removal-confirmation li.confirm-remove button::after {
    width: 12px;
    height: 12px;
    margin-left: 12px;
  }
  .removal-confirmation {
    right: -6px;
  }
  .path-user-script .views-form .card.ts-empty-state.no-result {
    margin-top: 0;
  }
}
@media screen and (max-width: 767px) {
  .connect-box {
    flex-direction: column;
    align-items: center;
  }
}

/* New registration process updates */
.email-register a {
  color: var(--primary-color);
}
/* New registration process updates end */

@media only screen and (max-width: 767px) {
  .path-user-reply-library table.custom-table td a img {
    max-width: none;
  }
  .path-user-channels .card-connected-channel .sec-media-list .d-md-flex {
    display: flex;
    padding-top: 30px;
  }
  .path-user-channels
    .card-connected-channel
    .sec-media-list
    .d-md-flex
    .text-notes-list
    h5 {
    margin-bottom: -8px;
  }
}
@media only screen and (max-width: 767px) and (min-width: 330px) {
  .path-user-channels
    .card-connected-channel
    .top-head-block
    .sec-media-item
    .text-notes-list {
    margin-top: 35px;
  }
}
@media (max-width: 475px) {
  .sec-user-membership-main
    .user-form
    .form-actions.js-form-wrapper.form-wrapper
    .btn {
    margin-top: 10px;
  }
}
@media (max-width: 375px) {
  .path-tubespanner-tokens .d-flex {
    justify-content: center;
  }
  .path-tubespanner-tokens .ac-save-button,
  .path-tubespanner-tokens .ac-edit-button {
    font-size: 12px;
  }
  .path-notifications .ts-notifications-form .table-tube .custom-table th,
  .path-notifications .ts-notifications-form .table-tube .custom-table td {
    padding: 0.5rem;
  }
}
@media only screen and (max-width: 330px) {
  .sec-user-membership-main
    .user-form
    .form-actions.js-form-wrapper.form-wrapper
    .btn {
    padding: 6px;
    margin-top: 5px;
  }
  .path-user-channels
    .card-connected-channel
    .top-head-block
    .sec-media-item
    .text-notes-list {
    margin-top: 25px;
  }
}
/* hide objective percentage display */
.sec-channel-obj .control-field .form-label .text-end {
  display: none;
}
/* hide objective percentage display end */

#react-app .hstack .p-2 {
  float: left;
  text-align: center;
}
/* Padding only. The border-radius here was 0.2rem, which is Bootstrap's own
   .btn-sm default restated, so it added nothing except specificity: an element
   plus two classes (0,2,1) beats the house .btn.btn-primary (0,2,0). The
   result was that every small button in the SPA lost the 8px house radius and
   came out at 3.2px, while full-size buttons kept 8px. Visible on
   /dashboard/user-facts, where Answer, Add fact and Add story sat at 3.2px
   next to a header Create button at 8px. Dropping the line lets the theme
   radius apply; the padding stays so nothing reflows. */
button.btn.btn-sm {
  padding: 0.25rem 0.5rem;
}
.lextronics-item .col-4 {
  float: left;
}
.lextronics-item .col-8 {
  float: left;
}
label.accordion-header-text.form-label {
  font-size: 12px;
  padding: 3px 0px 3px 0px;
}

/** HomeRun Page **/
.homerun-wrapper span.badge.homerun-btn {
  background: #2bc485;
}
.loader {
  width: 42px;
  aspect-ratio: 4;
  --_g: no-repeat radial-gradient(circle closest-side, #763475 90%, #0000);
  background: var(--_g) 0% 50%, var(--_g) 50% 50%, var(--_g) 100% 50%;
  background-size: calc(100% / 3) 100%;
  animation: l7 1s infinite linear;
}
.btnWrapper {
  position: relative;
}
.btnWrapper .loader {
  position: absolute;
  width: 45px;
  top: 35%;
  left: 50%;
  transform: translate(-50%, -50%);
  --_g: no-repeat radial-gradient(circle closest-side, #000000 90%, #0000);
}
.view.view-toolbox-dashboard.view-display-id-dashboard_tools
  .views-exposed-form,
.view.view-toolbox-dashboard.view-display-id-page_1 .views-exposed-form {
  display: none;
}
#block-scheduledposts #Scheduled-posts-root .fc-toolbar-title {
  text-align: center;
}
.dashboard
  .ui-dialog.gear-setting-modal
  ~ .ajax-progress.ajax-progress-fullscreen {
  display: none;
}

/** End HomeRun Page **/
@media screen and (min-width: 1201px) and (max-width: 1460px) {
  .card-recent-project .action-tool {
    position: relative;
    align-items: end;
    text-align: right;
    display: block;
  }
}

/* Project Planner */
/* css for correcting auto complete display */
#drupal-modal .ui-autocomplete {
    width: 90% !important;
}

#drupal-modal .ui-autocomplete li.ui-menu-item {
    width: 100% !important;
}

#drupal-modal .ui-autocomplete li.ui-menu-item a.ui-menu-item-wrapper, #drupal-modal .ui-autocomplete li.ui-menu-item a.ui-menu-item-wrapper.ui-state-active {
    width: -webkit-fill-available;
    display: block;
    border-radius: 15px;
}

.project-category a {
    padding: 5px;
    font-weight: bold;
    color: #fff !important;
}
.project-category a {
    padding: 5px;
    color: #FFF !important;
    font-weight: bold;
}
/* Project Planner end */

/* TS-4176: Do Next cards — fit the new action-led microcopy. */
.do-next-col .card-info h4 { line-height: 1.3; margin-bottom: 6px; }
.card-info p.do-next-blurb { font-size: 14px; line-height: 1.4; color: var(--paragraph); margin-bottom: 12px; }
.do-next-col .suggestions > .d-flex.justify-content-between.align-items-center { flex-wrap: nowrap; align-items: stretch; gap: 8px; }
.card-info .btn.do-next-open { flex: 1 1 auto; min-width: 0; white-space: normal; min-height: 46px; display: inline-flex; align-items: center; justify-content: center; text-align: center; line-height: 1.25; padding: 6px 12px; }
.card-info .btn.btn-skip { flex: 0 0 auto; min-width: 0; min-height: 46px; display: inline-flex; align-items: center; justify-content: center; }
/* Skip was pinned to 100px and the action next to it was left with 24, so the
 * dismiss button had four times the width of the thing we want people to do,
 * and the action's label wrapped inside a box too small to hold it.
 *
 * The 100px comes from `.btn.btn-primary.btn-light.btn-skip` in style.css.
 * override.css already unset it, but only under a `.dashboard` ancestor, and
 * the Channel Audit page does not have one, so the rule never applied here.
 * Matched at five classes so it holds wherever the card is used rather than
 * depending on an ancestor that may or may not be present.
 *
 * Skip is also quieter now. It is the lesser of the two actions and should not
 * out-weigh the one beside it. */
.card-info .btn.btn-primary.btn-light.btn-skip {
  min-width: 0;
  flex: 0 0 auto;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  background: transparent;
  border-color: transparent;
}
.card-info .btn.btn-primary.btn-light.btn-skip:hover,
.card-info .btn.btn-primary.btn-light.btn-skip:focus-visible {
  background: #f4f2f8;
  border-color: transparent;
}
/* The two buttons had nothing between them, so the action and the dismiss read
   as one control. */
.card-info .d-flex.justify-content-between {
  gap: 8px;
}
.do-next-col .img-figure .do-next-icon { font-size: 34px; color: #5b2a86; display: flex; align-items: center; justify-content: center; width: 100%; min-height: 88px; }

/* TS-4176: colour-code the icon tile by card category. */
/* Connect & set up */
.do-next-col[data-evaluator-plugin-id="connected_channel_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="install_extension_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="reconnect_youtube_channel_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="user_objective_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="youtube_evaluator"] .img-figure {
  background: #efe9f8;
}
.do-next-col[data-evaluator-plugin-id="connected_channel_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="install_extension_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="reconnect_youtube_channel_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="user_objective_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="youtube_evaluator"] .img-figure .do-next-icon {
  color: #6a3aa8;
}
/* Grow on social */
.do-next-col[data-evaluator-plugin-id="facebook_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="linkedin_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="social_media_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="social_share_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="ts_link_to_social_account_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="twitter_evaluator"] .img-figure {
  background: #e7f0fb;
}
.do-next-col[data-evaluator-plugin-id="facebook_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="linkedin_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="social_media_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="social_share_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="ts_link_to_social_account_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="twitter_evaluator"] .img-figure .do-next-icon {
  color: #2b6cb0;
}
/* Channel basics */
.do-next-col[data-evaluator-plugin-id="channel_about_content_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="channel_banner_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="channel_category_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="channel_checklist_complete_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="channel_country_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="channel_description_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="channel_handle_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="channel_keywords_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="channel_links_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="channel_permissions_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="channel_title_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="channel_upload_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="channel_watermark_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="duplicate_check_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="enable_link_blocking_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="live_redirects_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="set_channel_language_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="set_kids_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="upload_visibility_evaluator"] .img-figure {
  background: #e4f3ee;
}
.do-next-col[data-evaluator-plugin-id="channel_about_content_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="channel_banner_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="channel_category_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="channel_checklist_complete_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="channel_country_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="channel_description_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="channel_handle_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="channel_keywords_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="channel_links_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="channel_permissions_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="channel_title_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="channel_upload_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="channel_watermark_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="duplicate_check_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="enable_link_blocking_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="live_redirects_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="set_channel_language_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="set_kids_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="upload_visibility_evaluator"] .img-figure .do-next-icon {
  color: #1f7a68;
}
/* Channel spotlight */
.do-next-col[data-evaluator-plugin-id="subscribers_channel_trailer_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="unsubbed_channel_trailer_evaluator"] .img-figure {
  background: #fbf0da;
}
.do-next-col[data-evaluator-plugin-id="subscribers_channel_trailer_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="unsubbed_channel_trailer_evaluator"] .img-figure .do-next-icon {
  color: #b0791a;
}
/* Content & video */
.do-next-col[data-evaluator-plugin-id="comments_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="custom_description_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="end_slate_link_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="publish_video_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="scoring_video_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="thumbnail_link_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="video_tags_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="video_title_quality_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="write_script_evaluator"] .img-figure {
  background: #fbe9f1;
}
.do-next-col[data-evaluator-plugin-id="comments_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="custom_description_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="end_slate_link_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="publish_video_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="scoring_video_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="thumbnail_link_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="video_tags_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="video_title_quality_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="write_script_evaluator"] .img-figure .do-next-icon {
  color: #b8386e;
}
/* Account & housekeeping */
.do-next-col[data-evaluator-plugin-id="contact_details_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="notifications_evaluator"] .img-figure,
.do-next-col[data-evaluator-plugin-id="upgrade_plan_evaluator"] .img-figure {
  background: #edeef3;
}
.do-next-col[data-evaluator-plugin-id="contact_details_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="notifications_evaluator"] .img-figure .do-next-icon,
.do-next-col[data-evaluator-plugin-id="upgrade_plan_evaluator"] .img-figure .do-next-icon {
  color: #556072;
}

/* TS-4176: replace the faded ghost fillers with a single clean "more coming" tile.
   (.first-div scope beats calendar-custom.css's blur/absolute rules and covers
   both the dashboard and channel-audit surfaces.) */
.first-div .two-remaining-item ~ .two-remaining-item { display: none; }
.first-div .two-remaining-item { height: auto; }
.first-div .two-remaining-item > img { display: none; }
.first-div .two-remaining-item > p {
  position: static;
  transform: none;
  min-width: 0;
  margin: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px 18px;
  border: 1px dashed #d6cfe6;
  border-radius: 12px;
  background: #faf9fc;
  color: var(--paragraph);
  font-size: 14px;
  line-height: 1.4;
  text-align: center;
}

/* TS-5053: live "next refresh" countdown + tier upsell inside the filler tile.
   Reuses the dashed-box look above; scoped to .first-div so it covers both the
   dashboard and channel-audit surfaces. */
.first-div .two-remaining-item .donext-refresh-tile {
  height: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 24px 18px;
  border: 1px dashed #d6cfe6;
  border-radius: 12px;
  background: #faf9fc;
  color: var(--paragraph);
  font-size: 14px;
  line-height: 1.4;
  text-align: center;
}

.first-div .two-remaining-item .donext-refresh-icon {
  font-size: 22px;
  line-height: 1;
  color: #8a7fb8;
  margin-bottom: 2px;
}

.first-div .two-remaining-item .donext-refresh-headline {
  font-weight: 600;
  color: var(--headings, #2c2c3a);
}

.first-div .two-remaining-item .donext-refresh-sub {
  font-size: 12.5px;
  opacity: 0.75;
}

/* This is now a <button> rather than an <a>: it opens the upgrade gate in
   place instead of navigating to /subscription-plans. The rule was written for
   an anchor, so the reset below is what keeps it looking identical - without
   it the browser's default button chrome (background, border, padding, centred
   font) shows through. */
.first-div .two-remaining-item .donext-refresh-cta {
  margin-top: 8px;
  font-size: 12.5px;
  font-weight: 600;
  color: #6f5cc4;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  background: none;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  padding: 0;
  font-family: inherit;
  cursor: pointer;
}

.first-div .two-remaining-item .donext-refresh-cta:hover {
  color: #5a49a8;
  border-bottom-color: currentColor;
}

/* The notifications empty state.
 *
 * Reuses .notification-section-wrapper.card so an empty category sits in the
 * same panel as a populated one, rather than the tab appearing to do nothing.
 * Padding because the card's own padding is carried by the table in the
 * populated case, and a bare paragraph would otherwise sit flush to the edge. */
.notification-sec .notification-empty {
  margin: 0;
  padding: 24px;
  color: #5b5872;
}
