/* Praktisk Info Page Specific Styles */
/* Scoped overrides to avoid conflicts when embedded */
.pi-scope .accordion-button {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 1rem 0 !important;
  font-weight: 600 !important;
  color: #000 !important;
  border-radius: 0 !important;
  position: relative !important;
  letter-spacing: 1px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* Desktop padding 8px per accordion */
@media (min-width: 992px) {
  .pi-scope .accordion-button {
    padding: 8px 0 !important;
  }

  .pi-scope .accordion-body {
    padding: 8px 0 !important;
  }
}

.pi-scope .accordion-button:not(.collapsed) {
  background-color: transparent !important;
  color: #bf6d4b !important;
  box-shadow: none !important;
}

.pi-scope .accordion-button:focus {
  border-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

.pi-scope .accordion-button::after {
  transform: rotate(-90deg) !important;
  margin-left: auto !important;
  width: 1rem !important;
  height: 1rem !important;
  transition: transform 0.3s ease !important;
  flex-shrink: 0 !important;
  align-self: center !important;
}

.pi-scope .accordion-button:not(.collapsed)::after {
  transform: rotate(0deg) !important;
}

.pi-scope .accordion-item {
  border: none !important;
  border-bottom: 1px solid #bf6d4b !important;
  background-color: #fff5ee !important;
}

.pi-scope .accordion-body {
  padding: 1rem 0 !important;
  color: #333 !important;
  background-color: #fff5ee !important;
}

.pi-scope .praktisk-info-title {
  color: #fff !important;
}

.pi-scope .praktisk-info-content {
  background-color: #fff5ee !important;
}

/* Page background */
body.praktisk-info-page {
  background-color: #fff5ee !important;
}

/* Hide info icon on mobile in Praktisk Info sections */
@media (max-width: 991.98px) {
  .info-icon {
    display: none !important;
  }
}

/* Container background */
.praktisk-info-container {
  background-color: #fff5ee;
  min-height: auto;
}

/* Ensure consistent row min-height across pages (home, meny, arrangementer) */
.praktiskinfo-home .row.g-0.align-items-stretch {
  min-height: 35vh !important;
  /* restored per request */
}

/* Desktop: remove top/left padding/margins for icon and title */
@media (min-width: 992px) {

  .info-icon,
  .info-icon-fallback {
    margin-top: 0 !important;
    margin-left: 0 !important;
  }

  .praktisk-info-title {
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
}

/* Accordion button styles - specific to praktisk info */
.accordion-button {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0.3rem 0 !important;
  font-weight: 600 !important;
  color: #000 !important;
  border-radius: 0 !important;
  position: relative !important;
  letter-spacing: 1px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* Desktop: Reduce spacing between accordion items - VERY COMPACT */
@media (min-width: 992px) {
  .accordion-button {
    padding: 0.2rem 0 !important;
  }

  .accordion-item {
    margin-bottom: 2px !important;
  }

  .accordion-body {
    padding: 0.3rem 0 !important;
  }
}

.accordion-button:not(.collapsed) {
  background-color: transparent !important;
  color: #bf6d4b !important;
  box-shadow: none !important;
}

.accordion-button:focus {
  border-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

.accordion-button::after {
  transform: rotate(-90deg) !important;
  margin-left: auto !important;
  width: 1rem !important;
  height: 1rem !important;
  transition: transform 0.3s ease !important;
  flex-shrink: 0 !important;
  align-self: center !important;
}

.accordion-button:not(.collapsed)::after {
  transform: rotate(0deg) !important;
}

.accordion-button:hover {
  background-color: transparent !important;
  color: #bf6d4b !important;
}

.accordion-button:hover::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23bf6d4b'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

.accordion-item {
  border: none !important;
  border-bottom: 1px solid #bf6d4b !important;
  background-color: #fff5ee !important;
  margin-bottom: 2px !important;
}

.accordion-item:last-child {
  border-bottom: none !important;
}

.pi-scope .accordion-header {
  min-height: 50px !important;
  display: flex !important;
  align-items: center !important;
}

.pi-scope .accordion-button {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 1rem 0 !important;
  font-weight: 600 !important;
  color: #000 !important;
  border-radius: 0 !important;
  display: flex !important;
  align-items: center !important;
  letter-spacing: 1px !important;
}

.accordion-body {
  padding: 1rem 0 !important;
  color: #333 !important;
  background-color: #fff5ee !important;
}

/* Title section styling */
.praktisk-info-title {
  color: #fff;
  text-align: left;
  font-size: 2.5rem;
  font-weight: 400;
  margin: 0;
  letter-spacing: 1px !important;
  margin-left: 15vh;
  margin-bottom: 15vh;

}

/* Mobile padding for title block */
@media (max-width: 991.98px) {
  .pi-title-block {
    padding-left: 20px !important;
  }
}

/* Info icon styling */
.info-icon {
  width: auto !important;
  height: auto !important;
  margin-bottom: 1.5rem;
  margin-left: 15vh;
  margin-top: 7vh;
  filter: brightness(0) invert(1);
  /* Makes the icon white */
  display: block;
  background-color: transparent;
  border: none;
}

/* Fallback icon styling */
.info-icon-fallback {
  width: auto !important;
  height: auto !important;
  margin-bottom: 1.5rem;
  margin-left: 15vh;
  margin-top: 7vh;
  font-size: 120px;
  line-height: 120px;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  background-color: transparent;
  border: none;
}

/* Content section styling */
.praktisk-info-content {
  background-color: #fff5ee;
  padding: 0;
}

/* Accordion container styling */
.accordion {
  max-width: 600px !important;
  margin: 0 auto !important;
}

/* List styling - restore bullets */
.accordion-body ul {
  list-style-type: disc !important;
  padding-left: 20px !important;
  margin-left: 0 !important;
}

.accordion-body li {
  margin-bottom: 8px !important;
  color: #333 !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {

  /* Stack and center title area */
  .pi-title-block {
    padding-left: 20px !important;
    padding-right: 20px !important;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .praktisk-info-title {
    text-align: center;
    margin: 16px 0 !important;
  }

  .info-icon,
  .info-icon-fallback {
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 16px !important;
  }

  /* Content small horizontal padding on mobile */
  .praktisk-info-content {
    padding: 0 16px !important;
  }

  /* Ensure accordion fits viewport width */
  .praktisk-info-title {
    font-size: 2rem;
    margin-left: 5vh;
    margin-bottom: 5vh;
  }

  .praktisk-info-content {
    padding: 0;
  }

  .info-icon {
    width: auto !important;
    height: auto !important;
    margin-left: 5vh;
    margin-top: 3vh;
  }

  .info-icon-fallback {
    width: auto !important;
    height: auto !important;
    margin-left: 5vh;
    margin-top: 3vh;
    font-size: 120px;
  }

  .accordion {
    max-width: 100% !important;
  }
}

@media (max-width: 576px) {

  /* Relax row min-height set inline in templates */
  .praktisk-info-container .row {
    min-height: auto !important;
  }

  .praktisk-info-title {
    font-size: 1.5rem;
    margin-left: 3vh;
    margin-bottom: 3vh;
  }

  .praktisk-info-content {
    padding: 0;
  }

  .info-icon {
    width: auto !important;
    height: auto !important;
    margin-left: 3vh;
    margin-top: 2vh;
  }

  .info-icon-fallback {
    width: auto !important;
    height: auto !important;
    margin-left: 3vh;
    margin-top: 2vh;
    font-size: 100px;
  }

  .accordion-button {
    font-size: 0.9rem;
    padding: 0.8rem 0 !important;
  }

  .accordion {
    max-width: 100% !important;
  }
}

@media (max-width: 480px) {
  .praktisk-info-title {
    font-size: 1.25rem;
    margin-left: 2vh;
    margin-bottom: 2vh;
  }

  .praktisk-info-content {
    padding: 0;
  }

  .info-icon {
    width: auto !important;
    height: auto !important;
    margin-left: 2vh;
    margin-top: 1vh;
  }

  .info-icon-fallback {
    width: auto !important;
    height: auto !important;
    margin-left: 2vh;
    margin-top: 1vh;
    font-size: 80px;
  }

  .accordion-button {
    font-size: 0.8rem;
    padding: 0.6rem 0 !important;
  }

  .accordion-body {
    padding: 0.8rem 0 !important;
  }
}

/* Assicura che l'accordion-collapse si espanda correttamente */
.pi-scope .accordion-collapse {
  transition: height 0.35s ease !important;
}

/* Lista con bullets visibili */
.pi-scope .accordion-body ul {
  list-style-type: disc !important;
  padding-left: 24px !important;
  margin: 0 !important;
}

.pi-scope .accordion-body ul li {
  margin-bottom: 12px !important;
  line-height: 1.6 !important;
}

/* Rimuovi margini extra dall'ultimo elemento */
.pi-scope .accordion-body ul:last-child {
  margin-bottom: 0 !important;
}