/*========== GOOGLE FONTS ==========*/
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Infant:ital,wght@0,300..700;1,300..700&family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Inter+Tight:ital,wght@0,100..900;1,100..900&family=Onest:wght@100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

/*========== VARIABLES CSS ==========*/
:root {
  /*===== Colors =====*/
  --soft-white: #fbfaf5;
  --soft-black: #181a18;
  --white: #ffffff;
  --black: #0a0a0a;
  --t-black: #1c1d20;
  --vc-black: #141414;
  --vc-blue: #00bbe0;
  --vc-yellow: #ffdb58;
  --vc-l-grey: #e9eaec;
  --vc-grey: #708090;
  --t-blue: #023047;
  --tb-dark: #1b263b;
  --tb-light: #1b263b;
  --the-grey: #f6f7f9;
  --text-grey: #444950;
  --success: #13ae8f;
  --error: #ff3333;

  /*===== Font and typography =====*/
  --pri-font: "Poppins", sans-serif;
  --sec-font: "Inter Tight", sans-serif;
  --dms-font: "DM Sans", sans-serif;
  --cor-font: "Cormorant Infant", serif;
  --one-font: "Onest", sans-serif;

  /* .5rem = 8px, 1rem = 16px, 1.5rem = 24px ... */
  --fs-9: 9rem;
  --fs-8-5: 8.5rem;
  --fs-8: 8rem;
  --fs-7-5: 7.5rem;
  --fs-7: 7rem;
  --fs-6-5: 6.5rem;
  --fs-6: 6rem;
  --fs-5-5: 5.5rem;
  --fs-5: 5rem;
  --fs-4-5: 4.5rem;
  --fs-4: 4rem;
  --fs-3-5: 3.5rem;
  --fs-3: 3rem;
  --fs-2-5: 2.5rem;
  --fs-2: 2rem;
  --fs-1-5: 1.5rem;
  --fs-1: 1rem;
  --fs-0-95: 0.95rem;
  --fs-0-85: 0.85rem;
  --fs-0-75: 0.75rem;
  --fs-0-65: 0.65rem;
  --fs-0-5: 0.5rem;
  --fs-0-25: 0.275rem;
  --fs-0-2: 0.2rem;
  /*===== Font weight =====*/
  --font-medium: 500;
  --font-semi-bold: 600;
  /*===== Margenes Bottom =====*/
  /* .25rem = 4px, .5rem = 8px, .75rem = 12px ... */
  --mb-0-25: 0.25rem;
  --mb-0-5: 0.5rem;
  --mb-0-75: 0.75rem;
  --mb-1: 1rem;
  --mb-1-5: 1.5rem;
  --mb-2: 2rem;
  --mb-2-5: 2.5rem;
  --mb-3: 3rem;
  --mb-3-5: 3rem;
  --mb-4: 4rem;
  --mb-4-5: 4.5rem;
  --mb-5: 5rem;
  --mb-5-5: 5.5rem;
  --mb-6: 6rem;
  --mb-6-5: 6.5rem;
  --mb-7: 7rem;
  --mb-7-5: 7.5rem;
  --mb-8: 8rem;
  --mb-8-5: 8.5rem;
  --mb-9: 9rem;
  --mb-9-5: 9.5rem;
  --mb-10: 10rem;
}

/* ------ >>>>>> ========== PROMPTS (INFO - NOTICE - WARN) ========== <<<<<< ------ */
.edb-notice {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  column-gap: var(--mb-0-75);
  padding: var(--mb-0-75);
  border-radius: 8px;
  box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;
}

.edb-notice span {
  flex: 0 0 21px;
  height: 21px;
  font-size: 1.3rem;
  font-weight: 600;
}

.edbn-data {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-25);
}

.edbn-data h5 {
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1;
}

.edbn-data p {
  width: 100%;
  font-size: 0.75rem;
  font-weight: 400;
  text-align: left;
  color: var(--text-grey);
  text-wrap: inherit;
  word-wrap: break-word;
}

.edbn-ul {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  /* row-gap: var(--mb-0-25); */
}

.edbn-li {
  font-size: 0.75rem;
  font-weight: 400;
  text-align: left;
  color: var(--text-grey);
  text-wrap: inherit;
  word-wrap: break-word;
}

.edb-notice.warn span {
  color: rgba(255, 219, 87, 1);
}

.edb-notice.warn {
  background: rgba(255, 251, 238, 1);
}

.edb-notice.note span {
  color: dodgerblue;
}

.edb-notice.note {
  background: rgba(230, 248, 252, 1);
}

/* ------ >>>>>> ========== ENTREPRENEUR DASHBOARD MODALS ========== <<<<<< ------ */
.edb-modal {
  position: fixed;
  inset: 0;
  width: 100%;
  max-width: 100%;
  height: auto;
  min-width: 100dvh;
  max-height: 150dvh;
  align-items: flex-start;
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(5px);
  --webkit-backdrop-filter: blur(5px);
  padding: var(--mb-2);
  z-index: 100;
  animation: fade-center 0.3s ease-in-out;
  overflow-y: auto;
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
  display: none;
}

.edb-modal::-webkit-scrollbar {
  display: none;
}

.edb-modal.active {
  display: flex;
}

.edb-container {
  position: relative;
  width: 100%;
  height: auto;
}

.edb {
  height: auto;
  background-color: var(--white);
  padding: var(--mb-2);
  overflow: hidden;
  border-radius: 15px;
  animation: fade 0.3s ease-in-out;
  display: none;
}

.edb.active {
  display: flex;
}

/* --------------- ========== (CREATE CAMPAIGN) ========== ---------------*/
.cp {
  position: relative;
  width: 780px;
  padding-bottom: var(--mb-4);
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
  align-self: center;
}

.cp-title {
  width: 100%;
  flex: 0 0 84px;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-75);
  padding-bottom: var(--mb-1);
  border-bottom: 1px #e5e5e5 solid;
}

.cp-title h2 {
  font-size: var(--fs-1-5);
  font-weight: 600;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.cp-title p {
  font-size: 0.85rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.35;
}

.cp-tags {
  width: 100%;
  flex: 0 0 51px;
  justify-content: space-between;
}

.cpt {
  flex: 0 0 23%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-25);
  /* cursor: pointer; */
}

