/* Comments translated in english on 21/03/2026 */
/* Availability Calendar shortcode style */
.ar-ac-calendar {
  display: flex;
  justify-content: space-around; /* space between elements (calendar) of the container + 1/2 space at ends */
  flex-wrap: wrap; /* Allows elements to wrap if space is insufficient (e.g. smartphone)*/
  align-items: flex-start; /* Aligns elements to the top if their total heights differ */
}

/* monthly table style */
.ar-ac-month { 
  border-collapse: separate; 
  width: 32%;  /* so we have 3 months per line with all margins = 4% (3*32% + 4% = 100% !)*/
  text-align: center;
}

/* rows and columns style (basic grey borders) */
.ar-ac-calendar th, 
.ar-ac-calendar td {
  border: 1px solid #ccc;
  padding: 5px;
}

/* available day */
.ar-ac-available { background: #c8f7c5; }

/* first half-day available and second booked (free in the morning and arrival in the afternoon) */
.ar-ac-available-booked-diag-cell.grad {
  /* 135deg makes the diagonal from bottom left corner to top right corner */
  background: linear-gradient(135deg, #c8f7c5 50%, #f7c5c5 50%);
}

/* booked day */
.ar-ac-booked { background: #f7c5c5; }

/* first half-day booked and second available (departure in the morning and free in the afternoon) */
.ar-ac-booked-available-diag-cell.grad {
  /* 135deg makes the diagonal from bottom left corner to top right corner */
  background: linear-gradient(135deg, #f7c5c5 50%, #c8f7c5 50%);
}

/* no rate entered for the day */
.ar-ac-na { background: #f0f0f0; }


/* ------------------------------------------------------------------- */
/* Blue frame for arrival days of periods >1 day */
/* ------------------------------------------------------------------- */
.ar-ac-month td.ar-ac-first-day-period {
    border: 2px solid #0066ff ;
}


/* ---------------------------------------------------- */
/* navigation buttons                               */
/* ---------------------------------------------------- */
.ar-ac-month .ar-ac-btn-prev { 
  text-align: left; 
  padding: 0px;
  border-right: none;
}
.ar-ac-month .ar-ac-month-prev { 
  border-left: none;
}

.ar-ac-month .ar-ac-month-next { 
  border-right: none;
}
.ar-ac-month .ar-ac-btn-next { 
  text-align: right; 
  padding: 0px;
  border-left: none;
}

/* buttons must occupy the entire cell where they are located */
.ar-ac-month .ar-ac-btn-next button,
.ar-ac-month .ar-ac-btn-prev button { 
  width: 100%; 
  height: 100%;  
  box-sizing: border-box; /* Ensures padding is INCLUDED in the 100% */
  display: block; /* Ensures width/height: 100% works */
  padding-left: 0px; /* neutralizes wp theme padding */
  padding-right: 0px; /* neutralizes wp theme padding */
}

/* ---------------------------- */
/* legend under calendars */
/* ---------------------------- */

.ar-ac-legend-container {
  display: flex;
  justify-content: space-around; /* space between elements (calendar) of the container */
  column-gap: 5px; /* Space between elements */
  flex-wrap: wrap; /* Allows elements to wrap if space is insufficient (e.g. smartphone)*/
  align-items: flex-start; /* Aligns elements to the top if their total heights differ */
}

.ar-ac-legend-1 {
  width: 100%; /* 1 element */
}

.ar-ac-legend-4 {
  width: 24%; /* 4 elements */
  min-width: 300px;
  flex: 0 0 300px; /* flex-grow: 0 (cannot grow), flex-shrink: 0 (cannot shrink), flex-basis: 600px (preferred width) */    
}

/* check-in and/or check-out day */
.ar-ac-legend-container .ar-ac-legend-change-day {
  border: 3px solid #0066ff;
}

/* available */
.ar-ac-legend-container .ar-ac-legend-available{
  border: 2px solid #ccc;
  background: #c8f7c5;
}

/* booked */
.ar-ac-legend-container .ar-ac-legend-booked{
  border: 2px solid #ccc;;
  background: #f7c5c5;
}

/* unavailable */
.ar-ac-legend-container .ar-ac-legend-unavailable{
  border: 2px solid #ccc;
  background: #f0f0f0;
}