/* CA Smart Staycation — uniform shell for primary admin tabs. */
:root{
  --ca-admin-max:1500px;
  --ca-admin-edge:24px;
  --ca-admin-gap:18px;
  --ca-admin-green:#173f35;
  --ca-admin-muted:#68736e;
  --ca-admin-gold:#8b6b2e;
  --ca-admin-line:#dfe6e2;
  --ca-admin-tab:#eef3f0;
}

*{box-sizing:border-box}
html{width:100%;min-height:100%;scrollbar-gutter:stable;overflow-y:scroll}
body{width:100%;min-height:100vh;margin:0;background:#f5f7f6;color:#24342f;font-family:Arial,sans-serif;overflow-x:hidden}

/* Every primary admin tab uses exactly the same page width and outer spacing. */
.page,
.admin-shell,
.wrap,
.studio{
  width:calc(100% - (var(--ca-admin-edge) * 2))!important;
  max-width:var(--ca-admin-max)!important;
  margin:0 auto!important;
  padding:24px 0 36px!important;
  box-sizing:border-box!important;
}

/* Standard top header. */
.topbar,
.studio>.top{
  width:100%!important;
  min-height:72px!important;
  margin:0 0 var(--ca-admin-gap)!important;
  padding:0!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:20px!important;
  box-sizing:border-box!important;
}
.topbar>div:first-child,
.studio>.top>div:first-child{min-width:0;flex:1 1 auto}
.topbar .eyebrow,
.studio>.top .eyebrow{
  margin:0 0 6px!important;
  color:var(--ca-admin-gold)!important;
  font:700 11px/1.2 Arial,sans-serif!important;
  letter-spacing:2px!important;
  text-transform:uppercase!important;
}
.topbar h1,
.studio>.top h1{
  margin:0!important;
  color:var(--ca-admin-green)!important;
  font:700 30px/1.15 Arial,sans-serif!important;
}
.topbar .subtitle,
.topbar p.subtitle,
.studio>.top p:not(.eyebrow){
  margin:7px 0 0!important;
  color:var(--ca-admin-muted)!important;
  font:400 14px/1.4 Arial,sans-serif!important;
}
.top-actions,
.topbar>div:last-child:not(:first-child),
.studio>.top>div:last-child:not(:first-child){
  flex:0 0 auto;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
}
.topbar .refresh,
.topbar .top-actions a,
.topbar .top-actions button,
.studio>.top .refresh,
.studio>.top .top-actions a,
.studio>.top .top-actions button{
  min-width:88px!important;
  height:40px!important;
  padding:0 16px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-radius:7px!important;
  background:var(--ca-admin-green)!important;
  color:#fff!important;
  text-decoration:none!important;
  font:700 13px/1 Arial,sans-serif!important;
  cursor:pointer!important;
  box-sizing:border-box!important;
}

/* Exact same navigation footprint on every primary admin page. */
.admin-nav,
.ca-admin-primary-nav,
.ca-admin-main>.admin-nav{
  width:100%!important;
  min-height:54px!important;
  height:54px!important;
  margin:0 0 12px!important;
  padding:5px!important;
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  grid-auto-rows:42px!important;
  gap:5px!important;
  align-items:stretch!important;
  overflow:visible!important;
  background:#fff!important;
  border:1px solid var(--ca-admin-line)!important;
  border-radius:8px!important;
  box-sizing:border-box!important;
}
.admin-nav>a,
.admin-nav>button,
.ca-admin-primary-nav>a,
.ca-admin-primary-nav>button,
.ca-admin-main>.admin-nav>a,
.ca-admin-main>.admin-nav>button{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  min-height:42px!important;
  height:42px!important;
  margin:0!important;
  padding:7px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid #d7e1dc!important;
  border-radius:7px!important;
  background:var(--ca-admin-tab)!important;
  color:var(--ca-admin-green)!important;
  text-decoration:none!important;
  text-align:center!important;
  white-space:normal!important;
  font:700 12px/1.15 Arial,sans-serif!important;
  box-sizing:border-box!important;
  cursor:pointer!important;
}
.admin-nav>a:hover,
.admin-nav>button:hover,
.ca-admin-primary-nav>a:hover,
.ca-admin-primary-nav>button:hover{background:#e1ebe6!important;color:var(--ca-admin-green)!important}
.admin-nav>a.active,
.admin-nav>button.active,
.ca-admin-primary-nav>a.active,
.ca-admin-primary-nav>button.active{background:var(--ca-admin-green)!important;color:#fff!important;border-color:var(--ca-admin-green)!important}
.admin-nav .badge,
.ca-admin-primary-nav .badge{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto!important;
  min-width:20px!important;
  height:20px!important;
  margin-left:6px!important;
  padding:0 5px!important;
  border-radius:999px!important;
  background:#b08a3c!important;
  color:#fff!important;
  font:700 10px/1 Arial,sans-serif!important;
}
.admin-nav .badge[hidden],.ca-admin-primary-nav .badge[hidden]{display:none!important}

/* Keep the content start position consistent between tabs. */
.admin-tab-content,
.page>main,
.wrap>main,
.studio>main,
#newBookingInlineHost,
#voucherAdminCard,
.admin-email-settings{scroll-margin-top:18px}

@media(max-width:900px){
  :root{--ca-admin-edge:12px}
  .page,.admin-shell,.wrap,.studio{padding-top:16px!important;padding-bottom:28px!important}
  .topbar,.studio>.top{min-height:0!important;gap:12px!important}
  .topbar h1,.studio>.top h1{font-size:27px!important}
  .admin-nav,.ca-admin-primary-nav,.ca-admin-main>.admin-nav{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-auto-rows:42px!important;
    min-height:146px!important;
    height:auto!important;
  }
  .admin-nav>a,.admin-nav>button,.ca-admin-primary-nav>a,.ca-admin-primary-nav>button{font-size:11px!important;padding:7px 5px!important}
}

@media(max-width:520px){
  :root{--ca-admin-edge:8px}
  .topbar,.studio>.top{display:block!important}
  .top-actions,.topbar>div:last-child:not(:first-child),.studio>.top>div:last-child:not(:first-child){margin-top:12px!important;display:flex!important;gap:8px!important}
  .top-actions>*,.studio>.top .top-actions>*{flex:1 1 0;min-width:0!important}
}
