:root{
  --cms-radius:18px;
  --cms-shadow:0 8px 28px rgba(0,0,0,.08);
  --cms-hero-a:#15171a;
  --cms-hero-b:#313844;
}

html{scroll-behavior:smooth}
body{
  min-height:100vh;
  background:var(--bs-tertiary-bg);
  color:var(--bs-body-color);
  overflow-x:hidden;
}
body,.card,.navbar,.list-group-item,.form-control,.form-select,.table,.alert,.dropdown-menu,footer{
  transition:background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;
}
a{overflow-wrap:anywhere}
img,svg{max-width:100%;height:auto}

.cms-navbar{
  background:color-mix(in srgb,var(--bs-body-bg) 94%,transparent);
  border-bottom:1px solid var(--bs-border-color);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.cms-navbar .navbar-brand{color:var(--bs-emphasis-color)}
.cms-navbar .nav-link{color:var(--bs-secondary-color)}
.cms-navbar .nav-link:hover,.cms-navbar .nav-link:focus{color:var(--bs-emphasis-color)}
.cms-nav-actions{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap}

.theme-menu .dropdown-toggle{min-width:108px}
.theme-menu .dropdown-item{display:flex;align-items:center;gap:.55rem}
.theme-dot{width:.75rem;height:.75rem;border-radius:50%;display:inline-block;border:1px solid var(--bs-border-color)}
.theme-dot-light{background:#f8f9fa}.theme-dot-dark{background:#212529}.theme-dot-system{background:linear-gradient(90deg,#f8f9fa 50%,#212529 50%)}

.hero{
  background:linear-gradient(135deg,var(--cms-hero-a),var(--cms-hero-b));
  color:#fff;
  border-radius:24px;
  padding:clamp(1.5rem,5vw,2.75rem);
  overflow:hidden;
}
.hero .lead{max-width:760px}
.card{border:1px solid var(--bs-border-color-translucent);border-radius:var(--cms-radius);box-shadow:var(--cms-shadow);background:var(--bs-body-bg)}
.promo-card{height:100%}
.promo-price{font-size:clamp(1.45rem,4vw,1.8rem);font-weight:800}
.stat{font-size:clamp(1.55rem,5vw,2rem);font-weight:800}
.table-card{overflow:hidden}
.phone-box{border:2px dashed var(--bs-border-color);border-radius:16px;padding:clamp(1rem,4vw,1.25rem)}
.sidebar-link{display:block;padding:.7rem 1rem;border-radius:10px;text-decoration:none;color:var(--bs-body-color)}
.sidebar-link:hover{background:var(--bs-tertiary-bg)}
.badge-soft{background:var(--bs-primary-bg-subtle);color:var(--bs-primary-text-emphasis)}
.form-control,.form-select,.btn{border-radius:10px}
pre{color:inherit}
code{color:var(--bs-code-color);overflow-wrap:anywhere}

.table-responsive{border-radius:inherit;-webkit-overflow-scrolling:touch}
.table-responsive>.table{margin-bottom:0;min-width:680px}
.table-responsive>.table.table-compact-mobile{min-width:560px}
.table th{white-space:nowrap}
.table td{vertical-align:middle}
.transaction-cell{max-width:240px;overflow-wrap:anywhere;word-break:break-word}

.cms-section-title{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.cms-form-actions{display:flex;gap:.65rem;flex-wrap:wrap}
.cms-form-actions>.btn{flex:0 0 auto}

.admin-sidebar .list-group{border-radius:16px;overflow:hidden;box-shadow:var(--cms-shadow)}
.admin-sidebar .list-group-item{background:var(--bs-body-bg);color:var(--bs-body-color);border-color:var(--bs-border-color)}
.admin-sidebar .list-group-item:hover{background:var(--bs-tertiary-bg)}
.admin-content{min-width:0}
.admin-point-form{display:flex;gap:.4rem;align-items:center;min-width:360px}
.admin-point-form .point-amount{width:100px;flex:0 0 100px}

.cms-footer{background:var(--bs-body-bg);border-top:1px solid var(--bs-border-color)!important}

[data-bs-theme="dark"]{
  color-scheme:dark;
  --cms-shadow:0 8px 28px rgba(0,0,0,.28);
  --cms-hero-a:#090b0e;
  --cms-hero-b:#202733;
}
[data-bs-theme="dark"] .text-muted{color:var(--bs-secondary-color)!important}
[data-bs-theme="dark"] .btn-dark{--bs-btn-bg:#e9ecef;--bs-btn-border-color:#e9ecef;--bs-btn-color:#111;--bs-btn-hover-bg:#fff;--bs-btn-hover-border-color:#fff;--bs-btn-hover-color:#111}
[data-bs-theme="dark"] .btn-outline-dark{--bs-btn-color:#e9ecef;--bs-btn-border-color:#adb5bd;--bs-btn-hover-bg:#e9ecef;--bs-btn-hover-border-color:#e9ecef;--bs-btn-hover-color:#111}

@media (max-width:991.98px){
  .cms-navbar .navbar-collapse{padding-top:.85rem;padding-bottom:.25rem}
  .cms-navbar .navbar-nav{gap:.15rem;margin-bottom:.75rem}
  .cms-nav-actions{padding-top:.75rem;border-top:1px solid var(--bs-border-color);width:100%}
  .cms-nav-actions .user-name{margin-right:auto}
  .admin-sidebar{order:0}
  .admin-content{order:1}
  .admin-sidebar .list-group{display:flex;flex-direction:row;overflow-x:auto;white-space:nowrap;scrollbar-width:thin;border-radius:12px}
  .admin-sidebar .list-group-item{flex:0 0 auto;border-width:0 1px 0 0}
}

@media (max-width:767.98px){
  main.container,.admin-shell.container{padding-left:.85rem;padding-right:.85rem}
  main.container{padding-top:1rem!important;padding-bottom:1rem!important}
  .hero{border-radius:18px}
  .card.p-4{padding:1.15rem!important}
  .card.p-3{padding:1rem!important}
  h1,.display-5{font-size:clamp(1.85rem,9vw,2.5rem)}
  h2{font-size:1.5rem}
  h3{font-size:1.25rem}
  .cms-section-title{align-items:flex-start;flex-direction:column}
  .cms-form-actions{width:100%}
  .cms-form-actions>.btn{flex:1 1 auto}
  .phone-box .d-flex,.mobile-stack{flex-direction:column!important;align-items:stretch!important}
  .phone-box .btn,.mobile-stack .btn{width:100%}
  .admin-point-form{min-width:280px;flex-wrap:wrap}
  .admin-point-form .point-amount{width:90px;flex-basis:90px}
  .admin-point-form .point-note{flex:1 1 140px}
  .table-responsive>.table{font-size:.9rem}
  .navbar-brand{max-width:62vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

@media (max-width:575.98px){
  .cms-nav-actions>*{flex:1 1 auto;text-align:center}
  .cms-nav-actions .user-name{flex:1 0 100%;text-align:left}
  .theme-menu,.theme-menu .btn{width:100%}
  .theme-menu .dropdown-menu{width:100%}
  .btn-lg{font-size:1rem;padding:.65rem 1rem}
  .table-responsive>.table{min-width:620px}
  footer{font-size:.85rem}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}

@media (max-width:575.98px){
  .otp-group{display:flex;flex-direction:column;gap:.5rem}
  .otp-group>.form-control,.otp-group>.btn{width:100%;border-radius:10px!important;margin-left:0!important}
  .otp-group>.form-control{flex:none}
}
