/* Animal King — Liquid Glass UI
   Global, non-destructive visual layer inspired by modern iOS glass materials. */
:root{
  color-scheme:light;
  --lg-bg-1:#eef6ff;
  --lg-bg-2:#f9f4ff;
  --lg-bg-3:#fff8e8;
  --lg-ink:#142033;
  --lg-muted:#667085;
  --lg-accent:#0a84ff;
  --lg-accent-2:#7c5cff;
  --lg-success:#30b56f;
  --lg-danger:#ff453a;
  --lg-glass:rgba(255,255,255,.52);
  --lg-glass-strong:rgba(255,255,255,.72);
  --lg-glass-soft:rgba(255,255,255,.34);
  --lg-stroke:rgba(255,255,255,.72);
  --lg-stroke-dark:rgba(84,110,145,.16);
  --lg-shadow:0 18px 50px rgba(67,86,120,.16),inset 0 1px 0 rgba(255,255,255,.92);
  --lg-shadow-hover:0 24px 70px rgba(67,86,120,.22),inset 0 1px 0 rgba(255,255,255,.96);
  --lg-radius:24px;
  --lg-radius-sm:16px;
  --lg-blur:24px;
}
html{background:var(--lg-bg-1)}
body{
  color:var(--lg-ink)!important;
  background:
    radial-gradient(circle at 12% 8%,rgba(10,132,255,.20),transparent 30rem),
    radial-gradient(circle at 88% 14%,rgba(124,92,255,.18),transparent 32rem),
    radial-gradient(circle at 76% 88%,rgba(255,184,76,.20),transparent 34rem),
    linear-gradient(145deg,var(--lg-bg-1),var(--lg-bg-2) 52%,var(--lg-bg-3)) fixed!important;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.38;
  background-image:linear-gradient(rgba(255,255,255,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom,black,transparent 85%);
}
::selection{background:rgba(10,132,255,.22)}
a{color:var(--lg-accent)}

/* Shared glass surfaces */
.card,.ak-card,.ak-v3-card,.ak-dashboard-card,.ak-stat-card,.ak-action-card,.ak-business-card,.ak-merchant-card,
.panel,.well,.jumbotron,.list-group-item,.dropdown-menu,.popover,.toast,.ak-toast,.ak-v3-toast,
.modal-content,.ak-modal-card,.ak-v3-modal,.ak-v3-bottom-sheet,
fieldset,.formoid-solid-blue,.table-responsive,
[class*="container-box"],[class*="content-box"],[class*="dashboard-box"]{
  background:linear-gradient(145deg,var(--lg-glass-strong),var(--lg-glass-soft))!important;
  border:1px solid var(--lg-stroke)!important;
  box-shadow:var(--lg-shadow)!important;
  backdrop-filter:blur(var(--lg-blur)) saturate(155%);
  -webkit-backdrop-filter:blur(var(--lg-blur)) saturate(155%);
}
.card,.ak-card,.ak-v3-card,.ak-dashboard-card,.ak-stat-card,.ak-action-card,.ak-business-card,.ak-merchant-card,
.panel,.well,.jumbotron,.table-responsive{border-radius:var(--lg-radius)!important}
.card:hover,.ak-card:hover,.ak-v3-card:hover,.ak-dashboard-card:hover,.ak-stat-card:hover,.ak-action-card:hover,.ak-business-card:hover,.ak-merchant-card:hover{
  box-shadow:var(--lg-shadow-hover)!important;border-color:rgba(255,255,255,.95)!important;
}

/* Navigation */
nav,.navbar,.ak-v3-sidebar,.ak-sidebar,.sidebar,.ak-topbar,.topbar,header:not(.modal-header){
  background:linear-gradient(145deg,rgba(255,255,255,.70),rgba(255,255,255,.38))!important;
  border-color:var(--lg-stroke)!important;
  box-shadow:0 12px 40px rgba(67,86,120,.13),inset 0 1px 0 rgba(255,255,255,.9)!important;
  backdrop-filter:blur(28px) saturate(165%);
  -webkit-backdrop-filter:blur(28px) saturate(165%);
}
.navbar,.ak-topbar,.topbar{border-radius:0 0 24px 24px}
.ak-v3-sidebar,.ak-sidebar,.sidebar{border-right:1px solid rgba(255,255,255,.72)!important}
.nav-link,.navbar a,.ak-nav-link,.ak-v3-nav a,.sidebar a{
  border-radius:14px!important;transition:background .2s ease,transform .2s ease,box-shadow .2s ease!important;
}
.nav-link:hover,.navbar a:hover,.ak-nav-link:hover,.ak-v3-nav a:hover,.sidebar a:hover{
  background:rgba(255,255,255,.48)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)!important;
}
.nav-link.active,.ak-nav-link.active,.ak-v3-nav a.active,.sidebar a.active{
  background:linear-gradient(135deg,rgba(10,132,255,.92),rgba(124,92,255,.86))!important;
  color:#fff!important;box-shadow:0 10px 24px rgba(10,132,255,.25),inset 0 1px 0 rgba(255,255,255,.35)!important;
}

