.format-info {
  flex: 1 1 auto;         
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xl);
  height: 100%;
}

.adv-format-img, .format-info-footer{
  flex-shrink: 0;        
}
.format-modal-slider {
  height: 271px ;
  border-radius: var(--radius-slg);
  min-width: 100%;
}
.format-preview{
  min-width: 100%;
  object-fit: cover;
  border-radius: 16px;
  border-radius: 16px;
}


.format-details {
  flex: 1 1 auto;         
  overflow-y: auto;      
  display: flex;
  flex-direction: column;
  gap: 32px;

  scrollbar-width: none;        
  -ms-overflow-style: none;   
}
.format-details::-webkit-scrollbar {
  display: none;                /* Chrome / Safari */
}

.format-info-footer button{
  height: 48px ;
  padding: 14px 0;
}
.format-title{
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}
.format-title h4{
  font-size: var(--font-size-xl);
  font-weight: 600;
  line-height: 32px;
}
.format-title p{
  font-size: var(--font-size-sm);
  font-weight: 500;
  line-height: 20px;
}
.format-block-details{
  display: flex;
  gap: var(--spacing-sm)
}
.format-block-info{
  width: 100%;
  height: 152px;
  border-radius: var(--radius-lg);

  display: flex;
  flex-direction: column;
  gap:var(--spacing-lg);
  background-color: var(--color-light);
  padding: var(--spacing-lg);
}
.format-block-info h5{
  font-size: var(--font-size-xxxl);
  font-weight: 500;
  line-height: 40px;
}
.format-block-info p {
  font-size: var(--font-size-sm);
  font-weight: 500;
  line-height: 20px;
}
.format-details-container {
  display: flex;
  flex-direction: column;
  gap:var(--spacing-lg)
}
.format-details-container h6{
  font-size: var(--font-size-md);
  font-weight: 600;
  line-height: 28px;
}
.format-details-list{
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md)
}
.format-detail-list-item span{
  color: var(--color-secondary);
  font-size: var(--font-size-sm);
}
.format-detail-list-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.format-detail-list-item{
  display: flex;
  justify-content: space-between;
  padding-bottom: var(--spacing-md);
  border-bottom: 1px solid var(--color-light);
}
.adv-dots {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 12px;
}

.adv-dot {
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background: #6C757D;
  transition: all .25s ease;
}

.adv-dot.is-active {
  width: 32px;
  background: #007BFF;
}

.format-slider-buttons{
  position: absolute;
}

@media (max-width: 600px) {
  .format-modal-slider{
    height: 199px;
    min-height: 199px;
  }
  .format-preview{
    height: 175px;
  }
  .format-slider-buttons{
    display: none !important;
  }
}