/* BobaLive Web Console UI system v3 — local workbench, 2026-08-13. */
:root {
  --ui-bg: #12161d;
  --ui-sidebar: #101315;
  --ui-surface: #171c23;
  --ui-surface-raised: #1b2028;
  --ui-input: #0f141a;
  --ui-line: rgba(211, 162, 76, .15);
  --ui-line-strong: rgba(211, 162, 76, .28);
  --ui-gold: #d3a24c;
  --ui-gold-soft: #efd39b;
  --ui-text: #f2eee7;
  --ui-muted: #9ca7b4;
  --ui-success: #52c986;
  --ui-danger: #e1625c;
  --ui-info: #62b9df;
  --ui-radius: 16px;
  --ui-control: 44px;
}

html,
body {
  color: var(--ui-text);
  background: var(--ui-bg);
  font-size: 16px;
}

.main-panel {
  background: var(--ui-bg) !important;
}

.view-panel {
  min-width: 0;
  width: 100%;
  max-width: none;
}

.view-panel > .page-header {
  min-height: 78px;
  margin: 0 0 16px;
  padding: 4px 2px 16px !important;
  border-bottom: 1px solid var(--ui-line);
}

.view-panel > .page-header .page-kicker {
  display: none;
}

.view-panel > .page-header h1 {
  margin: 0;
  color: var(--ui-text);
  font-size: clamp(28px, 2.1vw, 36px);
  line-height: 1.12;
  letter-spacing: -.025em;
}

.view-panel > .page-header .status-text,
.view-panel > .page-header .facebook-message-settings-subtitle,
.view-panel > .page-header .trends-subtitle {
  max-width: 760px;
  margin: 7px 0 0;
  color: var(--ui-muted) !important;
  font-size: 14px;
  line-height: 1.55;
}

.content-card,
.platform-connection-card,
.platform-connection-note,
.customer-list-card,
.customer-detail-card,
.product-category-card,
.product-detail-card,
.trends-section,
.lottery-card {
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-radius) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

.ghost-btn,
.primary-btn,
.customer-select,
input,
select {
  min-height: var(--ui-control);
  font-size: 14px;
}

.ghost-btn,
.primary-btn {
  padding: 9px 16px;
  border-radius: 11px !important;
  font-weight: 750;
}

.ghost-btn {
  border-color: var(--ui-line-strong) !important;
  background: rgba(255, 255, 255, .015) !important;
  color: var(--ui-gold-soft) !important;
}

.ghost-btn:hover {
  border-color: rgba(229, 181, 90, .5) !important;
  background: rgba(211, 162, 76, .08) !important;
}

.primary-btn {
  border-color: #b8842e !important;
  background: linear-gradient(180deg, #d7a84f, #b67d24) !important;
  color: #171108 !important;
}

.field > span,
.workbench-date-field > span,
.facebook-message-template-label {
  margin-bottom: 7px;
  color: #c5cdd7 !important;
  font-size: 13px;
  font-weight: 700;
}

input,
select,
textarea,
.customer-select {
  border: 1px solid rgba(145, 165, 190, .22) !important;
  border-radius: 11px !important;
  background: var(--ui-input) !important;
  color: var(--ui-text) !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: rgba(211, 162, 76, .62) !important;
  box-shadow: 0 0 0 3px rgba(211, 162, 76, .10) !important;
  outline: none;
}

.customer-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 9px;
}

.status-text {
  color: var(--ui-muted);
  font-size: 13px;
  line-height: 1.5;
}

.empty-state {
  color: #8793a1 !important;
  font-size: 14px;
}

/* Platform settings */
#facebook-pages-view,
#facebook-message-settings-view,
#tiktok-settings-view {
  max-width: 1240px;
}

#facebook-pages-view .facebook-pages-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, .8fr) minmax(360px, 1.2fr);
  gap: 18px;
  margin-bottom: 12px;
  padding: 14px 18px !important;
  background: rgba(98, 185, 223, .055) !important;
  border-color: rgba(98, 185, 223, .18) !important;
}

#facebook-pages-view .facebook-pages-card {
  min-height: 360px;
  padding: 18px !important;
}

#facebook-pages-view .facebook-pages-summary {
  margin-bottom: 12px;
}

