/*
 Theme Name:   Freeio Child
 Theme URI:    https://themeforest.net/item/freeio-freelance-marketplace-wordpress-theme/42045416
 Description:  Freeio Child Theme
 Author:       ApusTheme
 Author URI:   http://apusthemes.com
 Template:     freeio
 Version:      1.0.0
 Text Domain:  freeio-child
*/

.job-submission-form-wrapper .employer-details {
  display: none;
}

.job-submission-form-wrapper #cmb2-metabox-_project_front {
  display: flex;
  gap: 20px;
}

.job-submission-form-wrapper .price-time-section {
  width: 45%;
  background: white;
  padding: 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.price-time-section h5.day-heading {
  border-bottom: 1px solid lightgray;
  padding-bottom: 10px;
  width: 95%;
  font-size: 1rem;
  margin-bottom: 10px;
}

.price-time-section .day-element {
  padding: 15px;
  transition: all ease 0.5s;
  margin-bottom: 15px;
  padding-top: 0;
}

.price-time-section .day-element.selected {
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  border-radius: 5px;
}

.price-time-section .day-element:not(.selected) .day-lower {
  pointer-events: none;
  filter: blur(2px);
}

.price-time-section .day-upper {
  display: flex;
  align-items: baseline;
}

.price-time-section .day-upper label {
  display: block;
  width: 40px;
  height: 20px;
  background-color: gray;
  border-radius: 10px;
  position: relative;
  cursor: pointer;
  transition: 0.5s;
  box-shadow: 0 0 2px #477a8550;
}

.price-time-section .day-upper input[type="checkbox"] {
  width: 0;
  height: 0;
  visibility: hidden;
}

.price-time-section .day-upper label::after {
  content: "";
  width: 12px;
  height: 12px;
  background-color: #e8f5f7;
  position: absolute;
  border-radius: 7px;
  top: 4px;
  left: 5px;
  transition: 0.5s;
}

.price-time-section .day-upper input:checked + label:after {
  left: calc(100% - 5px);
  transform: translateX(-100%);
}

.price-time-section .day-upper input:checked + label {
  background-color: #477a85;
}

.price-time-section .day-lower {
  display: flex;
  gap: 20px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
}

.price-time-section .day-lower .day-slot {
  display: flex;
  width: 100%;
  gap: 20px;
  justify-content: space-evenly;
}

.price-time-section .day-lower .day-slot input {
  height: 40px;
  width: 100px;
  text-align: center;
}

.price-time-section .day-time {
  background-image: url(/wp-content/themes/freeio-child/images/clock-icon.svg);
  background-size: 20px 20px;
  background-repeat: no-repeat;
  padding-left: 30px;
  background-position-y: 2px;
}

.from-time-section,
.to-time-section,
.break-time-section {
  text-align: center;
}

.from-time-section label,
.to-time-section label,
.break-time-section label {
  font-weight: 500;
}

.cost-section {
  box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px,
    rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
  padding: 20px;
  margin-top: 30px;
}

.cost-section .total-days,
.cost-section .total-hours,
.cost-section .total-minutes,
.cost-section .total-estimate {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid lightgray;
  padding: 5px 0;
}

.cost-section .total-estimate {
  border-bottom: 0;
}

.cost-section .total-days-heading,
.cost-section .total-hours-heading,
.cost-section .total-minutes-heading,
.cost-section .total-cost-heading {
  font-weight: 600;
  font-size: 16px;
  color: #222;
  line-height: 1.75;
  text-transform: uppercase;
}

.cost-section .total-days-value,
.cost-section .total-hours-value,
.cost-section .total-minutes-value,
.cost-section .total-cost-value {
  font-size: 16px;
  color: #222;
}

.price-time-section .status-message {
  font-size: 20px;
  text-align: center;
  line-height: 1.2;
}

.time-slot {
  margin-bottom: 20px;
}

.cmb2-id-project-date.hidden-field {
  height: 0;
  opacity: 0;
  display: none;
}

#cmb2-metabox-_project_front .cmb2-id-project-price,
#cmb2-metabox-_project_front .cmb2-id-date-and-time-slots,
#cmb2-metabox-_project_front .cmb2-id-project-price-with-commission {
  display: none;
}