.cpt h6 {
  margin: 0;
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.cpt p {
  font-size: 0.7rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
}

.cpt span {
  width: 100%;
  height: 4px;
  border-radius: 30px;
  background-color: #e5e5e5;
  margin-top: var(--mb-0-5);
}

.cpt.active span {
  background-color: var(--vc-blue);
}

.cp-main {
  width: 100%;
  height: auto;
  padding: var(--mb-1-5) 0;
  border-top: 1px #e5e5e5 solid;
  border-bottom: 1px #e5e5e5 solid;
  /* border: 1px red solid; */
}

/* --------------- ========== CREATE CAMPAIGN (MAIN WRAPPER)  ========== ---------------*/
.cpm {
  width: 100%;
  height: auto;
  animation: fadeY 0.3s ease-in-out;
  display: none;
}

.cpm.active {
  display: flex;
}

/* --------------- ========== CREATE CAMPAIGN - (CAMPAIGN DETAILS) ========== ---------------*/
.cd {
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  row-gap: var(--mb-1);
}

.cd-input {
  flex: 0 0 31.5%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
}

.cd-input.textarea,
.cd-input.select {
  flex: 0 0 100%;
}

.cd-input label {
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.cdi {
  width: 100%;
  padding: 0.6rem var(--mb-0-75);
  column-gap: 0.65rem;
  border: 1px #e5e5e5 solid;
  border-radius: 5px;
}

.cdi:hover {
  border: 1px var(--vc-blue) solid;
}

/* #rgfi-icon {
  font-size: 1.2rem;
  color: var(--vc-blue);
} */

.cdi input,
.cdi textarea,
.cd-input.select .cdi select {
  width: 100%;
  border: none;
  outline: none;
  margin: 0;
  padding: 0;
  background: transparent;
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: var(--text-grey);
  opacity: 0.9;
  resize: none;
}

.cdi textarea {
  height: 5rem;
  overflow: hidden;
}

.cdi > input::placeholder {
  color: var(--vc-grey);
  font-weight: 400;
  opacity: 1;
}

.cp-action {
  width: 100%;
  flex: 0 0 47.4px;
  justify-content: flex-end;
  column-gap: var(--mb-1);
  /* border: 1px teal solid; */
}

.cp-action button {
  border-radius: 8px;
  padding: var(--mb-0-75) var(--mb-1-5);
}

.cp-foot,
.cc-foot {
  position: absolute;
  bottom: var(--mb-2);
  width: 100%;
  flex: 0 0 19px;
  justify-content: flex-start;
  padding: 0 var(--mb-2);
  /* border: 1px hotpink solid; */
  column-gap: var(--mb-0-25);
}

.cp-foot p,
.cp-foot a,
.cc-foot p,
.cc-foot a {
  font-size: 0.7rem;
  font-weight: 400;
  text-align: center;
  color: #737373;
}

.cp-foot a,
.cc-foot a {
  text-decoration: underline;
  text-decoration-style: solid;
  text-decoration-color: #737373;
}

.cp-foot a:hover,
.cc-foot a:hover {
  color: var(--vc-blue);
  text-decoration-color: var(--vc-blue);
}

/* --------------- ========== CREATE CAMPAIGN - (MEDIA & DOCUMENTS) ========== ---------------*/
.md {
  width: 100%;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
}

.md-title {
  width: 100%;
  justify-content: flex-start;
}

.md-title h3 {
  font-size: 0.95rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
}

.md-upload {
  width: 100%;
  border: 2px #d4d4d4 dashed;
  padding: var(--mb-2) var(--mb-1-5);
  border-radius: 15px;
  justify-content: space-between;
  column-gap: var(--mb-1-5);
  cursor: pointer;
}

.md-upload > span {
  font-size: 2rem;
  color: #a3a3a3;
  color: var(--vc-blue);
}

.mdu {
  flex: 0 0 auto;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-25);
}

.mdu > p {
  font-size: var(--fs-1);
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.mdu > span {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.mdu-select {
  flex: 0 0 auto;
}

.mdu-select p {
  padding: 0.6rem 1.3rem;
  background: rgba(230, 248, 252, 1);
  color: var(--vc-blue);
  font-size: 0.8rem;
  font-weight: 400;
  text-align: center;
  border-radius: 6px;
  cursor: pointer;
}

.md-upload:hover {
  background-color: rgba(230, 248, 252, 1);
  border: 2px rgba(230, 248, 252, 1) solid;
}

.md-upload:hover .mdu-select p {
  background-color: var(--white);
}

.md-upload:hover .mdu-select p:hover {
  background-color: var(--tb-dark);
  color: var(--white);
}

.md-file {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-1);
}

.md-file h6 {
  width: 100%;
  margin: 0;
  padding: 0;
  font-size: 0.9rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1;
}

.mdf-list {
  width: 100%;
  padding: var(--mb-1);
  row-gap: var(--mb-0-75);
  border: 1px #d4d4d4 solid;
  border-radius: 8px;
  justify-content: flex-start;
}

.mdf {
  width: 100%;
  padding: var(--mb-1);
  background-color: var(--tb-dark);
  border-radius: 8px;
  justify-content: space-between;
}

.mdf-data {
  flex: 0 0 auto;
  justify-content: flex-start;
  column-gap: var(--mb-0-75);
}

.mdf-data > span {
  flex: 0 0 auto;
  color: var(--vc-blue);
  font-size: 2.1rem;
}

.mdf-txt {
  flex: 0 0 auto;
  /* justify-content: flex-start; */
  align-items: flex-start;
}

.mdf-txt p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #fafafa;
  line-height: 1.1;
}

.mdf-txt > span {
  font-size: 0.65rem;
  font-weight: 300;
  text-align: left;
  color: #e5e5e5;
}

.mdf-action {
  flex: 0 0 auto;
  justify-content: flex-end;
  column-gap: var(--mb-0-75);
}

.mdf-action p {
  font-size: 0.75rem;
  font-weight: 500;
  text-align: center;
  cursor: pointer;
}

.mdf-action p:first-child {
  color: var(--vc-blue);
}

.mdf-action P:nth-child(2) {
  color: tomato;
}

.mdf-action p:hover {
  text-decoration: underline;
  text-decoration-style: solid;
  text-decoration-thickness: 1px;
}

.md-preview {
  width: 100%;
  justify-content: flex-start;
  row-gap: var(--mb-0-5);
  animation: fade 0.3s ease-in-out;
  display: none;
}

.md-preview.active {
  display: flex;
}

.mdp-title {
  width: 100%;
  justify-content: flex-start;
}

.mdp-title h6 {
  margin: 0;
  padding: 0;
  font-size: 0.9rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1;
}

.mdp-img {
  width: 100%;
  height: auto;
  overflow: hidden;
  border-radius: 15px;
  background-color: #fafafa;
}

.mdp-img img {
  width: 100%;
  object-fit: cover;
}

/* --------------- ========== CREATE CAMPAIGN - (FUNDING STRUCTURE) ========== ---------------*/
.fs {
  width: 100%;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
}

.fs-details {
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  row-gap: var(--mb-0-75);
}

.fsd {
  flex: 0 0 48%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
}

.fsd.textarea,
.fsd.select {
  flex: 0 0 100%;
}

.fsd label {
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.fsd label > span {
  color: var(--error);
}

.fsd-input {
  width: 100%;
  padding: 0.6rem;
  column-gap: 0.5rem;
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
}

.fsd-input:hover {
  border: 1px var(--vc-blue) solid;
}

#fsdi-icon {
  font-size: 1.2rem;
  color: var(--vc-blue);
}

.fsd-input input,
.fsd.textarea .fsd-input textarea,
.fsd.select .fsd-input select {
  width: 100%;
  border: none;
  outline: none;
  margin: 0;
  padding: 0;
  background: transparent;
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: var(--text-grey);
  opacity: 0.9;
  resize: none;
}

.fsd.textarea .fsd-input textarea {
  height: 5rem;
  overflow: hidden;
}

.fsd-input > input::placeholder {
  color: var(--vc-grey);
  font-weight: 400;
  opacity: 1;
}

.fd-milestones {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: 1rem;
}

.fdm-title {
  width: 100%;
  justify-content: flex-start;
}

.fdm-title h6 {
  margin: 0;
  padding: 0;
  font-size: 0.9rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1;
}

.fdm-title h6 span {
  font-size: 0.65rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
}

.fdm-list {
  width: 100%;
  justify-content: flex-start;
  row-gap: var(--mb-1);
  padding: var(--mb-1) 0;
  border-top: 1px #e5e5e5 solid;
  border-bottom: 1px #e5e5e5 solid;
}

.fdm-card {
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
}

.fdmc {
  flex: 0 0 48%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
}

.fdmc.textarea,
.fdmc.select {
  flex: 0 0 100%;
}

.fdmc label {
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.fdmc label > span {
  color: var(--error);
}

.fdmc-input {
  width: 100%;
  padding: 0.6rem;
  column-gap: 0.5rem;
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
}

.fdmc-input:hover {
  border: 1px var(--vc-blue) solid;
}

#fsdi-icon {
  font-size: 1.2rem;
  color: var(--vc-blue);
}

.fdmc-input input,
.fsd.textarea .fdmc-input textarea,
.fsd.select .fdmc-input select {
  width: 100%;
  border: none;
  outline: none;
  margin: 0;
  padding: 0;
  background: transparent;
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: var(--text-grey);
  opacity: 0.9;
  resize: none;
}

.fsd.textarea .fdmc-input textarea {
  height: 5rem;
}

.fdmc-input > input::placeholder {
  color: var(--vc-grey);
  font-weight: 400;
  opacity: 1;
}

/* --------------- ========== CREATE CAMPAIGN - (FUNDING STRUCTURE) ========== ---------------*/
.rs {
  width: 100%;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
}

.rs-info {
  width: 100%;
  justify-content: flex-start;
  border-radius: 15px;
  border: 1px #e5e5e5 solid;
}

.rsi-title {
  width: 100%;
  justify-content: flex-start;
  padding: var(--mb-1);
  border-bottom: 1px #e5e5e5 solid;
}

.rsi-title h4 {
  margin: 0;
  padding: 0;
  font-size: 1rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1;
}

.rsi-list {
  width: 100%;
  justify-content: flex-start;
  padding: var(--mb-1);
  row-gap: var(--mb-1);
}

.rsil {
  width: 100%;
  justify-content: space-between;
}

.rsil span,
.rsil p {
  flex: 0 0 48%;
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.rsil p {
  color: var(--tb-dark);
  font-weight: 500;
  justify-content: flex-end;
  flex-wrap: wrap;
  line-height: 1.3;
}

.rs-form {
  width: 100%;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
}

.rsf {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
  /* border: 1px red solid; */
}

.rsf label {
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.rsf-input {
  width: 100%;
  padding: 0.6rem;
  column-gap: 0.5rem;
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
  justify-content: flex-start;
  align-items: flex-start;
}

.rsf.textarea .rsf-input {
  min-height: 5rem;
  height: auto;
}

.rsf-input:hover {
  border: 1px var(--vc-blue) solid;
}

#fsdi-icon {
  font-size: 1.2rem;
  color: var(--vc-blue);
}

.rsf-input p,
.rsf.textarea .rsf-input p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: var(--text-grey);
  opacity: 0.9;
}

.rs-documents {
  width: 100%;
  row-gap: var(--mb-0-75);
}

.rsd-title {
  width: 100%;
  justify-content: flex-start;
}

.rsd-title h6 {
  margin: 0;
  padding: 0;
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.rsd-cards {
  width: 100%;
  justify-content: flex-start;
  row-gap: var(--mb-0-5);
}

.rsdc {
  width: 100%;
  justify-content: space-between;
  padding: var(--mb-0-75);
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
}

.rsdc > p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.rs-confirm {
  width: 100%;
  padding: var(--mb-0-75);
  border-radius: 8px;
  border: 1px #e5e5e5 solid;
  justify-content: flex-start;
  align-items: flex-start;
  column-gap: 0.6rem;
}

.rsc-check {
  width: 20px;
  height: 20px;
  background-color: transparent;
  padding: var(--mb-0-25);
  border: 2px #e5e5e5 solid;
  transform: translateY(1px);
  border-radius: 4px;
  cursor: pointer;
}

.rsc-check:hover {
  border: 2px var(--vc-blue) solid;
}

.rsc-check.active {
  background-color: var(--vc-blue);
  border: 2px var(--vc-blue) solid;
}

#rscc-icon {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--white);
  display: none;
}

.rsc-check.active #rscc-icon {
  display: inline-block;
}

