/*==========================================
-------- TABLES TIMES
========================================== */

.box-opening-hours {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 32px;
}

.box-col-1
{
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(1, 1fr);
  gap: 32px;
}

.box-col-2
{
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(2, 1fr);
  gap: 32px;
}

.box-col-3
{
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(3, 1fr);
  gap: 32px;
}



@media (min-width: 500px) {
  .box-col-1
  {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr;
  }

  .box-col-2
  {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
  }

  .box-col-3
  {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
  }
}

.box-opening-hours-item {
  display: flex;
  flex-direction: column;
  gap: var(--m16);
}



.table-opening-hours, .table-contact {
  width: 100%;
  align-self: left;
}

.table-opening-hours{
  border-collapse: separate; 
  border-spacing: var(--m8);
}

.section-dark .title-opening-hours{
  color: var(--txt-light-0);
}

.section-light .title-opening-hours{
  color: var(--txt-dark-0);
}

.table-opening-hours-row{
  margin-bottom: 8px;
}

.table-opening-hours-data
{
  padding-left: var(--m16);
}

.section-dark .table-opening-hours-data,
.section-dark .table-opening-hours-header{
  color: var(--txt-light-1);
}

.section-light .table-opening-hours-data,
.section-light .table-opening-hours-header{
  color: var(--txt-dark-1);
}

.table-opening-hours-header{
  display: flex;
  justify-content: start;
}


.table-opening-hours-header, .table-contact-header { font-size: clamp(0.8rem, 0.6rem + 1.28vw, 1rem); padding-right: 4px;}
.table-opening-hours-data, .table-contact-data { font-size: clamp(0.8rem, 0.6rem + 1.28vw, 1rem); }

@media (min-width: 500px)
{
  .table-opening-hours-header,  .table-contact-header { font-size: clamp(0.7rem, 0.5239rem + 0.5634vw, 1.2rem); }
  .table-opening-hours-data, .table-contact-data { font-size: clamp(0.7rem, 0.5239rem + 0.5634vw, 1.2rem); }
}