/* -------------------------------------------------------------------------- */

/* Main  Section                                                              */

/* -------------------------------------------------------------------------- */

#profile-bg-section {

  background-color: #d8c7bd4d;

}



/* -------------------------------------------------------------------------- */

/* Hero  Section                                                              */

/* -------------------------------------------------------------------------- */



/* -------------------------------------------------------------------------- */

/* Main Section                                                               */

/* -------------------------------------------------------------------------- */

.main-container {

  position: relative;

  margin-top: -140px;

  z-index: 5;

}

/* -------------------------------------------------------------------------- */

/* Tab Section                                                                */

/* -------------------------------------------------------------------------- */

#pills-tab {

  gap: 8px;

  margin-left: 100px;

}



@media (max-width: 850px) {

  #pills-tab {

    justify-content: flex-start;

    flex-wrap: nowrap;

    overflow-x: auto;

    margin: 0 20px;

  }

}



.tab-link {

  background: var(--color-brand-green);

  height: 56px;

  border: none;

  border-radius: 8px 8px 0 0;

  padding: 16px;

  font-size: 16px;

  color: var(--color-white);

}



.tab-link:hover {

  background: var(--color-yellow);

}



.tab-link.active {

  background: var(--color-yellow) !important;

  color: var(--color-white);

}



.tab-pane {

  animation: fadeIn 1.5s ease;

}



@keyframes fadeIn {

  from {

    opacity: 0;

    transform: translateY(8px);

  }

  to {

    opacity: 1;

    transform: translateY(0);

  }

}

/* -------------------------------------------------------------------------- */

/* Profile Section                                                            */

/* -------------------------------------------------------------------------- */

.profile-card {

  margin-bottom: 128px;

  border-radius: 16px 16px 0 0;

}



.profile-body {

  padding: 78px 95px 80px 98px;

}



@media (max-width: 880px) {

  .profile-body {

    padding: 78px 25px 80px 25px;

  }

}



/* -------------------------------------------------------------------------- */

/* Common Header                                                              */

/* -------------------------------------------------------------------------- */

.container_title {

  font-family: var(--font-title);

  font-size: 55px;

  font-style: bold;

  font-weight: 700;

  line-height: 60px;

  color: var(--color-green);

}



.container_text {

  font-family: var(--font-title);

  font-size: clamp(18px, 3vw, 24px);

  font-style: italic;

  line-height: 1.5;

  color: var(--color-brand-gray);

  margin: 0;

}



/* -------------------------------------------------------------------------- */

/*  Child Container                                                           */

/* -------------------------------------------------------------------------- */

.child-container {

  margin-top: 48px;

}



/* -------------------------------------------------------------------------- */

/* Plant Section                                                              */

/* -------------------------------------------------------------------------- */

.plant-info {

  margin-top: 48px;

}



.plant-card {

  padding: 16px 0;

}



.plant-img {

  width: 247px;

  height: 247px;

  object-fit: cover;

  border-radius: 8px;

  transition: transform 0.3s ease;

  cursor: pointer;

}

.plant-img:hover {

  transform: translateY(-2px);

  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);

}



@media (max-width: 767px) {

  .plant-img {

    width: 100%;

    height: 100%;

    object-fit: cover;

  }

}

.plant-section__see-all {

  display: flex;

  align-items: center;

  gap: 8px;

  font-family: var(--font-body);

  font-weight: 500;

  font-size: 16px;

  line-height: 1.5;

  color: var(--color-brand-gray);

  text-decoration: none;

}

.plant-section__see-all:hover {

  text-decoration: underline;

}



.plant-section__see-all img {

  width: 11px;

  height: 16px;

  transform: rotate(-90deg);

}

/* -------------------------------------------------------------------------- */

/* Management Section                                                         */

/* -------------------------------------------------------------------------- */



.manage-info {

  margin-top: 28px;

  gap: 16px;

}

/* -------------------------------------------------------------------------- */

/* Further Section                                                            */

/* -------------------------------------------------------------------------- */

.further-reading {

  margin: 72px -95px -80px -98px;

  padding: 56px 98px;

  background: #93c6a866;

  height: auto;

}



.further-reading-title {

  font-family: var(--font-title);

  font-size: clamp(34px, 4vw, 52px);

  font-weight: 700;

  line-height: 1.15;

  color: var(--color-netural-black);

  margin: 0;

}



.reading-links {

  display: flex;

  flex-direction: column;

}



.reading-links .with-border {

  border-bottom: 1px solid #ffffff4d;

}



.reading-card {

  display: block;

  padding: 5px 16px 16px 16px;

  text-decoration: none;

}



.reading-content strong {

  display: block;

  font-size: 18px;

  line-height: 1.5;

  font-weight: 600;

  color: var(--color-netural-black);

  margin-bottom: 8px;

}



.reading-url {

  display: flex;

  align-items: center;

  gap: 10px;

}



.reading-url img {

  width: 20px;

  height: 20px;

  object-fit: contain;

}



.reading-url small {

  font-size: 15px;

  line-height: 1;

  color: #4d4d4d;

  text-decoration: none;

  cursor: pointer;

}

.reading-url small:hover {

  text-decoration: underline;

}



@media (max-width: 991px) {

  .further-reading {

    margin: 72px -40px -80px -40px;

    padding: 40px;

  }

}