/* Project list - Freelancer */

.project-custom-data .project-time-slot {
  display: flex;
  gap: 30px;
  flex-wrap: wrap;
}

.project-custom-data .project-time-slot .time-slot {
  margin-bottom: 10px;
}

.project-list .project-custom-data {
  margin-top: 30px;
}

.project-list .project-metas .project-price {
  font-size: 16px;
}

@media (max-width: 480px) {
  .job-submission-form-wrapper #cmb2-metabox-_project_front {
    flex-direction: column;
  }

  .job-submission-form-wrapper .price-time-section {
    width: 100%;
    margin-bottom: 30px;
  }

  .price-time-section .day-lower .day-slot {
    width: 100%;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
  }

  .price-time-section .day-lower .day-slot input {
    margin-left: 0;
  }

  .price-time-section .day-lower {
    flex-direction: column;
  }
}

/* Freelancer planning dashboard */

.freelancer-planning-dashboard .project {
  background: #fff;
  border-bottom: 1px solid lightgray;
  display: grid;
  grid-template-columns: 2fr repeat(7, 1fr);
  height: 100px;
  align-items: center;
  justify-items: center;
}

.freelancer-planning-dashboard .project-slots-hidden {
  display: none;
}

.freelancer-planning-dashboard .project {
  display: none;
}

.freelancer-planning-dashboard .project.employer-element {
  display: grid;
}
.freelancer-planning-dashboard .project:has(.project-slot.slot-available) {
  display: grid;
}

.freelancer-planning-dashboard .projects-heading {
  display: grid;
  grid-template-columns: 2fr repeat(7, 1fr);
  margin-top: 30px;
  font-weight: bold;
  color: #fff;
  text-align: center;
  box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
  background: #7479db;
  padding: 5px 20px;
}

.freelancer-planning-dashboard .projects-heading > div {
  padding: 10px 0;
}

.freelancer-planning-dashboard .project-slot.slot-available {
  background: #7ac143;
  padding: 15px;
  border-radius: 5px;
  color: #fff;
  font-size: 0.8rem;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px,
    rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  text-align: center;
  margin: 0 15px;
  cursor: pointer;
  transition: all ease 0.5s;
}

.freelancer-planning-dashboard .project-slot.slot-available:hover {
  opacity: 0.75;
}

.freelancer-planning-dashboard .project-info {
  display: flex;
  gap: 15px;
}

.freelancer-planning-dashboard .project .employer-logo-container,
.freelancer-planning-dashboard .project .employer-info {
  display: none;
}

.freelancer-planning-dashboard
  .project.employer-element
  .employer-logo-container,
.freelancer-planning-dashboard .project.employer-element .employer-info {
  display: block;
}

.freelancer-planning-dashboard .employer-logo-container {
  max-width: 50px;
}

.freelancer-planning-dashboard .employer-logo-container img {
  border-radius: 50%;
}

.freelancer-planning-dashboard .end-date {
  color: #222;
}

.freelancer-planning-dashboard .date-range-picker {
  display: flex;
  align-items: center;
}

.slot-popup-container .mfp-content,
.accept-mission-popup-container .mfp-content {
  background: white;
  width: fit-content;
  padding: 30px;
  border-radius: 5px;
}

.accept-mission-popup-container .mfp-content {
  padding: 45px;
}

.accept-mission-popup-container .buttons {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 20px;
  margin-top: 30px;
}

.accept-mission-popup-container .btn.btn-confirm,
.accept-mission-popup-container .btn.btn-cancel {
  height: 40px;
  background: #89ba16;
  color: white;
  padding: 7.5px 20px;
  line-height: 1.5;
  align-items: center;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px,
    rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  border-radius: 5px;
  transition: all ease 0.5s;
}

.accept-mission-popup-container .btn.btn-cancel {
  background: #fd5c63;
}

.accept-mission-popup-container .btn.btn-confirm:hover {
  background: #c1d82f;
}

.accept-mission-popup-container .btn.btn-cancel:hover {
  background: #ff6c5f;
}

