/*!
Theme Name: Stackifya Portal
Theme URI: https://stackifya.com
Author: Stackifya
Author URI: https://stackifya.com
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: stackifya-portal
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Stackifya Portal is based on Underscores https://stackifya.com, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/

/*--------------------------------------------------------------
>>> VARIALBES:
----------------------------------------------------------------*/
:root {
  --cure-font: "Poppins", sans-serif;
  --cure-primary-color: #eea851;
  --primary-gold-600: #75744a;
  --primary-gold-500: #000;
  --primary-gold-400: #b9b990;
  --primary-gold-300: #c5c3a3;
  --primary-gold-50: #f4f4f0;
  --primary-gold-100: #f3f2da;
  --primary-gold-800: #4f4d20;

  --neutral-50: #fafafa;
  --neutral-500: #191919;
  --neutral-400: #808080;
  --neutral-800: #242d35;
  --neutral-100: #f3f3f3;
  --neutral-200: #e7e7e7;
  --neutral-300: #bababa;

  --error-red-100: #ffe7d7;
  --error-red-500: #ff4538;
  --error-red-800: #931129;

  --success-green-100: #e6fcdd;
  --success-green-600: #39b34a;
  --success-green-800: #197937;

  --warning-yellow-600: #d6b306;

  --info-blue-700: #668b9b;

  --gray-800: #242d35;
}

* {
  scrollbar-width: thin;
  scrollbar-color: #3a3a34 #101010;
}

*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

*::-webkit-scrollbar-track {
  background: #101010;
}

*::-webkit-scrollbar-thumb {
  background: #3a3a34;
  border: 2px solid #101010;
  border-radius: 999px;
}

*::-webkit-scrollbar-thumb:hover {
  background: #5d5b48;
}

*::-webkit-scrollbar-corner {
  background: #101010;
}

/*--------------------------------------------------------------
>>> GLOBAL CLASSES
----------------------------------------------------------------*/
.space-between {
  justify-content: space-between;
}
.no-white-space {
  white-space: nowrap;
}
.common-flex {
  display: flex;
  align-items: center;
  column-gap: 6px;
}
.cure-centered-section {
  max-width: 988px;
  margin: auto;
  padding: 50px 0;
}
.gap-10 {
  height: 10px;
  width: 100%;
}
.gap-20 {
  height: 20px;
  width: 100%;
}
.gap-30 {
  height: 30px;
  width: 100%;
}
.gap-40 {
  height: 40px;
  width: 100%;
}
.gap-50 {
  height: 50px;
  width: 100%;
}
/*--------------------------------------------------------------
>>> EDIT CLIENT REPORTING MODAL
----------------------------------------------------------------*/
.cure-modal.edit-client-report .client-modal-heading img {
  width: 48px;
}
.cure-modal.edit-client-report .client-modal-heading {
  display: flex;
  align-items: center;
  column-gap: 6px;
}

/*--------------------------------------------------------------
>>> VIEW FILTER
----------------------------------------------------------------*/
.view-filter {
  display: flex;
  align-items: flex-end;
}
.view-filter .button-wrapper {
  display: flex;
  justify-content: flex-end;
}
.view-filter .normal--view,
.view-filter .all--view {
  border-radius: 200px 0px 0px 200px;
}
.view-filter .compact--view,
.view-filter .billable--view {
  border-radius: 0px 200px 200px 0px;
}
.btn-cure-alt.active {
  color: #fff;
  background-color: var(--primary-gold-500);
}
.btn-cure-alt.active svg path {
  fill: #ffffff;
}

/*--------------------------------------------------------------
>>> Client Briefs
----------------------------------------------------------------*/
.main.project-briefs .status-of-approval .bs-text {
  padding: 5px 10px 7px 10px;
  font-size: 12px;
  font-weight: 500;
  border-radius: 12px;
  color: var(--neutral-500);
  text-align: center;
}
.main.project-briefs .status-of-approval .common-flex {
  justify-content: space-between;
}
.main.project-briefs .status-of-approval.for-approval .bs-text {
  background-color: var(--primary-gold-100);
  color: var(--primary-gold-800);
}
.change--status {
  display: flex;
}

/*--------------------------------------------------------------
>>> Client Overview
----------------------------------------------------------------*/
.client-overview-msg {
  padding: 10px 30px 30px 30px;
  position: relative;
  margin-top: -40px;
}
.client-overview-msg .btn-cure {
  margin-bottom: 17px;
}
.client-overview-msg p {
  text-align: center;
  font-size: 12px;
  color: var(--neutral-400);
}
.brief-fields.client-overview .cure-field-group {
  max-width: 100%;
}
.brief-fields.client-overview
  .cure-field-group
  > div:not(.cure-rich-text-editor)
  p {
  font-size: 12px;
  color: var(--neutral-400);
  max-width: 194px;
}
.brief-fields.client-overview .progress-bar .meter {
  width: 50%;
}
.submit-brief.btn-cure.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/*--------------------------------------------------------------
>>> NEW CLIENT MODAL
----------------------------------------------------------------*/
.cure-modal.new-client form,
.cure-modal.new-client-report form,
.cure-modal form {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
}
button.add-logo {
  outline: none;
  border: none;
  background: transparent;
  display: flex;
  padding-left: 0;
  cursor: pointer;
  transition: all 0.3s ease;
}
button.add-logo:hover {
  opacity: 0.7;
}
button.add-logo img {
  width: 36px;
  border-radius: 50%;
}
.client-name {
  display: flex;
  align-items: center;
  column-gap: 5px;
}
.client-name img {
  width: 32px;
  border-radius: 50%;
}

/*--------------------------------------------------------------
>>> BREADCRUMBS
----------------------------------------------------------------*/
.cure-breadcrumbs {
  display: flex;
  align-items: center;
  column-gap: 6px;
}
.cure-breadcrumbs span:not(.current-breadcrumb) {
  color: var(--neutral-300);
}
.cure-breadcrumbs span {
  font-size: 12px;
}
.cure-section-heading h2 {
  font-size: 18px;
  margin-bottom: 10px;
}

/*--------------------------------------------------------------
>>> CLIENT REPORTING DASHBOARD
----------------------------------------------------------------*/
.client-reporting-dashboard .cure-filters {
  padding-top: 0;
}
.client-reporting-dashboard .td-status > div {
  text-transform: capitalize;
}

/*--------------------------------------------------------------
>>> SELECT 2
----------------------------------------------------------------*/
.select2-search--dropdown i {
  position: absolute;
  right: 16px;
  top: 12px;
  color: var(--primary-gold-500);
  display: flex;
}
.select2-container {
  background-color: #fff !important;
}
.select2-container--default
  .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: #000 !important;
  color: chartreuse !important;
}
.select2-container--default .select2-results__option--selected {
  background: inherit !important;
  color: chartreuse;
}
.select2-selection__rendered:focus-visible,
.select2-selection:focus-visible {
  outline: none !important;
}
.select2-search--dropdown {
  position: relative;
}
.main.approvals .select2-container {
  width: 200px !important;
}
.select2-container .select2-selection--single {
  height: 40px !important;
}
.select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  line-height: 40px !important;
  padding-right: 40px !important;
  padding-left: 20px !important;
  background: rgba(0, 0, 0, 0.9) !important;
  color: var(--neutral-100) !important;
}
.select2-container--default .select2-selection--single {
  border: none !important;
  border-bottom: 0.5px solid var(--neutral-500) !important;
  border-radius: 0 !important;
  height: 40px;
}
.select2-container--default .select2-selection--single:hover {
  background-color: var(--neutral-50);
  cursor: pointer;
}
.select2-dropdown {
  border: 2px solid rgba(0, 0, 0, 0.9) !important;
  border-top: 0 !important;
  background: rgba(0, 0, 0, 0.9) !important;
  overflow: hidden !important;
}
.select2-results__options {
  overflow-x: hidden !important;
  scrollbar-width: thin;
  scrollbar-color: #444 transparent;
}
.select2-results__options::-webkit-scrollbar {
  width: 4px;
}
.select2-results__options::-webkit-scrollbar-track {
  background: transparent;
}
.select2-results__options::-webkit-scrollbar-thumb {
  background: #444;
  border-radius: 4px;
}
.select2-results__options::-webkit-scrollbar-thumb:hover {
  background: #666;
}
.select2-container--default
  .select2-selection--single
  .select2-selection__arrow {
  height: 40px !important;
  right: 10px !important;
}
.select2-container--default
  .select2-selection--single
  .select2-selection__arrow
  b {
  border-color: var(--primary-gold-300) transparent transparent transparent !important;
}
.select2-container--default.select2-container--open
  .select2-selection--single
  .select2-selection__arrow
  b {
  border-color: transparent transparent var(--primary-gold-300) transparent !important;
}
.select2-container--default.select2-container--open.select2-container--below
  .select2-selection--single,
.select2-container--default.select2-container--open.select2-container--below
  .select2-selection--multiple {
  background: var(--primary-gold-50) !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
  border: none !important;
  border-bottom: 0.5px solid var(--neutral-500) !important;
  opacity: 0.5 !important;
}
.select2-container--open .select2-dropdown--below {
  padding: 20px !important;
}
.select2-container--default
  .select2-search--dropdown
  .select2-search__field:focus-visible {
  outline: none;
  border-bottom: 0.5px solid var(--primary-gold-500) !important;
  opacity: 1 !important;
}

/* Multiple */
.select2-container--default .select2-selection--multiple {
  border: none !important;
  border-bottom: 0.5px solid var(--neutral-500) !important;
  border-radius: 0 !important;
  line-height: 40px !important;
}
.select2-selection--multiple .select2-search--inline {
  display: inline-flex !important;
  align-items: center !important;
}
.select2-selection--multiple .select2-search--inline .select2-search__field {
  height: 32px !important;
  min-width: 80px !important;
  margin: 4px 0 !important;
  padding: 0 8px !important;
  resize: none !important;
  background: transparent !important;
  border: none !important;
  color: #fff !important;
  font-size: 13px !important;
  line-height: 32px !important;
  overflow: hidden !important;
}
.option-image {
  width: 32px;
  border-radius: 50%;
  vertical-align: middle;
  padding-right: 5px;
}
.select2-container--default .select2-selection--multiple {
  padding: 0px 40px 0 20px !important;
  background: rgba(0, 0, 0, 0.9) !important;
}
.select2-search {
  display: flex;
  align-items: center;
  height: 40px;
}
.select2-search textarea {
  margin: 0 !important;
}
.select2-container--default.select2-container--open.select2-container--below
  .select2-selection--multiple {
  background: rgba(0, 0, 0, 0.9) !important;
}
.select2-container--default
  .select2-selection--multiple
  .select2-selection__choice {
  background: #000 !important;
}
.select2-container--default
  .select2-selection--multiple
  .select2-selection__choice__remove:hover {
  background: chartreuse;
}
.select2-container--default
  .select2-selection--multiple
  .select2-selection__choice__remove:hover
  span {
  color: #000;
}

/* Assignee select2 — dropdown option */
.s2-option {
  display: flex;
  align-items: center;
  gap: 8px;
}
.s2-option__avatar {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.s2-option__name {
  font-size: 13px;
  color: #fff;
}

/* Assignee select2 — selected pill */
.s2-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  line-height: 1;
}
.s2-tag__avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.s2-tag__name {
  font-size: 12px;
  color: #fff;
}

/* Override the plain black pill with a styled one */
.select2-container--default
  .select2-selection--multiple
  .select2-selection__choice {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  background: #1e1e1e !important;
  border: 1px solid #333 !important;
  border-radius: 20px !important;
  padding: 4px 4px 4px 10px !important;
  margin: 4px 4px !important;
}

.select2-container--default
  .select2-selection--multiple
  .select2-selection__choice__remove {
  order: 1;
  margin-left: 4px !important;
  color: #888 !important;
  border: none !important;
  background: none !important;
}

/*--------------------------------------------------------------
>>> 404 NOT FOUND:
----------------------------------------------------------------*/
.cr-table th div {
  display: flex;
  align-items: center;
  column-gap: 5px;
}
.text-center {
  text-align: center;
}

.invisible {
  visibility: hidden;
}

.not-found {
  width: 100%;
}

.notfound-404 span {
  font-size: unset;
}

#notfound {
  position: relative;
  height: calc(100vh - 50px);
  width: 100%;
}

#notfound .notfound {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.notfound {
  max-width: 520px;
  width: 100%;
  line-height: 1.4;
  text-align: center;
}

.notfound .notfound-404 {
  position: relative;
  height: 240px;
}

.notfound .notfound-404 h1 {
  font-family: "Montserrat", sans-serif;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 252px;
  font-weight: 900;
  margin: 0px;
  color: #262626;
  text-transform: uppercase;
  letter-spacing: -40px;
  margin-left: -20px;
}

.notfound .notfound-404 h1 > span {
  text-shadow: -8px 0px 0px #fff;
  color: var(--primary-gold-400);
}

.notfound .notfound-404 h3 {
  font-family: "Cabin", sans-serif;
  position: relative;
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  color: #262626;
  margin: 0px;
  letter-spacing: 3px;
  padding-left: 6px;
}

.notfound h2 {
  font-family: "Cabin", sans-serif;
  font-size: 20px;
  font-weight: 400;
  text-transform: uppercase;
  color: #000;
  margin-top: 0px;
  margin-bottom: 25px;
}

@media only screen and (max-width: 767px) {
  .notfound .notfound-404 {
    height: 200px;
  }
  .notfound .notfound-404 h1 {
    font-size: 200px;
  }
}

@media only screen and (max-width: 480px) {
  .notfound .notfound-404 {
    height: 162px;
  }
  .notfound .notfound-404 h1 {
    font-size: 162px;
    height: 150px;
    line-height: 162px;
  }
  .notfound h2 {
    font-size: 16px;
  }
}

.cure-radio-choice {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 10px;
  margin-top: 10px;
}

.cure-radio-choice label {
  white-space: nowrap;
}

/*--------------------------------------------------------------
>>> LAYOUT:
----------------------------------------------------------------*/
.cure-radio-group > label {
  display: flex;
  align-items: center;
  column-gap: 8px;
  cursor: pointer;
  font-size: 12px;
}
input[type="radio"] {
  appearance: none;
  border: 1px solid var(--primary-gold-600) !important;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  position: relative;
  padding: 0 !important;
  cursor: pointer;
}

