@import url("./index.css");

.mainframe{
    padding-top: 0;
    padding-left: 260px;
    padding-right: 0px;
}

.mainframe-toptop{
    position: sticky;
    top: 0;
    background: var(--body-bg-color);
    z-index: var(--z-index-25);
    padding-top: 70px;
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
    box-shadow: 0 0 20px 0 var(--light-dark-color);
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.mainframe-topbar {
  width: 100%;
  height: 35px;
  position: sticky;
  top: 0;
}

ll-previewer {
  width: 100%;
}

.mainframe-footer{
    padding: 0 20px;
}

/* Mobile Responsive Styles */
@media screen and (max-width: 1024px) {
    .mainframe {
        padding-left: 20px;
    }
}

@media screen and (max-width: 768px) {
    .mainframe-toptop {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media screen and (max-width: 480px) {
    .mainframe-toptop {
        padding-left: 10px;
        padding-right: 10px;
    }

    .mainframe-footer {
        padding: 0 10px;
    }
}