.slot-popup-container .slot-content {
  width: 600px;
}

.slot-popup-container .slot-content h3 {
  text-align: center;
  text-transform: uppercase;
}

.slot-popup-container .employer-details {
  display: flex;
  gap: 20px;
  margin-bottom: 30px;
  align-items: center;
  justify-content: center;
}

.slot-popup-container .employer-logo-container .employer-logo {
  max-width: 250px;
}

.slot-popup-container .project-details span,
.slot-popup-container .slot-details span {
  color: #222;
  font-weight: bold;
}

.slot-popup-container .project-details {
  text-align: center;
  margin-bottom: 30px;
}

.slot-popup-container .project-price {
  color: #222;
}

.slot-popup-container .project-category {
  background: #f47721;
  color: #fff;
  display: inline-block;
  padding: 5px 10px;
  border-radius: 5px;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px,
    rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}

.slot-popup-container h4 {
  border-bottom: 1px solid lightgray;
  padding-bottom: 10px;
  text-align: center;
}

.freelancer-date-range-picker.flatpickr-input {
  background: transparent;
  border: 0 none;
  max-width: 90px;
  margin-left: 10px;
}

.mobile-scroll-message {
  display: none;
}

.notyf .notyf__toast {
  max-width: fit-content;
  border-radius: 5px;
}

.notyf .notyf__toast--success {
  background: rgb(61, 199, 99);
}

.notyf .notyf__toast--error {
  background: rgb(237, 61, 61);
}

@media (max-width: 480px) {
  .mobile-scroll-message {
    display: block;
    margin-top: 30px;
    line-height: 1.5;
    text-align: center;
  }

  .freelancer-planning-dashboard {
    width: 1600px;
  }

  .page-id-6719 .inner-dashboard .site-main {
    overflow-x: scroll;
  }

  .slot-popup-container .mfp-content {
    width: 300px;
    padding: 15px;
  }

  .slot-popup-container .slot-content {
    width: 250px;
    margin: 0 auto;
  }

  .slot-popup-container .project-title,
  .slot-popup-container .project-category {
    line-height: 1.25;
  }
}

/* Invoice styling */

body.single-invoice {
  background: #f5f5f9;
}

.invoice-container {
  margin: 90px;
  display: grid;
  grid-template-columns: 3fr 1fr;
  gap: 30px;
  max-width: 1200px;
  margin: 90px auto;
}

.invoice-container .main-invoice,
.invoice-container .sidebar-invoice {
  box-shadow: 0 2px 6px 0 rgba(67, 89, 113, 0.12);
  background: #fff;
  border-radius: 10px;
}

.invoice-container .invoice-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 30px;
  border-bottom: 1px solid lightgray;
}

.invoice-container .invoice-header .right-column-invoice {
  align-self: flex-start;
}

.invoice-container .invoice-header .auxi-work-logo {
  max-width: 90px;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  gap: 20px;
}

.freelancer_invoice-template-default .auxi-work-logo img {
  margin-bottom: -100px;
  margin-left: -100px;
}

.employer_invoice-template-default
  .invoice-container
  .invoice-header
  .auxi-work-logo {
  max-width: 90px;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  gap: 20px;
}

.invoice-container .invoice-header .auxi-work-logo h4 {
  text-wrap: nowrap;
  margin-bottom: 15px;
  color: #566a7f;
  font-size: 36px;
  font-weight: 600;
  font-family: "Monotype Corsiva", sans-serif;
}

.invoice-container .invoice-header .auxi-work-address p {
  margin: 0;
}

.invoice-container .invoice-number h4 {
  color: #566a7f;
  font-weight: 500;
  margin-bottom: 5px;
}

.invoice-container .cost-section {
  box-shadow: none;
}

.invoice-container .invoice-footer {
  border-top: 1px solid lightgray;
  padding: 20px;
}

