.admin-live-toolbar {
  position: fixed;
  top: 14px;
  right: 14px;
  z-index: 9999;
  display: flex;
  gap: 8px;
  padding: 8px;
  border: 1px solid rgba(184, 229, 58, .45);
  border-radius: 8px;
  background: rgba(3, 27, 19, .94);
  box-shadow: 0 16px 45px rgba(0, 0, 0, .32);
  backdrop-filter: blur(14px);
}

.admin-live-toolbar button,
.admin-live-chip,
.admin-live-panel button,
.admin-live-panel input,
.admin-live-panel select {
  font: 800 12px/1 Inter, Arial, sans-serif;
}

.admin-live-toolbar button,
.admin-live-upload,
.admin-live-blog-add,
.admin-live-panel button {
  min-height: 36px;
  border: 1px solid rgba(184, 229, 58, .34);
  border-radius: 6px;
  padding: 0 12px;
  color: #fff;
  background: rgba(255, 255, 255, .08);
  cursor: pointer;
  text-transform: uppercase;
}

.admin-live-toolbar button[data-admin-action="save"] {
  background: linear-gradient(135deg, #6f982f, #96c93d);
}

.admin-live-toolbar button:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.admin-live-eye {
  width: 42px;
  padding: 0;
}

.admin-live-eye svg {
  display: block;
  width: 20px;
  height: 20px;
  fill: currentColor;
}

.admin-live-eye.is-active {
  color: #102018;
  background: linear-gradient(135deg, #b8e53a, #ffffff);
  box-shadow: 0 0 18px rgba(184, 229, 58, .34);
}

.admin-live-visit-panel {
  position: fixed;
  top: 72px;
  right: 14px;
  z-index: 9998;
  width: min(360px, calc(100vw - 28px));
  overflow: hidden;
  border: 1px solid rgba(184, 229, 58, .46);
  border-radius: 8px;
  color: #fff;
  background:
    linear-gradient(145deg, rgba(26, 62, 41, .96), rgba(3, 27, 19, .98)),
    rgba(3, 27, 19, .96);
  box-shadow: 0 22px 60px rgba(0, 0, 0, .38);
  backdrop-filter: blur(16px);
}

.admin-live-visit-panel[hidden] {
  display: none;
}

.admin-live-visit-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px;
  border-bottom: 1px solid rgba(184, 229, 58, .24);
  background: rgba(255, 255, 255, .04);
}

.admin-live-visit-head span {
  display: block;
  color: rgba(255, 255, 255, .66);
  font: 800 10px/1 Inter, Arial, sans-serif;
  text-transform: uppercase;
}

.admin-live-visit-head strong {
  display: block;
  margin-top: 5px;
  color: #b8e53a;
  font: 800 17px/1.15 "Playfair Display", Georgia, serif;
}

.admin-live-visit-head button {
  width: 34px;
  min-height: 34px;
  padding: 0;
  border: 1px solid rgba(184, 229, 58, .32);
  border-radius: 6px;
  color: #fff;
  background: rgba(255, 255, 255, .08);
  cursor: pointer;
  font: 800 20px/1 Inter, Arial, sans-serif;
}

.admin-live-visit-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  padding: 12px;
}

.admin-live-visit-summary div {
  min-width: 0;
  padding: 10px 8px;
  border: 1px solid rgba(184, 229, 58, .2);
  border-radius: 7px;
  background: rgba(0, 0, 0, .2);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07);
}

.admin-live-visit-summary strong {
  display: block;
  color: #fff;
  font: 800 18px/1 Inter, Arial, sans-serif;
}

.admin-live-visit-summary span {
  display: block;
  margin-top: 5px;
  color: rgba(255, 255, 255, .7);
  font: 800 10px/1 Inter, Arial, sans-serif;
  text-transform: uppercase;
}

.admin-live-months {
  display: grid;
  gap: 7px;
  max-height: min(46vh, 410px);
  overflow: auto;
  padding: 0 12px 12px;
}

