//
// @file Source of osec-admin-pge-edit-event.css
//       Manual compilation process is required.
//
/*! DO NOT EDIT source: public/admin/less/admin-pages/control-geocoder.less */
#wpbody-content {
  max-width: 68rem;
}

.timely .ai1ec-input-warn {
  border-color: red;
  background-color: #f5f5f5;
}

// Time input and date input.
.osec-date-input,
.osec-time-input {
  background-repeat: no-repeat;
  background-position:  calc(100% - 1em) 50%;
  display: inline-block;
}
// Time input
.osec-date-input {
  background-image: url("data:image/svg+xml,%3Csvg width='1.2em' height='1.2em' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21 10H3M16 2V6M8 2V6M10.5 14L12 13V18M10.75 18H13.25M7.8 22H16.2C17.8802 22 18.7202 22 19.362 21.673C19.9265 21.3854 20.3854 20.9265 20.673 20.362C21 19.7202 21 18.8802 21 17.2V8.8C21 7.11984 21 6.27976 20.673 5.63803C20.3854 5.07354 19.9265 4.6146 19.362 4.32698C18.7202 4 17.8802 4 16.2 4H7.8C6.11984 4 5.27976 4 4.63803 4.32698C4.07354 4.6146 3.6146 5.07354 3.32698 5.63803C3 6.27976 3 7.11984 3 8.8V17.2C3 18.8802 3 19.7202 3.32698 20.362C3.6146 20.9265 4.07354 21.3854 4.63803 21.673C5.27976 22 6.11984 22 7.8 22Z' stroke='%23bcbcbc' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
  width: 8.5em;
}
// Time input
.osec-time-input {
  width: 6em;
  background-image: url("data:image/svg+xml,%3Csvg width='1.2em' height='1.2em' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 8V12L15 15' stroke='%23bcbcbc' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='12' cy='12' r='9' stroke='%23bcbcbc' stroke-width='2'/%3E%3C/svg%3E") !important;
}


#osec-time-and-date-box {

  .osec-date-input-group {
    padding: 6px 6px;

    @media screen and (min-width: 783px) {
      & {
        background: linear-gradient(to right, rgba(246, 246, 247, 1) 0%, rgba(255, 255, 255, 0) 100%);
      }
    }

    // Each form group
    & > div {
      padding-bottom: 12px;
      position: relative;

      &:last-of-type {
        padding-bottom: 0;
      }
    }

    // Date inputs
    .ai1ec-form-control {
      background-color: white;
      width: auto;
      display: inline-block;
      padding: 3px 1em !important; // Ensure popups are not overlapping
    }
  }

  // Fix: Wp responsive form-table styles crashing DatePicker.
  .calendricalDatePopup td,
  .calendricalDatePopup th {
    display: table-cell !important;
  }
}

/* Recurrence fields */
#osec_repeat_text a,
#osec_exclude_text a,
#osec_exclude-dates-input {
  text-decoration: none;
  border-bottom: 1px dashed red;
}

#osec_exclude_text {
  margin-right: 20px;
}

#osec_venue,
#osec_address,
#osec_cost,
#osec_contact_name,
#osec_contact_phone,
#osec_contact_email,
#osec_contact_url,
#osec_ticket_url {
  width: 100%;
  max-width: 24em;
}

#osec_cost {
  transition: width 0.2s, padding 0.2s, opacity 0.2s;
}

#osec_cost.ai1ec-hidden {
  opacity: 0;
  padding: 0;
  width: 0;
}

#s2id_timezone-select {
  width: 172px;
  margin: 0;
}

#osec_rec_dates_list {
  line-height: 1.7em;
}

#osec_recurrence_calendar .ai1ec-datepicker-inline {
  width: auto;
}

#osec_recurrence_calendar .ai1ec-datepicker-inline table {
  width: 100%;
}

@color_1: black;
@color_2: #999999;
@font_family_1: inherit;

.calendricalDatePopup {
  z-index: 2;
  background: white;
  border: solid 1px #999999;
  padding: 2px;
  text-align: center;
  width: 16.8em;
  //height: 15.25em;


  table {
    border-collapse: collapse;
    width: inherit;

    .monthCell {
      padding: 2px 0;

      a {
        display: block;
        float: left;
        line-height: 20px;
      }

      .prevMonth {
        width: 24px;
      }

      .nextMonth {
        width: 24px;
      }

      .monthName {
        width: 150px;
      }
    }

    a {
      text-decoration: none !important;
      padding: 0;
    }

    th {
      text-align: center;
    }

    td {
      text-align: center;
      font-size: 12px;
      padding: 0;
      font-family: @font_family_1;

      a {
        display: block;
        color: @color_1;
        padding: .4em .6em;
        margin-bottom: 2px;

        &:hover {
          background: #ccccff;
          border: none;
        }
      }
    }

    td.today {
      a {
        background: #f8f8c0;
      }
    }

    td.selected {
      a {
        background: #ccccff;
      }
    }

    td.today_selected {
      a {
        background: #f8f8c0;
        border: solid 1px #dddd66;
      }
    }

    td.nonMonth {
      a {
        color: @color_2;
      }
    }
  }
}

//
// Time selecotr
//
.calendricalTimePopup {
  z-index: 2;
  background: white;
  border: solid 1px #999999;
  width: 12em;
  height: 130px;
  overflow: auto;

  ul {
    margin: 0 !important;
    padding: 0 !important;

    li {
      list-style: none !important;
      padding: 0 !important;
      margin: 0;

      a {
        text-indent: .5em;
        padding: 4px;
        display: block;
        color: @color_1;
        text-decoration: none !important;

        &:visited {
          padding: 4px;
          display: block;
          color: @color_1;
          text-decoration: none !important;
        }

        &:hover {
          background: #ccccff;
        }
      }
    }

    li.selected {
      a {
        background: #ccccff;
      }
    }
  }
}

// Attached to #osec_end-time-input
.calendricalEndTimePopup {
  // Must be wider for timespan text.
  width: 12em;
}


// Recurrence modal
.ai1ec-modal-content {
  .timely & .ai1ec-nav > li {
    width: auto;
  }

  // Range select
  .ai1ec-slider {
    background: #eee;
    height: 0.4em;
    position: relative;
    cursor: pointer;
    border: 1px solid #ccc;
    width: 8.8em;
    margin: 0.7em 0.25em 0 0;
    float: left;
    clear: right;
    border-radius: 3px;
  }

  // Range select handle
  .timely & .ai1ec-handle {
    background: #fff;
    height: 1em;
    width: 1em;
    top: -0.5em;
    margin-top: 1px;
    position: absolute;
    z-index: 0;
    display: block;
    border: 1px solid #ccc;
    cursor: move;
    border-radius: 0.25em;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
  }

  // Range select text input
  .ai1ec-range {
    text-align: center;
    width: 3em;
    border: 1px solid #dfdfdf;
    background: #fff;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  // Week and year buttons
  .ai1ec-btn-group-grid > .ai1ec-pull-left {
    padding: 0 0.5em 0.5em 0;
    width: 14.2%;
  }

  // Year buttons
  #osec_yearly_date_select > .ai1ec-pull-left {
    width: 16.6%;
  }
}
