/* ACCEA EXPRESS timetable page specific styles */

/* ===== Store Title (Accordion trigger) ===== */
.shoplist-html .shopTitle.trigger{
  display:flex;
  align-items:center;
  justify-content:space-between;
  cursor:pointer;
  padding:0 14px;
  margin:10px 0 0;
  border:1px solid #d5d5d5;
  border-radius:6px;
  line-height:1.4;
  min-height:38px;
  font-size:1rem;
  font-weight:400;
}
.shoplist-html .shopTitle.trigger.active{
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
}
/* Arrow */
.shoplist-html .shopTitle.trigger .acc-arrow{
  font-size:15px;
  line-height:1;
  margin-left:10px;
  user-select:none;
  font-weight:bold;
  transition:transform .2s;
  color:#333;
}
.shoplist-html .shopTitle.trigger[aria-expanded="true"] .acc-arrow{ color:#222; }

/* ===== Area Title ===== */
.shoplist-html .areaTitle{
  background: #eee;
  border-left: 6px solid #191970;
  padding:10px 14px;
  margin:14px 0 8px;
  font-size:1.28rem;
  line-height:1.35;
}
.shoplist-html .areaTitle:first-child{ margin-top:0; }

/* ===== Panel ===== */
.shoplist-html .shopTitle.trigger + .shopContents{
  display:none;
  padding:4px 18px 18px;
  border:1px solid #d5d5d5;
  border-top:none;
  border-radius:0 0 6px 6px;
  background:transparent;
  line-height:1.55;
}

.shopDataItem .dataName { background:#f7f7fb; font-weight:600; padding:4px 8px; border-radius:6px; }
.shopDataItem .dataData { background:#fff;     padding:6px 8px; border-radius:6px; }

.telText { margin:0; }
.telText .telLink {
  font-size:1rem;
  display:inline-flex;
  align-items:center;
  gap:6px;
  line-height:1;
  text-decoration:none;
}

@media (max-width:480px){
  .shoplist-html .areaTitle{ padding:6px 12px; font-size:1.4rem; }
  .shoplist-html .shopTitle.trigger{ padding:2px 12px; font-size:1.2rem; }
  .shoplist-html .shopTitle.trigger + .shopContents{ padding:14px 14px 16px; }
  .telText .telLink { font-size:14px; }
  .shopDataItem .dataName { font-size:12px; }
}

/* Disable click on tel: (desktop hover devices) */
@media (hover:hover) and (pointer:fine){
  .shoplist-html a[href^="tel:"]{
    pointer-events:none;
    cursor:default;
    text-decoration:none;
    color:inherit;
  }
}