.invoice-container .address-section {
  padding: 30px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.single-employer_invoice .invoice-container .address-section {
  display: block;
}

.single-employer_invoice .invoice-container .address-section .details-content {
  display: flex;
  justify-content: space-between;
}

.single-employer_invoice
  .invoice-container
  .address-section
  .details-content
  .details-description {
  max-width: 60%;
}

.invoice-container .address-section .address {
  width: 200px;
}

.invoice-container .address-section h6 {
  color: #566a7f;
}

.single-employer_invoice .invoice-container .items-section {
  border-top: 1px solid lightgray;
  border-bottom: 1px solid lightgray;
  padding: 30px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.single-freelancer_invoice
  .invoice-container
  .items-section
  .project-time-slot {
  border-top: 1px solid lightgray;
  border-bottom: 1px solid lightgray;
  padding: 30px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.invoice-container .sidebar-invoice {
  padding: 30px;
  height: max-content;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}

/* Invoices list */

.invoices-container {
  box-shadow: 0 2px 6px 0 rgba(67, 89, 113, 0.12);
  background: #fff;
  border-radius: 5px;
}

.invoices-container .heading-section,
.invoices-container .content-section {
  padding: 20px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  text-align: center;
  align-items: center;
}

.invoices-container .heading-section {
  font-weight: 600;
  text-align: center;
  background: #7479db;
  color: #fff;
  border-radius: 5px 5px 0 0;
}

.invoices-container .invoice-action a {
  background: #7479db;
  color: #fff;
  padding: 10px 20px;
  border-radius: 5px;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px,
    rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}

.invoices-container .content-section .invoice-status:not(:empty) {
  background: #009688;
  color: #fff;
  padding: 5px 10px;
  border-radius: 5px;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px,
    rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  width: fit-content;
  margin: 0 auto;
}

body.single-employer_invoice :is(#apus-header, #apus-footer),
body.single-freelancer_invoice :is(#apus-header, #apus-footer) {
  display: none !important;
}

body.single-employer_invoice,
body.single-freelancer_invoice {
  background: #f0f0f1;
}

.sidebar-invoice .button {
  background: #7479db;
  color: #fff;
  padding: 10px 20px;
  border-radius: 5px;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px,
    rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  width: 100%;
  text-align: center;
}

.sidebar-invoice .print {
  background: #3f51b5;
}

.sidebar-invoice .return-to-dashboard a {
  color: #fff;
}

.invoice-container .cost-section {
  margin-top: 0px;
}

.invoice-container .cost-section .cost-section-item {
  gap: 10px;
  display: grid;
  grid-template-columns: 250px 100px;
  place-content: end;
}

.invoice-container .cost-section .total-area .total-price {
  font-weight: 600;
}

.invoice-container .sub-total-price.cost-section-value {
  font-weight: 500;
}

.invoice-container .address-section .address {
  width: 200px;
  font-size: 15px;
  font-weight: 400;
}

.invoice-container .sidebar-invoice .print.button {
  cursor: pointer;
}

.invoice-container .sidebar-invoice .button {
  transition: all ease 0.5s;
}

.invoice-container .sidebar-invoice .button:hover {
  opacity: 0.9;
}

@media print {
  body * {
    visibility: hidden;
  }
  .invoice-container .main-invoice,
  .invoice-container .main-invoice * {
    visibility: visible;
  }
  .invoice-container .main-invoice {
    position: absolute;
    left: 0;
    top: 0;
  }
}

@media (max-width: 480px) {
  body.employer-invoices,
  body.freelancer-invoices {
    overflow-x: scroll;
    margin-bottom: 60px !important;
    width: fit-content;
  }

  body.employer-invoices .invoices-container,
  body.freelancer-invoices .invoices-container {
    width: max-content;
  }

  body.single-employer_invoice,
  body.single-freelancer_invoice {
    overflow-x: scroll;
    margin-bottom: 60px !important;
    width: fit-content;
  }

  body.single-employer_invoice .invoice-container,
  body.single-freelancer_invoice .invoice-container {
    width: max-content;
    margin: 30px;
  }

  body.single-employer_invoice .header-mobile,
  body.single-freelancer_invoice .header-mobile {
    margin: 30px;
  }
}
.page-id-6989 .project-detail-detail li:first-child {
  display: none !important;
}

.page-id-6989 .project-detail-detail li:first-child + li {
  display: none !important;
}


.planning-logo {
    pointer-events: none;
}
