:root {
  --body-background: #fff;
  --theme-background: #fff;
  --rounded-corners: 1.5rem;
  --primary-color: #0456fb;
  --go-option-transition: all 0.25s ease-in-out;
  --content-max-width: 768px;
  --header-height: 61px;
  --go-option-hover-background: rgba(0, 0, 0, 0.05);
  --link-active-color: #0456fb;
  --input-border-radius: 0.375rem;
  --secondary-color: var(--go-option-hover-background);
}

.homeLink {
  --link-active-color: initial;
}

.adsContainer {
  display: flex;
  width: 100%;
}

.pageAside {
  display: none;
  flex-direction: column;
}

.ViewHeader go-button:active {
  color: var(--primary-color);
}

.View.menu app-aside .appAsideCredits {
  padding: calc(var(--gap) * 0.5) 0 0 0;
}

.adsContainer go-icon {
  font-size: 120%;
}

go-options-content .go-option {
  border-radius: 2pc;
}

go-options-content .go-option:hover {
  background-color: var(--go-option-hover-background, rgba(0, 0, 0, 0.05));
  transition: var(--go-option-transition);
}

go-options-content .go-option.active {
  background-color: var(--go-option-hover-background);
}

.ViewContent .error,
.ViewBody .error {
  padding: 0;
  font-size: 100%;
}

.adsContainer {
  min-height: calc(100dvh - var(--header-height));
}

.pageAside {
  padding: calc(var(--header-height) + var(--gap)) var(--gap) var(--gap) var(--gap);
  border-right: solid 1px var(--border-color);
  position: fixed;
  background-color: var(--theme-background);
  left: 0;
  top: 0;
  bottom: 0;
  height: 100dvh;
  min-width: var(--aside-min-width);
}

app-aside > go-options {
  margin: 0 0 var(--gap) 0;
}

