/* ============ Base ============ */
:root{
  --brand:#635bff;
  --brand-2:#20c997;
  --glass-bg: rgba(255,255,255,.75);
  --glass-bd: rgba(0,0,0,.06);
}

[data-bs-theme="dark"]{
  --glass-bg: rgba(22,22,26,.7);
  --glass-bd: rgba(255,255,255,.12);
}

html, body { height: 100%; }
body{
  font-family: "Prompt", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans Thai", "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

/* subtle background pattern */
.bg-pattern{
  background:
    radial-gradient( circle at 10% 10%, rgba(99,91,255,.08) 0 20%, transparent 21% ),
    radial-gradient( circle at 90% 30%, rgba(32,201,151,.08) 0 18%, transparent 19% ),
    linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,.00) 40%);
}

/* ============ Navbar ============ */
.navbar-softglass{
  background: var(--glass-bg);
  backdrop-filter: saturate(140%) blur(10px);
  border-bottom: 1px solid var(--glass-bd);
}

.navbar-brand .brand-dot{
  width: .9rem; height: .9rem; border-radius: 50%;
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
  display: inline-block;
  box-shadow: 0 0 0 .15rem rgba(99,91,255,.15);
}

.navbar .nav-link{
  border-radius: .65rem;
  padding: .45rem .75rem;
  font-weight: 500;
  opacity: .9;
}
.navbar .nav-link.active{
  color: #fff !important;
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
  box-shadow: 0 6px 18px rgba(99,91,255,.25);
  opacity: 1;
}
.navbar .nav-link:hover{
  background: rgba(0,0,0,.05);
}
[data-bs-theme="dark"] .navbar .nav-link:hover{
  background: rgba(255,255,255,.06);
}

/* ============ Cards & Tables ============ */
.card{ border-radius: 1rem; border: 1px solid var(--glass-bd); }
.card-header{ border-bottom: 1px solid var(--glass-bd); }
.table td, .table th { vertical-align: middle; }

/* ============ Forms & Buttons ============ */
.btn, .form-control, .form-select{ border-radius: .75rem; }
.form-control:focus, .form-select:focus{
  box-shadow: 0 0 0 .2rem rgba(99,91,255,.15);
  border-color: var(--brand);
}

/* ============ Sticky action bar ============ */
.sticky-actions{
  position: sticky;
  bottom: -1px;
  border-radius: 0 0 1rem 1rem;
}

/* ============ Footer ============ */
.bg-white-ghost{
  background: var(--glass-bg);
  backdrop-filter: saturate(140%) blur(8px);
  border-top: 1px solid var(--glass-bd);
}

/* SEO preview (ถ้าใช้หน้า Pages) */
.seo-preview { background:#fff; border-radius:.75rem; }
.seo-preview .seo-title { color:#1a0dab; font-size:1rem; line-height:1.2; }
.seo-preview .seo-url { color:#006621; font-size:.9rem; margin:.25rem 0; }
.seo-preview .seo-desc { color:#4d5156; font-size:.95rem; }

/* Dark mode tweaks for SEO preview */
[data-bs-theme="dark"] .seo-preview{
  background:#1e1f22; border:1px solid rgba(255,255,255,.08);
}