#facebook-pages-view .facebook-page-item {
  min-height: 66px;
  border-color: rgba(145, 165, 190, .16) !important;
  background: rgba(255, 255, 255, .015) !important;
}

#facebook-message-settings-view .facebook-message-settings-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 14px;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

#facebook-message-settings-view .facebook-message-setting-block,
#facebook-message-settings-view .facebook-message-variables {
  margin: 0;
  padding: 20px;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-radius);
  background: var(--ui-surface) !important;
}

#facebook-message-settings-view .facebook-message-variables,
#facebook-message-settings-view #facebook-message-settings-status {
  grid-column: 1 / -1;
}

#facebook-message-settings-view .facebook-message-template {
  min-height: 160px;
  resize: vertical;
}

#facebook-message-settings-view .facebook-message-setting-block:nth-child(2) .facebook-message-template {
  min-height: 160px;
}

#facebook-message-settings-view .facebook-message-variable-list {
  grid-template-columns: max-content minmax(0, 1fr) max-content minmax(0, 1fr);
  gap: 10px 14px;
}

#tiktok-settings-view .platform-connection-grid-single {
  max-width: 920px;
  margin: 0;
}

#tiktok-settings-view .platform-connection-card {
  padding: 22px !important;
}

#tiktok-settings-view .platform-connection-card .field {
  margin-top: 18px;
}

#tiktok-settings-view .platform-toggle {
  min-height: 46px;
  margin-top: 12px;
  border-color: rgba(98, 185, 223, .22);
  background: rgba(98, 185, 223, .05);
}

#tiktok-settings-view .platform-connection-note {
  max-width: 920px;
  margin-top: 14px;
  padding: 18px 22px !important;
}

/* Customer and order workbench */
#customers-view,
#trends-view,
#products-view {
  max-width: none;
}

#customers-view .customer-toolbar,
#products-view .customer-toolbar {
  display: grid !important;
  grid-template-columns: minmax(0, 1.55fr) minmax(340px, .85fr);
  gap: 12px;
  margin-bottom: 14px;
  padding: 14px !important;
}

#customers-view .customer-search-row,
#products-view .product-search-row {
  gap: 10px;
}

#customers-view .customer-summary-strip,
#trends-view .trends-summary-band {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 14px;
  padding: 0;
  border: 0;
}

#trends-view .trends-summary-band {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#customers-view .customer-summary-cell,
#trends-view .trends-summary-item {
  position: relative;
  min-height: 88px;
  padding: 16px 18px !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: 14px;
  background: linear-gradient(180deg, var(--ui-surface-raised), var(--ui-surface));
}

#customers-view .customer-summary-cell::before,
#trends-view .trends-summary-item::before {
  display: none !important;
}

#customers-view .customer-summary-cell span,
#trends-view .trends-summary-item span {
  color: var(--ui-muted);
  font-size: 12px;
}

#customers-view .customer-summary-cell strong,
#trends-view .trends-summary-item strong {
  display: block;
  margin-top: 5px;
  color: var(--ui-gold-soft);
  font-size: 30px;
  line-height: 1;
}

#customers-view .customer-layout {
  grid-template-columns: minmax(620px, 1.55fr) minmax(320px, .72fr);
  gap: 14px;
}

#customers-view .customer-list-card,
#customers-view .customer-detail-card,
#products-view .product-category-card,
#products-view .product-detail-card {
  overflow: hidden;
}

#customers-view .customer-list-head,
#products-view .customer-list-head {
  min-height: 58px;
  padding: 15px 18px;
  border-bottom: 1px solid var(--ui-line);
}

#customers-view .customer-table-head,
#products-view .product-table-head {
  min-height: 42px;
  padding: 12px 18px;
  color: #8793a1;
  font-size: 11px;
  letter-spacing: .04em;
}

#customers-view .customer-record-item,
#products-view .product-category-item {
  min-height: 74px;
  padding: 13px 18px !important;
}

#customers-view .customer-record-item.active,
#products-view .product-category-item.active {
  border-left-color: var(--ui-gold) !important;
  background: rgba(211, 162, 76, .075) !important;
}

#customers-view .customer-detail-card,
#products-view .product-detail-card {
  position: sticky;
  top: 12px;
  align-self: start;
  max-height: calc(100vh - 36px);
  overflow-y: auto;
}