go-items {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.pageMain {
  flex: auto;
  display: flex;
  flex-direction: column;
}

.mainContent {
  padding: var(--gap) 0;
}

.adsFooter {
  margin: auto 0 0 0;
  border-top: solid 1px var(--border-color);
  padding: var(--gap) 0 0 0;
  position: sticky;
  bottom: 0;
  background-color: var(--theme-background);
}

.title-section {
  border-bottom: solid 1px var(--border-color);
  padding: var(--gap) var(--gap) calc(var(--gap) * 1.5) var(--gap);
  margin: 0;
}

.title-section go-button {
  align-self: center;
}

.body go-view.View.view.page .ViewHeader {
  position: fixed;
  top: 0;
  background-color: var(--theme-background);
  z-index: 1;
  left: 0;
  width: 100%;
}

.body go-view.View.view.page .ViewBody {
  padding: var(--content-header-height) 0 0 0;
  height: auto !important;
}

.View.view.ads-menu .app-aside {
  padding: calc(var(--gap) * 0.5);
  display: block;
}

.View.view.ads-menu .app-aside .go-option {
  gap: var(--gap);
}

.View.view.ads-menu .app-aside .go-option:hover {
  color: var(--primary-color);
}

.View.view.ads-menu .app-aside .go-option go-icon {
  font-size: 150%;
}

.View.view.ads-menu .ViewContent {
  min-height: 256px;
}

body .inputbg,
body [inputbg],
body .go-input .input,
body go-input .input {
  box-shadow: none;
}

body .go-input .input[name="name"],
body go-input .input[name="name"] {
  font-weight: bold;
}

.ck-voice-label,
.ck-powered-by {
  display: none !important;
}

.ck-editor {
  --ck-border-radius: var(--input-border-radius, 0.375rem);
  border-radius: var(--ck-border-radius);
  max-width: calc(100vw - calc(var(--gap) * 2));
  margin: calc(var(--gap) * 0.5) 0 0 0;
}

.pageMain .title-section {
  line-height: 1.1;
}

.pageMain go-fileimage img {
  max-height: 320px;
}

.body .ck.ck-editor {
  position: relative;
  margin-top: calc(var(--gap) * 0.5);
}

go-items .adsItem:not(:last-child) {
  border-bottom: 1px solid var(--border-color);
}

.adsItem,
.adsItem .contain,
.adsItem .details {
  width: 100%;
}

.adsItem,
.adsItem .contain {
  display: flex;
  align-items: center;
}

.adsItem img {
  max-width: 72px;
}

.adsItem .title {
  font-size: calc(var(--gap) * 1.5);
  font-weight: 900;
  line-height: 1.1;
}

.adsItem .site,
.adsItem .description {
  opacity: 0.7;
}

.adsItem .adsFoot {
  font-size: 85%;
}

.adsItem .adsFoot {
  margin: calc(var(--gap) * 0.5) 0 0 0;
}

.adsItem,
.siteItem {
  cursor: pointer;
}

.siteItem {
  display: inline-flex;
}

.siteItem .contain {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: calc(var(--gap) * 0.5);
}

.siteItem img {
  max-width: 72px;
  aspect-ratio: 1/1;
  margin: auto;
}

.siteItem:active img {
  opacity: 0.5;
}

.siteSelect go-items,
app-main > go-items {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.adsItem:active {
  background-color: var(--go-option-hover-background);
}

.mainContent > form {
  padding: var(--gap);
}

input[name="config.price"] {
  font-weight: bold;
}

input-images,
input-images {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--gap);
  margin: calc(var(--gap) * 0.5) 0 0 0;
}

input-images .picture {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: var(--input-border-radius, 0.375rem);
  background-color: var(--input-background, rgba(238, 242, 251, 0.3));
  object-fit: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  border: solid 1px var(--border-color);
}

input-images .picture:active {
  opacity: 0.5;
}

input-images .picture:hover {
  border: solid 1px var(--primary-color);
}

input-images .picture img {
  max-height: 100%;
}

.View.view.preview img {
  display: flex;
  object-fit: contain;
  margin: auto;
}

.View.view.preview .ViewHeader {
  background: linear-gradient(180deg, #000000, transparent);
  margin-bottom: calc(0px - var(--content-header-height));
  color: #fff;
}

app-aside go-options-content {
  gap: calc(var(--gap) * 0.5);
}

.View.page go-view-header-left {
  flex-direction: row-reverse;
}

.View.page .appHeaderLeft {
  display: none;
  align-items: center;
}

app-aside .appAsideCredits {
  display: flex;
  gap: calc(var(--gap) * 1.5);
  align-items: center;
  justify-content: space-between;
  padding: var(--gap) 0 0 0;
  margin: auto 0 0 0;
  font-size: 90%;
  opacity: 0.7;
  border-top: solid 1px var(--border-color);
}

.feed-form {
  padding: var(--gap);
}

.tab-body {
  display: none;
  margin: calc(var(--gap) * 1) 0 0 0;
  flex-direction: column;
  gap: calc(var(--gap) * 1);
  padding: var(--gap) 0 0 0;
  border-top: solid 1px var(--border-color);
}

.tab-body.enabled {
  display: flex;
}

@media (min-width: 768px) {
  .ViewHeader go-button:hover {
    color: var(--primary-color);
  }

  .pageAside {
    display: flex;
  }

  .pageMain {
    padding: 0 0 0 var(--aside-width);
  }

  .title-section {
    padding: var(--gap) 0 calc(var(--gap) * 1.5) 0;
  }

  .adsItem:hover {
    background-color: var(--go-option-hover-background);
  }

  .mainContent > form {
    padding: var(--gap) 0;
  }

  .mainContent {
    padding: var(--gap);
  }

  .feed-form {
    padding: calc(var(--gap)) 0;
  }
}

@media (min-width: 1024px) {
  .View.page .appHeaderLeft {
    display: flex;
  }
}

@media (min-width: 1200px) {
  .main-panel {
    --panel-width: calc(var(--screen-width) - calc(var(--gap) * 4) - calc(var(--aside-width) + var(--main-width)));
    position: fixed;
    right: 0;
    overflow-y: auto;
    bottom: 0;
    width: var(--panel-width);
    top: var(--header-height);
    border-left: solid 1px var(--border-color);
    background-color: var(--theme-background);
    max-width: 320px;
  }

  .main-panel .container {
    padding: var(--gap);
  }

  .mainContent {
    padding: var(--gap) calc(var(--gap) * 2);
    max-width: var(--content-max-width);
  }
}