input[type="radio"]:checked::before {
  content: "";
  width: 6px;
  height: 6px;
  background-color: var(--primary-gold-500);
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

body.modal-active {
  overflow: hidden;
}
.cure-team > div {
  display: flex;
}
.cure-team > div img {
  border-radius: 50%;
  border: 2px solid var(--primary-gold-50);
  margin-right: -15px;
}
.not-allowed {
  cursor: not-allowed !important;
}
.force-hide {
  display: none !important;
}

td.the-user img {
  border-radius: 50%;
}

body {
  margin: 0;
  background: #000;
}

html {
  scroll-behavior: smooth;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  font-family: var(--cure-font);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  color: var(--neutral-100);
}

table {
  border-collapse: collapse;
  width: 100%;
}

.cure-section {
  padding: 20px;
}

.rounded {
  border-radius: 50%;
}

.media-modal-content {
  background: #000 !important;
  border: 1px solid rgba(255, 255, 255, 0.04);
}

.media-toolbar {
  background: #000 !important;
}

.media-router .active,
.media-router .media-menu-item:focus {
  border-color: #fff !important;
  color: #fff !important;
  outline-color: #fff !important;
}

.media-router .active,
.media-router .media-menu-item:hover {
  color: chartreuse !important;
}

.media-frame select,
.media-modal-content .attachments-browser .search {
  background-color: rgba(255, 255, 255, 0.1) !important;
  border: none !important;
  color: #fff !important;
}

.media-frame select:focus,
.media-modal-content .attachments-browser .search:focus {
  outline-color: chartreuse !important;
}

.media-sidebar {
  background: #000 !important;
}

.media-frame-router button {
  background: #000 !important;
  border: none !important;
  color: var(--neutral-400);
}

.media-frame-content {
  background: #000 !important;
}

.media-frame-router button.active {
  color: var(--neutral-100);
}

p,
input,
label,
li,
span {
  margin: 0;
  font-family: var(--cure-font);
  font-weight: normal;
  font-size: 14px;
  color: var(--neutral-100);
  -webkit-font-smoothing: antialiased;
}

input,
textarea {
  background: rgba(255, 255, 255, 0.04);
}

input[type="radio"]:checked {
  background: var(--primary-gold-600);
}

a {
  font-family: var(--cure-font);
  text-decoration: none;
  -webkit-font-smoothing: antialiased;
}

th,
td,
div {
  font-family: var(--cure-font);
  -webkit-font-smoothing: antialiased;
  color: var(--neutral-100);
}

.site {
  display: flex;
  height: 100%;
}

.hidden {
  display: none;
}

.dev-notes {
  font-family: var(--cure-font);
  font-weight: 300;
  font-size: 14px;
  list-style-type: circle;
  margin: 50px 0;
  background-color: aliceblue;
  padding: 30px 40px;
  -webkit-font-smoothing: antialiased;
}

.btn-cure {
  padding: 10px 20px;
  font-size: 12px;
  transition: all 0.3s ease;
  color: #fff;
  background-color: var(--primary-gold-500);
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 6px;
  cursor: pointer;
}

.btn-cure-alt {
  padding: 10px 20px;
  font-size: 12px;
  transition: all 0.3s ease;
  color: chartreuse;
  border: 0.5px solid var(--primary-gold-300, #c5c3a3);
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 6px;
  cursor: pointer;
}
.btn-cure-tom {
  background-color: #000;
  color: #fff;
  padding: 6px 16px;
  font-size: 14px;
}
.btn-cure-secondary {
  border-radius: 32px;
  padding: 10px 20px;
  font-size: 14px;
  transition: all 0.3s ease;
  color: var(--neutral-400);
}
.cure-p-20 {
  padding: 20px 20px;
}
.no-hover {
  column-gap: 8px;
}
.error-msg {
  display: none;
  color: red;
}
.cure-modal .cure-field-group.multi {
  display: flex;
  flex-direction: row;
  column-gap: 15px;
}
.cure-field-group.multi > div {
  display: flex;
  flex-direction: column;
}
meter::-webkit-meter-optimum-value,
meter::-webkit-meter-suboptimum-value,
meter::-webkit-meter-even-less-good-value {
  transition: 1s width;
}
.timely-sync-preloader h3 {
  padding: 20px;
}
.timely-sync-preloader img {
  width: 100%;
}
.timely-sync-preloader {
  width: 100%;
}
.cure-sbs {
  column-gap: 20px;
}
.cr-table {
  overflow: auto;
  margin: 0 26px;
}
td.cure-user {
  position: sticky;
  left: 0;
}
.cr-table thead tr th:first-child {
  position: sticky;
  left: 0;
  z-index: 999;
}
.cr-table tbody tr td:first-child {
  position: sticky;
  left: 0;
  z-index: 999;
}
.table-actions {
  display: flex;
  align-items: center;
}
.table-actions a {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

/*--------------------------------------------------------------
>>> PASSWORD MANAGER:
----------------------------------------------------------------*/
.cure-modal.new-password .inner,
.cure-modal.edit-password .inner {
  width: 75%;
  height: 80%;
  overflow-y: scroll;

  /* Styling the scrollbar */
  scrollbar-width: thin; /* For Firefox */
  scrollbar-color: black transparent; /* For Firefox */
}

/* Webkit-based browsers (Chrome, Edge, Safari) */
.cure-modal.new-password .inner::-webkit-scrollbar,
.cure-modal.edit-password .inner::-webkit-scrollbar {
  width: 8px;
}

.cure-modal.new-password .inner::-webkit-scrollbar-track,
.cure-modal.edit-password .inner::-webkit-scrollbar-track {
  background: transparent; /* Transparent track */
}

.cure-modal.new-password .inner::-webkit-scrollbar-thumb,
.cure-modal.edit-password .inner::-webkit-scrollbar-thumb {
  background-color: black; /* Black thumb */
  border-radius: 4px; /* Rounded corners */
  border: 2px solid transparent; /* Add spacing around the thumb */
  background-clip: content-box; /* Prevent the border from overlapping */
}

.cure-modal.new-password .inner::-webkit-scrollbar-thumb:hover,
.cure-modal.edit-password .inner::-webkit-scrollbar-thumb:hover {
  background-color: #333; /* Darker black on hover */
}

.main.passwords .cr-table td {
  width: initial;
}

.wp-media-buttons .insert-media {
  background: #000 !important;
  color: #fff !important;
  border-color: #fff !important;
}

.wp-media-buttons .insert-media:hover {
  background: #000 !important;
  color: #fff !important;
  border-color: chartreuse !important;
}

.wp-switch-editor {
  background: #000 !important;
}

.html-active .switch-html,
.tmce-active .switch-tmce {
  background: #000 !important;
  color: #fff !important;
}

.wp-editor-container textarea.wp-editor-area {
  color: #fff !important;
}

.cure-modal.new-password .inner {
  width: 75%;
  max-height: 85%;
}

.wp-media-buttons .insert-media {
  background: #000;
  color: #fff;
  border-color: #fff;
}

.wp-media-buttons .insert-media:hover {
  background: #000;
  color: #fff;
  border-color: chartreuse;
}

.password-wrapper button {
  background: transparent;
  border: none;
  outline: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  position: absolute;
  right: 5px;
}

.password-wrapper button:hover svg path {
  fill: #dbdab9;
}

.password-wrapper {
  display: flex;
  align-items: center;
  position: relative;
}

.password-wrapper input {
  width: 100%;
}

.main.passwords td.cure-team img:not(:first-child) {
  margin-left: -20px;
}

.main.passwords a {
  color: chartreuse;
}

.main.passwords a:hover {
  text-decoration: underline;
}

.main.passwords .approval-actions {
  justify-content: flex-start;
}

.main.passwords .greetings .common-flex {
  align-items: center;
  justify-content: center;
}

.main.passwords .greetings svg {
  display: flex;
}

.main.passwords .greetings .common-flex > a:first-child {
  margin-right: 5px;
}

.main.passwords .greetings .common-flex > a:first-child:hover svg path {
  fill: #dbdab9;
}

.main.passwords .greetings .common-flex > a:first-child svg path {
  transition: all 0.3s ease;
}

.copy-password,
.copy-username {
  background: transparent;
  outline: none;
  border: none;
  cursor: pointer;
}

.copy-password:hover svg path,
.copy-username:hover svg path {
  fill: chartreuse;
}

.copy-password:hover svg rect:first-child,
.copy-username:hover svg rect:first-child {
  fill: #000;
}

.copy-password:active svg rect:first-child,
.copy-username:active svg rect:first-child {
  fill: chartreuse;
}

.copy-password:active svg path,
.copy-username:active svg path {
  fill: #000;
}

.copy-password:active svg,
.copy-username:active svg {
  transform: scale(0.8);
}

.main.passwords .greetings .select2 {
  width: 300px !important;
}

.cr-table::-webkit-scrollbar {
  height: 8px;
}

.cr-table::-webkit-scrollbar-track {
  background: transparent;
}

.cr-table::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 4px;
}

.cr-table::-webkit-scrollbar-thumb:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

.cr-table {
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.3) transparent;
}

.cr-table tbody tr td:first-child,
.cr-table thead tr th:first-child {
  background: #000;
}

/*--------------------------------------------------------------
>>> TOP BAR:
----------------------------------------------------------------*/
.top-bar {
  background-color: #000;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 50px;
  padding: 0 24px;
  position: sticky;
  top: 0;
  z-index: 99999;
}
.top-bar .current-user img {
  border-radius: 32px;
  border: 2px solid #000;
}
cure-logo .top-bar h2 {
  font-weight: 400;
  font-size: 16px;
}
.top-bar .current-user {
  display: flex;
  align-items: center;
  justify-content: center;
}
.top-bar .site-branding,
.top-bar .site-branding * {
  display: flex;
  align-items: center;
}

/*--------------------------------------------------------------
>>> LOGIN PAGE:
----------------------------------------------------------------*/
.cure-login-container .login-modal-trigger {
  display: flex;
  width: fit-content;
  height: fit-content;
  position: absolute;
  right: 30px;
  top: 30px;
  background: rgba(255, 255, 255, 0.1);
  padding: 2px 12px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s ease;
  color: #fff;
}
.cure-login-container .login-modal-trigger:hover {
  background: #000;
  color: #fff;
  box-shadow: 0 0 7px #fff;
}
body.home .cure-centered-section {
  padding: 20px;
  opacity: 0.95;
  max-width: 80%;
  width: 100%;
}
body.home .main {
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.page-template-login header {
  display: none;
}
.cure-login-container {
  height: 100vh;
  width: 100%;
  display: flex;
  background: radial-gradient(
    circle at 24.1% 68.8%,
    rgb(50, 50, 50) 0%,
    rgb(0, 0, 0) 99.4%
  );
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
}
.cure-login-container > div {
  height: 100%;
  width: 50%;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.login-logo img {
  width: 100%;
}
.cure-login-container > div:first-child h1 {
  color: #fff;
  font-weight: 300;
  line-height: 1.2;
  padding-top: 30px;
}
#cure_login_form input:not(#wp-submit) {
  padding-left: 15px;
}
#cure_login_form .login-submit input {
  background-color: var(--cure-primary-color);
}
#cure_login_form .login-submit input {
  background-color: var(--cure-primary-color);
  color: #fff;
  border: none;
  width: 100%;
  border-radius: 36px;
  padding: 18px;
  cursor: pointer;
  font-weight: 500;
  font-style: normal;
  font-size: 14px;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}
.login-form-container .login-logo {
  padding-bottom: 30px;
}
.login-form-container label {
  color: #fff;
}
.login-form-container h2 {
  font-weight: 400;
  font-size: 42px;
  line-height: 120%;
  margin-bottom: 30px;
}
#cure_login_form p:not(.login-errors) {
  display: flex;
  flex-direction: column;
}
p.login-errors {
  color: #db282c;
  padding-bottom: 10px;
}
.login-form-container .inner {
  min-width: 380px;
  max-width: 380px;
  padding: 80px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.1);
}
.login-form-container .forgot-password a {
  color: #fff;
  font-size: 0.8em;
  opacity: 0.6;
  transition: all 0.3s ease;
}

.login-form-container .forgot-password a:hover {
  opacity: 1;
}
#cure_login_form p:not(.login-submit) input {
  border: none;
  border-bottom: 0.5px solid #191919;
  padding: 12px 12px 12px 0;
  margin-bottom: 20px;
}
#cure_login_form p:not(.login-submit) input:focus-visible {
  border: none;
  border-bottom: 1px solid #191919;
  outline: none;
}

#cure_login_form p:not(.login-submit) input::placeholder {
  color: #bababa;
  padding-left: 0;
}