#trends-view .trends-section {
  margin-bottom: 14px;
  padding: 18px !important;
}

#trends-view .trends-section-head {
  margin-bottom: 14px;
}

#trends-view .trends-chart {
  min-height: 260px;
}

#trends-view .trends-table-wrap {
  border: 1px solid rgba(145, 165, 190, .13);
  border-radius: 12px;
}

#trends-view .trends-table th {
  height: 44px;
  color: #8f9aa8;
  background: rgba(255, 255, 255, .018);
}

#trends-view .trends-table td {
  min-height: 52px;
  padding-top: 14px;
  padding-bottom: 14px;
}

#products-view .product-layout {
  grid-template-columns: minmax(560px, 1.45fr) minmax(340px, .75fr);
  gap: 14px;
}

/* Live interaction tools */
#lottery-view {
  max-width: 1240px;
}

#lottery-view .lottery-card {
  padding: 18px !important;
}

#lottery-view .lottery-stage {
  min-height: 188px;
  border: 1px solid rgba(211, 162, 76, .2) !important;
  border-radius: 15px;
  background: radial-gradient(circle at 50% 20%, rgba(211, 162, 76, .12), transparent 48%), #11161c !important;
}

#lottery-view .lottery-marquee-name,
#lottery-view .lottery-winner-display strong {
  color: var(--ui-gold-soft) !important;
  font-size: clamp(30px, 4vw, 54px);
}

#lottery-view .lottery-control-grid {
  gap: 12px;
  margin-top: 16px;
}

#lottery-view .lottery-option-row {
  gap: 10px;
  padding: 14px 0;
}

#lottery-view .lottery-stat-grid {
  gap: 10px;
}

#lottery-view .summary-card {
  min-height: 84px;
  border: 1px solid var(--ui-line);
  border-radius: 14px;
  background: var(--ui-surface-raised);
}

#lottery-view .lottery-layout {
  gap: 12px;
}

#lottery-view .lottery-list-panel {
  overflow: hidden;
  border: 1px solid var(--ui-line);
  border-radius: 14px;
  background: #141920;
}

#lottery-view .lottery-list-head {
  min-height: 54px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--ui-line);
}

.qr-modal {
  padding: 20px;
  background: rgba(5, 8, 12, .78) !important;
  backdrop-filter: blur(8px);
}

.qr-card {
  width: min(460px, 100%);
  padding: 22px !important;
  border: 1px solid var(--ui-line-strong) !important;
  border-radius: 18px !important;
  background: var(--ui-surface) !important;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .48) !important;
}

.qr-head {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--ui-line);
}

.qr-head .page-kicker {
  color: var(--ui-gold);
}

.qr-preview {
  width: min(280px, 100%);
  margin: 18px auto;
  padding: 14px;
  border: 1px solid rgba(211, 162, 76, .22);
  border-radius: 16px;
  background: #fff !important;
}

/* Narrow desktop */
@media (max-width: 1180px) {
  #facebook-message-settings-view .facebook-message-settings-card {
    grid-template-columns: 1fr;
  }

  #facebook-message-settings-view .facebook-message-variables,
  #facebook-message-settings-view #facebook-message-settings-status {
    grid-column: auto;
  }

  #facebook-message-settings-view .facebook-message-variable-list {
    grid-template-columns: max-content minmax(0, 1fr);
  }

  #customers-view .customer-toolbar,
  #products-view .customer-toolbar {
    grid-template-columns: 1fr;
  }

  #customers-view .customer-layout,
  #products-view .product-layout {
    grid-template-columns: 1fr;
  }

  #customers-view .customer-detail-card,
  #products-view .product-detail-card {
    position: static;
    max-height: none;
  }
}

@media (max-width: 1350px) {
  #customers-view .customer-toolbar,
  #products-view .customer-toolbar {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #customers-view .customer-date-row,
  #products-view .product-date-row {
    justify-content: end;
  }
}

