/* -------------------------------------------------
    Datepicker cells
   ------------------------------------------------- */
.datepicker--cells{
  display:flex;
  flex-wrap:wrap;
  appearance:none;

  margin:5px 0 0 0;

  outline:none !important;
  -webkit-tap-highlight-color:rgba(255,255,255,0);
}

.datepicker--cell{
  height:35px;
  position:relative;    
  
  display:flex;
  align-items:center;
  justify-content:center;
  
  cursor:pointer;
  /*
  background-color:#ffffff;  
  */
  box-sizing:border-box;
  border:1px solid #ffffff;   
  border-radius:var(--border_radius_cuadrado);  
  
  z-index: 1;
}
.datepickers-container.reservas .datepicker--cell{border:1px solid var(--color_back_1);}

.datepickers-container.academia .datepicker--cell,
.datepickers-container.paquetes .datepicker--cell{border:1px solid #ffffff;}


.datepicker--cell.-focus-{background-color:var(--color_back_1); border:1px solid var(--seleccion_opcion_borde);}
.datepicker--cell.-current-{color:var(--color_ter_1); font-weight:700;}
.datepicker--cell.-current-.-in-range-{ color:var(--color_ter_1); }
.datepicker--cell.-in-range-{background:#f7f7f7; color:#4a4a4a; border-radius:0;}
.datepicker--cell.-in-range-.-focus-{background-color:rgba(92, 196, 239, 0.2);}

.datepicker--cell.-disabled-,
.datepicker--cell.-disabled-.-focus-,
.datepicker--cell.-disabled-.-in-range-,
.datepicker--cell.-disabled-.-current-.-focus-{
    color:#aeaeae;
	  cursor:default;
}

.datepicker--cell.-range-from- {background-color: rgba(92, 196, 239, 0.1); border-radius: 4px 0 0 4px; }
.datepicker--cell.-range-to- {background-color: rgba(92, 196, 239, 0.1); border-radius: 0 4px 4px 0; }
.datepicker--cell.-range-from-.-range-to- {border-radius: 4px; }
.datepicker--cell.-selected-,
.datepicker--cell.-selected-.-current-,
.datepicker--cell.-selected-.-focus-{
    color:var(--color_ter_1);
    background-color:#ffffff;
    border:1px solid var(--literal_border);  
	  font-weight:700;
}
.datepicker--cell:empty{cursor:default;}
.datepicker--days-names{display:flex; flex-wrap:wrap; margin:15px 0 0 0;}

.datepicker--day-name{
    color: #303030;
	  display: flex;
	  align-items: center;
    justify-content: center;
      
    flex:1;
    text-align:center;
    text-transform:uppercase;

    font-size:0.85em;
    font-weight:700;
}

.datepicker--cell-day{width:14.28571%; padding:20px 0;}
.datepicker--cells-months{height:170px;}
.datepicker--cell-month{width:33.33%; height:25%;}
.datepicker--years {height:170px;}
.datepicker--cells-years{height:170px;}
.datepicker--cell-year{width:25%; height:33.33%;}
.datepicker--cell-day.-other-month-, .datepicker--cell-year.-other-decade-{color:var(--texto_5);}
.datepicker--cell-day.-other-month-:hover, .datepicker--cell-year.-other-decade-:hover{color:var(--texto_5);}
.-disabled-.-focus-.datepicker--cell-day.-other-month-, .-disabled-.-focus-.datepicker--cell-year.-other-decade-{color:var(--texto_5);}
.-selected-.datepicker--cell-day.-other-month-, .-selected-.datepicker--cell-year.-other-decade-{color:#ffffff; background:#85bdaa;}
.-selected-.-focus-.datepicker--cell-day.-other-month-, .-selected-.-focus-.datepicker--cell-year.-other-decade-{background:#8ad5f4;}
.-in-range-.datepicker--cell-day.-other-month-, .-in-range-.datepicker--cell-year.-other-decade-{background-color:rgba(92, 196, 239, 0.1); color: #cccccc;}
.-in-range-.-focus-.datepicker--cell-day.-other-month-, .-in-range-.-focus-.datepicker--cell-year.-other-decade-{background-color:rgba(92, 196, 239, 0.2);}
.datepicker--cell-day.-other-month-:empty, .datepicker--cell-year.-other-decade-:empty{background:none; border:none;}
.-weekend-{font-weight:700;}

/* -------------------------------------------------
    Datepicker
   ------------------------------------------------- */
.datepickers-container{
	height:auto;
  width:94%; 
  position:absolute;
  left:3%;

  visibility:hidden;
  
  z-index:100; 
}
.datepickers-container.reservas{top:225px;}
.datepickers-container.academia{bottom:390px;}
.datepickers-container.paquetes{bottom:390px;}
.datepickers-container.periodo{height:420px;}
.datepickers-container.activo{visibility:visible;}

.datepicker{
  width:100%;
  position: absolute; 
  
  opacity:1;
  color:var(--texto_1);

  overflow:hidden;

  font-size: 0.85rem;
  font-family:'Lato', sans-serif;  

  /*
  box-sizing:border-box;
  background-color:#ffffff;  
  border:solid 1px var(--literal_border);
  border-radius:var(--border_radius_cuadrado);

  box-shadow:0 13px 27px -5px rgba(var(--shadow_clara), 0.150), 
             0 8px 16px -8px rgba(var(--shadow_oscura), 0.250);
  */
  z-index: 100;
}
.datepicker.active{opacity:1;}

.datepicker-inline .datepicker {
  border-color: #d7d7d7;
  box-shadow: none;
  position: static;
  left: auto;
  right: auto;
  opacity: 1;
  transform: none;
}
.datepicker-inline .datepicker--pointer{display:none;}

.datepicker--content{
  height:auto;
  box-sizing: content-box;
  padding:0px 5px;
  /*
  background-color:#ffffff;
  */
}
.-only-timepicker- .datepicker--content{display:none;}	
.datepicker--content input{cursor:default;}

.datepicker--pointer {
  display:none;
  position: absolute;
  background: #fff;
  border-top: 1px solid #dbdbdb;
  border-right: 1px solid #dbdbdb;
  width: 10px;
  height: 10px;
  z-index: -1; }
.datepicker.overlay .datepicker--pointer{border-top: 1px solid #808080; border-right: 1px solid #808080;}  
  
  .-top-left- .datepicker--pointer, .-top-center- .datepicker--pointer, .-top-right- .datepicker--pointer {
    top: calc(100% - 5px);
            transform: rotate(135deg); }
  .-right-top- .datepicker--pointer, .-right-center- .datepicker--pointer, .-right-bottom- .datepicker--pointer {
    right: calc(100% - 5px);
            transform: rotate(225deg); }
  .-bottom-left- .datepicker--pointer, .-bottom-center- .datepicker--pointer, .-bottom-right- .datepicker--pointer {
    bottom: calc(100% - 5px);
            transform: rotate(315deg); }
  .-left-top- .datepicker--pointer, .-left-center- .datepicker--pointer, .-left-bottom- .datepicker--pointer {
    left: calc(100% - 5px);
            transform: rotate(45deg); }
  .-top-left- .datepicker--pointer, .-bottom-left- .datepicker--pointer {
    left: 10px; }
  .-top-right- .datepicker--pointer, .-bottom-right- .datepicker--pointer {
    right: 10px; }
  .-top-center- .datepicker--pointer, .-bottom-center- .datepicker--pointer {
    left: calc(50% - 10px / 2); }
  .-left-top- .datepicker--pointer, .-right-top- .datepicker--pointer {
    top: 10px; }
  .-left-bottom- .datepicker--pointer, .-right-bottom- .datepicker--pointer {
    bottom: 10px; }
  .-left-center- .datepicker--pointer, .-right-center- .datepicker--pointer {
    top: calc(50% - 10px / 2); }

.datepicker--body{display:none;}
.datepicker--body.active{display:block;}



/* -------------------------------------------------
    Navigation
   ------------------------------------------------- */
.datepicker--nav{
  min-height:40px;
  margin:0;
  padding:6px;

  display:flex;  
  justify-content:space-between;

  box-sizing:border-box;
  /*background:var(--color_back_2);*/
  border-top:solid 1px var(--seleccion_opcion_borde);
  border-bottom:solid 1px var(--seleccion_opcion_borde);
}
.datepickers-container.academia .datepicker--nav,
.datepickers-container.paquetes .datepicker--nav{border-top:none; border-bottom:solid 1px var(--seleccion_opcion_borde);}


.-only-timepicker- .datepicker--nav{display:none;}

.datepicker--nav-title,
.datepicker--nav-action{
  display:flex;
  cursor:pointer;
  align-items: center;
  justify-content: center;
}

.datepicker--nav-action {
  width: 32px;
  border-radius:var(--border_radius_cuadrado);
          user-select: none; }
  .datepicker--nav-action:hover {
    background: #f0f0f0; }
  .datepicker--nav-action.-disabled- {
    visibility: hidden; }
  .datepicker--nav-action svg {
    width: 32px;
    height: 32px; }
  .datepicker--nav-action path {
    fill: none;
    stroke: #9c9c9c;
    stroke-width: 2px; }

.datepicker--nav-title {
  font-size:1.15em;
  font-weight:700;  
  font-family:'Lato', sans-serif;
  border-radius:var(--border_radius_cuadrado);
  padding: 0 8px; }
  .datepicker--nav-title i {
    font-style: normal;
    color:var(--color_ter_1);
    margin-left: 5px; }
  .datepicker--nav-title.-disabled- {
    cursor: default;
    background: none; }

.datepicker--buttons {
  
  
  display: flex;
  padding: 20px;
  margin:0;
}

.datepicker--button{
  height:41px;
  font-size:0.85rem;
  font-weight:700; 
  color:#ffffff;
  cursor:pointer;  
  border-radius:var(--border_radius_cuadrado);
  background-color:var(--boton_fondo_reposo);
  
  transition:all 0.25s ease;
  transition-delay:0.10s;  
  
  outline:none !important;
  -webkit-tap-highlight-color:rgba(255,255,255,0);
	
  
      
          flex: 1;
  display: inline-flex;
  
      
          justify-content: center;
  
      
          align-items: center;
 }
.datepicker--button:hover {background-color:var(--boton_fondo_hover);}
	
.datepicker--button#aceptar_fecha{color:#ffffff;background-color:var(--color_pri_2);}	

.datepicker--dates{
	height:48px;
	width:100%; 
	position:relative;
	margin:0;
	padding:0;
  
	display:flex;
	flex-direction:row;
	justify-content:center;
  
	box-sizing:border-box; 
	border-bottom: 1px solid #efefef;
  
	background-size:contain;
	background-color:#ffffff;	
	background-repeat:no-repeat;
	background-position:center center;
	background-image:url(../../../www_librerias/plugins/img/comun/fechas_periodo.svg?version=001);	
}

.datepicker--dates input[type=text]{
	width:150px; 
	height:38px; 
	position:relative;
	margin:5px 15px;
	padding:0;		
	
	text-align:center; 
	
    color:var(--texto_1);
	font-weight:400;
	font-size:3.50vw;	
	font-family:'Lato', sans-serif;		
	
    appearance:none;
	
    outline:none !important;
    -webkit-tap-highlight-color:rgba(255,255,255,0);	
    
	box-sizing:border-box; 
	border:solid 1px #ffffff;
	background-color:#ffffff;	
	
	z-index:200; 
}

.datepicker--dates input[type=text]::placeholder{ 
    color:#bbbbbb;
	font-size:3.50vw;
	font-style:italic; 
}





/* -------------------------------------------------
    Timepicker
   ------------------------------------------------- */
.datepicker--time {
    outline:none !important;
    -webkit-tap-highlight-color:rgba(255,255,255,0);

  border-top: 1px solid #efefef;
  
  
  display: flex;
  
      
          align-items: center;
  padding: 15px;
  position: relative; }
  .datepicker--time.-am-pm- .datepicker--time-sliders {
            flex: 0 1 138px;
    max-width: 138px; }
  .-only-timepicker- .datepicker--time {
    border-top: none; }

.datepicker--time-sliders {

    outline:none !important;
    -webkit-tap-highlight-color:rgba(255,255,255,0);	

          flex: 0 1 215px;
  margin-left:15px; 
  margin-right:5px;
  
  max-width: 215px; }

.datepicker--time-label {
  display: none;
  font-size: 12px; }

.datepicker--time-current {
  
  
  display: flex;
  
      
          align-items: center;
  
      
          flex: 1;
  color:#194a51;		  
  font-size: 14px;
  text-align: center;
  margin: 0 5px 0 0; }

.datepicker--time-current-colon {
  margin: 0 2px 3px;
  line-height: 1; }

.datepicker--time-current-hours,
.datepicker--time-current-minutes {
  line-height: 1;
  font-size: 24px;
  
  position: relative;
  z-index: 1; }
  .datepicker--time-current-hours:after,
  .datepicker--time-current-minutes:after {
    content: '';
    background: #f0f0f0;
    border-radius:var(--border_radius_cuadrado);
    position: absolute;
    left: -2px;
    top: -3px;
    right: -2px;
    bottom: -2px;
    z-index: -1;
    opacity: 0; }
  .datepicker--time-current-hours.-focus-:after,
  .datepicker--time-current-minutes.-focus-:after {
    opacity: 1; }

.datepicker--time-current-ampm {
  text-transform: uppercase;
  
      
          align-self: flex-end;
  color: #9c9c9c;
  margin-left: 6px;
  font-size: 11px;
  margin-bottom: 1px; }

.datepicker--time-row {
    
    
    appearance:none;

    outline:none !important;
    -webkit-tap-highlight-color:rgba(255,255,255,0);

  
  
  display: flex;
  
      
          align-items: center;
  font-size: 11px;
  height: 17px;
  background: linear-gradient(to right, #aeaeae, #aeaeae) left 50%/100% 1px no-repeat; }
  .datepicker--time-row:first-child {
    margin-bottom: 15px; }
  .datepicker--time-row input[type='range'] {
    
    
    appearance:none;
	
    outline:none !important;
    -webkit-tap-highlight-color:rgba(255,255,255,0);
	
    background: none;
    cursor: pointer;
    
        
            flex: 1;
    height: 100%;
    padding: 0;
    margin: 0;
     }
    .datepicker--time-row input[type='range']::-webkit-slider-thumb {
      -webkit-appearance: none; }
    .datepicker--time-row input[type='range']::-ms-tooltip {
      display: none; }
    .datepicker--time-row input[type='range']:hover::-webkit-slider-thumb {
      border-color: #b8b8b8; }
    .datepicker--time-row input[type='range']:hover::-moz-range-thumb {
      border-color: #b8b8b8; }
    .datepicker--time-row input[type='range']:hover::-ms-thumb {
      border-color: #b8b8b8; }
    .datepicker--time-row input[type='range']:focus {
      outline: none; }
      .datepicker--time-row input[type='range']:focus::-webkit-slider-thumb {
        background: #5cc4ef;
        border-color: #5cc4ef; }
      .datepicker--time-row input[type='range']:focus::-moz-range-thumb {
        background: #5cc4ef;
        border-color: #5cc4ef; }
      .datepicker--time-row input[type='range']:focus::-ms-thumb {
        background: #5cc4ef;
        border-color: #5cc4ef; }
    .datepicker--time-row input[type='range']::-webkit-slider-thumb {
      box-sizing: border-box;
      height: 12px;
      width: 12px;
      border-radius:var(--border_radius_cuadrado);
      border: 1px solid #d9e6e2;
      background: #ffffff;
      cursor: pointer;
      transition: background .2s; }
    .datepicker--time-row input[type='range']::-moz-range-thumb {
      box-sizing: border-box;
      height: 12px;
      width: 12px;
      border-radius:var(--border_radius_cuadrado);
      border: 1px solid #aeaeae;
      background: #fff;
      cursor: pointer;
      transition: background .2s; }
    .datepicker--time-row input[type='range']::-ms-thumb {
      box-sizing: border-box;
      height: 12px;
      width: 12px;
      border-radius:var(--border_radius_cuadrado);
      border: 1px solid #aeaeae;
      background: #fff;
      cursor: pointer;
      transition: background .2s; }
    .datepicker--time-row input[type='range']::-webkit-slider-thumb {
      margin-top: -6px; }
    .datepicker--time-row input[type='range']::-webkit-slider-runnable-track {
      border: none;
      height: 1px;
      cursor: pointer;
      color: transparent;
      background: transparent; }
    .datepicker--time-row input[type='range']::-moz-range-track {
      border: none;
      height: 1px;
      cursor: pointer;
      color: transparent;
      background: transparent; }
    .datepicker--time-row input[type='range']::-ms-track {
      border: none;
      height: 1px;
      cursor: pointer;
      color: transparent;
      background: transparent; }
    .datepicker--time-row input[type='range']::-ms-fill-lower {
      background: transparent; }
    .datepicker--time-row input[type='range']::-ms-fill-upper {
      background: transparent; }
  .datepicker--time-row span {
    padding: 0 12px; }

.datepicker--time-icon {
  color: #9c9c9c;
  border: 1px solid;
  border-radius: 50%;
  font-size: 16px;
  position: relative;
  margin: 0 5px -1px 0;
  width: 1em;
  height: 1em; }
  .datepicker--time-icon:after, .datepicker--time-icon:before {
    content: '';
    background: currentColor;
    position: absolute; }
  .datepicker--time-icon:after {
    height: .4em;
    width: 1px;
    left: calc(50% - 1px);
    top: calc(50% + 1px);
            transform: translateY(-100%); }
  .datepicker--time-icon:before {
    width: .4em;
    height: 1px;
    top: calc(50% + 1px);
    left: calc(50% - 1px); }