/* Buttons */
.btn,.ak-btn,.ak-v3-btn,button,input[type="submit"],input[type="button"]{
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.78)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,255,255,.42))!important;
  color:var(--lg-ink)!important;
  box-shadow:0 8px 20px rgba(67,86,120,.13),inset 0 1px 0 rgba(255,255,255,.95)!important;
  backdrop-filter:blur(16px) saturate(145%);-webkit-backdrop-filter:blur(16px) saturate(145%);
}
.btn-primary,.ak-btn-primary,.ak-v3-btn-primary,.btn-info,.btn-warning{
  background:linear-gradient(135deg,var(--lg-accent),var(--lg-accent-2))!important;
  color:#fff!important;border-color:rgba(255,255,255,.35)!important;
  box-shadow:0 12px 28px rgba(10,132,255,.28),inset 0 1px 0 rgba(255,255,255,.38)!important;
}
.btn-success,.ak-btn-success{background:linear-gradient(135deg,#34c77b,#22a861)!important;color:#fff!important}
.btn-danger,.ak-btn-danger,.ak-v3-btn-danger{background:linear-gradient(135deg,#ff6259,#ff3b30)!important;color:#fff!important}
.btn-secondary,.ak-btn-secondary{background:linear-gradient(135deg,rgba(42,53,72,.92),rgba(79,88,108,.82))!important;color:#fff!important}
.btn:hover,.ak-btn:hover,.ak-v3-btn:hover,button:hover{transform:translateY(-2px);filter:brightness(1.03)}

/* Inputs */
.form-control,.form-select,input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),textarea,select{
  background:rgba(255,255,255,.48)!important;
  border:1px solid rgba(255,255,255,.8)!important;
  color:var(--lg-ink)!important;
  border-radius:var(--lg-radius-sm)!important;
  box-shadow:inset 0 1px 2px rgba(65,82,110,.08),0 6px 18px rgba(67,86,120,.07)!important;
  backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);
}
.form-control:focus,.form-select:focus,input:focus,textarea:focus,select:focus{
  background:rgba(255,255,255,.72)!important;border-color:rgba(10,132,255,.58)!important;
  box-shadow:0 0 0 4px rgba(10,132,255,.14),inset 0 1px 0 rgba(255,255,255,.9)!important;
}
input::placeholder,textarea::placeholder{color:#8993a3!important}
label,.form-label{color:var(--lg-ink)!important}

/* Tables */
.table,.dataTable,.ak-v3-table{background:rgba(255,255,255,.36)!important;border:1px solid var(--lg-stroke)!important;border-radius:20px!important;overflow:hidden}
.table thead th,.dataTable thead th,.ak-v3-table th{
  background:linear-gradient(135deg,rgba(28,42,65,.88),rgba(53,66,91,.80))!important;color:#fff!important;
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-color:rgba(255,255,255,.12)!important;
}
.table tbody td,.dataTable tbody td,.ak-v3-table td{background:rgba(255,255,255,.25)!important;border-color:rgba(122,141,168,.14)!important}
.table tbody tr:hover td,.dataTable tbody tr:hover td{background:rgba(255,255,255,.52)!important}

/* Modals and overlays */
.modal-backdrop,.ak-v3-modal-backdrop{background:rgba(20,30,48,.36)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.modal-content,.ak-v3-modal{border-radius:30px!important}
.modal-header,.modal-footer,.ak-v3-modal-header,.ak-v3-modal-footer{
  background:rgba(255,255,255,.30)!important;border-color:rgba(122,141,168,.14)!important;
}

/* Alerts / badges */
.alert{border:1px solid rgba(255,255,255,.72)!important;border-radius:18px!important;box-shadow:0 8px 24px rgba(67,86,120,.10)!important;backdrop-filter:blur(16px)}
.badge,.ak-badge,.ak-v3-badge{border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.75)}

/* Preserve readability on dark legacy areas */
.bg-dark,.navbar-dark,[class*="dark"]{color:#fff}
.bg-dark .form-control,.navbar-dark .form-control,[class*="dark"] .form-control{color:var(--lg-ink)!important}

/* Mobile: iOS-like floating surfaces and safe areas */
@media(max-width:767px){
  :root{--lg-radius:22px;--lg-blur:20px}
  body{padding-bottom:env(safe-area-inset-bottom,0)}
  .navbar,.ak-topbar,.topbar{border-radius:0 0 20px 20px}
  .modal-dialog{margin:10px!important}.modal-content,.ak-v3-modal{border-radius:26px!important}
  .btn,.ak-btn,.ak-v3-btn,button{min-height:48px}
}
@media(prefers-reduced-transparency:reduce){
  .card,.ak-card,.ak-v3-card,.panel,.modal-content,.ak-v3-modal,nav,.navbar,.ak-v3-sidebar{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#f8fbff!important}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}


/* ChatGPT modal close fix */
.modal-header .btn-close,
.btn-close{
    width:42px!important;
    height:42px!important;
    border-radius:50%!important;
    background-color:rgba(255,255,255,.35)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    filter:invert(1) brightness(0)!important;
    border:1px solid rgba(0,0,0,.12)!important;
    box-shadow:0 4px 14px rgba(0,0,0,.18), inset 0 1px 1px rgba(255,255,255,.5)!important;
    opacity:1!important;
}
.modal-header .btn-close:hover,
.btn-close:hover{
    background-color:rgba(255,255,255,.55)!important;
    transform:scale(1.05);
}
.modal-header .close,
.close{
    width:42px!important;
    height:42px!important;
    border-radius:50%!important;
    background:rgba(255,255,255,.35)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    color:#111!important;
    font-size:28px!important;
    font-weight:700!important;
    text-shadow:none!important;
    opacity:1!important;
    border:1px solid rgba(0,0,0,.12)!important;
    display:flex!important;
    align-items:center;
    justify-content:center;
}

/* Liquid Glass close button — stable alignment on desktop and mobile */
.glass-close{
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  min-height:42px!important;
  padding:0!important;
  border:1px solid rgba(0,0,0,.10)!important;
  border-radius:999px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 42px!important;
  background:rgba(255,255,255,.62)!important;
  color:#172033!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:28px!important;
  font-weight:400!important;
  line-height:1!important;
  text-align:center!important;
  text-indent:0!important;
  opacity:1!important;
  cursor:pointer!important;
  box-shadow:0 6px 18px rgba(21,31,51,.16),inset 0 1px 0 rgba(255,255,255,.86)!important;
  backdrop-filter:blur(18px) saturate(150%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(150%)!important;
  transition:transform .18s ease,background-color .18s ease,box-shadow .18s ease!important;
  appearance:none!important;
  -webkit-appearance:none!important;
}
.glass-close:hover{
  transform:scale(1.06)!important;
  background:rgba(255,255,255,.82)!important;
  box-shadow:0 8px 22px rgba(21,31,51,.20),inset 0 1px 0 rgba(255,255,255,.95)!important;
}
.glass-close:focus-visible{
  outline:3px solid rgba(13,110,253,.28)!important;
  outline-offset:3px!important;
}

/* The close control always occupies the far-right edge of a modal header. */
.modal-header{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
}
.modal-header > .glass-close,
.modal-header .glass-close[data-bs-dismiss="modal"],
.modal-header .glass-close[data-dismiss="modal"]{
  position:relative!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  inset:auto!important;
  float:none!important;
  order:999!important;
  margin-top:0!important;
  margin-right:0!important;
  margin-bottom:0!important;
  margin-left:auto!important;
  align-self:center!important;
  z-index:5!important;
}
.modal-header > :not(.glass-close){
  min-width:0;
}
.modal-header .modal-title{
  flex:1 1 auto!important;
  min-width:0!important;
  margin-right:0!important;
}

@media(max-width:767.98px){
  .modal-header{gap:10px!important;}
  .modal-header > .glass-close,
  .modal-header .glass-close[data-bs-dismiss="modal"],
  .modal-header .glass-close[data-dismiss="modal"]{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    min-height:42px!important;
    flex-basis:42px!important;
    margin-left:auto!important;
  }
}


/* Improved menu subtitle contrast */
.menu-card .subtitle,
.menu-card small,
.menu-card p,
.menu-text p,
.card-subtitle{
  color:#5b5345 !important;
  opacity:1 !important;
  font-weight:500;
}

/* Logout card subtitle: match the readable subtitle color used by every other menu card. */
body.pg-menu .ak-action-panel .ak-action-card.ak-exit small,
body.pg-menu button.ak-action-card.ak-exit small {
  color:#4d3511 !important;
  -webkit-text-fill-color:#4d3511 !important;
  opacity:1 !important;
  font-weight:750 !important;
  text-shadow:none !important;
  filter:none !important;
}