/* Mobile */
@media (max-width: 760px) {
  html,
  body {
    font-size: 15px;
  }

  .view-panel > .page-header {
    display: flex;
    min-height: 0;
    padding: 4px 0 14px !important;
  }

  .view-panel > .page-header h1 {
    font-size: 27px;
  }

  .customer-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .customer-actions .ghost-btn,
  .customer-actions .primary-btn {
    flex: 1 1 130px;
  }

  #facebook-pages-view .facebook-pages-toolbar {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  #facebook-message-settings-view .facebook-message-setting-block,
  #facebook-message-settings-view .facebook-message-variables,
  #tiktok-settings-view .platform-connection-card,
  #tiktok-settings-view .platform-connection-note,
  #lottery-view .lottery-card {
    padding: 14px !important;
  }

  #facebook-message-settings-view .facebook-message-setting-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }

  #facebook-message-settings-view .facebook-message-toggle {
    align-self: stretch;
    justify-content: center;
  }

  #customers-view .customer-summary-strip,
  #trends-view .trends-summary-band {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #customers-view .customer-summary-cell,
  #trends-view .trends-summary-item {
    min-height: 76px;
    padding: 13px !important;
  }

  #customers-view .customer-summary-cell strong,
  #trends-view .trends-summary-item strong {
    font-size: 26px;
  }

  #customers-view .customer-search-row,
  #customers-view .customer-date-row,
  #products-view .product-search-row,
  #products-view .product-date-row {
    display: grid !important;
    grid-template-columns: 1fr;
    width: 100%;
  }

  #customers-view .customer-search-row > *,
  #products-view .product-search-row > * {
    width: 100% !important;
  }

  #customers-view .customer-table-head,
  #products-view .product-table-head {
    display: none;
  }

  #trends-view .trends-summary-item:last-child {
    grid-column: 1 / -1;
  }

  #trends-view .trends-section {
    padding: 14px !important;
  }

  #trends-view .trends-chart {
    min-height: 210px;
  }

  #lottery-view .lottery-stage {
    min-height: 150px;
  }

  #lottery-view .lottery-control-grid,
  #lottery-view .lottery-stat-grid,
  #lottery-view .lottery-layout {
    grid-template-columns: 1fr;
  }

  #lottery-view .lottery-option-row {
    align-items: stretch;
    flex-direction: column;
  }

  #lottery-view .lottery-option-row .ghost-btn,
  #lottery-view .lottery-option-row .primary-btn {
    width: 100%;
  }

  .qr-modal {
    align-items: flex-end;
    padding: 0;
  }

  .qr-card {
    width: 100%;
    max-height: 92dvh;
    overflow-y: auto;
    border-radius: 20px 20px 0 0 !important;
  }
}

/* Precision pass: match the selected borderless list + floating detail concept. */
#customers-view > .page-header,
#products-view > .page-header {
  min-height: 66px;
  margin-bottom: 12px;
  padding-bottom: 10px !important;
  border-bottom: 0 !important;
}

#customers-view .customer-actions,
#products-view .customer-actions {
  gap: 8px;
}

#customers-view .customer-actions .ghost-btn,
#products-view .customer-actions .ghost-btn {
  min-height: 40px;
  padding: 8px 14px;
}

#customers-view .customer-summary-strip {
  margin-bottom: 18px;
}

#customers-view .customer-summary-cell {
  display: grid !important;
  align-content: center;
  gap: 6px;
}

#customers-view .customer-summary-cell span {
  font-size: 12px;
  line-height: 1;
}

#customers-view .customer-summary-cell strong {
  margin: 0;
  font-size: 28px !important;
  line-height: 1;
}

#customers-view .customer-layout.drawer-open,
#products-view .product-layout {
  grid-template-columns: minmax(520px, 1.68fr) minmax(320px, .86fr);
}

#customers-view .customer-layout:not(.drawer-open) {
  grid-template-columns: minmax(0, 1fr) !important;
}

#customers-view .customer-table-head,
#customers-view .customer-record-item {
  grid-template-columns: 42px minmax(0, 2.2fr) 92px 128px 150px !important;
  gap: 12px !important;
}

#customers-view .customer-table-head::before,
#products-view .product-table-head::before {
  content: "";
}

#customers-view .customer-record-item {
  min-height: 64px;
  padding: 9px 14px !important;
}

#customers-view .customer-record-item::before,
#products-view .product-category-item::before {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 12px;
  color: #ecd096;
  background: rgba(211, 162, 76, .12);
  font-size: 15px;
  font-weight: 800;
  line-height: 1;
}

