/*
  SamudraHost custom overrides.

  File ini selalu diload paling akhir di setiap halaman panel.
  Tambahkan CSS custom di bawah ini. Jika perlu menimpa style inline atau
  style yang sangat spesifik, pakai !important pada rule yang kamu tulis.
*/

.sc-footer .btn,
.detail-actions .btn {
  font-weight: 600 !important;
  letter-spacing: -0.1px !important;
}

.detail-panel .detail-actions {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  gap: 10px !important;
}

.detail-panel .detail-actions .btn {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;
  padding: 0 14px !important;
  font-size: 12px !important;
  line-height: 1.25 !important;
  text-align: center !important;
  white-space: normal !important;
}

.copy-btn {
  font-size: 12px !important;
  line-height: 1.2 !important;
}

.notice-box {
  font-size: 12.5px !important;
  overflow-wrap: anywhere !important;
}

.sc-footer .btn {
  min-height: 40px !important;
  font-size: 11.5px !important;
}

.quick-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  margin-bottom: 0 !important;
}

.quick-btn {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  min-height: 52px !important;
  padding: 0 16px !important;
  border-radius: 14px !important;
}

.quick-btn-icon {
  display: none !important;
}

.quick-btn-label {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--ink) !important;
  letter-spacing: 0 !important;
}

html[data-theme="dark"] .quick-btn {
  background: linear-gradient(135deg, rgba(11, 23, 38, .94), rgba(7, 17, 31, .9)) !important;
  border-color: rgba(127, 178, 236, .24) !important;
}

html[data-theme="dark"] .quick-btn-label {
  color: var(--ink) !important;
}

@media (max-width: 780px) {
  .sc-footer .btn {
    min-height: 38px !important;
    font-size: 10.5px !important;
  }

  html:has(body.ticket-chat-open),
  body.ticket-chat-open {
    width: 100% !important;
    height: var(--ticket-vh, 100dvh) !important;
    max-height: var(--ticket-vh, 100dvh) !important;
    overflow: hidden !important;
  }

  body.ticket-chat-open {
    position: fixed !important;
    top: var(--ticket-offset-top, 0px) !important;
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
  }

  body.ticket-chat-open main {
    height: var(--ticket-vh, 100dvh) !important;
    max-height: var(--ticket-vh, 100dvh) !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.ticket-chat-open .content {
    height: calc(var(--ticket-vh, 100dvh) - 58px) !important;
    max-height: calc(var(--ticket-vh, 100dvh) - 58px) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 10px !important;
  }

  body.ticket-chat-open .ticket-detail-panel,
  body.ticket-chat-open .ticket-detail-panel > div {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.ticket-chat-open .messages-area {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body.ticket-chat-open .reply-box {
    flex: 0 0 auto !important;
    position: relative !important;
    bottom: auto !important;
    margin: 0 !important;
    padding: 8px 10px max(8px, env(safe-area-inset-bottom)) !important;
    background: var(--paper) !important;
    border-top: 1px solid var(--border) !important;
    z-index: 40 !important;
  }

  body.ticket-chat-open .reply-composer {
    min-height: 44px !important;
  }
}

.btn-google{
  display: none !important;
}

h1.hero-title {
  box-sizing: border-box;
  color: #FFFFFF;
  font-family: Poppins, sans-serif;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.35;
  margin: 0;
  max-width: 280px;
  padding: 0;
}

div.user-email {
  box-sizing: border-box;
  color: rgba(255, 255, 255, 0.72);
  display: block;
  font-family: Poppins, sans-serif;
  margin: 0;
  max-width: 100%;
  overflow: hidden;
  padding: 0;
  text-overflow: ellipsis;
  text-wrap-mode: nowrap;
  white-space-collapse: collapse;
  font-size: 14px;
}

div.wallet-card {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-image: none 100% 1 0 stretch;
  border-radius: 14px;
  box-sizing: border-box;
  color: #FFFFFF;
  font-family: Poppins, sans-serif;
  margin: 0;
  overflow: hidden;
  padding: 22px;
  position: relative;
  background-image: linear-gradient(to right, rgb(55, 65, 81), rgb(17, 24, 39), rgb(0, 0, 0));
  background-repeat: initial;
  font-weight: 600;
}

.btn-pdf{
    display: none !important;
}