/* ── 2FA Login Step ─────────────────────────────────────────── */
#stackifya-2fa-login-form {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.login-2fa-icon {
  margin-bottom: 24px;
}
.login-2fa-icon-circle {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: rgba(219, 218, 185, 0.08);
  border: 1px solid rgba(219, 218, 185, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
}
.login-2fa-header {
  margin-bottom: 28px;
}
.login-2fa-header h3 {
  color: #fff;
  font-size: 20px;
  font-weight: 500;
  margin: 0 0 8px;
  letter-spacing: 0.3px;
}
.login-2fa-header p {
  color: rgba(255, 255, 255, 0.5);
  font-size: 13px;
  margin: 0;
  line-height: 1.5;
}
.login-2fa-code {
  width: 100%;
  margin-bottom: 8px;
}
.login-2fa-input {
  width: 100% !important;
  text-align: center !important;
  font-size: 28px !important;
  font-weight: 300 !important;
  letter-spacing: 12px !important;
  padding: 16px 12px !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 10px !important;
  color: #fff !important;
  transition: border-color 0.2s ease, background 0.2s ease;
  box-sizing: border-box;
}
.login-2fa-input:focus,
.login-2fa-input:focus-visible {
  outline: none !important;
  border-color: rgba(219, 218, 185, 0.5) !important;
  background: rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 0 0 3px rgba(219, 218, 185, 0.08);
}
.login-2fa-input::placeholder {
  color: rgba(255, 255, 255, 0.15) !important;
  letter-spacing: 16px !important;
  font-size: 22px !important;
}
.login-2fa-error {
  color: #ff6b6b;
  font-size: 13px;
  margin: 4px 0 8px;
  padding: 8px 14px;
  background: rgba(255, 107, 107, 0.08);
  border-radius: 6px;
  width: 100%;
  box-sizing: border-box;
}
.login-2fa-submit {
  width: 100%;
  margin-top: 8px;
}
.login-2fa-submit input {
  width: 100%;
  padding: 14px;
  border: none;
  border-radius: 10px;
  background: #DBDAB9;
  color: #1a1a2e;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  letter-spacing: 0.3px;
}
.login-2fa-submit input:hover {
  background: #e8e7cc;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(219, 218, 185, 0.2);
}
.login-2fa-submit input:active {
  transform: translateY(0);
}
.login-2fa-footer {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  width: 100%;
}
.login-2fa-footer a {
  color: rgba(255, 255, 255, 0.4);
  font-size: 12px;
  text-decoration: none;
  transition: color 0.2s ease;
}
.login-2fa-footer a:hover {
  color: #DBDAB9;
}
.login-2fa-input--recovery {
  font-size: 22px !important;
  letter-spacing: 4px !important;
  font-family: monospace !important;
}
.login-2fa-input--recovery::placeholder {
  letter-spacing: 2px !important;
  font-size: 16px !important;
}

/*--------------------------------------------------------------
>>> New Navigation:
----------------------------------------------------------------*/
.nav-children {
  position: sticky;
  top: 50px;
  left: 50px;
  min-width: 194px;
  height: 100%;
  background: #070707;
  border-right: 1px solid rgba(219, 218, 185, 0.16);
  box-shadow: 18px 0 34px rgba(0, 0, 0, 0.36);
  transition: all 0.3s ease;
  transform: translateX(-194px);
  z-index: -1;
  opacity: 0;
}
.nav-children.active {
  transform: translateX(0);
  opacity: 1;
}

/*--------------------------------------------------------------
>>> Access Denied:
----------------------------------------------------------------*/
.cure-section-centered {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.access-denied-container {
  min-width: 600px;
  max-width: 600px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.access-denied-container h2 {
  font-weight: 600;
  font-size: 36px;
  padding-top: 16px;
  padding-bottom: 24px;
}
.access-denied-container p {
  font-size: 16px;
  text-align: center;
}
.access-denied-container a {
  margin-top: 24px;
}

/*--------------------------------------------------------------
>>> User Menu:
----------------------------------------------------------------*/
.user-menu {
  position: absolute;
  top: 50px;
  min-width: 82px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #000;
  border-top: none;
  display: none;
  background-color: #fff;
}
.user-menu ul {
  list-style: none;
  padding: 0;
}
.user-menu ul li a {
  color: var(--neutral-500);
  font-size: 12px;
}

/*--------------------------------------------------------------
>>> Header:
----------------------------------------------------------------*/
.top-bar .current-user {
  cursor: pointer;
}
.nav-parent {
  height: 88vh;
  background-color: var(--primary-gold-500);
}
.greetings.has-options {
  justify-content: space-between;
}
.greetings img {
  border: 2px solid #fef5dc;
  border-radius: 50%;
  background-color: #c4c4c4;
}
.site-header {
  background-color: var(--primary-gold-500);
  z-index: 9999;
}
.site-header .cure-sticky {
  position: sticky;
  top: 50px;
  display: flex;
  width: 50px;
  padding-right: 0;
  transition: all 0.3s ease;
}
.site-header .cure-sticky.active {
  padding-right: 194px;
}
.cure-logo img {
  max-width: 200px;
}
.main {
  width: calc(100% - 50px);
}
.main-navigation .menu li,
.main-settings .menu li {
  position: relative;
  transition: all 0.2s ease;
  cursor: pointer;
}
.main-navigation .menu li:after {
  content: "";
  width: 4px;
  height: 0;
  background-color: var(--primary-gold-400);
  position: absolute;
  top: 0;
  right: 0;
  transform-origin: center top; /* Set the transform origin to center top */
  transform: scaleY(0); /* Start with scaleY(0) to hide the element */
  transition: transform 0.2s ease-in-out; /* Transition only transform */
}

.main-navigation .menu li.active:after {
  height: 100%;
  transform: scaleY(1); /* Animate scaleY to 1 to reveal the element */
}
.main-navigation .menu li.active svg path {
  fill: #f4f4f0;
}
.main-navigation .menu li a,
.main-settings .menu li a {
  color: #4f5b67;
  text-decoration: none;
  padding: 12px 15px;
}
.main-navigation .menu li.active a {
  color: #72340f;
}
.main-navigation .menu,
.main-settings .menu {
  list-style: none;
  padding: 0;
  margin: 0;
}
.main-navigation .menu li a,
.main-settings .menu li a {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--cure-font);
  column-gap: 15px;
  -webkit-font-smoothing: antialiased;
}
.main-navigation .menu li a img,
.main-settings .menu li a img {
  width: 24px;
}
.nav-parent {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 70px;
}
.main-navigation li:after {
  height: 0%;
}
.main-navigation li:hover:after {
  content: "";
  width: 4px;
  height: 100%;
  background-color: var(--primary-gold-400);
  position: absolute;
  top: 0;
  right: 0;
}
.main-navigation li:hover a {
  color: #72340f;
}
.main-navigation li:hover svg path {
  fill: #f4f4f0;
}
.main-navigation .menu li svg path {
  transition: all 0.3s ease;
}
.cure-sub-menu {
  display: flex;
  flex-direction: column;
  font-size: 0.8em;
  padding: 18px 14px;
  row-gap: 6px;
  position: sticky;
  top: 50px;
}
.cure-sub-menu a {
  color: #dbdab9;
  display: flex;
  align-items: center;
  column-gap: 10px;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  text-decoration: none;
  border: 1px solid rgba(219, 218, 185, 0.08);
  border-radius: 8px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.03);
  transition: all 0.18s ease;
}
.cure-sub-menu a:hover {
  color: #f4f1df;
  border-color: rgba(219, 218, 185, 0.28);
  background: rgba(219, 218, 185, 0.08);
  transform: translateX(2px);
}
.sub-menu-heading {
  padding: 8px 12px 10px;
  color: #74745f;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

/*--------------------------------------------------------------
>>> Dashboard:
----------------------------------------------------------------*/
.greetings img {
  width: 32px;
}

.greetings {
  display: flex;
  align-items: center;
  column-gap: 20px;
  padding: 24.5px 26px;
}

/*--------------------------------------------------------------
>>> Client Reporting:
----------------------------------------------------------------*/
.generate-client-report .target-hit,
.main.single-report .target-hit {
  text-transform: capitalize;
  font-size: 12px;
  font-weight: 500;
}
.generate-client-report .target-hit-circle,
.main.single-report .target-hit-circle {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.generate-client-report .target-hit.on-target .target-hit-circle,
.main.single-report .target-hit.on-target .target-hit-circle {
  background-color: #00ca4e;
}
.generate-client-report .target-hit.above-target .target-hit-circle,
.main.single-report .target-hit.above-target .target-hit-circle {
  background-color: #ff605c;
}
.generate-client-report .target-hit.not-applicable .target-hit-circle,
.main.single-report .target-hit.not-applicable .target-hit-circle {
  background-color: #bababa;
}
.generate-client-report {
  width: calc(100% - 410px);
}
.single-date-range {
  font-size: 0.9em;
  padding: 3px 15px;
  background-color: aliceblue;
  border-radius: 36px;
  display: flex;
  width: fit-content;
  box-shadow: 0 0 7px rgba(0, 0, 0, 10%);
  margin-top: 5px;
}
.cure-filters {
  padding: 20px 26px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.date-notice {
  color: #717d8a;
  font-family: var(--cure-font);
  -webkit-font-smoothing: antialiased;
}
.filters {
  display: flex;
  column-gap: 12px;
}
.cr-table thead {
  border-bottom: 1px solid #f1f1f1;
}
.cr-table th {
  font-size: 12px;
  font-weight: 500;
  text-align: justify;
}
.cr-table th {
  padding: 13px 24px;
  white-space: nowrap;
}
.cr-table .cure--project {
  display: flex;
  align-items: center;
  column-gap: 10px;
  color: #242d35;
}
.cr-table .cure--project img {
  max-width: 32px;
  border-radius: 50%;
}
.main:not(.client-reporting-overview) .cr-table .cure--project img {
  border-radius: 50%;
}
.cr-table td {
  font-size: 14px;
  padding: 13px 24px;
  width: 100%;
}
.cr-table tbody td {
  box-shadow: 0px -1px 0px 0px #f1f1f1 inset;
}
.dev-notes {
  font-family: var(--cure-font);
  font-weight: 300;
  margin: 50px 0;
  padding: 50px 40px;
  -webkit-font-smoothing: antialiased;
}
.dev-notes ul {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
}
.client-reporting-overview .td-status {
  white-space: nowrap;
}
.client-reporting-overview .td-status.on-target > div {
  background-color: #e6fbd9;
  border-radius: 36px;
  color: #0f5b1d;
  font-size: 12px;
  padding: 5px 10px 7px;
  font-weight: 500;
}
.client-reporting-overview .td-status.above-target > div {
  background-color: #ffe8d7;
  border-radius: 36px;
  color: #931222;
  font-size: 12px;
  padding: 5px 10px 7px;
  font-weight: 500;
}
.single-client-reporting .target-hit,
.single-report .target-hit {
  position: relative;
}
.single-client-reporting .target-hit > div,
.single-report .target-hit > div {
  display: flex;
  align-items: center;
  column-gap: 5px;
  font-size: 0.9em;
}

.single-client-reporting .target-hit div:before,
.single-report .target-hit div:before {
  content: "";
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.single-client-reporting .target-hit div.on-target:before,
.single-report .target-hit div.on-target:before {
  background-color: #00ca4e;
}
.single-client-reporting .target-hit div.under:before,
.single-report .target-hit div.under:before {
  background-color: #ff605c;
}
.single-client-reporting .target-hit div.over:before,
.single-report .target-hit div.over:before {
  background-color: #808080;
}
.mobile-view th,
.mobile-view td {
  text-align: left !important;
}
.mobile-view thead tr th:not(:first-child) {
  width: 125px;
}
.tl-spend-status {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.tl-spend-status.under-spend {
  background-color: #ff605c;
}
.tl-spend-status.on-spend {
  background-color: #00ca4e;
}
.tl-spend-status.over-spend {
  background-color: #808080;
}
.td-spend-status {
  white-space: nowrap;
}
.td-spend-status > div {
  display: flex;
  align-items: center;
  column-gap: 5px;
}

@media (max-width: 1200px) {
  .normal-view {
    display: none;
  }
  table.mobile-view {
    display: table;
  }
  .single-report .cr-insights-container li {
    max-width: 100%;
  }
}

/*--------------------------------------------------------------
>>> Single Client Reporting:
----------------------------------------------------------------*/
.breadcrumb_parent {
  color: var(--cure-primary-color);
  text-decoration: underline;
}
.client-icon-large {
  height: 59px;
  width: auto;
  padding-right: 15px;
}
.single-client-reporting .filters {
  align-items: center;
}
tr.channel-total td {
  font-weight: 600;
  white-space: nowrap;
}
.single-date-range-wrapper {
  display: flex;
  column-gap: 15px;
}
.main.single-client-report textarea:focus,
.single-client-report textarea:focus-visible {
  border: none !important;
  outline: none !important;
}
.main.single-report .inner > .report-header {
  display: none;
}
.section-two-logos img:last-child {
  max-width: 157px;
}
.section-two-logos {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.section-two-logos img:first-child {
  max-height: 64px;
}
.metric-name {
  display: flex;
  align-items: center;
  column-gap: 3px;
  font-size: 14px;
}
.cure-graph-box {
  width: 400px;
  padding: 10px;
  border: 1px solid #eaecee;
}
.client-metric-graphs {
  display: flex;
  column-gap: 20px;
}

/*--------------------------------------------------------------
>>> Weekly Snapshot
----------------------------------------------------------------*/
.cure-report .inner {
  padding: 20px 26px;
}
.cure-report .report-header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}
.cure-report .report-header img {
  height: 60px;
  width: auto;
}
.cure-report .report-header h5 {
  color: var(--primary-gold-500);
  font-weight: 500;
}
.cure-report .report-header h4 {
  font-weight: 500;
}
.cr-insights-container h4 {
  display: flex;
  column-gap: 6px;
}
.cr-insights-container > div {
  max-width: 50%;
  word-wrap: break-word;
}
.cr-insights-container {
  margin-top: 50px;
  display: flex;
  column-gap: 40px;
  max-width: 1200px;
}
.add-insights-container {
  display: flex;
  flex-direction: column;
  row-gap: 30px;
}
.add-insights-container label {
  display: flex;
  align-items: center;
  margin-bottom: 12px;
  column-gap: 6px;
  font-size: 16px;
}
.add-insights-container .cure-field-group {
  display: flex;
  column-gap: 20px;
  flex-direction: column;
}
.add-insights-container .cure-field-group > div:first-child {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 800px;
}
.add-insights-container textarea {
  border: none;
  padding: 12px;
  font-family: var(--cure-font);
  color: var(--neutral-100);
  -webkit-font-smoothing: antialiased;
}
.add-insights-container .btn-cure {
  position: relative;
  top: 10px;
}
.add-insights-container textarea:focus {
  border: 2px solid var(--cure-primary-color) !important;
  outline: none;
}
.cr-actions .filter a {
  background-color: #fafafa;
  border: none;
  display: flex;
  align-items: center;
  column-gap: 5px;
  transition: all 0.3s ease;
}
.cr-actions .filter a:hover {
  background-color: var(--cure-primary-color);
  color: #000;
}

/*--------------------------------------------------------------
>>> Cure Modal
----------------------------------------------------------------*/
.cure-modal {
  width: 100%;
  position: fixed;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(12, 17, 22, 20%);
  z-index: 999;
}
.cure-modal .inner {
  min-width: 451px;
  background-color: #000;
  box-shadow: 0 4px 6px rgba(255, 255, 255, 0.25);
  border-radius: 20px;
}
.cure-modal-header h3 {
  font-size: 28px;
  font-weight: 400;
}
.cure-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 32px 32px 25px 32px;
  position: relative;
}
.cure-modal-header a {
  position: absolute;
  top: 15px;
  right: 20px;
  transition: all 0.3s ease;
  width: 20px;
  height: 20px;
  padding: 5px;
  background: rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cure-modal-header a:hover {
  transform: scale(1.2);
}
.cure-modal-body {
  padding: 20px 32px;
}
.cure-modal .cure-field-group {
  display: flex;
  flex-direction: column;
}
.cure-modal input {
  border: none;
  border-bottom: 0.5px solid var(--neutral-500);
  padding: 12px;
  background: rgba(255, 255, 255, 0.1);
  box-sizing: border-box;
}
.cure-modal input:focus-visible {
  outline: none;
  border-bottom: 0.5px solid var(--primary-gold-500);
}
.modal-btn-wrapper {
  padding: 10px 30px 30px 30px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  column-gap: 10px;
}
.report-sent-msg-container {
  padding: 20px;
  font-family: var(--cure-font);
  font-size: 14px;
  color: #252a31;
  -webkit-font-smoothing: antialiased;
}
.report-sent-msg-container .inner {
  display: flex;
  justify-content: flex-end;
  background-color: rgba(40, 161, 56, 10%);
  width: fit-content;
  margin-left: auto;
  padding: 10px;
  border-left: 3px solid #28a138;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  column-gap: 10px;
  align-items: center;
}
.report-sent-msg-container .inner p {
  color: #252a31;
  display: flex;
  align-items: center;
  column-gap: 5px;
}
.report-sent-msg-container .inner span {
  color: #2d7738;
  background-color: #e1efe2;
  border-radius: 3px;
  font-size: 12px;
  padding: 4px 6px;
  cursor: pointer;
  font-weight: 500;
}

/*--------------------------------------------------------------
>>> FORGOT PASSWORD
----------------------------------------------------------------*/
.forgot-password a {
  color: #191919;
  font-size: 14px;
}
.forgot-password iframe {
  border: none;
  width: 100%;
}

/*--------------------------------------------------------------
>>> Approvals Section
----------------------------------------------------------------*/
.the-approval a {
  color: inherit;
}
.the-user > div {
  display: flex;
  align-items: center;
  column-gap: 8px;
}
.main.approvals .cr-table {
  margin-bottom: 40px;
}
.approval-row td {
  white-space: nowrap;
}
.approval-actions img {
  max-height: 18px;
}
.approval-actions {
  display: flex;
  align-items: center;
  justify-content: center;
}
.approval-actions a {
  display: flex;
  align-items: center;
  justify-content: center;
}
.main:not(.single-client-overview) .status-of-approval.pending > div {
  background-color: var(--primary-gold-100);
  border-radius: 36px;
  color: var(--primary-gold-800);
  font-size: 12px;
  padding: 5px 10px 7px;
  font-weight: 500;
}
.main:not(.single-client-overview) .status-of-approval.approved > div {
  background-color: #e6fbd9;
  border-radius: 36px;
  color: #0f5b1d;
  font-size: 12px;
  padding: 5px 10px 7px;
  font-weight: 500;
  width: fit-content;
}

/*--------------------------------------------------------------
>>> Client Report Date Filter
----------------------------------------------------------------*/
.cure-filters .filter {
  position: relative;
}
.custom-date-selector {
  position: absolute;
  top: -1px;
  left: 100%;
  background-color: #fff;
  z-index: 999;
  border: 1px solid var(--primary-gold-50);
  display: none;
  padding: 0 !important;
  height: 100%;
}
.custom-date-selector.active {
  display: block;
}

/*--------------------------------------------------------------
>>> Single Report Edit Functionality
----------------------------------------------------------------*/
.single-reports .cure-report .inner {
  position: relative;
}
.single-reports .cure-report .inner.active {
  box-shadow: 0 0 25px var(--cure-primary-color);
}
.cure-report .cr-table {
  margin: 0;
}
.edit--report img {
  max-height: 32px;
  transition: all 0.3s ease;
}
.edit--report img:hover {
  transform: scale(1.2);
}
.edit--report {
  position: absolute;
  right: 25px;
  bottom: 15px;
  display: flex;
  align-items: center;
  column-gap: 20px;
}
.edit-insight {
  position: relative;
}
.edit-insight img {
  max-height: 18px;
}
.new-field-group {
  position: absolute;
  display: flex;
  align-items: center;
  column-gap: 5px;
  left: 30px;
  top: -6px;
}
.single-reports .cure-report .inner > p {
  display: none;
}
a.save--changes.btn-cure {
  align-items: center;
  position: relative;
}
a.save--changes.btn-cure img {
  position: absolute;
  left: -40px;
  display: none;
  max-height: 40px;
}
.edit-initiator {
  position: relative;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.edit-initiator .save--changes {
  position: relative;
  right: 70px;
  bottom: 10px;
  display: none;
}
.single-reports .cure-report .inner.active .edit-initiator .save--changes {
  display: flex;
}

/*--------------------------------------------------------------
>>> Single Report Comment / Revision Functionality
----------------------------------------------------------------*/
#wpdcom {
  margin-left: 0;
  padding: 20px;
}
#wpdcom .wpd-form-head {
  display: none;
}
.cure-user-role .role {
  font-size: 12px;
  text-transform: capitalize;
  font-weight: 300;
}

/*--------------------------------------------------------------
>>> Navigation Footer
----------------------------------------------------------------*/
.cure-user-role img:not(.logout-icon) {
  border: 2px solid #fef5dc;
  border-radius: 50%;
  background-color: #c4c4c4;
}
.cure-user-role a {
  column-gap: 10px !important;
}
.cure-user-role {
  padding: 24px 15px !important;
  box-shadow: inset 0px 1px 0px #f1f1f1;
  display: flex;
  justify-content: space-between;
}
.logout-icon {
  opacity: 0.4;
  transition: all 0.2s ease;
}
.logout-icon:hover {
  opacity: 1;
}

/*--------------------------------------------------------------
>>> Rich Text Editor
----------------------------------------------------------------*/
.brief-fields div.mce-toolbar-grp {
  background: #fff;
  border-bottom: 0;
}
.brief-fields .wp-editor-container {
  border: 1px solid var(--neutral-neutral-100, #f3f3f3);
}
.brief-fields .mce-top-part::before {
  box-shadow: none;
  --webkit-box-shadow: none;
}
.brief-fields .mce-container > div > div:nth-child(4),
.brief-fields .mce-container > div > div:nth-child(5),
.brief-fields .mce-container > div > div:nth-child(6),
.brief-fields .mce-container > div > div:nth-child(8),
.brief-fields .mce-container > div > div:nth-child(9),
.brief-fields .mce-container > div > div:nth-child(10) {
  display: none;
}
.mceu_opener button svg {
  position: relative;
  top: 4px;
}
.mceu_opener,
.mceu_opener:hover {
  border: none !important;
  background: none !important;
  box-shadow: none !important;
}
.brief-fields div.mce-toolbar {
  display: flex;
  align-items: center;
}
.animated-opener {
  width: 300px !important;
  background: #fff !important;
  position: absolute !important;
  height: 30px !important;
  left: 30px;
  z-index: 2;
  transition: all 0.3s ease;
  transform: translateX(-1px);
}
.animated-opener.state-opened {
  transform: translateX(300px);
}
.brief-fields .mce-toolbar .mce-container-body {
  opacity: 0;
}

/*--------------------------------------------------------------
>>> Project Briefs aka Briefing Section
----------------------------------------------------------------*/
.review-data-container.empty-value * {
  color: var(--error-red-500);
}
.project-briefs .filter {
  position: relative;
  display: flex;
  align-items: center;
}
.project-briefs .filter a {
  display: flex;
  align-items: center;
}
.project-briefs .cure-field-group {
  display: flex;
  align-items: center;
  column-gap: 5px;
  position: relative;
}
.search-brief .cure-field-group {
  border: 1px solid #eaecee;
  border-radius: 32px;
  padding: 10px;
}
.search-brief input {
  border: none;
}
.search-brief input:focus {
  border: none;
  outline: none;
}
.search-brief img {
  max-height: 15px;
}
.project-briefs .filter:not(.cure-search) img {
  max-height: 22px;
}
.cure-modal.new-brief form {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
}
.cure-field-group.hidden {
  display: none;
}
.main.project-briefs .cr-table {
  margin-bottom: 40px;
}
.back-btn a {
  color: chartreuse;
  display: flex;
  align-items: center;
  font-size: 14px;
  column-gap: 5px;
}
.main.create-brief {
  display: flex;
}
.brief-overview {
  width: 310px;
  padding: 30px 50px;
  background-color: rgba(255, 255, 255, 0.05);
  height: calc(100% - 50px);
}
.brief-fields {
  padding: 60px 70px;
  width: calc(100% - 460px);
}
.brief-heading h1 {
  font-size: 28px;
}
.brief-heading {
  padding: 26px 0 20px 0;
}
.brief-details {
  font-size: 12px;
  color: var(--neutral-500);
  margin-bottom: 46px;
}
.brief-details-title {
  margin-bottom: 10px;
  font-weight: 500;
}
.brief-details img {
  border-radius: 50%;
}
.brief-details-data {
  display: flex;
  align-items: center;
  column-gap: 8px;
}
.brief-details > div {
  padding-bottom: 20px;
}
.brief-fields .save-draft {
  margin-bottom: 26px;
}
.btn-save-draft,
.btn-edit-client-overview {
  display: flex;
  color: var(--neutral-500);
  font-size: 12px;
  column-gap: 8px;
  align-items: center;
  padding: 20px;
  border: 0.5px solid var(--primary-gold-300);
  width: fit-content;
  margin-right: 0;
  margin-left: auto;
  cursor: pointer;
}
.progress-bar {
  background-color: var(--primary-gold-50);
  border-radius: 100px;
  padding: 6px;
  max-height: 9px;
  display: flex;
  align-items: center;
  margin-bottom: 27px;
}
.progress-bar .meter {
  width: 20%;
  background-color: #c5c3a3;
  height: 9px;
  border-radius: 100px;
  transition: all 0.3s ease;
  position: relative;
}
.meter-percentage {
  color: #c5c3a3;
  font-size: 12px;
  font-weight: 400;
  position: absolute;
  right: -28px;
  top: -4px;
}
.slide-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 22px;
}
.slide-controls a:not(.submit-brief) {
  color: var(--neutral-500);
  font-size: 12px;
  display: flex;
  align-items: center;
  column-gap: 8px;
  padding: 20px;
  padding-right: 0;
}
.slide-controls h2 {
  color: var(--neutral-500);
  font-size: 18px;
  font-weight: 400;
}
.slide-form .cure-field-group {
  display: flex;
  align-items: flex-start;
  column-gap: 50px;
  margin-bottom: 30px;
  justify-content: space-between;
}
.cure-radio-group {
  display: flex;
  align-items: center;
  column-gap: 10px;
}
.slide-controls-btn-wrapper {
  display: flex;
}
.submit-brief {
  display: flex;
  align-items: center;
  margin-left: 20px;
  border: none;
}
.brief-overview .inner {
  position: sticky;
  top: 80px;
}
.main.create-brief .cure-review-instructions h5 {
  color: var(--neutral-400);
  font-size: 14px;
}
.main.create-brief .cure-review-instructions {
  margin-top: 12px;
  margin-bottom: 40px;
}
.review-inputs {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
  font-size: 14px;
  color: var(--neutral-500);
}
.review-data-container {
  display: flex;
  justify-content: space-between;
  max-width: 800px;
  line-height: 40px;
}
.rd-key {
  text-transform: capitalize;
}
.rd-value {
  width: 300px;
  line-break: anywhere;
}
.slide-heading {
  padding-bottom: 5px;
  margin-bottom: 15px;
  border-bottom: 1px solid #eeeeee;
}
.slide-heading:not(:first-of-type) {
  margin-top: 50px;
}
.brief-estimated-hours h3 {
  font-size: 16px;
  margin-bottom: 14px;
}
.total-estimated-time {
  font-size: 12px;
  color: var(--neutral-500);
  font-weight: 500;
}
.review-part h3 {
  color: var(--primary-gold-500);
  font-size: 24px;
  font-weight: 400;
  margin-bottom: 18px;
  margin-top: 36px;
}
.review-part {
  border-bottom: 1px solid var(--primary-gold-300);
  padding-bottom: 36px;
}
.cure-edit-time-wrapper,
.cure-edit-time,
.cure-edit-time a {
  display: flex;
  align-items: center;
  column-gap: 6px;
}
.cure-edit-time span {
  padding-left: 10px;
}
.cure-edit-time input:focus,
.cure-edit-time input:active {
  outline: none;
  border: none;
}
.cure-edit-time input {
  max-width: 20px;
  border: none;
  outline: none;
  text-align: center;
}
.cure-edit-time {
  margin-left: 30px;
}
.cure-edit-time-wrapper {
  border-bottom: 1px solid var(--neutral-500);
}

/*--------------------------------------------------------------
>>> Create Client Overview
----------------------------------------------------------------*/
.create-client-overview .cure-filters {
  flex-direction: column;
  align-items: flex-start;
}
.client-overview-info ul {
  list-style: none;
  padding-left: 0;
  opacity: 0.5;
}
.client-overview-fields {
  width: 700px;
  display: flex;
  align-items: center;
  column-gap: 30px;
}
.client-overview-fields .cure-field-group {
  display: flex;
  flex-direction: column;
  background-color: var(--cure-primary-color);
  padding: 20px;
  border-radius: 15px;
  margin-bottom: 30px;
}
.client-overview-fields .cure-field-group > h3 {
  margin-bottom: 5px;
}
.client-overview-fields .swiper-wrapper {
  display: flex;
}
.swiper-slide {
  visibility: hidden;
}
.swiper-slide.swiper-slide-active {
  visibility: visible;
}
.cure-slide-controls > div {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
}
.cure-prev-slide {
  display: none;
}
.cure-next-slide {
  /* opacity: 0.5;
  pointer-events: none;
  cursor: not-allowed; */
  transition: all 0.2s ease;
}
.cure-next-slide.active {
  opacity: 1;
  pointer-events: auto;
  cursor: pointer;
}
.main.approvals .cr-table {
  margin-bottom: 40px;
}
.cure-modal.client-overview-success .inner {
  max-width: 500px;
  border-radius: 4px;
}
.cure-modal.client-overview-success h3 {
  font-size: 18px;
  color: var(--primary-gold-500);
}
.cure-modal.client-overview-success .cure-modal-body * {
  color: var(--neutral-500);
  font-size: 12px;
}
.cure-modal.client-overview-success .modal-btn-wrapper {
  flex-direction: column;
}
.cure-modal.client-overview-success .modal-btn-wrapper a {
  width: -webkit-fill-available;
  text-align: center;
  padding-top: 19px;
  padding-bottom: 19px;
  font-size: 12px;
}
.cure-modal.client-overview-success .cure-modal-header {
  border-bottom: none;
}

/*--------------------------------------------------------------
>>> Single Client Overview
----------------------------------------------------------------*/
.cod-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 40px;
  flex-direction: column;
  row-gap: 20px;
  margin-top: 20px;
}
.cod-header h2 {
  color: var(--neutral-neutral-500, #191919);
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 400;
  line-height: 120%;
}
.cod-body td {
  border: 1px solid #d1d1d1;
  padding: 5px;
}
.cod-body tr td:first-child {
  width: 25%;
}
.cod-body table {
  margin-top: 30px;
  max-width: 1200px;
}
.main.single-client-overview {
  display: flex;
}
.main.single-client-overview .client-overview-details.cure-section {
  width: calc(100% - 440px);
  padding-top: 61px;
}
.main.single-client-overview #comments {
  margin: unset;
}
.last-modified-date h4 {
  font-size: 14px;
  color: var(--neutral-300);
}
.status-of-approval.for-approval .bs-text {
  background-color: var(--primary-gold-100);
  color: var(--primary-gold-800);
}
.status-of-approval.done .bs-text {
  background-color: var(--success-green-100);
  color: var(--success-green-800);
}
.status-of-approval .bs-text {
  padding: 5px 10px 7px 10px;
  font-size: 12px;
  font-weight: 500;
  border-radius: 12px;
  color: var(--neutral-500);
  text-align: center;
}
.change--status {
  cursor: pointer;
}
.main.single-client-overview .common-flex {
  position: relative;
}
.main.single-client-overview .status--options {
  position: absolute;
  padding: 10px;
  top: 30px;
  flex-direction: column;
  row-gap: 4px;
}
.main.single-client-overview .status--options a {
  transition: all 0.3s ease;
  color: var(--neutral-500);
  text-wrap: nowrap;
}
.main.single-client-overview .status--options a:hover {
  color: var(--primary-gold-500);
}

/*--------------------------------------------------------------
>>> File upload
----------------------------------------------------------------*/
#drop_file_zone {
  background-color: #eee;
  border: #999 5px dashed;
  width: 290px;
  height: 200px;
  padding: 8px;
  font-size: 18px;
}
#drag_upload_file {
  width: 50%;
  margin: 0 auto;
}
#drag_upload_file p {
  text-align: center;
}
#drag_upload_file #selectfile {
  display: none;
}