#customers-view .customer-record-item::before {
  content: attr(data-customer-initial);
}

#customers-view .customer-record-name {
  font-size: 14px;
}

#customers-view .customer-record-preview,
#customers-view .customer-record-sub {
  font-size: 11px;
}

#customers-view .customer-record-preview {
  max-width: 310px;
}

#customers-view .customer-record-side {
  gap: 3px;
}

#products-view .product-table-head,
#products-view .product-category-item {
  grid-template-columns: 42px minmax(0, 1.55fr) minmax(130px, .82fr) 132px !important;
  gap: 12px !important;
}

#products-view .product-category-item {
  min-height: 64px;
  padding: 9px 14px !important;
}

#products-view .product-category-item::before {
  content: attr(data-product-initial);
  background: rgba(255, 255, 255, .045);
  color: #e4c987;
}

#products-view .product-category-main strong {
  font-size: 14px;
  line-height: 1.25;
}

#products-view .product-category-main span,
#products-view .product-category-customers,
#products-view .product-category-time {
  font-size: 11px;
}

#customers-view .customer-record-item.active,
#products-view .product-category-item.active {
  padding-left: 14px !important;
}

#customers-view .customer-detail-card,
#products-view .product-detail-card {
  max-height: calc(100vh - 150px);
}

#customers-view .customer-drawer-head,
#products-view .product-detail-head {
  padding-bottom: 14px;
  border-bottom: 0 !important;
}

#customers-view .customer-detail-tabs {
  gap: 14px;
  margin: 4px 0 12px;
}

#customers-view .customer-tab-btn {
  padding-top: 9px;
  padding-bottom: 9px;
}

#customers-view .customer-drawer-body,
#products-view .product-category-detail {
  font-size: 13px;
}

#products-view .product-detail-head h3 {
  font-size: 22px;
  line-height: 1.25;
}

#products-view .product-detail-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 8px 0 14px;
  padding: 10px 0 !important;
  background: rgba(255, 255, 255, .018);
  border-radius: 12px;
}

#products-view .product-detail-stats .mini-stat {
  display: grid;
  justify-items: center;
  gap: 5px;
  text-align: center;
}

#products-view .product-detail-stats .mini-stat strong {
  font-size: 16px;
}

#products-view .product-buyer-item {
  min-height: 54px;
}

@media (max-width: 1180px) {
  #customers-view .customer-layout.drawer-open,
  #products-view .product-layout {
    grid-template-columns: 1fr;
  }

  #customers-view .customer-detail-card,
  #products-view .product-detail-card {
    position: static;
    max-height: none;
  }
}

@media (max-width: 760px) {
  #customers-view .customer-record-item,
  #products-view .product-category-item {
    grid-template-columns: 38px minmax(0, 1fr) auto !important;
    gap: 10px !important;
  }

  #customers-view .customer-record-item::before,
  #products-view .product-category-item::before {
    grid-row: 1 / span 2;
    width: 34px;
    height: 34px;
  }

  #customers-view .customer-record-meta,
  #products-view .product-category-customers {
    grid-column: 2;
  }

  #customers-view .customer-record-side,
  #products-view .product-category-time {
    grid-column: 3;
    grid-row: 1 / span 2;
  }
}

/* Customer + product workbench refinement
   Direction: borderless data canvas with one floating detail surface. */
#customers-view .customer-toolbar,
#products-view .customer-toolbar {
  padding: 0 0 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#customers-view .customer-summary-strip {
  gap: 0;
  padding: 8px 10px !important;
  border: 0 !important;
  border-radius: 14px;
  background: rgba(255, 255, 255, .022);
}

#customers-view .customer-summary-cell {
  min-height: 72px;
  padding: 12px 18px !important;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
}

#customers-view .customer-summary-cell + .customer-summary-cell {
  padding-left: 18px !important;
}

#customers-view .customer-summary-cell + .customer-summary-cell::before {
  display: none !important;
}

#customers-view .customer-layout,
#customers-view .customer-layout.drawer-open,
#products-view .product-layout {
  gap: 22px;
}

#customers-view .customer-list-card,
#products-view .product-category-card {
  overflow: visible;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#customers-view .customer-list-head,
