/* ============================================================
   MONIKA+ Public layout — modern, no heavy sidebar chrome
   Keep: monika image identity + chat button caption
   ============================================================ */
:root {
  --pk: #6D6CE9;
  --pk2: #5b5ad6;
  --pk-text: #1f2430;
  --pk-muted: #5b6172;
  --pk-bg: #f3f4fb;
}

body.compact-wrapper, body.mk-public-body {
  background: var(--pk-bg) !important;
  color: var(--pk-text) !important;
  overflow-x: hidden !important;
}

/* Hide classic sidebar chrome; use identity rail instead */
body.mk-public-body .page-wrapper.compact-wrapper .page-body-wrapper .sidebar-wrapper {
  width: 280px !important;
  background: linear-gradient(180deg, #4a49c4 0%, #6D6CE9 100%) !important;
  box-shadow: 8px 0 30px rgba(109,108,233,.2) !important;
}
body.mk-public-body .page-wrapper.compact-wrapper .page-body-wrapper .page-body {
  margin-left: 280px !important;
  background: var(--pk-bg) !important;
  min-height: 100vh;
}
@media (max-width: 991.98px) {
  body.mk-public-body .page-wrapper.compact-wrapper .page-body-wrapper .page-body {
    margin-left: 0 !important;
  }
}

body.mk-public-body .page-header {
  background: #fff !important;
  border-bottom: 1px solid #e4e6f2 !important;
  box-shadow: 0 4px 16px rgba(31,36,48,.05) !important;
}

/* Public identity panel in sidebar */
.mk-public-identity {
  padding: 1.25rem 1rem 1rem;
  color: #fff;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.mk-public-identity .mk-brand-text {
  color: #fff !important;
  -webkit-text-fill-color: #fff;
  font-size: 1.5rem;
  margin-bottom: .75rem;
}
.mk-public-identity .mk-brand-text .mk-plus {
  color: #ffc500 !important;
  -webkit-text-fill-color: #ffc500;
}
.mk-public-caption {
  font-size: .88rem;
  line-height: 1.55;
  color: rgba(255,255,255,.92) !important;
  margin-bottom: 1rem;
}
.mk-public-caption strong { color: #fff !important; }
.mk-chat-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  background: #ffc500 !important;
  color: #1f2430 !important;
  font-weight: 700 !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: .65rem 1.1rem !important;
  text-decoration: none !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.15);
  margin-bottom: 1rem;
}
.mk-chat-btn:hover { filter: brightness(1.05); color: #1f2430 !important; }
.sidebar-monika {
  margin-top: auto;
  text-align: center;
  pointer-events: none;
}
.monika-image {
  max-width: 88%;
  height: auto;
  opacity: .95;
}

/* Content cards */
.page-body .card, .card {
  background: linear-gradient(165deg, #fff, #f8f9ff) !important;
  color: #1f2430 !important;
  border: 1px solid #e0e2f5 !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 28px rgba(31,36,48,.06) !important;
  max-width: 100%;
}
.page-body .card.bg-primary, .card.bg-primary {
  background: linear-gradient(135deg, #6D6CE9, #4a49c4) !important;
  color: #fff !important;
  border: 0 !important;
}
.page-body .card.bg-primary h4,
.page-body .card.bg-primary p,
.page-body .card.bg-primary label,
.page-body .card.bg-primary .media-body,
.page-body .card.bg-primary strong {
  color: #fff !important;
}
.page-body .card h1, .page-body .card h2, .page-body .card h3,
.page-body .card h4, .page-body .card h5, .page-body .card h6,
.page-body .card p, .page-body .card label {
  color: #1f2430 !important;
}
.page-body .card.bg-primary h1, .page-body .card.bg-primary h2,
.page-body .card.bg-primary h3, .page-body .card.bg-primary h4 {
  color: #fff !important;
}

.page-title h3 { color: #1f2430 !important; font-weight: 700 !important; }

/* Forms / buttons public */
.form-control, .form-select {
  min-height: 44px !important;
  border-radius: 10px !important;
  color: #1f2430 !important;
  background: #fff !important;
  border: 1px solid #d0d3e6 !important;
}
.btn {
  min-height: 42px !important;
  padding: .5rem 1.15rem !important;
  font-weight: 600 !important;
  border-radius: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
}
.btn-primary {
  background: linear-gradient(135deg, #6D6CE9, #5b5ad6) !important;
  border: 0 !important;
  color: #fff !important;
}
.btn-warning { background: #ffc500 !important; color: #1f2430 !important; border: 0 !important; }

/* Tables */
.table-responsive { max-width: 100%; overflow-x: auto; }
table.dataTable thead th, .table thead th {
  background: linear-gradient(135deg, #6D6CE9, #5b5ad6) !important;
  color: #fff !important;
}
table.dataTable tbody td, .table tbody td {
  color: #1f2430 !important;
  background: #fff !important;
}

/* Tabs modern */
.nav-tabs {
  border: 0 !important;
  gap: .35rem;
  flex-wrap: wrap;
}
.nav-tabs .nav-link {
  border: 0 !important;
  border-radius: 999px !important;
  color: #1f2430 !important;
  font-weight: 600;
  background: #fff;
  box-shadow: 0 2px 8px rgba(31,36,48,.06);
  padding: .55rem 1rem !important;
}
.nav-tabs .nav-link.active {
  background: linear-gradient(135deg, #6D6CE9, #5b5ad6) !important;
  color: #fff !important;
}

.alert-light {
  background: #fff !important;
  color: #1f2430 !important;
  border: 1px solid #e4e6f2 !important;
  border-radius: 12px !important;
}

/* Loader fixed center */
#loader-container {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background: rgba(45,44,120,.45) !important;
  z-index: 99990 !important;
  display: none;
  align-items: center !important;
  justify-content: center !important;
}
#loader-container[style*="block"],
#loader-container[style*="flex"] {
  display: flex !important;
}
#loader-container img, #loader-container #loader { display: none !important; }
#loader-container::after {
  content: "";
  width: 72px; height: 72px; border-radius: 50%;
  border: 3px solid rgba(255,255,255,.25);
  border-top-color: #fff;
  border-right-color: #ffc500;
  animation: pkspin .85s linear infinite;
}
@keyframes pkspin { to { transform: rotate(360deg); } }

.ribbon-wrapper.card p { color: #1f2430 !important; }

@media (max-width: 575.98px) {
  .form-select { width: 100% !important; min-width: 100% !important; }
}