.admin-live-month-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 10px;
  border: 1px solid rgba(184, 229, 58, .18);
  border-radius: 6px;
  background: rgba(255, 255, 255, .055);
}

.admin-live-month-row span {
  color: rgba(255, 255, 255, .86);
  font: 800 12px/1 Inter, Arial, sans-serif;
}

.admin-live-month-row strong {
  color: #b8e53a;
  font: 800 12px/1 Inter, Arial, sans-serif;
  white-space: nowrap;
}

.admin-live-visit-error {
  grid-column: 1 / -1;
  margin: 0;
  color: rgba(255, 255, 255, .78);
  font: 800 12px/1.4 Inter, Arial, sans-serif;
}

.admin-live-blog-add {
  position: sticky;
  top: 92px;
  z-index: 30;
  width: max-content;
  margin: 0 0 18px calc(50% + 36px);
  background: linear-gradient(135deg, #6f982f, #96c93d);
  box-shadow: 0 12px 26px rgba(126, 180, 48, .2);
}

.admin-live-formatbar {
  position: sticky;
  top: 84px;
  z-index: 31;
  display: flex;
  align-items: center;
  gap: 8px;
  width: max-content;
  max-width: 100%;
  margin: 0 0 14px calc(50% + 36px);
  padding: 8px;
  border: 1px solid rgba(184, 229, 58, .42);
  border-radius: 8px;
  background: rgba(3, 27, 19, .96);
  box-shadow: 0 14px 32px rgba(0, 0, 0, .28);
  overflow-x: auto;
}

.admin-live-formatbar button,
.admin-live-formatbar select {
  flex: 0 0 auto;
  min-height: 36px;
  border: 1px solid rgba(184, 229, 58, .34);
  border-radius: 6px;
  padding: 0 10px;
  color: #fff;
  background: rgba(255, 255, 255, .08);
  font: 800 12px/1 Inter, Arial, sans-serif;
}

.admin-live-formatbar select {
  min-width: 112px;
  color: #102018;
  background: #fff;
}

.admin-live-upload {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.admin-live-editing [contenteditable="true"],
.admin-live-editing .admin-live-image-path,
.admin-live-panel input,
.admin-live-panel select {
  outline: 2px solid rgba(184, 229, 58, .72);
  outline-offset: 3px;
}

.admin-live-image-path {
  display: block;
  width: calc(100% - 24px);
  margin: 12px;
  border: 1px solid rgba(184, 229, 58, .36);
  border-radius: 6px;
  padding: 10px;
  color: #102018;
  background: #fff;
}

.admin-live-row-actions {
  display: flex;
  gap: 8px;
  padding: 0 12px 14px;
  flex-wrap: wrap;
}

.admin-live-panel {
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 9998;
  display: none;
  width: min(980px, calc(100vw - 28px));
  max-height: min(72vh, 760px);
  overflow: auto;
  border: 1px solid rgba(184, 229, 58, .45);
  border-radius: 8px;
  padding: 14px;
  color: #fff;
  background: rgba(3, 27, 19, .96);
  box-shadow: 0 22px 60px rgba(0, 0, 0, .4);
}

.admin-live-panel.is-open {
  display: block;
}

.admin-live-panel-head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: -14px -14px 12px;
  padding: 14px;
  border-bottom: 1px solid rgba(184, 229, 58, .28);
  background: rgba(3, 27, 19, .98);
}

.admin-live-panel h2 {
  margin: 0;
  font-family: "Playfair Display", Georgia, serif;
  letter-spacing: 0;
}

.admin-live-panel-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

.admin-live-panel-actions [data-add-product] {
  background: linear-gradient(135deg, #6f982f, #96c93d);
}

.admin-live-product-filter {
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid rgba(184, 229, 58, .28);
  border-radius: 7px;
  background: rgba(255, 255, 255, .06);
}

.admin-live-product-filter label {
  display: grid;
  grid-template-columns: 150px minmax(180px, 320px);
  gap: 10px;
  align-items: center;
  color: rgba(255, 255, 255, .86);
  font: 800 12px/1.2 Inter, Arial, sans-serif;
}

.admin-live-product-filter select {
  width: 100%;
  min-height: 36px;
  border: 1px solid #cad9c3;
  border-radius: 5px;
  padding: 8px 10px;
  color: #102018;
  background: #fff;
}

.admin-live-minimize {
  min-width: 40px;
  padding-bottom: 7px;
  font-size: 18px;
  line-height: 1;
}

.admin-live-panel-tab {
  display: none;
}

.admin-live-panel.is-minimized {
  top: 78px;
  right: 14px;
  bottom: auto;
  width: min(560px, calc(100vw - 28px));
  max-height: none;
  overflow: visible;
  padding: 0;
  border-radius: 8px;
}

.admin-live-panel.is-minimized .admin-live-panel-head,
.admin-live-panel.is-minimized .admin-live-product-filter,
.admin-live-panel.is-minimized .admin-live-product-grid {
  display: none;
}

.admin-live-panel.is-minimized .admin-live-panel-tab {
  display: block;
  width: 100%;
  min-height: 14px;
  padding: 0;
  border-radius: 7px;
  color: transparent;
  background: linear-gradient(90deg, rgba(184, 229, 58, .75), rgba(255, 255, 255, .36), rgba(184, 229, 58, .75));
  box-shadow: 0 10px 30px rgba(0, 0, 0, .24);
}

.admin-live-panel.is-minimized .admin-live-panel-tab::after {
  content: "";
  display: block;
  width: 86px;
  height: 3px;
  margin: 5px auto 0;
  border-radius: 999px;
  background: rgba(3, 27, 19, .72);
}

.admin-live-product-grid {
  display: grid;
  gap: 8px;
}

.admin-live-product-row {
  display: grid;
  grid-template-columns: 150px 110px minmax(190px, 1fr) 90px 150px auto;
  gap: 8px;
  align-items: center;
}

.admin-live-product-row input,
.admin-live-product-row select {
  width: 100%;
  min-height: 38px;
  border: 1px solid #cad9c3;
  border-radius: 5px;
  padding: 8px 10px;
  color: #102018;
  background: #fff;
}

.admin-live-status {
  min-width: 190px;
  color: rgba(255, 255, 255, .78);
  align-self: center;
}

@media (max-width: 760px) {
  .admin-live-toolbar {
    left: 8px;
    right: 8px;
    top: auto;
    bottom: 8px;
    flex-wrap: wrap;
  }

  .admin-live-toolbar button {
    flex: 1;
  }

  .admin-live-status {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .admin-live-eye {
    flex: 0 0 48px;
  }

  .admin-live-visit-panel {
    top: auto;
    left: 8px;
    right: 8px;
    bottom: 118px;
    width: auto;
    max-height: calc(100vh - 150px);
  }

  .admin-live-visit-summary {
    grid-template-columns: repeat(2, 1fr);
  }

  .admin-live-months {
    max-height: 34vh;
  }

  .admin-live-panel {
    left: 8px;
    right: 8px;
    bottom: 76px;
    width: auto;
  }

  .admin-live-panel-head {
    display: grid;
  }

  .admin-live-panel-actions {
    display: grid;
    grid-template-columns: 1fr 44px;
  }

  .admin-live-product-filter label {
    grid-template-columns: 1fr;
  }

  .admin-live-panel.is-minimized {
    top: auto;
    left: 8px;
    right: 8px;
    bottom: 72px;
    width: auto;
  }

  .admin-live-blog-add {
    position: static;
    width: 100%;
    margin: 0 0 14px;
  }

  .admin-live-formatbar {
    position: sticky;
    top: 8px;
    width: 100%;
    margin: 0 0 12px;
  }

  .admin-live-product-row {
    grid-template-columns: 1fr;
    padding: 10px;
    border: 1px solid rgba(184, 229, 58, .24);
    border-radius: 8px;
  }
}