#products-view .customer-list-head {
  min-height: 48px;
  padding: 0 4px 12px !important;
  border: 0 !important;
}

#customers-view .customer-table-head,
#products-view .product-table-head {
  min-height: 38px;
  margin: 0 0 6px;
  padding: 9px 14px;
  border: 0 !important;
  border-radius: 10px;
  background: rgba(255, 255, 255, .018);
}

#customers-view .customer-record-list,
#products-view .product-category-list {
  display: grid;
  gap: 4px;
}

#customers-view .customer-record-item,
#products-view .product-category-item {
  margin: 0;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  transition: background-color .16s ease, transform .16s ease;
}

#customers-view .customer-record-item:hover,
#products-view .product-category-item:hover {
  background: rgba(255, 255, 255, .032) !important;
}

#customers-view .customer-record-item.active,
#products-view .product-category-item.active {
  padding-left: 18px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: linear-gradient(90deg, rgba(211, 162, 76, .17), rgba(211, 162, 76, .055)) !important;
  box-shadow: inset 3px 0 0 rgba(226, 179, 92, .82) !important;
}

#customers-view .customer-detail-card,
#products-view .product-detail-card {
  padding: 22px !important;
  border: 1px solid rgba(255, 255, 255, .055) !important;
  border-radius: 18px !important;
  background: rgba(27, 32, 40, .96) !important;
  box-shadow: 0 20px 46px rgba(0, 0, 0, .28) !important;
  backdrop-filter: blur(14px);
  scrollbar-width: thin;
  scrollbar-color: rgba(211, 162, 76, .32) transparent;
}

#customers-view .customer-detail-card::-webkit-scrollbar,
#products-view .product-detail-card::-webkit-scrollbar {
  width: 7px;
}

#customers-view .customer-detail-card::-webkit-scrollbar-track,
#products-view .product-detail-card::-webkit-scrollbar-track {
  background: transparent;
}

#customers-view .customer-detail-card::-webkit-scrollbar-thumb,
#products-view .product-detail-card::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(211, 162, 76, .28);
}

#customers-view .customer-detail-tabs,
#products-view .product-detail-stats,
#products-view .product-detail-alerts {
  border: 0 !important;
}

#customers-view .customer-tab-panel .detail-block,
#customers-view .customer-tab-panel .mini-stat,
#customers-view .product-summary-item,
#customers-view .timeline-item,
#products-view .product-buyer-item,
#products-view .product-buyer-order {
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
}

#customers-view .customer-tab-panel .detail-block,
#customers-view .product-summary-item,
#customers-view .timeline-item {
  padding-left: 0;
  padding-right: 0;
}

#products-view .product-buyer-list {
  display: grid;
  gap: 3px;
  border: 0 !important;
}

#products-view .product-buyer-item {
  padding: 12px 10px !important;
}

#products-view .product-buyer-item:hover {
  background: rgba(255, 255, 255, .03) !important;
}

#products-view .product-buyer-item.active {
  padding-left: 12px !important;
  background: rgba(211, 162, 76, .09) !important;
  box-shadow: inset 3px 0 0 rgba(226, 179, 92, .72) !important;
}

@media (max-width: 1180px) {
  #customers-view .customer-layout.drawer-open,
  #products-view .product-layout {
    gap: 16px;
  }

  #customers-view .customer-detail-card,
  #products-view .product-detail-card {
    padding: 18px !important;
  }
}

@media (max-width: 760px) {
  #customers-view .customer-toolbar,
  #products-view .customer-toolbar {
    padding-bottom: 12px !important;
  }

  #customers-view .customer-summary-strip {
    gap: 6px;
    padding: 6px !important;
    background: rgba(255, 255, 255, .018);
  }

  #customers-view .customer-summary-cell {
    min-height: 66px;
    padding: 10px 12px !important;
    border-radius: 10px;
    background: rgba(255, 255, 255, .018) !important;
  }

  #customers-view .customer-record-item.active,
  #products-view .product-category-item.active {
    padding-left: 14px !important;
  }

  #customers-view .customer-detail-card,
  #products-view .product-detail-card {
    position: static;
    max-height: none;
    margin-top: 8px;
    padding: 16px !important;
    border-color: rgba(255, 255, 255, .045) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .2) !important;
  }
}