.rsc-data {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
}

.rsc-data p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
}

/* --------------- ========== (CREATE CAMPAIGN) ========== ---------------*/
.cc {
  position: relative;
  width: 650px;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
  align-self: center;
}

.cc-title {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
  padding-bottom: var(--mb-1);
  border-bottom: 1px #e5e5e5 solid;
}

.cc-title h2 {
  font-size: 1.5rem;
  font-weight: 600;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.cc-title p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.35;
}

.cc-media {
  position: relative;
  width: 100%;
  height: 300px;
  overflow: hidden;
  border-radius: 10px;
  background-color: lightgoldenrodyellow;
}

.ccm-img {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.ccm-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ccm-status {
  position: absolute;
  top: var(--mb-1);
  right: var(--mb-1);
}

.cc-numbers {
  width: 100%;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
  padding: var(--mb-1-5) 0;
  border-top: 1px #e5e5e5 solid;
  border-bottom: 1px #e5e5e5 solid;
}

.ccn-cards {
  width: 100%;
  justify-content: space-between;
}

.ccnc {
  flex: 0 0 auto;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
}

.ccnc span {
  font-size: 0.75rem;
  font-weight: 500;
  text-align: left;
  color: #737373;
  line-height: 1;
}

.ccnc p {
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1;
}

.ccnc:last-child p {
  color: limegreen;
}

.ccn-stats {
  width: 100%;
  justify-content: flex-start;
  row-gap: 0.45rem;
}

.ccns {
  width: 100%;
  justify-content: space-between;
}

.ccns span {
  font-size: 0.75rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.ccns p {
  font-size: 0.75rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.ccns-span {
  width: 100%;
  height: 4px;
  justify-content: flex-start;
  background-color: #e5e5e5;
  border-radius: 30px;
  overflow: hidden;
}

#ccnss-bar {
  width: 90%;
  height: 100%;
  background-color: var(--vc-blue);
  border-radius: 30px;
}

.ccns-foot {
  width: 100%;
  justify-content: space-between;
}

.ccnsf {
  flex: 0 0 auto;
  justify-content: flex-start;
  column-gap: 0.2rem;
  cursor: pointer;
}

.ccnsf span {
  font-size: 0.725rem;
  color: #737373;
}

.ccnsf p {
  font-size: 0.7rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.cc-info {
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
}

.cci {
  flex: 0 0 auto;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-25);
}

.cci h6 {
  margin: 0;
  padding: 0;
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
  margin-bottom: var(--mb-0-25);
}

.cci p {
  font-size: 0.7rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  column-gap: 0.2rem;
}

.cci p > span {
  font-size: 0.7rem;
  color: #737373;
}

.cc-description {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: 0.45rem;
  padding-bottom: var(--mb-1-5);
  border-bottom: 1px #e5e5e5 solid;
}

.cc-description h6 {
  margin: 0;
  padding: 0;
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.cc-description p {
  font-size: 0.725rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.cc-action {
  width: 100%;
  justify-content: flex-end;
  column-gap: var(--mb-1);
}

.cc-action > button {
  font-size: 0.9rem;
  padding: var(--mb-0-75) var(--mb-1-5);
}

/* --------------- ========== (FUND WALLET) ========== ---------------*/
.fw,
.ww {
  position: relative;
  width: 700px;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
  justify-self: center;
}

.fw-title,
.ww-title {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
  padding-bottom: var(--mb-1);
  border-bottom: 1px #e5e5e5 solid;
}

.fw-title h2,
.ww-title h2 {
  font-size: 1.5rem;
  font-weight: 600;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.fw-title p,
.ww-title p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.35;
}

.fw-form,
.ww-form {
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  row-gap: var(--mb-1);
}

.fwf,
.wwf {
  flex: 0 0 48%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
  /* border: 1px red solid; */
}

.fwf label,
.wwf label {
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.fwf label > span,
.wwf label > span {
  color: var(--error);
}

.fwf-input,
.wwf-input {
  width: 100%;
  padding: 0.6rem;
  column-gap: 0.5rem;
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
}

.fwf-input:hover,
.wwf-input:hover {
  border: 1px var(--vc-blue) solid;
}

#fwfi-icon,
#wwfi-icon {
  font-size: 1.2rem;
  color: var(--vc-blue);
}

.fwf-input input,
.fwf-input select,
.wwf-input input,
.wwf-input select {
  width: 100%;
  border: none;
  outline: none;
  margin: 0;
  padding: 0;
  background: transparent;
  font-size: 0.85rem;
  font-weight: 400;
  text-align: left;
  color: var(--text-grey);
  opacity: 0.9;
  resize: none;
}

.fwf-input > input::placeholder,
.wwf-input > input::placeholder {
  color: var(--vc-grey);
  font-weight: 400;
  opacity: 1;
}

.fw-action,
.ww-action {
  width: 100%;
  flex: 0 0 47.4px;
  justify-content: flex-end;
  column-gap: var(--mb-0-75);
  /* border: 1px teal solid; */
}

.fw-action button,
.ww-action button {
  border-radius: 8px;
  padding: var(--mb-0-75) var(--mb-1-5);
}

/* --------------- ========== (WALLET WITHDRAWAL) ========== ---------------*/
.ww-balance {
  width: 100%;
  padding: var(--mb-1);
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-75);
}

.wwb {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-end;
  column-gap: var(--mb-0-5);
}

.wwb span {
  font-size: 0.95rem;
  color: var(--vc-blue);
}

.wwb p {
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: #545454;
  line-height: 1;
}

.ww-balance h3 {
  font-size: 2rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1;
}

/* --------------- ========== INVESTOR DASHBOARD (EXPLORE - INVEST) ========== ---------------*/
.iv {
  position: relative;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
  align-self: center;
}

.eiv-title {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
  padding-bottom: var(--mb-1);
  border-bottom: 1px #e5e5e5 solid;
}

.eiv-title > h3 {
  font-size: var(--fs-1-5);
  font-weight: 600;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1;
}

.eiv-title > p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.35;
}

.iv .ssbfs {
  position: relative;
  width: 10%;
  height: 100%;
  background-color: var(--soft-black);
  border-radius: 30px;
}

.eiv-slide {
  width: 100%;
  justify-content: flex-start;
  align-self: flex-start;
  row-gap: var(--mb-0-5);
}

.eivs {
  width: 100%;
  justify-content: space-between;
}

.eivs > p {
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: #545454;
  line-height: 1.1;
}

.eiv-id {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-75);
}

.eivi-title {
  width: 100%;
  justify-content: flex-start;
}

.eivi-title h5 {
  margin: 0;
  padding: 0;
  font-size: 1rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.eivi-list {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
}

.eivil {
  width: 100%;
  justify-content: space-between;
  padding-bottom: var(--mb-0-5);
  border-bottom: 1px #e5e5e5 solid;
}

.eivil p {
  font-size: 0.75rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.eivil span {
  font-size: 0.75rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.eiv-action {
  width: 100%;
  justify-content: flex-end;
  column-gap: var(--mb-0-75);
}

/* --------------- ========== INVESTOR DASHBOARD (EXPLORE - INVEST) ========== ---------------*/
.pay {
  position: relative;
  width: 500px;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
  align-self: center;
}

.epy-title {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
  padding-bottom: var(--mb-1);
  border-bottom: 1px #e5e5e5 solid;
}

.epy-title > h3 {
  font-size: var(--fs-1-5);
  font-weight: 600;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1;
}

.epy-title > p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.35;
}

.epy-cards {
  width: 100%;
  row-gap: var(--mb-0-75);
}

.epyc {
  position: relative;
  width: 100%;
  padding: var(--mb-1);
  border-radius: 8px;
  border: 1px #e5e5e5 solid;
  justify-content: flex-start;
  column-gap: var(--mb-1);
}

.epyc:hover {
  border: 1px var(--vc-blue) solid;
}

.epyc.active {
  border: 1px var(--vc-blue) solid;
}

.epyc-icon {
  flex: 0 0 auto;
  justify-content: flex-start;
}

#epyci-icon {
  padding: var(--mb-0-75);
  border-radius: 50%;
  font-size: 1.3rem;
  background: #f6f7f9;
  color: #737373;
}

.epyc-data {
  flex: 0 0 auto;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: 0.2rem;
}

.epyc-data h4 {
  margin: 0;
  padding: 0;
  font-size: 0.9rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.epyc-data p {
  font-size: 0.75rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.epyc-check {
  position: absolute;
  top: var(--mb-1);
  right: var(--mb-1);
  border: 2px #e5e5e5 solid;
  border-radius: 3px;
  padding: 0.15rem;
}

#epycc-icon {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--white);
  /* display: none; */
}

.epyc.active .epyc-check {
  background-color: var(--vc-blue);
  border: 2px var(--vc-blue) solid;
}

.epy-action {
  width: 100%;
  justify-content: flex-end;
  column-gap: var(--mb-0-75);
}

/* --------------- ========== INVESTOR DASHBOARD (EXPLORE - INVESTMENT SUCCESSFUL)  ========== ---------------*/
.is {
  position: relative;
  width: 500px;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
  align-self: center;
}

.eis-title {
  width: 100%;
  justify-content: flex-start;
  align-items: center;
  row-gap: var(--mb-0-5);
  padding-bottom: var(--mb-1);
  border-bottom: 1px #e5e5e5 solid;
}

.eis-title > h3 {
  font-size: var(--fs-1-5);
  font-weight: 600;
  text-align: center;
  color: var(--tb-dark);
  line-height: 1;
}

.eis-title > p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: center;
  color: #737373;
  line-height: 1.35;
}

.eis-data {
  width: 100%;
  justify-content: flex-start;
  row-gap: var(--mb-0-25);
}

#eisd-icon {
  padding: var(--mb-1);
  border-radius: 50%;
  font-size: 3rem;
  font-weight: 600;
  background: #daf4ec;
  color: #18a87c;
}

.eis-data h4 {
  margin: 0;
  margin-top: var(--mb-0-75);
  padding: 0;
  font-size: 1.1rem;
  font-weight: 500;
  text-align: center;
  color: var(--tb-dark);
  line-height: 1.3;
}

.eis-data p {
  font-size: 0.75rem;
  font-weight: 400;
  text-align: center;
  color: #737373;
  line-height: 1.1;
}

.eis-list {
  width: 100%;
  padding: var(--mb-1);
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
  row-gap: var(--mb-0-75);
}

.eisl {
  width: 100%;
  justify-content: space-between;
}

.eisl p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.eisl span {
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.eis-action {
  width: 100%;
  justify-content: flex-end;
  column-gap: var(--mb-0-75);
}

/* --------------- ========== ADMIN DASHBOARD - ACTIVE CAMPAIGNS PAGE (CAMPAIGN CARD)  ========== ---------------*/
.cc {
  position: relative;
  width: 600px;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
  align-self: center;
}

.ecc-title {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-25);
}

.ecc-title h3 {
  font-size: 1.1rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.ecc-title p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.ecc-tab {
  width: 100%;
  background-color: #f5f5f5;
  border-radius: 8px;
  justify-content: space-between;
  padding: var(--mb-0-25);
}

.ecct {
  flex: 0 0 24%;
  padding: var(--mb-0-5);
  cursor: pointer;
  border: 1px #f5f5f5 solid;
  border-radius: 6px;
}

.ecct p {
  font-size: 0.8rem;
  font-weight: 500;
  text-align: center;
  color: #545454;
  line-height: 1.1;
}

.ecct.active {
  background-color: var(--white);
  border: 1px var(--white) solid;
  box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
}

.ecct.active p {
  color: var(--tb-dark);
}

.ecct:hover {
  border: 1px #a3a3a3 solid;
}

.ecct.active:hover {
  border: 1px var(--white) solid;
}

.ecc-wrapper,
.ivd-wrapper {
  width: 100%;
}

.eccw,
.ivdw {
  width: 100%;
  animation: fade 0.3s ease-in-out;
  display: none;
}

.eccw.active,
.ivdw.active {
  display: flex;
}

/*ADMIN DASHBORAD - ACTIVE CAMPAIGN - CAMPAIGN CARD (INVESTORS SECTION) */
.eccw.ov,
.ivdw.ov {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
}

.cov-title {
  width: 100%;
  justify-content: flex-start;
}

.cov-title h5 {
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.cov-cards {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-75);
  padding: var(--mb-1);
  border: 1px #e5e5e5 solid;
  border-radius: 5px;
}

.covc {
  width: 100%;
  justify-content: space-between;
}

.covc span,
.covc p {
  font-size: 0.75rem;
  font-weight: 500;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.covc p {
  color: var(--tb-dark);
}

.cov-data {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-25);
  margin-top: var(--mb-0-75);
}

.cov-data h6 {
  margin: 0;
  padding: 0;
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.cov-data p {
  font-size: 0.75rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.35;
}

/*ADMIN DASHBORAD - ACTIVE CAMPAIGN - CAMPAIGN CARD (OVERVIEW SECTION) */
.eccw.iv,
.ivdw.iv {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
}

.civ-title {
  width: 100%;
  justify-content: flex-start;
}

.civ-title h5 {
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.civ-table {
  width: 100%;
  height: auto;
  justify-content: flex-start;
  border: 1px #e5e5e5 solid;
  border-radius: 10px;
}

.civ-tab {
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
  background-color: #f5f5f5;
  border-radius: 5px;
}

.civt {
  flex: 0 0 20%;
  padding: var(--mb-0-75);
  /* border: 1px red solid; */
  justify-content: flex-start;
}

.iv .civt:first-child {
  flex: 0 0 40%;
}

.civt p {
  font-size: 0.75rem;
  font-weight: 500;
  text-align: left;
  color: #545454;
  line-height: 1.1;
}

.civ-list {
  width: 100%;
  height: 400px;
  justify-content: flex-start;
  overflow-y: auto;
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

.civ-list::-webkit-scrollbar {
  display: none;
}

.civl {
  width: 100%;
  height: 61px;
  justify-content: space-between;
  align-items: flex-start;
  border-bottom: 1px #e5e5e5 solid;
}

.civl:last-child {
  border: none;
}

.civl:hover {
  background-color: #fafafa;
}

.civl-p {
  flex: 0 0 20%;
  justify-content: flex-start;
  padding: var(--mb-0-75);
  /* border: 1px teal solid; */
}

.civl-p p {
  font-size: 0.75rem;
  font-weight: 500;
  text-align: left;
  color: #545454;
  /* line-height: 1.3; */
}

.civl-p:first-child p {
  color: var(--vc-blue);
}

.civl-p .stat {
  font-size: 0.65rem;
}

/*ADMIN DASHBORAD - ACTIVE CAMPAIGN - CAMPAIGN CARD (DOCUMENTS SECTION) */
.eccw.dc,
.ivdw.dc {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
}

.cdc-title {
  width: 100%;
  justify-content: flex-start;
}

.cdc-title h5 {
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.cdc-cards {
  width: 100%;
  height: auto;
  max-height: 400px;
  padding: var(--mb-0-5) var(--mb-1);
  border: 1px #e5e5e5 solid;
  border-radius: 5px;
  justify-content: flex-start;
  /* row-gap: var(--mb-0-75); */
  overflow-y: auto;
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

.cdc-cards::-webkit-scrollbar {
  display: none;
}

.cdcc {
  width: 100%;
  justify-content: space-between;
  padding: var(--mb-0-75) 0;
  border-bottom: 1px #e5e5e5 solid;
}

.cdcc:last-child {
  border: none;
}

.cdcc-data {
  flex: 0 0 auto;
  justify-content: flex-start;
  column-gap: var(--mb-0-5);
}

#cdcc-icon {
  font-size: var(--fs-1);
  padding: var(--mb-0-5);
  background-color: #f5f5f5;
  border-radius: 50%;
}

.cdcc-data p {
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

/*ADMIN DASHBORAD - ACTIVE CAMPAIGN - CAMPAIGN CARD (COMPLIANCE SECTION) */
.eccw.co,
.ivdw.co {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-75);
}

.cco-title {
  width: 100%;
  justify-content: flex-start;
}

.cco-title h5 {
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.cco-cards {
  width: 100%;
  height: auto;
  max-height: 400px;
  padding: var(--mb-0-5) var(--mb-1);
  border: 1px #e5e5e5 solid;
  border-radius: 5px;
  justify-content: flex-start;
  /* row-gap: var(--mb-0-75); */
  overflow-y: auto;
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

.cco-cards::-webkit-scrollbar {
  display: none;
}

.ccoc {
  width: 100%;
  justify-content: space-between;
  padding: var(--mb-0-75) 0;
  border-bottom: 1px #e5e5e5 solid;
}

.ccoc:last-child {
  border: none;
}

.ccoc-data {
  flex: 0 0 auto;
  justify-content: flex-start;
  column-gap: var(--mb-0-5);
}

#cdcc-icon {
  font-size: var(--fs-1);
  padding: var(--mb-0-5);
  background-color: #f5f5f5;
  border-radius: 50%;
}

.ccoc-data p {
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.ccoc .stat {
  flex: 0 0 auto;
  font-size: 0.7rem;
}

.cco-action {
  width: 100%;
  justify-content: flex-start;
}

/*ADMIN DASHBORAD - ACTIVE CAMPAIGN - CAMPAIGN CARD (ACTION BUTTON) */
.ecc-action {
  width: 100%;
  justify-content: flex-end;
  padding-top: var(--mb-1);
  border-top: 1px #e5e5e5 solid;
}

.ecc-action button:hover {
  background-color: tomato;
  color: var(--white);
  border: 2px tomato solid;
}

/* --------------- ========== ADMIN DASHBOARD - PENDING CAMPAIGNS PAGE (CAMPAIGN APPROVAL)  ========== ---------------*/
.cl {
  position: relative;
  width: 550px;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
  align-self: center;
}

.ecl-title {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
  padding-bottom: var(--mb-1);
  border-bottom: 1px #e5e5e5 solid;
}

.ecl-title h3 {
  font-size: 1.1rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.ecl-title p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.ecl-st {
  width: 100%;
  justify-content: space-between;
  padding: var(--mb-0-75);
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
}

.eclst-title,
.ecldc-title,
.eclco-title {
  width: 100%;
  justify-content: flex-start;
}

.eclst-title h4,
.ecldc-title h4,
.eclco-title h4 {
  flex: 0 0 auto;
  font-size: 0.825rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.eclst {
  flex: 0 0 auto;
  justify-content: flex-end;
  column-gap: var(--mb-0-5);
}

.eclst span {
  font-size: 0.7rem;
  font-weight: 400;
  text-align: left;
  color: #545454;
  line-height: 1.1;
}

.ecl-dc {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
}

.ecldc-tab {
  width: 100%;
  justify-content: space-between;
  padding: var(--mb-0-25);
}

.ecldct {
  flex: 0 0 32.5%;
  padding: var(--mb-0-5);
  column-gap: var(--mb-0-5);
  cursor: pointer;
  border: 1px #545454 solid;
  border-radius: 6px;
}

.ecldct p {
  font-size: 0.78rem;
  font-weight: 500;
  text-align: center;
  color: #545454;
  line-height: 1.1;
}

.ecldct span {
  font-size: 0.95rem;
  color: #545454;
}

.ecldct.active {
  background-color: var(--tb-dark);
  border: 1px var(--tb-dark) solid;
  box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
}

.ecldct.active p,
.ecldct.active span {
  color: var(--white);
}

.ecldct:hover {
  border: 1px var(--white) solid;
  box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;
  background-color: #f5f5f5;
}

.ecldct.active:hover {
  background-color: var(--tb-dark);
  border: 1px var(--tb-dark) solid;
  box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
}

.ecl-text {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
}

.ecl-text label {
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.ecl-text textarea {
  width: 100%;
  height: 6rem;
  padding: 0.6rem var(--mb-0-75);
  column-gap: 0.65rem;
  border: 1px #e5e5e5 solid;
  border-radius: 5px;
  outline: none;
  margin: 0;
  background: transparent;
  font-size: 0.75em;
  font-weight: 400;
  text-align: left;
  color: var(--text-grey);
  opacity: 0.9;
  resize: none;
}

.ecl-co {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
}

.comp-list {
  width: 100%;
  padding: var(--mb-1);
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
  row-gap: var(--mb-0-75);
}

.coli {
  width: 100%;
  justify-content: flex-start;
  column-gap: var(--mb-0-75);
}

.coli-check {
  width: 20px;
  height: 20px;
  border: 2px #e5e5e5 solid;
  border-radius: 4px;
  cursor: pointer;
}

#colic-icon {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--white);
}

.coli p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #545454;
  line-height: 1.1;
}

.coli.active .coli-check {
  border: 2px #18a87c solid;
  background-color: #18a87c;
}

.ecl-action {
  width: 100%;
  justify-content: flex-end;
  column-gap: var(--mb-0-75);
}

.ecl-action button {
  padding: var(--mb-0-75) var(--mb-1);
  font-size: 0.85rem;
}

/* --------------- ========== ADMIN DASHBOARD - COMPLETED CAMPAIGNS PAGE (CAMPAIGN CARD)  ========== ---------------*/
.cocc {
  position: relative;
  width: 600px;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
  align-self: center;
}

.cocc .ecc-tab .ecct {
  flex: 0 0 32%;
}

.eoc-wrapper {
  width: 100%;
}

.eocw {
  width: 100%;
  animation: fade 0.3s ease-in-out;
  display: none;
}

.eocw.active {
  display: flex;
}

/* COMPLETED CAMPAIGN - CAMPAIGN CARD (OVERVIEW SECTION) */
.eocw.ov {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
}

.eoov-title {
  width: 100%;
  justify-content: flex-start;
}

.eoov-title h5 {
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.eoov-cards {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-75);
  padding: var(--mb-1);
  border: 1px #e5e5e5 solid;
  border-radius: 5px;
}

.eovc {
  width: 100%;
  justify-content: space-between;
  border-bottom: 1px #e5e5e5 solid;
  padding-bottom: var(--mb-0-75);
}

.eovc:last-child {
  border: none;
  padding: 0;
}

.eovc span,
.eovc p {
  font-size: 0.75rem;
  font-weight: 500;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.eovc p {
  color: var(--tb-dark);
}

.eovc p span {
  color: var(--tb-dark);
}

.eovc .stat {
  font-size: 0.65rem;
}

/* COMPLETED CAMPAIGN - CAMPAIGN CARD (INVESTORS SECTION) */
.eocw.iv {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-1);
}

.eoiv-stats {
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
}

.eois {
  flex: 0 0 47%;
  padding: var(--mb-1);
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
}

.eois-head {
  width: 100%;
  justify-content: flex-start;
  column-gap: var(--mb-0-25);
}

.eois-head p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.eois-head span {
  font-size: 1.2rem;
  color: #737373;
}

.eois h3 {
  font-size: var(--fs-1-5);
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1;
}

.eoiv-table {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
}

.eoiv-title {
  width: 100%;
  justify-content: flex-start;
  padding: var(--mb-0-75);
}

.eoiv-title h4 {
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.eoiv-tab {
  width: 100%;
  background-color: #f5f5f5;
  /* border-radius: 8px; */
  justify-content: space-between;
}

.eoiv-tab p {
  flex: 0 0 20%;
  padding: 0.65rem var(--mb-0-5);
  border: 1px #f5f5f5 solid;
  border-radius: 6px;
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: #545454;
  line-height: 1.1;
}

.eoiv-list {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
}

.eoivl {
  width: 100%;
  justify-content: space-between;
  cursor: pointer;
  border-bottom: 1px #e5e5e5 solid;
}

.eoivl:last-child {
  border: none;
}

.eoivl-p {
  flex: 0 0 20%;
  padding: 0.65rem var(--mb-0-5);
  justify-content: flex-start;
}

.eoivl-p p {
  font-size: 0.78rem;
  font-weight: 500;
  text-align: left;
  color: #545454;
  line-height: 1.1;
}

.eoivl-p .stat {
  font-size: 0.65rem;
}

/* COMPLETED CAMPAIGN - CAMPAIGN CARD (INVESTORS SECTION) */
.eocw.pe {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-1-5);
}

.eope-chart {
  width: 100%;
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
  padding: var(--mb-1);
  row-gap: var(--mb-0-75);
}

.eopec-title {
  width: 100%;
  justify-content: space-between;
  padding-bottom: var(--mb-0-5);
  border-bottom: 1px #e5e5e5 solid;
}

.eopect {
  flex: 0 0 auto;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-25);
}

.eopect h5 {
  font-size: 1.1rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.eopect p {
  font-size: 0.7rem;
  font-weight: 500;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.eopec-img {
  width: 100%;
  height: 230px;
  overflow: hidden;
}

.eopec-img img {
  width: 100%;
  height: 100%;
  /* background-color: #e5e5e5; */
  border-radius: 5px;
}

.eoc-action {
  width: 100%;
  justify-content: flex-end;
  column-gap: var(--mb-0-5);
  margin-top: var(--mb-0-75);
}

.eoc-action button {
  border-radius: 5px;
  padding: 0.65rem var(--mb-1);
  font-size: 0.9rem;
}

/* --------------- ========== ADMIN DASHBOARD - COMPLETED CAMPAIGNS PAGE (CAMPAIGN CARD)  ========== ---------------*/
.ts {
  position: relative;
  width: 600px;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
  align-self: center;
  padding: var(--mb-1-5);
}

.ets-title {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
  padding-bottom: var(--mb-1);
  border-bottom: 1px #e5e5e5 solid;
}

.ets-title h3 {
  font-size: 1.2rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.ets-title p {
  font-size: 0.8rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.1;
}

.ets-cards {
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  row-gap: var(--mb-1);
}

.etsc {
  flex: 0 0 47%;
  padding: var(--mb-0-75);
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-5);
  box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
}

.etsc span {
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: #545454;
  line-height: 1.2;
}

.etsc > p {
  font-size: var(--fs-1);
  font-weight: 500;
  color: var(--tb-dark);
  line-height: 1;
  text-align: left;
}

.etsc p.stat {
  font-size: 0.8rem;
  padding: var(--mb-0-5) var(--mb-0-75);
}

.ets-activity {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-25);
  padding: var(--mb-0-75) 0;
  border-top: 1px #e5e5e5 solid;
  border-bottom: 1px #e5e5e5 solid;
}

.ets-activity h4 {
  font-size: 0.9rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.ets-activity p {
  font-size: 0.75rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.35;
}

.ets-investor {
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-75);
}

.ets-investor h4 {
  font-size: 0.9rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.1;
}

.etsi-data {
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
  padding: var(--mb-0-75);
  border: 1px #e5e5e5 solid;
  border-radius: 8px;
}

.etsid {
  flex: 0 0 48%;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-25);
}

.etsid span {
  font-size: 0.7rem;
  font-weight: 500;
  text-align: left;
  color: #737373;
  line-height: 1;
}

.etsid p {
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1.35;
}

.ets-status {
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
  row-gap: var(--mb-1);
  flex-wrap: wrap;
}

.etss {
  flex: 0 0 48%;
  justify-content: flex-start;
  align-items: flex-start;
  column-gap: var(--mb-0-5);
  /* border: 1px teal solid; */
  border-radius: 8px;
  padding: var(--mb-1);
  box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
}

.etss > span {
  font-size: 1.5rem;
}

.etss-data {
  flex: 0 0 auto;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: var(--mb-0-25);
}

.etss-data h5 {
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  color: var(--tb-dark);
  line-height: 1;
}

.etss-data p {
  font-size: 0.75rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1;
}

.ets-action {
  width: 100%;
  justify-content: flex-end;
  column-gap: var(--mb-0-5);
}

.ets-action button {
  border-radius: 5px;
  padding: 0.65rem var(--mb-1);
  font-size: 0.9rem;
}

/* --------------- ========== ADMIN DASHBOARD - INVESTOR SECTION (INVESTOR DETAILS)  ========== ---------------*/
.ivd {
  position: relative;
  width: 650px;
  justify-content: flex-start;
  row-gap: var(--mb-1-5);
  align-self: center;
}

.iv .civt:first-child {
  flex: 0 0 40%;
}

.civl-p {
  flex: 0 0 20%;
  justify-content: flex-start;
  padding: var(--mb-0-75);
  /* border: 1px teal solid; */
}

.iv .civl-p:first-child {
  flex: 0 0 40%;
}

.civl-p p {
  font-size: 0.75rem;
  font-weight: 500;
  text-align: left;
  color: #545454;
  /* line-height: 1.3; */
}

.civl-p:first-child p {
  color: var(--tb-dark);
}

.civl-p.cm {
  column-gap: var(--mb-0-5);
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: 0.15rem;
}

.civlp-img {
  width: 40px;
  height: 40px;
  border-radius: 5px;
  background-color: #e5e5e5;
}

.civlp {
  flex: 0 0 auto;
  justify-content: flex-start;
  align-items: flex-start;
  row-gap: 0.15rem;
}

.civlp > p {
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  color: #545454;
  line-height: 1.3;
}

.civlp > span {
  font-size: 0.7rem;
  font-weight: 400;
  text-align: left;
  color: #737373;
  line-height: 1.3;
}

/*===== MEDIA QUERIES =====*/
/* Media query for screens with a maximum width of 500px */
@media screen and (max-width: 500px) {
}

/* Media query for screens with a minimum width of 700px and a maximum width of 900px */
@media screen and (min-width: 700px) and (max-width: 900px) {
}

/* Media query for screens with a minimum width of 1440px and a maximum width of 1600px */
@media screen and (min-width: 1440px) and (max-width: 1600px) {
}
