/* CSS generale per Macugnaga Ski Status */

:root {
  --macu-open-color: #59D556;
  --macu-alert-color: #F37515;
  --macu-close-color: #E14F4F;

  --difficulty-beginners: #42b23c;
  --difficulty-easy: #3372d1;
  --difficulty-medium: #b64141;
  --difficulty-hard: #000000;
}

/* STATUS DOT */
.status-dot {
  position: relative;
  width: 12px;
  height: 12px;
  display: inline-block;
  margin: 0 5px;
}
.status-dot::before, .status-dot::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
}
.status-dot::before{
  width: 18px;
  height: 18px;
  opacity: 0.5;
}
.status-dot::after {
  width: 12px;
  height: 12px;
}

.status-dot.open::before, .status-dot.open::after { background-color: var(--macu-open-color); }
.status-dot.alert::before, .status-dot.alert::after { background-color: var(--macu-alert-color); }
.status-dot.close::before, .status-dot.close::after { background-color: var(--macu-close-color); }

.slope-difficulty{ font-weight: 600; }
.slope-difficulty.Principianti{color: var(--difficulty-beginners);}
.slope-difficulty.Facile{color: var(--difficulty-easy);}
.slope-difficulty.Intermedia{color: var(--difficulty-medium);}
.slope-difficulty.Difficile{color: var(--difficulty-hard);}


/* STANDARD TABLE SYLE */
.macu-table-header, .macu-table-item {
  display: contents;
}

.macu-table-header div {
  font-weight: bold;
  text-align: center;
  background-color: var(--nectar-accent-color);
  padding: 20px 5px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.macu-table-item > div {
  padding: 20px 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-top: 1px solid #ccc;
}

.macu-table-item.has-warning div{
  padding-bottom: 8px;
}

.macu-table-item .item-name{
  font-weight: 600;
}

.macu-table-item .item-icon{
  height: 30px;
  width: 30px;
  overflow: hidden;
  padding: 0;
  margin: 0 5px 0 0;
}
.macu-table-item .item-icon img{
  height: 100% !important;
  width: 100% !important;
  object-fit: contain !important;
}
.macu-table-warning {
  color: var(--macu-alert-color);
  padding: 4px 20px;
  text-align: left;
  margin-bottom: 8px;
  font-weight: 500;
  font-size: 16px;
  text-align: left;
}
.macu-table-warning::before{
  content: "⚠️";
  margin-right: 6px;
}