/* ==============================================================
   Search Calendar
   style declarations for searchCalendar.xhtml
   ==============================================================*/
/* BLOCK */
.search-calendar {
    /* ELEMENT */
    .btn {}
    &__title {
        h1 {}
    }
    &__toggle {
        &.btn {}
        &:active,
        &:focus {}
    }
    &__input {
        background-color: @bg-content-box;
        border: @border;
        input {}
        .form-horizontal {}
        .form-group {}
        .col-sm-4 {}
        .col-sm-8 {}
        .control-label {}
        .form-control {}
    }
    &__select-wrapper {
        select {}
    }
    &__reset {
        .btn {}
    }
    &__months {
    }
    &__month {}
    &__month-title {
    	padding: 5px 10px;
		border: @border;
		border-bottom: 0;
		background-color: @fg-content-box;
   		background-color: @bg-content-box;
    }
    &__month-days,
    &__month-week {
		border: @border;
		border-top: 0;
    background-color: @bg-content-box;
    }
    &__month-days span,
    &__month-day,
    &__month-day-empty {}
    &__month-days {
        span {}
    }
    &__month-week {}
    &__month-day {
      a {
		background-color: @middlegray;
		color: @fg-general;
		& when (@colorModes = true) {
		  .mx-dark-mode-rules ({
		    background-color: @bg-active;
			
		  });
		  .mx-light-mode-rules ({
		    background-color: @middlegray;
			color: @fg-general;
		  });
		}
          &:focus,
          &:hover,
          &:active {
			  .mx-dark-mode-rules ({
			    background-color: @bg-hover;
				color: @fg-general;
			  });
			  .mx-light-mode-rules ({
				color: @white;
			    background-color: @bg-active;
			  });	
          }
      }
      a,
      span {
		color: var(--fg-general);
        &:focus,
        &:hover,
        &:active {}
      }
    }
    &__month-day-empty {}
    &__action {}
    &__incomplete {
        .label {}
    }
    /* MODIFICATION */
    &__month-day {
        &.active {
            a {
                color: @bg-content-box;

            }
        }
    }
}

/* BREAKPOINT FOR LARGE DESKTOPS */
@media screen and (max-width: @largeBreakpoint) {}

/* BREAKPOINT FOR DESKTOPS */
@media screen and (max-width: @mediumBreakpoint) {}

/* BREAKPOINT FOR TABLETS */
@media screen and (max-width: @smallBreakpoint) {}

/* BREAKPOINT FOR SMARTPHONES */
@media screen and (max-width: @xSmallBreakpoint) {}