/*--------------------------------------------------------------
>>> Single Project Brief
----------------------------------------------------------------*/
.cb-edit img,
.co-edit img {
  max-height: 20px;
  transition: all 0.3s ease;
}
.cb-edit:hover img,
.co-edit:hover img {
  transform: scale(1.2);
}
.cr-actions .filter.cb-edit.active,
.cr-actions .filter.co-edit.active {
  background-color: var(--cure-primary-color);
  color: #000;
  border-radius: 32px;
}
.cod-footer {
  margin-top: 20px;
  text-align: right;
  display: none;
}
.cod-footer .save--changes img {
  position: relative;
  top: -1px;
}

/*--------------------------------------------------------------
>>> Approvals Filter
----------------------------------------------------------------*/
.main.approvals .hide-approved.active {
  background-color: var(--cure-primary-color);
  color: #fff;
}
.main.approvals .f--search {
  display: none;
}

/*--------------------------------------------------------------
>>> Checklists
----------------------------------------------------------------*/
.cure-modal.new-checklist form {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
}

/*--------------------------------------------------------------
>>> Info Centre
----------------------------------------------------------------*/
.create-new-guide .date-notice,
.create-new-guide .date-notice input {
  width: 100%;
}
.guides {
  display: flex;
  gap: 30px;
  flex-wrap: wrap;
}
.guide a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-decoration: underline;
}
.guide {
  display: flex;
  width: 311px;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  flex-shrink: 0;
  border-radius: 2px;
  border: 0.5px solid var(--gray-200, #eaecee);
  background: var(--base-background-white, #fff);
}
.guide > .thumbnail > img {
  height: 157px;
  align-self: stretch;
  border-radius: 2px;
  background:
    url(<path-to-image>),
    lightgray 50% / cover no-repeat;
  width: 100%;
  object-fit: cover;
  color: var(--gray-900, #0c1116);
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 100%;
}

.guide button {
  display: flex;
  padding: 19px 76px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  align-self: stretch;
  border: 0.5px solid var(--primary-gold-300, #c5c3a3);
  background: var(--base-background-white, #fff);
  width: 100%;
  text-decoration: none;
  cursor: pointer;
}
.guide .view_post {
  width: 100%;
}
.guide a {
  text-decoration: none;
}
.guide > div {
  width: 100%;
}

.guide .date p {
  color: var(--neutral-neutral-400, #808080);
  font-family: Poppins;
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.guide .title h3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  line-clamp: 1;
  -webkit-line-clamp: 1;
  align-self: stretch;
  overflow: hidden;
  color: var(--gray-800, #242d35);
  text-overflow: ellipsis;
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
.guide .post-excerpt p {
  height: 36px;
  flex-shrink: 0;
  align-self: stretch;
  overflow: hidden;
  color: var(--gray-600, #4f5b67);
  text-overflow: ellipsis;
  font-family: Poppins;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.category {
  display: flex;
  padding: 5px 15px 7px 15px;
  align-items: flex-start;
  gap: 10px;
  border-radius: 25px;
  background: var(--neutral-neutral-100, #f3f3f3);
  width: max-content;
  color: var(--neutral-neutral-500, #191919);
  font-family: Poppins;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 100%;
}
.guidelines
  .select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  color: #bababa;
  line-height: 28px;
  font-size: 12px;
  font-weight: 400;
}
.main.create-new-guide {
  display: flex;
}
.info-centre-content > .cover-image {
  border: 0.5px solid var(--primary-gold-300, #c5c3a3);
  background: var(--neutral-white, #fff);
  max-width: 834px;
}
.cover-image > .icon {
  display: flex;
  padding: 8px;
  align-items: center;
  gap: 14px;
  align-self: stretch;
  border-bottom: 0.5px solid var(--primary-gold-300, #c5c3a3);
  background: var(--neutral-white, #fff);
}
.cover-image > .icon > div {
  display: flex;
  cursor: pointer;
}
.cover-image > .icon > div > u {
  color: var(--neutral-neutral-500, #191919);
  font-family: Poppins;
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 14px */
  text-decoration-line: underline;
}
.cover-image .img-preview {
  display: flex;
  padding: 12px 16px 16px 16px;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
}
.main.create-new-guide .save-draft {
  display: flex;
  column-gap: 6px;
}
.info-centre-content .title p {
  color: var(--neutral-neutral-500, #191919);
  text-align: justify;
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.forward-backward-icon {
  display: flex;
  padding: 8px;
  align-items: flex-start;
  gap: 14px;
  align-self: stretch;
  border-bottom: 0.5px solid var(--primary-gold-300, #c5c3a3);
  background: var(--neutral-white, #fff);
}
.info-title-desc {
  display: flex;
  max-width: 834px;
  height: 98px;
  flex-direction: column;
  align-items: flex-end;
  flex-shrink: 0;
  border: 0.5px solid var(--primary-gold-300, #c5c3a3);
  background: var(--neutral-white, #fff);
}
.forward-backward-icon > div {
  display: flex;
}
.info-title-desc > .desc {
  display: flex;
  padding: 12px 16px 16px 16px;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
}
.desc textarea {
  width: 100%;
  border: none;
  outline: none;
}
.info-centre-content .title {
  padding-bottom: 14.5px;
}
.gap-30 {
  height: 30px;
  width: 100%;
}

.cover-image .img-preview img {
  width: 100%;
}

.icon-btn span {
  color: white;
  width: 16px;
  padding-top: 3px;
}

.guidelines .cure-filters > div {
  display: flex;
}

.guidelines .cure-filters .cure-search {
  display: flex;
  width: 220px;
  padding: 12px 16px;
  justify-content: space-between;
  align-items: center;
  border-bottom: 0.5px solid var(--neutral-neutral-500, #191919);
  background: var(--neutral-white, #fff);
}

.guidelines .cure-filters .cure-search input {
  border: none;
  outline: none;
}
.guidelines .cure-filters .cure-search input::placeholder {
  color: var(--neutral-neutral-300, #bababa);
  font-family: Poppins;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.guidelines .cure-filters .cure-search .icon {
  display: flex;
  cursor: pointer;
}

.cure-filters > .filters > div a {
  display: flex;
  font-size: 12px;
  column-gap: 8px;
  align-items: center;
  padding: 20px;
  border: 0.5px solid var(--primary-gold-300);
  width: fit-content;
  margin-right: 0;
  margin-left: auto;
  cursor: pointer;
}
.cure-filters > .filters > .info-edit a {
  border: 0.5px solid transparent;
}

.cure-filters > .filters > .info-download a:hover {
  background-color: transparent;
}

/*--------------------------------------------------------------
>>> Single Guide
----------------------------------------------------------------*/
.main.single-guide .cod-body {
  display: flex;
  align-items: flex-start;
  gap: 30px;
  align-self: stretch;
  flex-direction: column;
}

.single-guide {
  display: flex;
}

.post-section {
  width: -webkit-fill-available;
  display: flex;
  justify-content: center;
}

.post-section > div {
  width: 834px;
}

.post-section .cure-filters {
  display: flex;
  justify-content: flex-end;
}
/*--------------------------------------------------------------
>>> Comments
----------------------------------------------------------------*/

.comments {
  display: flex;
  min-width: 318px;
  height: 1879px;
  padding: 30px 50px;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  flex-shrink: 0;
  background: var(--neutral-neutral-50, #fafafa);
}

.comments > .header {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 12px;
  align-self: stretch;
  color: var(--primary-gold-500);
}
.comments-module {
  width: 100%;
  display: flex;
  padding: 10px;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  align-self: stretch;
  background: var(--neutral-white, #fff);
}
.add-comments {
  width: 100%;
}
.comment-field {
  width: 85%;
  display: flex;
  height: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
  flex-shrink: 0;
  border-bottom: 0.5px solid var(--neutral-neutral-500, #191919);
  background: var(--neutral-white, #fff);
}
.comment-field > input {
  width: 100%;
  border: none;
  outline: none;
  background-color: transparent;
}
.add-comments .input-field {
  display: flex;
  width: 100%;
  justify-content: space-around;
}

.add-comments .input-field .comment-field {
  display: flex;
  justify-content: center;
}

.add-comments .input-field .user-avater {
  border-radius: 50%;
  overflow: hidden;
  margin-right: 5px;
}

.add-comments .input-field .user-avater {
  border-radius: 50%;
  overflow: hidden;
  margin-right: 5px;
}

.add-comments > button {
  display: flex;
  height: 40px;
  padding: 19px 20px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  background: var(--neutral-white, #fff);
  color: var(--neutral-neutral-300, #bababa);
  font-family: Poppins;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  width: 100%;
  border: none;
  cursor: pointer;
}

.comment-field input::placeholder {
  color: var(--neutral-neutral-300, #bababa);
  font-family: Poppins;
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
/*--------------------------------------------------------------
>>> User Management
----------------------------------------------------------------*/
.cure-modal.edit-user .cure-radio-group,
.cure-modal.new-user .cure-radio-group {
  justify-content: normal;
  column-gap: 20px;
}
.main.user-management td {
  white-space: nowrap;
}
.cure-modal.new-user form,
.cure-modal.edit-user form {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
}
.traffic-lights > div {
  width: 12px;
  height: 12px;
  background-color: #f1f3f4;
  border-radius: 50%;
}
.traffic-lights {
  display: flex;
  column-gap: 2px;
  align-items: center;
}
.total-hours-hit > div {
  display: flex;
  align-items: center;
}
.total-hours .all-users-total-status > div {
  display: flex;
  align-items: center;
}
.user-management .status-text {
  display: flex;
  align-items: center;
}
.user-management .percentage-hit {
  display: flex;
  align-items: center;
}
.cure-user img {
  width: 32px;
  height: 32px;
  border-radius: 50%;
}
.cure-user > div {
  display: flex;
  align-items: center;
  column-gap: 5px;
}
.send-password-reset svg {
  transform: rotate(-35deg);
  top: -3px;
  position: relative;
}
.invite-pending-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px 3px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  color: #c5a04a;
  background-color: rgba(238, 168, 81, 0.1);
  border: 1px solid rgba(238, 168, 81, 0.28);
  border-radius: 100px;
  white-space: nowrap;
  margin-left: 4px;
}

/* Toast notifications */
#cure-toast-container {
  position: fixed;
  bottom: 28px;
  right: 28px;
  z-index: 99999;
  display: flex;
  flex-direction: column;
  gap: 10px;
  pointer-events: none;
}
.cure-toast {
  padding: 11px 18px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.2px;
  border: 1px solid;
  background: #1a1a1a;
  transform: translateY(12px);
  opacity: 0;
  transition:
    transform 0.25s ease,
    opacity 0.25s ease;
  white-space: nowrap;
}
.cure-toast.is-visible {
  transform: translateY(0);
  opacity: 1;
}
.cure-toast--success {
  border-color: #39b34a;
  color: #39b34a;
}
.cure-toast--error {
  border-color: #ff4538;
  color: #ff4538;
}
.cure-toast--info {
  border-color: #eea851;
  color: #eea851;
}

/* Inline delete confirm state */
tr.confirm-delete-state .approval-actions {
  gap: 4px;
}
.delete-confirm-text {
  font-size: 12px;
  color: #808080;
  white-space: nowrap;
}
.confirm-yes-btn {
  font-size: 11px;
  font-weight: 600;
  color: #ff4538 !important;
  padding: 4px 10px;
  border: 1px solid rgba(255, 69, 56, 0.35);
  border-radius: 100px;
  white-space: nowrap;
  transition: background 0.2s;
}
.confirm-yes-btn:hover {
  background: rgba(255, 69, 56, 0.12);
}
.confirm-no-btn {
  font-size: 11px;
  color: #555 !important;
  padding: 4px 8px;
  white-space: nowrap;
}

/* Row flash when updated via AJAX */
@keyframes rowFlash {
  0% {
    background-color: rgba(238, 168, 81, 0.18);
  }
  100% {
    background-color: transparent;
  }
}
tr.row-updated {
  animation: rowFlash 1.2s ease-out forwards;
}

/* Modal submit button loading state */
.cure-modal .modal-submit.disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.total-hours-hit meter {
  transition: all 0.3s ease;
}
.days-of-the-week {
  display: flex;
  column-gap: 5px;
  position: relative;
  top: 10px;
}
.days-of-the-week > div {
  background-color: var(--neutral-50);
  border-radius: 36px;
  font-size: 0.8em;
  padding: 2px 8px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.days-of-the-week > div.active,
.days-of-the-week > div:hover {
  background-color: var(--primary-gold-600);
  color: #fff;
}
.user-management .select2-container {
  width: 100% !important;
}
.main.team-performance .user-status div {
  background: transparent;
}
.user-status div {
  font-size: 12px;
  color: var(--neutral-500);
  border-radius: 12px;
  font-weight: 500;
  padding: 5px 10px 7px 10px;
  line-height: 100%;
  white-space: nowrap;
}
.user-status .over {
  background: var(--neutral-100);
  color: var(--neutral-500);
}
.user-status .on-target {
  background: var(--success-green-100);
  color: var(--success-green-800);
}
.user-status .under,
.user-status .at-risk {
  background: var(--error-red-100);
  color: var(--error-red-800);
}
.user-status .not-applicable {
  background: var(--info-blue-700);
  color: #fafdfc;
}
.main.team-performance .user-status .at-risk {
  color: var(--warning-yellow-600);
}
.icon-sort {
  width: 16px;
  transition: all 0.3s ease;
}
.icon-sort.active svg path {
  fill: #898866;
}
.icon-sort.active {
  transform: rotate(180deg);
}
.th-target {
  cursor: pointer;
}
.th-target > div {
  display: flex;
  align-items: center;
  column-gap: 2px;
}
.edit-user .cure-modal-body,
.new-user .cure-modal-body {
  max-height: 500px;
  max-width: 462.23px;
  overflow: auto;
}

/* Client Performance
-----------------------------------------------------------*/
.api-loader img {
  width: 100%;
}
.client-color {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.client_name {
  display: flex;
  column-gap: 5px;
  align-items: center;
}
.page-template-client-reporting .api-loader {
  position: absolute;
  left: 240px;
  width: calc(100% - 240px);
  z-index: 999;
}

/* Team Performance
-----------------------------------------------------------*/
tr.total-hours {
  border-top: 1px solid var(--primary-gold-400);
}
.main.team-performance
  td:not(.total-hours-hit):not(.all-users-total-status)
  div {
  display: flex;
  align-items: center;
  column-gap: 5px;
}
.user-management meter {
  display: none;
}
.user-management.team-performance tr:not(.user-breakdown) {
  cursor: pointer;
}
.cure-modal.user-details .cure-modal-body {
  max-height: 500px;
  overflow: scroll;
}
.cure-modal.user-details .inner {
  max-width: 90%;
}
.cure-modal.user-details td {
  white-space: nowrap;
}
.user-management.team-performance .filter.f--status {
  display: none;
}
.user-management.team-performance .approval-actions {
  justify-content: flex-start;
}
.user-management.team-performance .cr-table th {
  width: 12.5%;
}

.cure-modal.user-details .cure-modal-body {
  padding: 20px 0;
}
.cure-modal.user-details .cure-modal-header {
  justify-content: flex-start;
  column-gap: 15px;
}

/* Sprint Burn Rate
-----------------------------------------------------------*/
.sum-total-container b {
  font-weight: 600;
}
#new-sprint {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
}
.cure-filed-scroller-group {
  max-height: 300px;
  overflow: auto;
  display: flex;
  flex-direction: column;
  row-gap: 20px;
  padding: 20px;
  border: 0.5px solid var(--primary-gold-50);
}
.cure-filed-scroller-group .cure-field-group {
  flex-direction: row;
  align-items: center;
  column-gap: 10px;
  justify-content: space-between;
}
.new-sprint .cure-field-group label {
  display: flex;
  align-items: center;
  column-gap: 5px;
}
.new-sprint .cure-field-group label img {
  border-radius: 50%;
}
.cure-modal-footer .data-loader {
  width: 24px;
}
.sbr-timesheets tbody tr {
  cursor: pointer;
  transition: all 0.2s ease;
}

.sprint-burn-rate .f--user > .select2-container {
  width: 100% !important;
  white-space: nowrap;
}
.planned-points,
.actual-points {
  display: flex;
  column-gap: 15px;
}
.ph,
.ah {
  background-color: cornsilk;
  font-size: 0.8em;
  display: flex;
  align-items: center;
  padding: 0 5px;
  border-radius: 36px;
}
.client-overview-fields .instructions {
  padding-bottom: 20px;
}

/* Edit Sprint
-----------------------------------------------------------*/
.cure-modal.edit-sprint .users-planned-time label {
  display: flex;
  align-items: center;
  column-gap: 5px;
}
.cure-modal.edit-sprint .users-planned-time label img {
  width: 24px;
  border: 2px solid #fef5dc;
  border-radius: 50%;
  background-color: #c4c4c4;
}
.cure-modal.edit-sprint .success-msg {
  color: green;
  font-size: 0.8em;
}

/* Date Range Selector
-----------------------------------------------------------*/
.cure-date-range {
  display: flex;
  column-gap: 16px;
}
.cure-date-selector {
  padding: 12px 16px;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
}
.cure-date-selector:hover {
  background-color: rgba(255, 255, 255, 0.05);
}
.cure-date-selector.active {
  background-color: #000;
}
.cure-date-selector svg {
  transition: all 0.3s ease;
}
.cure-date-selector.active svg:last-of-type {
  transform: rotate(180deg) translateX(-4px);
  transform-origin: center; /* Keep the rotation centered */
}
.cure-date-selector.active .date-selections {
  display: block;
}
.cure-date-selector,
.cure-date-range .date-notice {
  font-size: 12px;
  color: #000;
  font-weight: 400;
  display: flex;
  align-items: center;
}
.cure-date-selector svg:first-child {
  padding-right: 8px;
}
.cure-date-selector svg:last-of-type {
  padding-left: 4px;
}
.date-selections {
  position: absolute;
  top: 41.5px;
  left: 0;
  width: calc(100% - 2px);
  border: 1px solid var(--primary-gold-50, #f4f4f0);
  background: var(--neutral-white, #fff);
  z-index: 9999;
  border-top: none;
  display: none;
}
.date-selections div {
  padding: 14px 18px;
}
.date-selections
  div:not(.custom-date-selector):not(.custom-date-selector *):hover {
  background-color: var(--primary-gold-50);
}
.cds-to,
.cds-from {
  display: flex;
  align-items: center;
  column-gap: 10px;
  justify-content: space-between;
}
input[type="date"] {
  border: none;
  border-bottom: 0.5px solid var(--neutral-500);
}
.custom-date-selector label,
.custom-date-selector input,
.custom-date-selector button {
  font-size: 12px;
  color: #000;
}
.custom-date-selector input:focus-visible {
  outline: none;
  border-bottom: 0.5px solid var(--primary-gold-500);
}
.cds-btn-cancel {
  border: none;
  outline: none;
  background: transparent;
  cursor: pointer;
}
.cds-btn-submit {
  cursor: pointer;
  outline: none;
  border: none;
  background-color: var(--primary-gold-500);
  color: #fff !important;
  padding: 8px 10px;
  transition: all 0.3s ease;
}
.cds-btn-submit:hover {
  background-color: var(--primary-gold-600);
}
.table-actions a:hover svg path,
.approval-actions a:hover svg path {
  fill: var(--primary-gold-400);
}
.await-client-slection .select2-container,
.client-selection-from-ph .select2-container {
  width: 100% !important;
}

/* ================================
RICH TEXT EDITOR
==================================*/
i.mce-i-bold:before {
  content: "" !important;
  display: inline-block;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M11.4058 15.625H5.62451V4.375H10.937C11.5634 4.37504 12.1766 4.55435 12.7043 4.89174C13.232 5.22914 13.6522 5.71052 13.915 6.27903C14.1779 6.84754 14.2726 7.47942 14.1879 8.10001C14.1032 8.72061 13.8426 9.30399 13.437 9.78125C13.9668 10.205 14.3523 10.7825 14.5403 11.4344C14.7284 12.0862 14.7097 12.7803 14.487 13.4211C14.2642 14.0619 13.8483 14.6179 13.2965 15.0126C12.7447 15.4073 12.0842 15.6213 11.4058 15.625ZM7.49951 13.75H11.3933C11.5779 13.75 11.7608 13.7136 11.9314 13.643C12.102 13.5723 12.257 13.4687 12.3876 13.3381C12.5182 13.2075 12.6218 13.0525 12.6925 12.8819C12.7631 12.7113 12.7995 12.5284 12.7995 12.3438C12.7995 12.1591 12.7631 11.9762 12.6925 11.8056C12.6218 11.635 12.5182 11.48 12.3876 11.3494C12.257 11.2188 12.102 11.1152 11.9314 11.0445C11.7608 10.9739 11.5779 10.9375 11.3933 10.9375H7.49951V13.75ZM7.49951 9.0625H10.937C11.1217 9.0625 11.3045 9.02613 11.4752 8.95546C11.6458 8.88478 11.8008 8.7812 11.9314 8.65062C12.062 8.52004 12.1655 8.36501 12.2362 8.1944C12.3069 8.02378 12.3433 7.84092 12.3433 7.65625C12.3433 7.47158 12.3069 7.28872 12.2362 7.11810C12.1655 6.94749 12.062 6.79246 11.9314 6.66188C11.8008 6.53130 11.6458 6.42772 11.4752 6.35704C11.3045 6.28637 11.1217 6.25 10.9370 6.25H7.49951V9.0625Z' fill='%23191919'/%3E%3C/svg%3E");
  width: 20px;
  height: 20px;
}
/* Custom Italic Icon */
i.mce-i-italic:before {
  content: "" !important;
  display: inline-block;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M15.6245 5.625V4.375H7.49951V5.625H10.712L7.98076 14.375H4.37451V15.625H12.4995V14.375H9.28701L12.0183 5.625H15.6245Z' fill='%23191919'/%3E%3C/svg%3E");
  width: 20px; /* Adjust the width and height to match your icon size */
  height: 20px;
}
/* Custom Underline Icon */
i.mce-i-underline:before {
  content: "" !important;
  display: inline-block;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M2.49951 16.25H17.4995V17.5H2.49951V16.25ZM9.99951 14.375C8.83919 14.375 7.72639 13.9141 6.90592 13.0936C6.08545 12.2731 5.62451 11.1603 5.62451 10V3.125H6.87451V10C6.87451 10.8288 7.20375 11.6237 7.7898 12.2097C8.37585 12.7958 9.17071 13.125 9.99951 13.125C10.8283 13.125 11.6232 12.7958 12.2092 12.2097C12.7953 11.6237 13.1245 10.8288 13.1245 10V3.125H14.3745V10C14.3745 11.1603 13.9136 12.2731 13.0931 13.0936C12.2726 13.9141 11.1598 14.375 9.99951 14.375Z' fill='%23191919'/%3E%3C/svg%3E");
  width: 20px; /* Adjust the width and height to match your icon size */
  height: 20px;
}
/* Custom Bulleted List Icon */
i.mce-i-bullist:before {
  content: "" !important;
  display: inline-block;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M4.375 7.5C5.41053 7.5 6.25 6.66053 6.25 5.625C6.25 4.58947 5.41053 3.75 4.375 3.75C3.33947 3.75 2.5 4.58947 2.5 5.625C2.5 6.66053 3.33947 7.5 4.375 7.5Z' fill='%23191919'/%3E%3Cpath d='M4.375 16.25C5.41053 16.25 6.25 15.4105 6.25 14.375C6.25 13.3395 5.41053 12.5 4.375 12.5C3.33947 12.5 2.5 13.3395 2.5 14.375C2.5 15.4105 3.33947 16.25 4.375 16.25Z' fill='%23191919'/%3E%3Cpath d='M10 13.75H18.75V15H10V13.75ZM10 5H18.75V6.25H10V5Z' fill='%23191919'/%3E%3C/svg%3E");
  width: 20px; /* Adjust the width and height to match your icon size */
  height: 20px;
}
/* Custom Numbered List Icon */
i.mce-i-numlist:before {
  content: "" !important;
  display: inline-block;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M10 13.75H18.75V15H10V13.75ZM10 5H18.75V6.25H10V5ZM5 7.5V2.5H3.75V3.125H2.5V4.375H3.75V7.5H2.5V8.75H6.25V7.5H5ZM6.25 17.5H2.5V15C2.5 14.6685 2.6317 14.3505 2.86612 14.1161C3.10054 13.8817 3.41848 13.75 3.75 13.75H5V12.5H2.5V11.25H5C5.33152 11.25 5.64946 11.3817 5.88388 11.6161C6.1183 11.8505 6.25 12.1685 6.25 12.5V13.75C6.25 14.0815 6.1183 14.3995 5.88388 14.6339C5.64946 14.8683 5.33152 15 5 15H3.75V16.25H6.25V17.5Z' fill='%23191919'/%3E%3C/svg%3E");
  width: 20px; /* Adjust the width and height to match your icon size */
  height: 20px;
}
/* Custom Link Icon */
i.mce-i-link:before {
  content: "" !important;
  display: inline-block;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M18.2813 4.22503C17.9329 3.87543 17.5189 3.59804 17.0631 3.40877C16.6073 3.2195 16.1186 3.12207 15.625 3.12207C15.1315 3.12207 14.6428 3.2195 14.187 3.40877C13.7312 3.59804 13.3172 3.87543 12.9688 4.22503L13.8563 5.11253C14.089 4.87984 14.3652 4.69526 14.6692 4.56934C14.9733 4.44341 15.2991 4.37859 15.6282 4.37859C15.9572 4.37859 16.2831 4.44341 16.5871 4.56934C16.8911 4.69526 17.1674 4.87984 17.4 5.11253C17.6327 5.34521 17.8173 5.62145 17.9432 5.92547C18.0692 6.22949 18.134 6.55533 18.134 6.8844C18.134 7.21347 18.0692 7.53931 17.9432 7.84333C17.8173 8.14735 17.6327 8.42359 17.4 8.65628L12.4 13.6563C11.9309 14.1262 11.2944 14.3905 10.6304 14.3911C9.96638 14.3917 9.32935 14.1285 8.85942 13.6594C8.38949 13.1903 8.12515 12.5537 8.12457 11.8897C8.12398 11.2257 8.38719 10.5887 8.85629 10.1188L9.73754 9.23128L8.85629 8.34378L7.96879 9.23128C7.61919 9.57966 7.3418 9.99364 7.15253 10.4495C6.96326 10.9053 6.86583 11.3940 6.86583 11.8875C6.86583 12.3810 6.96326 12.8696 7.15253 13.3254C7.3418 13.7813 7.61919 14.1953 7.96879 14.5437C8.67597 15.2419 9.63134 15.6308 10.6250 15.6250C11.1205 15.6270 11.6114 15.5309 12.0695 15.3421C12.5276 15.1533 12.9437 14.8756 13.2938 14.5250L18.2938 9.5250C18.9944 8.8202 19.3866 7.8662 19.3842 6.8724C19.3819 5.8786 18.9852 4.9265 18.2813 4.2250Z' fill='%23191919'/%3E%3Cpath d='M2.61879 15.5125C2.38541 15.2802 2.20022 15.0041 2.07386 14.7C1.94749 14.396 1.88244 14.0699 1.88244 13.7407C1.88244 13.4114 1.94749 13.0853 2.07386 12.7813C2.20022 12.4772 2.38541 12.2011 2.61879 11.9688L7.61879 6.96878C7.85109 6.7354 8.1272 6.55021 8.43127 6.42384C8.73534 6.29748 9.06138 6.23243 9.39067 6.23243C9.71995 6.23243 10.046 6.29748 10.3501 6.42384C10.6541 6.55021 10.9302 6.7354 11.1625 6.96878C11.3944 7.2029 11.5770 7.48119 11.6994 7.78716C11.8218 8.09313 11.8815 8.42055 11.8750 8.75003C11.8769 9.08053 11.8133 9.40813 11.6878 9.71388C11.5623 10.0196 11.3774 10.2974 11.1438 10.5313L9.81879 11.8750L10.7063 12.7625L12.0313 11.4375C12.7366 10.7322 13.1328 9.77561 13.1328 8.77815C13.1328 7.78069 12.7366 6.82409 12.0313 6.11878C11.3260 5.41347 10.3694 5.01723 9.37192 5.01723C8.37446 5.01723 7.41785 5.41347 6.71254 6.11878L1.71254 11.1188C1.36200 11.4673 1.08382 11.8816 0.893994 12.3380C0.704168 12.7944 0.606445 13.2839 0.606445 13.7782C0.606445 14.2725 0.704168 14.7619 0.893994 15.2183C1.08382 15.6747 1.36200 16.0890 1.71254 16.4375C2.42431 17.1303 3.38185 17.5124 4.37504 17.5000C5.37698 17.5010 6.33862 17.1055 7.05004 16.4000L6.16254 15.5125C5.93025 15.7459 5.65413 15.9311 5.35006 16.0575C5.04599 16.1838 4.71995 16.2489 4.39067 16.2489C4.06138 16.2489 3.73534 16.1838 3.43127 16.0575C3.12720 15.9311 2.85109 15.7459 2.61879 15.5125Z' fill='%23191919'/%3E%3C/svg%3E");
  width: 20px; /* Adjust the width and height to match your icon size */
  height: 20px;
}
/* Define styles for your custom icon here */
.mce-i-custom-mce-icon:before {
  content: "" !important;
  display: inline-block;
  background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"%3E%3Cpath d="M11.875 8.75C12.2458 8.75 12.6084 8.64003 12.9167 8.43401C13.225 8.22798 13.4654 7.93514 13.6073 7.59253C13.7492 7.24992 13.7863 6.87292 13.714 6.50921C13.6416 6.14549 13.463 5.8114 13.2008 5.54917C12.9386 5.28695 12.6045 5.10837 12.2408 5.03603C11.8771 4.96368 11.5001 5.00081 11.1575 5.14273C10.8149 5.28464 10.522 5.52496 10.316 5.83331C10.11 6.14165 10 6.50416 10 6.875C10 7.37228 10.1975 7.84919 10.5492 8.20083C10.9008 8.55246 11.3777 8.75 11.875 8.75ZM11.875 6.25C11.9986 6.25 12.1195 6.28666 12.2222 6.35533C12.325 6.42401 12.4051 6.52162 12.4524 6.63582C12.4997 6.75003 12.5121 6.87569 12.488 6.99693C12.4639 7.11817 12.4044 7.22953 12.3169 7.31694C12.2295 7.40435 12.1182 7.46388 11.9969 7.48799C11.8757 7.51211 11.75 7.49973 11.6358 7.45243C11.5216 7.40512 11.424 7.32501 11.3553 7.22223C11.2867 7.11945 11.25 6.99861 11.25 6.875C11.25 6.70924 11.3158 6.55027 11.4331 6.43306C11.5503 6.31585 11.7092 6.25 11.875 6.25Z" fill="%23191919"/%3E%3Cpath d="M16.25 2.5H3.75C3.41848 2.5 3.10054 2.6317 2.86612 2.86612C2.6317 3.10054 2.5 3.41848 2.5 3.75V16.25C2.5 16.5815 2.6317 16.8995 2.86612 17.1339C3.10054 17.3683 3.41848 17.5 3.75 17.5H16.25C16.5815 17.5 16.8995 17.3683 17.1339 17.1339C17.3683 16.8995 17.5 16.5815 17.5 16.25V3.75C17.5 3.41848 17.3683 3.10054 17.1339 2.86612C16.8995 2.6317 16.5815 2.5 16.25 2.5ZM16.25 16.25H3.75V12.5L6.875 9.375L10.3688 12.8687C10.603 13.1016 10.9198 13.2322 11.25 13.2322C11.5802 13.2322 11.897 13.1016 12.1313 12.8687L13.125 11.875L16.25 15V16.25ZM16.25 13.2312L14.0063 10.9875C13.772 10.7547 13.4552 10.624 13.125 10.624C12.7948 10.624 12.478 10.7547 12.2437 10.9875L11.25 11.9812L7.75625 8.4875C7.52205 8.25469 7.20523 8.12401 6.875 8.12401C6.54477 8.12401 6.22795 8.25469 5.99375 8.4875L3.75 10.7312V3.75H16.25V13.2312Z" fill="%23191919"/%3E%3C/svg%3E');
  width: 20px; /* Adjust the width and height to match your icon size */
  height: 20px;
}
.brief-fields .wp-editor-tools,
.mce-path.mce-flow-layout-item.mce-first {
  display: none;
}
.brief-fields .cure-rich-text-editor {
  width: 66.66%;
}
.slide-form .cure-field-group.is-child .cure-rich-text-editor > div {
  width: 66.66%;
}
.slide-form .cure-field-group.is-child .cure-rich-text-editor {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

/* ================================
** THE MAIN DASHBOARD
==================================*/
.dashboard-header p {
  padding-top: 10px;
  font-size: 12px;
  font-style: italic;
  font-weight: 300;
}
.client-logos img {
  height: 27px;
  width: auto;
  border-radius: 50%;
}
.db-section-heading {
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  padding-bottom: 5px;
}
.db-section-heading span {
  font-size: 13px;
  opacity: 0.6;
}
.dashboard-modules {
  margin-top: 50px;
}
.dashboard-modules > div:not(.cure-2cols),
.cure-2cols > div {
  padding: 12px 20px;
}
.dashboard-modules > div > div:not(.inner-db-module) {
  border-radius: 2px;
  display: flex;
  gap: 20px;
}
.client-results-box {
  padding: 12px;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.05);
  width: 21%;
  cursor: pointer;
  box-shadow: 0 0 7px rgba(255, 255, 255, 0.25);
}
.client-results-box .client-logos {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.db--client-results .client-cpa-status.on-target {
  background-color: #e6fbd9;
  border-radius: 36px;
  color: #0f5b1d;
  font-size: 12px;
  padding: 5px 10px 7px;
  font-weight: 500;
}
.db--client-results .client-cpa-status.above-target {
  background-color: #ffe8d7;
  border-radius: 36px;
  color: #931222;
  font-size: 12px;
  padding: 5px 10px 7px;
  font-weight: 500;
}
.db--client-results .client-cpa-status.not-applicable {
  background-color: var(--neutral-100);
  color: var(--neutral-500);
  border-radius: 36px;
  font-size: 12px;
  padding: 5px 10px 7px;
  font-weight: 500;
  text-transform: lowercase;
}
.client-cpa-status {
  display: flex;
  align-items: center;
  text-transform: capitalize;
}
.client-cpa-status > img {
  height: 10px;
  width: 10px;
}
.client-stats {
  margin-top: 16px;
  display: flex;
  justify-content: space-between;
}
.client-stats div {
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
}
.cure-2cols {
  margin-top: 10px;
}
.cure-2cols > div {
  width: 45%;
}
.cure-2cols {
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
}
.inner-db-module .wtd-date {
  color: var(--primary-gold-500);
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
}
/* Approvals (pending) sub-module */
.ab-details img {
  height: 27px;
  width: auto;
  border-radius: 50%;
}
.ab-details {
  display: flex;
  align-items: center;
  column-gap: 17px;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  color: #000;
}
.ab-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.approvals-box {
  padding: 11px 10px;
  border-radius: 2px;
  border: 1px solid var(--gray-200, #eaecee);
  background: #fff;
}
.ab-approval-status {
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  color: var(--primary-gold-800);
  padding: 5px 10px 7px 10px;
  border-radius: 36px;
}
.ab-approval-status.for-approval {
  background-color: var(--primary-gold-100);
}
.cure-collaborators img {
  width: 32px;
  height: 32px;
  border-radius: 32px;
  border: 2px solid var(--primary-blue-100, #d8d8fe);
}
.cure-collaborators {
  margin-top: 16px;
  display: flex;
  align-items: center;
}
.approvals-loop {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
}
.sub-module-with-filter.time-spent {
  display: flex;
  justify-content: space-between;
}
.sub-module-with-filter.time-spent .select2 {
  width: fit-content !important;
}

/* ================================
** WEBOZZA PROJECTS
==================================*/
.webozza-projects .client-overviews {
  padding: 24.5px 26px;
  display: flex;
}

.cure-modal.view-task-notes .inner {
  box-shadow: none;
}

.task-comment-box {
  margin-top: 50px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.1);
  border-left: 4px solid chartreuse;
  font-size: 14px;
  color: #f1f1f1;
  border-radius: 4px;
}

.client-overviews {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.co-card {
  padding: 15px;
  border-radius: 8px;
  width: 250px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
  background: rgba(255, 255, 255, 0.1);
}

.co-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.client-info {
  display: flex;
  align-items: center;
}

.client-info img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin-right: 10px;
}

.payable-info {
  text-align: right;
}

.jenny-meta-data .currency-label {
  text-align: right;
}

.payable-info strong,
.usd-value-price {
  color: chartreuse;
  font-weight: 500;
  font-size: 16px;
  display: block;
}

.currency-label {
  font-size: 12px;
  color: #fff;
  letter-spacing: 0.75px;
  font-weight: 600;
}

.co-card-balance {
  font-size: 14px;
  color: #f3f3f3;
  margin-top: 10px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

.status-pill,
.paid-status {
  display: block;
  width: fit-content;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 500;
  border-radius: 2px;
  text-transform: uppercase;
}

.pill--delivered {
  background: #8e99e4;
  color: #fff;
}

.pill--accepted,
.status-paid {
  background: #d0f7e6;
  color: #005c25;
}

.pill--in-progress,
.status-unpaid {
  background: #d4defb;
  color: #1d3369;
}

.pill--not-confirmed {
  background: darkslategrey;
  color: darkgray;
  white-space: nowrap;
}

.task-info-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 10px;
}

.task-info-table td {
  padding: 6px 10px;
  border-bottom: 1px solid #eee;
  vertical-align: top;
}

.countdown-timer {
  display: flex;
  column-gap: 8px;
  font-family: "Poppins", sans-serif;
  justify-content: center;
  align-items: center;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 5px;
}

.countdown-timer .time-box {
  text-align: center;
}

.countdown-timer .time-box b {
  font-size: 18px;
  display: block;
}

.countdown-timer .time-box span {
  font-size: 10px;
  color: #999;
}

.cure-modal.view-task-notes .inner {
  max-width: 800px;
  min-width: 800px;
}

.toggle-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
}

.switch {
  position: relative;
  display: inline-block;
  width: 42px;
  height: 22px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  transition: 0.3s;
  border-radius: 34px;
}

.slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  transition: 0.3s;
  border-radius: 50%;
}

input:checked + .slider {
  background-color: #8e99e4;
}

input:checked + .slider:before {
  transform: translateX(20px);
}

.webozza-projects .cure-field-group {
  display: flex;
  gap: 20px;
  align-items: center;
}

.main.passwords.webozza-projects .greetings .select2 {
  width: 200px !important;
}

.co-card-balance a svg {
  position: relative;
  top: 15px;
  right: -10px;
}

.status-pill.pill--in-revision {
  color: #912626;
  background: #fed0d0;
}

.status-pill.pill--requirements-needed {
  color: #825723;
  background: #ffecd1;
}

.doc-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  color: chartreuse; /* adjust to theme */
  font-weight: 500;
}

.doc-link:hover {
  text-decoration: underline;
}

.doc-icon {
  width: 18px;
  height: 18px;
}

.nice-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, 0.15);
  padding: 6px 10px;
  border-radius: 999px;
  line-height: 1;
}
.nice-link:hover {
  border-color: rgba(255, 255, 255, 0.35);
}

.nice-link__icon {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

/* ================================
** ALL PROJECTS
==================================*/
.all-projects-wrap {
  padding: 24.5px 26px;
  width: 100%;
}
.all-projects-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 20px;
}
.client-card {
  display: block;
  text-decoration: none;
  background: #101010;
  border: 1px solid #1f1f1f;
  border-radius: 16px;
  overflow: hidden;
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease,
    border-color 0.15s ease;
}
.client-card:hover {
  transform: translateY(-2px);
  border-color: #2a2a2a;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.25);
}
.client-card-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
}
.client-card-header img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  flex: 0 0 56px;
  border: 1px solid #2b2b2b;
}
.client-card-title {
  font-size: 18px;
  font-weight: 600;
  color: #eaeaea;
  line-height: 1.2;
}
.client-card-sub {
  color: #b7b7b7;
  font-size: 13px;
  margin-top: 2px;
}
.client-card-footer {
  padding: 12px 16px;
  border-top: 1px solid #1d1d1d;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.badge {
  font-size: 12px;
  line-height: 1;
  padding: 6px 10px;
  border-radius: 999px;
  background: #1e1e1e;
  color: #cfcfcf;
  border: 1px solid #2a2a2a;
}
.arrow {
  color: #bdbdbd;
  font-size: 14px;
}

/* ================================
** PROJECTS PAGE — breathing room
==================================*/
.main.passwords.webozza-projects {
  padding-bottom: 60px;
}

/* ================================
** PROJECT MODALS (add / edit)
==================================*/
.cure-modal.add-project .inner,
.cure-modal.edit-project .inner {
  width: min(1120px, calc(100vw - 64px));
  max-width: 96vw;
  max-height: calc(100dvh - 48px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.cure-modal.add-project .cure-modal-header,
.cure-modal.edit-project .cure-modal-header,
.cure-modal.add-project .cure-modal-footer,
.cure-modal.edit-project .cure-modal-footer {
  flex: 0 0 auto;
}
.cure-modal.add-project .cure-modal-body,
.cure-modal.edit-project .cure-modal-body {
  flex: 1 1 auto;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.cure-modal.add-project .modal-btn-wrapper,
.cure-modal.edit-project .modal-btn-wrapper {
  padding-top: 18px;
}

/* Match select + textarea to the existing input style */
.cure-modal select,
.cure-modal textarea {
  border: none;
  border-bottom: 0.5px solid var(--neutral-500);
  padding: 12px;
  background: rgba(255, 255, 255, 0.1);
  box-sizing: border-box;
  color: #eaeaea;
  font-family: inherit;
  font-size: inherit;
  width: 100%;
  border-radius: 0;
}
.cure-modal select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23aaa' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 12px;
  cursor: pointer;
  padding-right: 32px;
}
.cure-modal select option {
  background: #111;
  color: #eaeaea;
}
.cure-modal select:focus-visible,
.cure-modal textarea:focus-visible {
  outline: none;
  border-bottom: 0.5px solid var(--primary-gold-500);
}
.cure-modal textarea {
  resize: vertical;
  min-height: 80px;
}
.cure-modal .project-comments-editor {
  width: 100%;
}
.cure-modal .project-comments-editor .wp-editor-wrap,
.cure-modal .project-comments-editor .wp-editor-container,
.cure-modal .project-comments-editor iframe,
.cure-modal .project-comments-editor textarea {
  width: 100% !important;
}
.cure-modal .project-comments-editor .wp-editor-container {
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: #111;
}
.cure-modal .project-comments-editor .mce-toolbar-grp,
.cure-modal .project-comments-editor .mce-statusbar,
.cure-modal .project-comments-editor .mce-top-part::before {
  background: #111 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: none !important;
}
.cure-modal .project-comments-editor .mce-btn {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
.cure-modal .project-comments-editor .mce-btn:hover,
.cure-modal .project-comments-editor .mce-btn:focus,
.cure-modal .project-comments-editor .mce-btn.mce-active {
  background: rgba(197, 195, 163, 0.16) !important;
  border-color: rgba(197, 195, 163, 0.24) !important;
}
.cure-modal .project-comments-editor .mce-toolbar .mce-btn i,
.cure-modal .project-comments-editor .mce-ico {
  color: #c5c3a3 !important;
  text-shadow: none !important;
}
.cure-modal .project-comments-editor .mce-btn button {
  color: #c5c3a3 !important;
}
.cure-modal .project-comments-editor .mce-btn.mce-disabled,
.cure-modal .project-comments-editor .mce-btn.mce-disabled:hover {
  background: transparent !important;
  border-color: transparent !important;
  opacity: 0.4;
}
.cure-modal .project-comments-editor .mce-btn.mce-disabled i,
.cure-modal .project-comments-editor .mce-btn.mce-disabled .mce-ico {
  color: #5d5b48 !important;
}
.cure-modal .project-comments-editor .mce-ico::before {
  filter: invert(92%) sepia(13%) saturate(530%) hue-rotate(15deg) brightness(104%);
}
.cure-modal .project-comments-editor .mce-i-undo::before,
.cure-modal .project-comments-editor .mce-i-redo::before,
.cure-modal .project-comments-editor .mce-i-unlink::before {
  color: #c5c3a3 !important;
}
.cure-modal .project-comments-editor .mce-btn.mce-disabled .mce-i-undo::before,
.cure-modal .project-comments-editor .mce-btn.mce-disabled .mce-i-redo::before,
.cure-modal .project-comments-editor .mce-btn.mce-disabled .mce-i-unlink::before {
  color: #5d5b48 !important;
}
.cure-modal .project-comments-editor .mce-toolbar .mce-container-body {
  opacity: 1;
}
.cure-modal .project-comments-editor .wp-media-buttons {
  display: none;
}
.cure-modal .project-comments-editor .mce-edit-area,
.cure-modal .project-comments-editor iframe {
  background: #111 !important;
}
.cure-modal .project-comments-editor .wp-editor-tools {
  display: none;
}

/* Side-by-side field pairs */
.cure-modal .field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

@media (max-width: 760px) {
  .cure-modal.add-project .inner,
  .cure-modal.edit-project .inner {
    width: calc(100vw - 24px);
    max-width: calc(100vw - 24px);
    max-height: calc(100dvh - 24px);
  }
  .cure-modal.add-project .field-row,
  .cure-modal.edit-project .field-row {
    grid-template-columns: 1fr;
  }
}

/* Flatpickr inside modal — inherit the input style */
.cure-modal .flatpickr-input {
  width: 100%;
}

.projects-graph-section {
  padding: 24.5px 26px;
}

/* ─── Project chart header stats ─────────────────────────── */
.pchart-header {
  margin-bottom: 12px;
}
.pchart-label {
  display: block;
  font-size: 11px;
  font-weight: 600;
  color: #888;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 4px;
}
.pchart-value-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 2px;
}
.pchart-total {
  font-size: 22px;
  font-weight: 800;
  color: #eaeaea;
  line-height: 1.1;
}
.pchart-indicator {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 12px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 20px;
}
.pchart-indicator svg {
  width: 11px;
  height: 11px;
  flex-shrink: 0;
}
.pchart-ind-up {
  color: #8eea8e;
  background: rgba(142, 234, 142, 0.12);
}
.pchart-ind-down {
  color: #ea6b6b;
  background: rgba(234, 107, 107, 0.12);
}
.pchart-period {
  font-size: 11px;
  color: #666;
}

/* Override ApexCharts tooltip chrome on dark pages */
.apexcharts-tooltip {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.apexcharts-tooltip-series-group {
  display: none !important;
}

/* ─── pchart date range picker ───────────────────────────── */
.pchart-header-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 6px;
}
.pchart-range-wrap {
  position: relative;
}
.pchart-range-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 6px;
  padding: 4px 10px;
  color: #aaa;
  font-size: 11px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  transition:
    background 0.15s,
    color 0.15s;
}
.pchart-range-btn:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #eaeaea;
}
.pchart-range-panel {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 200;
  background: #1a1a1a;
  border: 1px solid #2a2a2a;
  border-radius: 10px;
  min-width: 180px;
  padding: 6px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
}
.pchart-range-panel.open {
  display: block;
}
.pchart-presets-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.pchart-presets-list li {
  padding: 7px 12px;
  border-radius: 6px;
  font-size: 12px;
  color: #aaa;
  cursor: pointer;
  transition:
    background 0.12s,
    color 0.12s;
}
.pchart-presets-list li:hover {
  background: rgba(255, 255, 255, 0.06);
  color: #eaeaea;
}
.pchart-presets-list li.active {
  color: #8eea8e;
  background: rgba(142, 234, 142, 0.08);
}
.pchart-custom-wrap {
  display: none;
  flex-direction: column;
  gap: 6px;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid #2a2a2a;
}
.pchart-custom-wrap.visible {
  display: flex;
}
.pchart-custom-input {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid #333;
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 12px;
  color: #ccc;
  width: 100%;
  box-sizing: border-box;
  cursor: pointer;
}
.pchart-apply-btn {
  background: #8eea8e;
  color: #111;
  border: none;
  border-radius: 6px;
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s;
}
.pchart-apply-btn:hover {
  background: #a5f0a5;
}

/* ─── Project assignee avatars ───────────────────────────── */
.assignee-stack {
  display: flex;
  align-items: center;
}
.assignee-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  margin-right: 5px;
  object-fit: cover;
}
.assignee-more {
  font-size: 11px;
  color: #888;
  margin-left: 10px;
  white-space: nowrap;
}

/* ─── Clear filters button ───────────────────────────────── */
.proj-clear-filters {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  color: #888;
  border-bottom: 1px solid #555;
  padding-bottom: 2px;
  white-space: nowrap;
  transition:
    color 0.15s,
    border-color 0.15s;
}
.proj-clear-filters:hover {
  color: #fff;
  border-color: #fff;
  text-decoration: none;
}

/* ─── Project page nav switcher ──────────────────────────── */
.proj-switcher {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.proj-switcher__back {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: #666;
  text-decoration: none;
  padding: 5px 10px;
  border-radius: 20px;
  border: 1px solid #252525;
  background: #111;
  transition:
    color 0.15s,
    border-color 0.15s;
  margin-right: 4px;
}
.proj-switcher__back:hover {
  color: #eea851;
  border-color: #eea851;
  text-decoration: none;
}
.proj-switcher__tabs {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.proj-switcher__tab {
  font-size: 12px;
  font-weight: 500;
  color: #666;
  text-decoration: none;
  padding: 5px 14px;
  border-radius: 20px;
  border: 1px solid #252525;
  background: #111;
  transition:
    color 0.15s,
    background 0.15s,
    border-color 0.15s;
}
.proj-switcher__tab:hover {
  color: #ccc;
  border-color: #333;
  text-decoration: none;
}
.proj-switcher__tab.is-active {
  color: #000 !important;
  background: chartreuse;
  border-color: chartreuse;
  font-weight: bolder;
}

/* ─── Project stats dashboard ─────────────────────────────── */
.proj-insights {
  background: #101010;
  border: 1px solid #1f1f1f;
  border-radius: 16px;
  padding: 20px;
  margin: 24.5px 26px;
}

/* Row 1: client header + chips */
.proj-insights__top {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.proj-insights__client {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.proj-insights__client img {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid #2b2b2b;
}
.proj-insights__client-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.proj-insights__client-name {
  font-size: 15px;
  font-weight: 700;
  color: #eaeaea;
  line-height: 1.2;
}
.proj-insights__client-amount {
  font-size: 18px;
  font-weight: 800;
  color: #8eea8e;
  line-height: 1.1;
}
.proj-insights__client-amount em {
  font-size: 11px;
  font-style: normal;
  color: #888;
  font-weight: 400;
  margin-left: 4px;
}

/* Stat chips */
.proj-insights__chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  flex: 1;
}
.proj-stat-chip {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10px 16px;
  background: #181818;
  border: 1px solid #252525;
  border-radius: 10px;
  min-width: 70px;
  flex: 1;
}
.proj-stat-chip__val {
  font-size: 22px;
  font-weight: 800;
  color: #eaeaea;
  line-height: 1.1;
}
.proj-stat-chip__key {
  font-size: 10px;
  color: #666;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 3px;
}
.proj-stat-chip__sub {
  font-size: 9px;
  color: #555;
  margin-top: 1px;
}
.proj-stat-chip--blue {
  border-color: #1d2d44;
}
.proj-stat-chip--blue .proj-stat-chip__val {
  color: #6baed6;
}
.proj-stat-chip--green {
  border-color: #1a2e1a;
}
.proj-stat-chip--green .proj-stat-chip__val {
  color: #8eea8e;
}
.proj-stat-chip--red {
  border-color: #3a1a1a;
}
.proj-stat-chip--red .proj-stat-chip__val {
  color: #e55;
}
.proj-stat-chip--amber {
  border-color: #2e2210;
}
.proj-stat-chip--amber .proj-stat-chip__val {
  color: #eea851;
}

/* Row 2: team load */
.proj-insights__team {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 0;
  border-top: 1px solid #1f1f1f;
  border-bottom: 1px solid #1f1f1f;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.proj-insights__team-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #999;
  margin-right: 6px;
  flex-shrink: 0;
}
.proj-insights__team-members {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.proj-team-member {
  position: relative;
  display: inline-flex;
  align-items: center;
  cursor: default;
}
.proj-team-member img,
.proj-team-member__initials {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #1f1f1f;
}
.proj-team-member__initials {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #222;
  color: #aaa;
  font-size: 13px;
  font-weight: 600;
}
.proj-team-member__badge {
  position: absolute;
  bottom: -3px;
  right: -4px;
  background: #eea851;
  color: #111;
  font-size: 9px;
  font-weight: 800;
  border-radius: 10px;
  padding: 1px 4px;
  line-height: 1.4;
  border: 1px solid #101010;
}

/* Row 3: admin financial stats */
.proj-insights__finance {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.proj-fin-stat {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 140px;
  background: #141414;
  border: 1px solid #222;
  border-radius: 10px;
  padding: 12px 14px;
}
.proj-fin-stat__icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: #222;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #888;
}
.proj-fin-stat__icon--green {
  background: #1a2e1a;
  color: #8eea8e;
}
.proj-fin-stat__icon--amber {
  background: #2a1e08;
  color: #eea851;
}
.proj-fin-stat__icon--blue {
  background: #0d1d2e;
  color: #6baed6;
}
.proj-fin-stat__val {
  font-size: 16px;
  font-weight: 700;
  color: #eaeaea;
  line-height: 1.2;
}
.proj-fin-stat__ccy {
  font-size: 10px;
  font-weight: 400;
  color: #666;
  margin-left: 2px;
}
.proj-fin-stat__sub {
  font-size: 10px;
  color: #555;
  margin-top: 2px;
  line-height: 1.3;
}
.payable-sep {
  margin: 0 4px;
  color: #444;
}
.proj-fin-stat__key {
  font-size: 10px;
  color: #555;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 2px;
}

/* ─── Project payable banner ────────────────────────────── */
.proj-insights__payable {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  background: #1a1500;
  border: 1px solid #3a2c00;
  border-radius: 10px;
  margin: 4px 0;
}
.proj-insights__payable-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: #eea851;
  white-space: nowrap;
}
.proj-insights__payable-amount {
  flex: 1;
  font-size: 18px;
  font-weight: 700;
  color: #eaeaea;
}
.proj-insights__payable-amount em {
  font-style: normal;
  font-size: 11px;
  color: #666;
  margin-left: 4px;
}
.proj-insights__payable-sub {
  font-size: 10px;
  color: #555;
  white-space: nowrap;
}

/* JCI currency pills inside modal label (USD | AUD) */
.jci-ccy-pills {
  display: inline-flex;
  gap: 3px;
  margin-left: 8px;
  vertical-align: middle;
}
.jci-ccy-btn {
  padding: 2px 8px;
  border-radius: 12px;
  border: 1px solid #333;
  background: transparent;
  color: #666;
  font-size: 10px;
  font-weight: 600;
  cursor: pointer;
  line-height: 1.4;
  transition:
    background 0.12s,
    color 0.12s,
    border-color 0.12s;
}
.jci-ccy-btn:hover {
  border-color: #555;
  color: #aaa;
}
.jci-ccy-btn.is-active {
  background: #eea851;
  border-color: #eea851;
  color: #111;
}

/* Mo / Jenny pill toggle (JCI stats card) */
.jci-view-toggle {
  display: flex;
  gap: 4px;
  align-items: center;
  margin: 0 4px;
}
.jci-view-btn {
  padding: 4px 12px;
  border-radius: 20px;
  border: 1px solid #333;
  background: transparent;
  color: #666;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition:
    background 0.15s,
    color 0.15s,
    border-color 0.15s;
  white-space: nowrap;
}
.jci-view-btn:hover {
  border-color: #555;
  color: #aaa;
}
.jci-view-btn.is-active {
  background: #eea851;
  border-color: #eea851;
  color: #111;
  font-weight: 700;
}
/* Jenny stacked amounts (USD + AUD lines) */
.jci-jenny-stack {
  display: flex;
  flex-direction: column;
  gap: 1px;
  line-height: 1.25;
}
.jci-jenny-stack em {
  font-style: normal;
  font-size: 0.75em;
  color: #888;
  margin-left: 3px;
}

/* ─── Bulk action toolbar ────────────────────────────────── */
.bulk-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 14px;
  background: #1a1a1a;
  border: 1px solid #333;
  border-radius: 8px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.bulk-toolbar__count {
  font-size: 12px;
  color: #aaa;
  white-space: nowrap;
  min-width: 70px;
}
.bulk-toolbar__actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.bulk-btn {
  padding: 5px 14px;
  border-radius: 6px;
  border: 1px solid #444;
  background: #222;
  color: #ddd;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition:
    background 0.12s,
    border-color 0.12s,
    color 0.12s;
  white-space: nowrap;
}
.bulk-btn:hover {
  background: #2e2e2e;
  border-color: #666;
  color: #fff;
}
.bulk-status-select {
  padding: 5px 32px 5px 14px;
  border-radius: 6px;
  border: 1px solid #444;
  background-color: #222;
  color: #ddd;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  min-height: 30px;
}
.bulk-status-select:hover,
.bulk-status-select:focus {
  background-color: #2e2e2e;
  border-color: #666;
  color: #fff;
  outline: none;
}
.bulk-status-select:disabled {
  cursor: wait;
  opacity: 0.65;
}
.bulk-btn--clear {
  color: #888;
}
.bulk-btn--clear:hover {
  color: #ccc;
}

/* Checkbox column */
.col-cb {
  width: 36px;
  padding-right: 4px !important;
  text-align: center;
}
.col-cb input[type="checkbox"] {
  width: 15px;
  height: 15px;
  accent-color: #eea851;
  cursor: pointer;
}

/* ─── Project file upload zone ───────────────────────────── */
.proj-file-drop-area {
  border: 1px dashed #333;
  border-radius: 8px;
  padding: 14px 16px;
  text-align: center;
  color: #666;
  font-size: 13px;
  cursor: pointer;
  transition:
    border-color 0.2s,
    background 0.2s,
    color 0.2s;
  user-select: none;
}
.proj-file-drop-area:hover,
.proj-file-drop-area.drag-over {
  border-color: #eea851;
  background: rgba(238, 168, 81, 0.05);
  color: #eea851;
}
.proj-file-drop-area svg {
  transition: stroke 0.2s;
}
.proj-file-drop-area:hover svg,
.proj-file-drop-area.drag-over svg {
  stroke: #eea851;
}
.proj-file-browse {
  color: #eea851 !important;
  text-decoration: underline;
}

.proj-file-list {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-top: 8px;
}
.proj-file-item {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #111;
  border: 1px solid #252525;
  border-radius: 6px;
  padding: 7px 10px;
  font-size: 12px;
  transition: border-color 0.15s;
}
.proj-file-item--uploading {
  opacity: 0.7;
}
.proj-file-item--error {
  border-color: #c44 !important;
}
.proj-file-icon {
  flex-shrink: 0;
  color: #666;
  display: flex;
  align-items: center;
}
.proj-file-item__name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #ccc;
  text-decoration: none;
}
a.proj-file-item__name {
  color: #eea851;
}
a.proj-file-item__name:hover {
  text-decoration: underline;
}
.proj-file-item__meta {
  flex-shrink: 0;
  color: #555;
  font-size: 11px;
}
.proj-file-item__status {
  flex-shrink: 0;
  color: #888;
  font-size: 11px;
}
.proj-file-item__remove {
  flex-shrink: 0;
  color: #555;
  font-size: 17px;
  line-height: 1;
  text-decoration: none;
  padding: 0 2px;
  transition: color 0.15s;
}
.proj-file-item__remove:hover {
  color: #e55;
  text-decoration: none;
}

/* ─── Attachments in view-task-notes modal ────────────────── */
.task-files-section {
  margin-top: 16px;
}
.task-files-label {
  font-size: 11px;
  color: #555;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  margin-bottom: 8px;
}
.task-files-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.task-file-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  background: #1a1a1a;
  border: 1px solid #2a2a2a;
  border-radius: 6px;
  text-decoration: none;
  color: #eea851;
  font-size: 13px;
  transition:
    background 0.15s,
    border-color 0.15s;
}
.task-file-item .proj-file-icon {
  color: #eea851;
}
.task-file-item:hover {
  background: #222;
  border-color: #eea851;
  text-decoration: none;
}

/* ─── Split factor pill ───────────────────────────────────── */
.split-pill {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  font-size: 11px;
  font-weight: 600;
  line-height: 18px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.1);
  color: #bbb;
  vertical-align: middle;
  white-space: nowrap;
}

.jci-tip {
  white-space: nowrap;
}

.jci-tip em,
.proj-insights__tips em {
  color: #8f8f83;
  font-style: normal;
  font-size: 11px;
  margin-left: 3px;
}

.jci-empty-tip {
  color: #777;
}

.proj-insights__tips {
  border-color: rgba(197, 195, 163, .28);
}

.greetings.has-options .s2-tag__avatar {
  width: 24px;
  height: 24px;
}

.greetings.has-options .select2-selection__rendered {
  display: flex !important;
  align-items: center !important;
  height: 100% !important;
  justify-content: center !important;
}

.ap-assignee-select-wrap .select2-selection__clear {
  display: none;
}

#select2-ap-assignee-filter-container {
  display: flex;
  align-items: center;
  height: 100%;
}

/* Final scrollbar normalization after older module-specific rules. */
* {
  scrollbar-width: thin;
  scrollbar-color: #3a3a34 #101010;
}

*::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}

*::-webkit-scrollbar-track {
  background: #101010 !important;
}

*::-webkit-scrollbar-thumb {
  background: #3a3a34 !important;
  border: 2px solid #101010 !important;
  border-radius: 999px !important;
}

*::-webkit-scrollbar-thumb:hover {
  background: #5d5b48 !important;
}

*::-webkit-scrollbar-corner {
  background: #101010 !important;
}

/* ================================
** MODAL NORMALIZATION
==================================*/
.cure-modal {
  inset: 0;
  box-sizing: border-box;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px;
  overflow: hidden;
}

.cure-modal:not(.hidden),
.cure-modal[style*="display: block"],
.cure-modal[style*="display: flex"] {
  display: flex !important;
}

.cure-modal .inner {
  width: min(760px, calc(100vw - 48px));
  min-width: min(451px, calc(100vw - 48px)) !important;
  max-width: calc(100vw - 48px) !important;
  max-height: 75dvh !important;
  display: flex !important;
  flex-direction: column;
  overflow: hidden !important;
}

.cure-modal-header,
.cure-modal-footer {
  flex: 0 0 auto;
}

.cure-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.cure-modal form {
  min-height: 0;
}

.cure-modal.view-task-notes .inner,
.cure-modal.view-project-performance .inner {
  width: min(900px, calc(100vw - 48px)) !important;
  min-width: 0 !important;
}

.cure-modal.view-task-notes .cure-modal-body,
.cure-modal.view-project-performance .cure-modal-body {
  padding-top: 8px;
}

.cure-modal.view-task-notes .info-container,
.cure-modal.view-project-performance .info-container {
  min-height: 0;
}

.cure-modal.view-task-notes .task-info-table td,
.cure-modal.view-project-performance .task-info-table td {
  border-bottom-color: rgba(255, 255, 255, 0.28);
}

.cure-modal.view-task-notes a,
.cure-modal.view-project-performance a,
.task-comment-box a {
  color: #9cff4a !important;
  overflow-wrap: anywhere;
  text-decoration-color: rgba(156, 255, 74, 0.45);
  text-underline-offset: 3px;
}

.cure-modal.view-task-notes a:hover,
.cure-modal.view-project-performance a:hover,
.task-comment-box a:hover {
  color: #c5ff8a !important;
  text-decoration-color: #c5ff8a;
}

.cure-modal.view-task-notes .nice-link,
.cure-modal.view-project-performance .nice-link {
  color: #9cff4a !important;
  border-color: rgba(156, 255, 74, 0.28);
  background: rgba(156, 255, 74, 0.06);
}

.cure-modal.add-project .inner,
.cure-modal.edit-project .inner {
  width: min(1120px, calc(100vw - 48px)) !important;
}

.cure-modal.user-details .inner,
.cure-modal.new-password .inner,
.cure-modal.edit-password .inner,
.cure-modal.new-guide .inner,
.cure-modal.new-client-report .inner,
.cure-modal.edit-client-report .inner,
.cure-modal.new-user .inner,
.cure-modal.edit-user .inner,
.cure-modal.new-sprint .inner,
.cure-modal.edit-sprint .inner {
  width: min(840px, calc(100vw - 48px));
}

.task-comment-box {
  max-width: 100%;
  margin-top: 24px;
  overflow-wrap: anywhere;
}

.task-comment-box img,
.task-comment-box iframe,
.task-comment-box video {
  max-width: 100%;
  height: auto;
}

.task-comment-box ul,
.task-comment-box ol {
  padding-left: 24px;
}

@media (max-width: 640px) {
  .cure-modal {
    padding: 12px;
  }

  .cure-modal .inner,
  .cure-modal.view-task-notes .inner,
  .cure-modal.view-project-performance .inner {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    max-height: 82dvh !important;
    border-radius: 12px;
  }

  .cure-modal-header,
  .cure-modal-body {
    padding-left: 18px;
    padding-right: 18px;
  }
}

/* User notification delivery settings. */
.cure-modal .notification-email-settings { padding:16px; border:1px solid #333; border-radius:8px; }
.cure-modal .notification-email-toggle { display:flex; align-items:center; gap:10px; margin-top:14px; cursor:pointer; }
.cure-modal .notification-email-toggle input[type="checkbox"] {
  appearance:none; -webkit-appearance:none; position:relative; flex:0 0 38px;
  width:38px; height:22px; min-height:22px; margin:0; padding:0;
  border:1px solid #555; border-radius:20px; background:#333; cursor:pointer;
}
.cure-modal .notification-email-toggle input::before {
  content:""; position:absolute; top:3px; left:3px; width:14px; height:14px;
  border-radius:50%; background:#ddd; transition:transform .15s;
}
.cure-modal .notification-email-toggle input:checked { background:#4a6fa5; border-color:#6d95ce; }
.cure-modal .notification-email-toggle input:checked::before { transform:translateX(16px); background:#fff; }
.cure-modal .notification-email-toggle input:focus-visible { outline:2px solid #8ab4f8; outline-offset:3px; }
.cure-modal .notification-email-help { margin:10px 0 0; font-size:12px; line-height:1.5; color:#aaa; }