@media (max-width: 767px) {

  .further-reading {

    margin: 48px -25px -80px -25px;

    padding: 32px 24px;

  }



  .further-reading-title {

    font-size: 36px;

    margin-bottom: 24px;

  }



  .reading-card {

    padding: 12px 0 16px;

  }

}



/* -------------------------------------------------------------------------- */

/* distribution Section                                                       */

/* -------------------------------------------------------------------------- */

.distribution_img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



/* -------------------------------------------------------------------------- */

/* Gallery Section                                                            */

/* -------------------------------------------------------------------------- */

.gallery-grid {

  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 28px;

  border-radius: 8px;

}



@media (max-width: 991px) {

  .gallery-grid {

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 24px;

  }

}



@media (max-width: 639px) {

  .gallery-grid {

    grid-template-columns: 1fr;

    max-width: 400px;

    margin-left: auto;

    margin-right: auto;

  }

}

.gellary-card__media {

  overflow: hidden;

  border-radius: 12px;

}



.gallery-card__img {

  width: 100%;

  object-fit: cover;

  display: block;

  border-radius: 12px;

  transition: transform 0.3s ease;

  cursor: pointer;

}

.gallery-card__img:hover {

  transform: translateY(-5px);

  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);

}



/* -------------------------------------------------------------------------- */

/* References Section                                                         */

/* -------------------------------------------------------------------------- */

.references_container p {

  font-size: 18px;

  font-family: var(--font-body);

  font-weight: 400;

  line-height: 1.5;

  padding-top: 17px;

  padding-bottom: 14px;

  margin: 0;

}



.references_text {

  position: relative;

  padding-left: 18px;

}



.references_text::before {

  content: "•";

  position: absolute;

  left: 0;

  top: 17px;

  font-size: 20px;

  line-height: 1;

}



/* -------------------------------------------------------------------------- */

/* calendar Section                                                         */

/* -------------------------------------------------------------------------- */

.weed_lifecycle_container {

  width: 100%;

}



.weed_table_scroll {

  width: 100%;

}



.custom-table {

  --bs-table-bg: var(--color-netural-light);

  width: 100%;

}

.custom-table .blank_box {

  width: 142px;

  text-align: left;

  padding-left: 16px;

}



.note_column {

  display: flex;

  justify-content: center;

  width: 80px !important;

}



.custom-table th.blank_box {

  text-align: left;

  vertical-align: middle;

}



.custom-table th,

.custom-table td {

  height: 36px;

  vertical-align: middle;

  box-sizing: border-box;

  text-align: center;

  white-space: nowrap;

  color: var(--color-netural-black);

}



/* Colors */

.box_orange {

  background-color: var(--color-light-orange) !important;

}



.box_yellow {

  background-color: var(--color-yellow) !important;

}



.box_green {

  background-color: var(--color-brand-green) !important;

}



/* Legend */

.table_wrapper {

  display: flex;

  align-items: center;

  gap: 16px 24px;

  flex-wrap: wrap;

  margin-top: 16px;

}



.table_item {

  display: flex;

  align-items: center;

  gap: 8px;

  font-size: 14px;

}



.Optimal_box {

  width: 24px;

  height: 24px;

  flex: 0 0 24px;

}



.short_note {

  font-size: 14px;

  text-align: center !important;

}



/* Tooltip */

.note-actions {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 10px;

}

/* Tooltip */

.note-tooltip {

  position: relative;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  cursor: pointer;

  width: 22px;

  height: 22px;

  font-size: 20px;
  color: var(--header-bg);
  /*color: var(--color-brand-green);*/

}



.note-tooltip .tooltip-text {

  visibility: hidden;

  opacity: 0;

  position: absolute;

  bottom: calc(100% + 2px);

  right: 50%;

  transform: translateX(50%);

  min-width: 180px;

  max-width: 260px;

  background: var(--color-yellow);

  color: #fff;

  text-align: left;

  padding: 8px 10px;

  border-radius: 6px;

  font-size: 12px;

  line-height: 1.4;

  white-space: normal;

  z-index: 99999;

  transition: 0.25s ease;

}



.note-tooltip:hover .tooltip-text,

.note-tooltip:focus-within .tooltip-text {

  visibility: visible;

  opacity: 1;

}



.action_calender {

  margin-top: 80px;

}



/* =========================

   DESKTOP

========================= */

@media (min-width: 577px) {

  .weed_table_scroll {

    overflow-x: visible;

  }



  .custom-table {

    width: 100%;

    table-layout: fixed;

  }

}



/* =========================

   MOBILE

========================= */

@media (max-width: 576px) {

  .weed_table_scroll {

    overflow-x: auto;

    overflow-y: visible;

    -webkit-overflow-scrolling: touch;

  }



  .custom-table {

    min-width: 760px;

    width: max-content;

  }

  .custom-table th,

  .custom-table td {

    padding: 5px 8px !important;

    font-size: 13px;

  }



  .table_wrapper {

    flex-direction: column;

    align-items: flex-start;

  }



  .note-tooltip {

    position: relative;

  }

  .note-tooltip .tooltip-text {

    position: fixed;

    left: 50%;

    right: auto;

    bottom: auto;

    top: 80px;

    transform: translateX(-50%);

    min-width: 220px;

    max-width: calc(100vw - 24px);

    width: max-content;

    white-space: normal;

    z-index: 999999;

  }



  .note-tooltip .tooltip-text::after {

    display: none;

  }

}