:root{--bg:#06132d;--panel:#0b2148;--panel2:#0d2a5b;--line:#244d8e;--text:#f7f9ff;--muted:#b8c8e8;--blue:#1687ff;--green:#18bd7d;--danger:#ff6b7a}
*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text)}
a{color:#67b5ff;text-decoration:none}.topbar{height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:#071a3b;border-bottom:1px solid var(--line)}
.brand{font-size:22px;font-weight:800;color:white}.brand span{color:var(--blue)}.admin-name{color:var(--muted)}
.shell{display:grid;grid-template-columns:240px 1fr;min-height:calc(100vh - 68px)}.sidebar{padding:22px 14px;background:#071a3b;border-right:1px solid var(--line)}
.sidebar a{display:block;padding:12px 14px;margin:4px 0;border-radius:10px;color:#dce8ff}.sidebar a:hover{background:var(--panel2)}
.content{padding:30px;max-width:1400px;width:100%}h1{margin-top:0}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px}.metric{font-size:32px;font-weight:800}.muted{color:var(--muted)}
table{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden}
th,td{text-align:left;padding:12px;border-bottom:1px solid var(--line);vertical-align:top}th{background:var(--panel2)}
input,select,textarea{width:100%;background:#071a3b;color:white;border:1px solid var(--line);border-radius:9px;padding:10px}
textarea{min-height:160px}.btn{display:inline-block;border:0;border-radius:10px;background:var(--blue);color:white;padding:10px 16px;font-weight:700;cursor:pointer}
.btn.secondary{background:var(--panel2);border:1px solid var(--line)}.notice{padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--panel2);margin-bottom:16px}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(440px,100%);background:var(--panel);padding:28px;border:1px solid var(--line);border-radius:18px}
label{display:block;margin:14px 0 6px}.status-on{color:#5ee6ad}.status-off{color:#ff9aa5}
@media(max-width:760px){.shell{grid-template-columns:1fr}.sidebar{display:flex;overflow:auto;border-right:0;border-bottom:1px solid var(--line)}.sidebar a{white-space:nowrap}.content{padding:18px}.topbar{padding:0 16px}}

/* ChatHabesha Admin day/night mode */
:root[data-theme="day"]{color-scheme:light;--bg:#f3f7ff;--panel:#fff;--panel2:#eaf2ff;--line:#bfd1ec;--text:#102342;--muted:#566b89;--blue:#086fe8;--green:#087f59;--danger:#c73548}
:root[data-theme="day"] body{background:var(--bg);color:var(--text)}
:root[data-theme="day"] .topbar,:root[data-theme="day"] .sidebar{background:#fff}
:root[data-theme="day"] .brand,:root[data-theme="day"] .sidebar a{color:var(--text)}
:root[data-theme="day"] input,:root[data-theme="day"] select,:root[data-theme="day"] textarea{background:#fff;color:var(--text)}
.topbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:14px}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:8px 13px;border:1px solid var(--line);border-radius:12px;background:var(--panel2);color:var(--text);font:inherit;font-weight:700;cursor:pointer}
.theme-toggle:hover{border-color:var(--blue)}
.theme-toggle:focus-visible{outline:3px solid rgba(22,135,255,.32);outline-offset:2px}
.theme-toggle-icon{font-size:18px;line-height:1}
@media(max-width:760px){.topbar{align-items:flex-start}.topbar-actions{align-items:flex-end;flex-direction:column;gap:8px}.theme-toggle{min-height:36px;padding:6px 10px}}

/* ChatHabesha Activity Center v3 */
.activity-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin:18px 0}
.activity-filter-actions{display:flex;align-items:end;gap:10px;flex-wrap:wrap}
.activity-table-wrap{overflow:auto;border-radius:14px}
.activity-table-wrap table{min-width:1050px}

/* ChatHabesha Authentication v4 */
.admin-action-row{display:flex;gap:8px;flex-wrap:wrap}
.admin-action-row .btn{padding:8px 10px}

/* CHAT_HABESHA_ADMIN_GRID_REVISION_V20_7_14
 * Created Admin pages use the original .grid > .card structure from features.php.
 */

/* CHAT_HABESHA_ADMIN_CARD_SEPARATION_V20_8_1_2
 * Shared Admin spacing correction.
 * Keeps each top-level card group visually independent without changing
 * page markup, form behavior, business rules, APIs, or database state.
 */
:root{
  --admin-section-gap:20px;
  --admin-card-gap:18px;
  --admin-card-shadow:0 8px 24px rgba(0,0,0,.12);
}
.content > .grid{
  gap:var(--admin-card-gap);
  align-items:stretch;
}
.content > .grid > .card{
  min-width:0;
  height:100%;
}
.content > .grid + .grid,
.content > .grid + .card,
.content > .card + .grid,
.content > .card + .card{
  margin-top:var(--admin-section-gap);
}
.card{
  background-clip:padding-box;
  box-shadow:var(--admin-card-shadow);
}
:root[data-theme="day"]{
  --admin-card-shadow:0 8px 24px rgba(16,35,66,.08);
}
@media(max-width:760px){
  :root{
    --admin-section-gap:16px;
    --admin-card-gap:14px;
  }
  .content > .grid{
    grid-template-columns:1fr;
  }
  .content > .grid > .card{
    height:auto;
  }
}

/* CHAT_HABESHA_ADMIN_SHELL_AND_CARD_COMPLETION_V20_8_1_4
 * Separates the shared Admin header, sidebar, footer and navigation into
 * independently maintained components. Completes page-level card separation
 * without changing nested form grids, business rules, APIs or database state.
 */
:root{
  --admin-header-height:68px;
  --admin-sidebar-width:272px;
  --admin-page-max-width:1480px;
  --admin-footer-bg:color-mix(in srgb,var(--panel) 84%,var(--bg));
}
body.admin-density-comfortable{
  --admin-section-gap:24px;
  --admin-card-gap:20px;
  --admin-card-padding:22px;
}
body.admin-density-standard{
  --admin-section-gap:20px;
  --admin-card-gap:18px;
  --admin-card-padding:20px;
}
body.admin-density-compact{
  --admin-section-gap:14px;
  --admin-card-gap:12px;
  --admin-card-padding:16px;
}
body.admin-header-compact{
  --admin-header-height:56px;
}
.admin-shell-page{
  min-height:100vh;
}
.admin-header{
  position:sticky;
  top:0;
  z-index:50;
  height:var(--admin-header-height);
  min-height:var(--admin-header-height);
  gap:20px;
}
.admin-header-leading{
  display:flex;
  align-items:center;
  min-width:0;
  gap:14px;
}
.admin-header-subtitle{
  max-width:38vw;
  overflow:hidden;
  color:var(--muted);
  text-overflow:ellipsis;
  white-space:nowrap;
}
.admin-sidebar-toggle,
.admin-sidebar-close,
.admin-floating-menu-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  flex:0 0 auto;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--panel2);
  color:var(--text);
  font:inherit;
  font-size:21px;
  cursor:pointer;
}
.admin-sidebar-toggle:hover,
.admin-sidebar-close:hover,
.admin-floating-menu-button:hover{
  border-color:var(--blue);
}
.admin-shell{
  grid-template-columns:var(--admin-sidebar-width) minmax(0,1fr);
  min-height:calc(100vh - var(--admin-header-height));
  align-items:stretch;
}
.admin-workspace{
  display:flex;
  min-width:0;
  min-height:calc(100vh - var(--admin-header-height));
  flex-direction:column;
}
.admin-content{
  max-width:var(--admin-page-max-width);
  flex:1 0 auto;
  margin:0;
}
.admin-page-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin:0 0 var(--admin-section-gap);
}
.admin-page-heading h1{
  margin:0;
}
.admin-page-body{
  min-width:0;
}
.admin-page-body > :where(.grid,.card,.notice,.activity-table-wrap,table,section,article,form){
  min-width:0;
}
.admin-page-body > :where(.grid,.card,.notice,.activity-table-wrap,table,section,article,form)
+ :where(.grid,.card,.notice,.activity-table-wrap,table,section,article,form){
  margin-block-start:var(--admin-section-gap)!important;
}
.admin-page-body > :where(p,.admin-action-row)
+ :where(.grid,.card,.notice,.activity-table-wrap,table,section,article,form){
  margin-block-start:var(--admin-section-gap);
}
.admin-page-body > :where(.grid,.card,.notice,.activity-table-wrap,table,section,article,form)
+ h2{
  margin-block-start:calc(var(--admin-section-gap) * 1.35);
  margin-block-end:10px;
}
.admin-page-body > h2
+ :where(.grid,.card,.notice,.activity-table-wrap,table,section,article,form){
  margin-block-start:10px!important;
}
.admin-shell-page .content > .grid,
.admin-shell-page .admin-page-body > .grid,
.admin-shell-page form.grid{
  gap:var(--admin-card-gap);
}
.admin-shell-page .card{
  padding:var(--admin-card-padding);
  min-width:0;
  overflow-wrap:anywhere;
}
.admin-shell-page .grid > .card{
  min-width:0;
}
.admin-shell-page .activity-table-wrap{
  max-width:100%;
}
.admin-shell-page .admin-inline-form{
  margin-top:14px!important;
}
.admin-sidebar{
  position:sticky;
  top:var(--admin-header-height);
  z-index:30;
  display:block;
  height:calc(100vh - var(--admin-header-height));
  overflow-x:hidden;
  overflow-y:auto;
  padding:18px 14px 26px;
  transition:transform .2s ease,opacity .2s ease;
}
.admin-sidebar-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-height:38px;
  padding:0 10px 10px;
  color:var(--muted);
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.admin-sidebar-close{
  display:none;
  width:34px;
  height:34px;
  font-size:24px;
}
.admin-sidebar-group{
  margin:0;
  padding:12px 0;
  border-top:1px solid color-mix(in srgb,var(--line) 72%,transparent);
}
.admin-sidebar-group:first-of-type{
  border-top:0;
}
.admin-sidebar-group h2{
  margin:0 10px 7px;
  color:var(--muted);
  font-size:.75rem;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.admin-sidebar-links{
  display:grid;
  gap:3px;
}
.admin-sidebar a{
  position:relative;
  margin:0;
  padding:10px 12px;
  border:1px solid transparent;
}
.admin-sidebar a.active{
  border-color:color-mix(in srgb,var(--blue) 58%,var(--line));
  background:color-mix(in srgb,var(--blue) 18%,var(--panel2));
  color:var(--text);
  font-weight:800;
}
.admin-sidebar a.active::before{
  position:absolute;
  top:9px;
  bottom:9px;
  left:3px;
  width:3px;
  border-radius:999px;
  background:var(--blue);
  content:"";
}
.admin-sidebar-collapsed .admin-shell{
  grid-template-columns:minmax(0,1fr);
}
.admin-sidebar-collapsed .admin-sidebar{
  display:none;
}
.admin-sidebar-disabled .admin-shell{
  grid-template-columns:minmax(0,1fr);
}
.admin-sidebar-disabled .admin-sidebar,
.admin-sidebar-disabled .admin-sidebar-toggle,
.admin-sidebar-disabled .admin-floating-menu-button{
  display:none!important;
}
.admin-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:76px;
  margin-top:30px;
  padding:20px 30px;
  border-top:1px solid var(--line);
  background:var(--admin-footer-bg);
  color:var(--muted);
}
.admin-footer strong{
  color:var(--text);
}
.admin-footer-secondary{
  display:block;
  margin-top:4px;
}
.admin-footer-meta{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:14px;
  flex-wrap:wrap;
}
.admin-sidebar-backdrop{
  display:none;
}
.admin-floating-menu-button{
  position:fixed;
  top:14px;
  left:14px;
  z-index:60;
}
.admin-layout-summary .metric{
  font-size:clamp(1.3rem,2.8vw,2rem);
}
.admin-layout-table{
  min-width:780px;
}
.admin-layout-table input,
.admin-layout-table select{
  min-width:120px;
}
.admin-layout-table td:first-child,
.admin-layout-table th:first-child{
  width:80px;
}
:root[data-theme="day"]{
  --admin-footer-bg:color-mix(in srgb,var(--panel) 88%,var(--bg));
}
@media(max-width:900px){
  .admin-header{
    align-items:center;
  }
  .admin-header-subtitle{
    display:none;
  }
  .admin-shell{
    grid-template-columns:minmax(0,1fr);
  }
  .admin-sidebar{
    position:fixed;
    top:var(--admin-header-height);
    bottom:0;
    left:0;
    z-index:70;
    width:min(330px,88vw);
    height:auto;
    border-right:1px solid var(--line);
    border-bottom:0;
    transform:translateX(-105%);
    box-shadow:18px 0 42px rgba(0,0,0,.28);
  }
  .admin-header-hidden .admin-sidebar{
    top:0;
  }
  .admin-sidebar-heading{
    position:sticky;
    top:-18px;
    z-index:2;
    margin:-18px -14px 4px;
    padding:18px 14px 12px;
    background:#071a3b;
    border-bottom:1px solid var(--line);
  }
  :root[data-theme="day"] .admin-sidebar-heading{
    background:#fff;
  }
  .admin-sidebar-close{
    display:inline-flex;
  }
  .admin-mobile-sidebar-open{
    overflow:hidden;
  }
  .admin-mobile-sidebar-open .admin-sidebar{
    display:block;
    transform:translateX(0);
  }
  .admin-sidebar-collapsed .admin-sidebar{
    display:block;
  }
  .admin-sidebar-backdrop{
    position:fixed;
    inset:0;
    z-index:65;
    border:0;
    background:rgba(0,0,0,.5);
    cursor:pointer;
  }
  .admin-mobile-sidebar-open .admin-sidebar-backdrop{
    display:block;
  }
  .admin-content{
    width:100%;
    max-width:none;
  }
}
@media(max-width:760px){
  body.admin-density-comfortable{
    --admin-section-gap:18px;
    --admin-card-gap:15px;
    --admin-card-padding:18px;
  }
  body.admin-density-standard{
    --admin-section-gap:16px;
    --admin-card-gap:14px;
    --admin-card-padding:17px;
  }
  body.admin-density-compact{
    --admin-section-gap:12px;
    --admin-card-gap:10px;
    --admin-card-padding:14px;
  }
  .admin-header{
    height:var(--admin-header-height);
    min-height:var(--admin-header-height);
    padding:0 12px;
  }
  .admin-header-leading{
    gap:9px;
  }
  .admin-header .brand{
    max-width:46vw;
    overflow:hidden;
    font-size:18px;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .admin-header .admin-name{
    display:none;
  }
  .admin-header .topbar-actions{
    flex-direction:row;
    align-items:center;
  }
  .admin-header .theme-toggle span[data-theme-label]{
    display:none;
  }
  .admin-header .theme-toggle{
    width:40px;
    padding:6px;
  }
  .admin-page-heading{
    margin-bottom:var(--admin-section-gap);
  }
  .admin-footer{
    align-items:flex-start;
    flex-direction:column;
    padding:18px;
  }
  .admin-footer-meta{
    justify-content:flex-start;
  }
}

/* CHAT_HABESHA_ADMIN_DAY_MODE_BUTTON_CONTRAST_V20_8_1_5
 * Restores accessible text and state contrast for primary, secondary and
 * disabled Admin buttons in both day and night modes.
 */
:root{
  --admin-button-primary-text:#fff;
  --admin-button-secondary-bg:var(--panel2);
  --admin-button-secondary-text:var(--text);
  --admin-button-disabled-bg:color-mix(in srgb,var(--panel2) 74%,var(--bg));
  --admin-button-disabled-text:color-mix(in srgb,var(--text) 58%,var(--muted));
  --admin-button-focus:color-mix(in srgb,var(--blue) 42%,transparent);
}
.admin-shell-page .btn,
.login-wrap .btn{
  border:1px solid transparent;
  color:var(--admin-button-primary-text);
  text-decoration:none;
  opacity:1;
}
.admin-shell-page .btn:visited,
.login-wrap .btn:visited{
  color:var(--admin-button-primary-text);
}
.admin-shell-page .btn.secondary,
.login-wrap .btn.secondary{
  border-color:var(--line);
  background:var(--admin-button-secondary-bg);
  color:var(--admin-button-secondary-text);
}
.admin-shell-page .btn.secondary:visited,
.login-wrap .btn.secondary:visited{
  color:var(--admin-button-secondary-text);
}
.admin-shell-page .btn:not(:disabled):not([aria-disabled="true"]):not(.disabled):hover,
.login-wrap .btn:not(:disabled):not([aria-disabled="true"]):not(.disabled):hover{
  filter:brightness(1.06);
}
.admin-shell-page .btn:focus-visible,
.login-wrap .btn:focus-visible{
  outline:3px solid var(--admin-button-focus);
  outline-offset:2px;
}
.admin-shell-page .btn:is(:disabled,[disabled],[aria-disabled="true"],.disabled),
.login-wrap .btn:is(:disabled,[disabled],[aria-disabled="true"],.disabled){
  border-color:var(--line);
  background:var(--admin-button-disabled-bg);
  color:var(--admin-button-disabled-text);
  opacity:1;
  box-shadow:none;
  filter:none;
  cursor:not-allowed;
}
.admin-shell-page a.btn:is([aria-disabled="true"],.disabled),
.login-wrap a.btn:is([aria-disabled="true"],.disabled){
  pointer-events:none;
}
:root[data-theme="day"]{
  --admin-button-secondary-bg:#e5eefc;
  --admin-button-secondary-text:#102342;
  --admin-button-disabled-bg:#eef3fa;
  --admin-button-disabled-text:#64748b;
  --admin-button-focus:rgba(8,111,232,.28);
}
:root[data-theme="day"] .admin-shell-page .btn.secondary:not(:disabled):not([aria-disabled="true"]):not(.disabled):hover,
:root[data-theme="day"] .login-wrap .btn.secondary:not(:disabled):not([aria-disabled="true"]):not(.disabled):hover{
  border-color:#8faed8;
  background:#d8e6fa;
}

/* CHAT_HABESHA_ADMIN_NESTED_GRID_CONTAINMENT_V20_8_1_6
 * Prevents nested Admin form grids and controls from escaping narrow cards.
 * The previous fixed 220px grid minimum was wider than the usable content
 * area of some cards after padding, causing inputs to extend into card gaps.
 */
.admin-shell-page .grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));
}
.admin-shell-page .grid > *,
.admin-shell-page .card form,
.admin-shell-page .card fieldset,
.admin-shell-page .card .grid{
  min-width:0;
  max-width:100%;
}
.admin-shell-page input,
.admin-shell-page select,
.admin-shell-page textarea{
  min-width:0;
  max-width:100%;
}
.admin-shell-page .card{
  overflow:hidden;
}
.admin-shell-page .card :where(h1,h2,h3,h4,p,label,.muted){
  overflow-wrap:anywhere;
}

