/* ShipStore Gmail-like UI */
.ss-bg { background: #f6f8fc; }
.ss-topbar { background: #ffffff; }
.ss-logo { font-weight: 800; letter-spacing: .2px; }
.ss-sub { color: #6c757d; font-weight: 600; }
.ss-user { max-width: 220px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.ss-search { width: min(720px, 55vw); }
.ss-search-input { border-radius: 999px; padding-left: 14px; }
.ss-search-btn { border-radius: 999px; }

.ss-sidebar { background: #ffffff; min-height: calc(100vh - 56px); }
.ss-compose { border-radius: 999px; font-weight: 700; }

.ss-main { min-height: calc(100vh - 56px); }

.ss-card { border-radius: 16px; border: 1px solid rgba(0,0,0,.08); box-shadow: 0 1px 2px rgba(0,0,0,.03); }
.ss-table th, .ss-table td { vertical-align: middle; }
.ss-row { cursor: pointer; }
.ss-row:hover { background: #f1f3f4; }
.ss-unread td { background: #ffffff; }
.ss-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #0d6efd;
  margin-right: 8px;
  position: relative; top: -1px;
}
.ss-addr { word-break: break-word; }
.ss-body pre { white-space: pre-wrap; word-break: break-word; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }


@media (max-width: 767.98px){
  .btn-sm{ padding: .45rem .65rem; font-size: .95rem; }
  .ss-sidebar{ min-height: auto; }
  .ss-user{ max-width: 140px; }
}


/* Mobile bottom action bar */
.ss-bottombar{
  position: fixed;
  left: 0; right: 0; bottom: 0;
  height: 56px;
  background: #ffffff;
  border-top: 1px solid rgba(0,0,0,.08);
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 6px 10px;
  z-index: 1030;
}
.ss-bottombar .ss-ba{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 44px; height: 44px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  background: #f8f9fa;
  text-decoration: none;
  font-size: 18px;
}
.ss-bottombar .ss-ba--primary{
  background: #0d6efd;
  color: #fff;
  border-color: #0d6efd;
}

@media (max-width: 767.98px){
  .ss-main{ padding-bottom: 70px; }
}
