/* BBTM Admin Console 1.0.0 */
#bbtm-ac-root{
  --blue:#1a6eb5; --blue-d:#134f86; --blue-deep:#0e3e6b;
  --purple:#534AB7; --gold:#F0B429; --gold-lt:#ffd54a;
  --ink:#1b2a48; --muted:#6c7a93; --line:#e7eef7; --soft:#f5f8fc;
  --green:#22a565; --red:#e05656;
  position:fixed; inset:0; z-index:99999; background:#eef3fa;
  display:flex; flex-direction:column; overflow:hidden;
  font-family:'Nunito',-apple-system,Segoe UI,sans-serif; color:var(--ink);
}
#bbtm-ac-root *{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
#bbtm-ac-root button{font-family:inherit}
@media(min-width:560px){
  #bbtm-ac-root{max-width:480px;left:50%;transform:translateX(-50%);box-shadow:0 0 60px rgba(0,0,0,.18)}
}

/* ---------- Lock / setup ---------- */
#bbtm-ac-root .lock{position:absolute;inset:0;z-index:50;background:linear-gradient(165deg,var(--blue),var(--blue-deep));
  color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;overflow-y:auto}
#bbtm-ac-root .lk-logo{width:66px;height:66px;border-radius:20px;background:rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;font-size:34px;margin-bottom:14px}
#bbtm-ac-root .lock h1{font-family:'Oswald',sans-serif;font-weight:700;font-size:1.5rem;margin:0;text-align:center}
#bbtm-ac-root .lock p{opacity:.85;font-size:13px;font-weight:700;margin:8px 0 22px;text-align:center;max-width:300px;line-height:1.5}
#bbtm-ac-root .dots{display:flex;gap:14px;margin-bottom:26px}
#bbtm-ac-root .dots i{width:15px;height:15px;border-radius:50%;border:2px solid rgba(255,255,255,.6);transition:.15s}
#bbtm-ac-root .dots i.on{background:var(--gold);border-color:var(--gold)}
#bbtm-ac-root .pad{display:grid;grid-template-columns:repeat(3,70px);gap:15px}
#bbtm-ac-root .key{height:70px;border-radius:50%;border:none;background:rgba(255,255,255,.12);color:#fff;font-family:'Oswald',sans-serif;font-weight:600;font-size:1.7rem;cursor:pointer}
#bbtm-ac-root .key:active{background:rgba(255,255,255,.3)}
#bbtm-ac-root .key.blank{background:none;cursor:default}
#bbtm-ac-root .lk-err{color:#ffd1d1;font-size:13px;font-weight:800;margin-top:18px;min-height:18px;text-align:center}
#bbtm-ac-root .lk-field{width:100%;max-width:320px;margin-bottom:13px}
#bbtm-ac-root .lk-field label{display:block;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;opacity:.8;margin:0 2px 6px}
#bbtm-ac-root .lk-field input{width:100%;border:none;border-radius:12px;padding:14px 15px;font-family:inherit;font-size:15px;outline:none;background:rgba(255,255,255,.95);color:var(--ink)}
#bbtm-ac-root .lk-btn{width:100%;max-width:320px;border:none;border-radius:12px;padding:14px;margin-top:6px;cursor:pointer;
  font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.04em;font-size:.95rem;
  background:linear-gradient(150deg,var(--gold-lt),var(--gold));color:#4a3500}
#bbtm-ac-root .lk-note{margin-top:18px;font-size:11.5px;opacity:.7;font-weight:700;text-align:center;max-width:300px;line-height:1.5}
#bbtm-ac-root .lk-link{background:none;border:none;color:#cfe2ff;font-weight:800;font-size:12.5px;margin-top:16px;cursor:pointer;text-decoration:underline}

/* ---------- App bar ---------- */
#bbtm-ac-root .appbar{background:linear-gradient(150deg,var(--blue),var(--blue-d));color:#fff;
  padding:calc(16px + env(safe-area-inset-top)) 18px 16px;display:flex;align-items:center;gap:12px;position:relative;flex:0 0 auto}
#bbtm-ac-root .appbar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:4px;background:linear-gradient(90deg,var(--gold),var(--gold-lt))}
#bbtm-ac-root .logo{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;font-size:22px;flex:0 0 auto}
#bbtm-ac-root .appbar h1{font-family:'Oswald',sans-serif;font-weight:700;font-size:1.25rem;margin:0;line-height:1}
#bbtm-ac-root .appbar .sub{font-size:11.5px;opacity:.82;margin-top:3px;font-weight:700}
#bbtm-ac-root .lockbtn{margin-left:auto;display:flex;align-items:center;gap:6px;height:40px;padding:0 15px;border-radius:999px;background:rgba(255,255,255,.18);border:none;color:#fff;cursor:pointer;flex:0 0 auto;font-family:'Oswald',sans-serif;font-weight:600;font-size:.82rem;letter-spacing:.03em;text-transform:uppercase}
#bbtm-ac-root .lockbtn:active{background:rgba(255,255,255,.32)}
#bbtm-ac-root .lockbtn .li{font-size:18px;line-height:1}

/* ---------- Screens ---------- */
#bbtm-ac-root .screens{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch}
#bbtm-ac-root .screen{display:none;padding:18px 16px 26px;animation:acfade .25s ease}
#bbtm-ac-root .screen.active{display:block}
@keyframes acfade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
#bbtm-ac-root .sec-title{font-family:'Oswald',sans-serif;font-weight:600;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:4px 2px 11px}
#bbtm-ac-root .card{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 6px 18px rgba(26,110,181,.07)}
#bbtm-ac-root .loading{text-align:center;color:var(--muted);font-weight:700;padding:34px 10px}
#bbtm-ac-root .empty{text-align:center;color:var(--muted);font-weight:700;font-size:13px;padding:30px 10px;line-height:1.6}

/* Home */
#bbtm-ac-root .hello{padding:16px 17px;margin-bottom:14px;background:linear-gradient(150deg,#fff,#f3f8ff)}
#bbtm-ac-root .hello h2{font-family:'Oswald',sans-serif;font-weight:700;font-size:1.45rem;margin:0 0 3px}
#bbtm-ac-root .hello p{margin:0;color:var(--muted);font-size:13px;font-weight:700}
#bbtm-ac-root .tiles{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:6px}
#bbtm-ac-root .tile{padding:15px 14px;cursor:pointer;text-align:left;border:none;width:100%;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:0 6px 18px rgba(26,110,181,.07)}
#bbtm-ac-root .tile .ic{font-size:24px}
#bbtm-ac-root .tile .n{font-family:'Oswald',sans-serif;font-weight:700;font-size:1.85rem;line-height:1;margin:7px 0 2px}
#bbtm-ac-root .tile .l{font-size:12px;color:var(--muted);font-weight:700}
#bbtm-ac-root .tile.acc{background:linear-gradient(155deg,var(--purple),#433a9e);border-color:transparent;color:#fff}
#bbtm-ac-root .tile.acc .l{color:rgba(255,255,255,.85)}
#bbtm-ac-root .tile.gold{background:linear-gradient(155deg,var(--gold-lt),var(--gold));border-color:transparent;color:#4a3500}
#bbtm-ac-root .tile.gold .l{color:#6a4d00}

/* Requests */
#bbtm-ac-root .req{padding:15px 16px;margin-bottom:13px}
#bbtm-ac-root .req .top{display:flex;align-items:center;gap:11px;margin-bottom:10px}
#bbtm-ac-root .av{width:42px;height:42px;border-radius:50%;flex:0 0 auto;display:flex;align-items:center;justify-content:center;font-family:'Oswald',sans-serif;font-weight:600;color:#fff;font-size:17px;overflow:hidden;background:#9fb4cc}
#bbtm-ac-root .av img{width:100%;height:100%;object-fit:cover}
#bbtm-ac-root .req .who{font-weight:800;font-size:14.5px}
#bbtm-ac-root .req .what{font-size:12.5px;color:var(--muted);margin-top:1px}
#bbtm-ac-root .req .what b{color:var(--purple);font-weight:800}
#bbtm-ac-root .reason{background:var(--soft);border:1px solid var(--line);border-radius:11px;padding:10px 13px;font-size:13.5px;line-height:1.45;color:#33425c;margin-bottom:12px;white-space:pre-wrap;word-break:break-word}
#bbtm-ac-root .btnrow{display:flex;gap:9px}
#bbtm-ac-root .btn{flex:1;border:none;border-radius:11px;padding:11px;font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.04em;font-size:.82rem;cursor:pointer}
#bbtm-ac-root .btn.ok{background:linear-gradient(150deg,#2bbd76,#1d9a5e);color:#fff}
#bbtm-ac-root .btn.no{background:#fff;border:1.5px solid #f0c9c9;color:var(--red)}
#bbtm-ac-root .btn.ghost{background:var(--soft);border:1px solid var(--line);color:var(--ink)}
#bbtm-ac-root .btn.full{flex:none;width:100%}
#bbtm-ac-root .btn:disabled{opacity:.6}

/* Mail */
#bbtm-ac-root .mailitem{padding:14px 15px;margin-bottom:11px;cursor:pointer}
#bbtm-ac-root .mailitem .top{display:flex;align-items:center;gap:11px}
#bbtm-ac-root .mailitem .who{font-weight:800;font-size:14px;flex:1}
#bbtm-ac-root .mailitem .time{font-size:11px;color:var(--muted);font-weight:700}
#bbtm-ac-root .mailitem .unread{width:9px;height:9px;border-radius:50%;background:var(--purple);flex:0 0 auto}
#bbtm-ac-root .mailitem .cat{display:inline-block;font-size:10px;font-weight:800;background:#eef4fb;color:var(--blue);border-radius:999px;padding:2px 8px;margin-top:7px}
#bbtm-ac-root .mailitem .prev{font-size:13px;color:var(--muted);margin:7px 0 0;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#bbtm-ac-root .mailitem.open .prev{display:none}
#bbtm-ac-root .thread{margin-top:11px;border-top:1px dashed var(--line);padding-top:12px;display:none}
#bbtm-ac-root .mailitem.open .thread{display:block}
#bbtm-ac-root .bubble{background:var(--soft);border-radius:12px;padding:11px 13px;font-size:13.5px;line-height:1.5;color:#33425c;margin-bottom:10px;white-space:pre-wrap;word-break:break-word}
#bbtm-ac-root .reply{display:flex;gap:8px}
#bbtm-ac-root .reply textarea{flex:1;border:1.5px solid var(--line);border-radius:14px;padding:10px 14px;font-family:inherit;font-size:13.5px;background:#fbfdff;outline:none;resize:vertical;min-height:42px}
#bbtm-ac-root .reply textarea:focus{border-color:var(--blue)}
#bbtm-ac-root .reply button{border:none;border-radius:14px;background:linear-gradient(150deg,var(--gold-lt),var(--gold));color:#4a3500;font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;font-size:.78rem;padding:10px 16px;cursor:pointer;align-self:flex-end}

/* Credits */
#bbtm-ac-root .search{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:14px;box-shadow:0 6px 18px rgba(26,110,181,.07)}
#bbtm-ac-root .search input{flex:1;border:none;outline:none;font-family:inherit;font-size:14.5px;background:none}
#bbtm-ac-root .sresult{padding:12px 14px;margin-bottom:9px;display:flex;align-items:center;gap:11px;cursor:pointer}
#bbtm-ac-root .sresult .who{font-weight:800;font-size:14px}
#bbtm-ac-root .sresult .em{font-size:11.5px;color:var(--muted)}
#bbtm-ac-root .sresult .bal{margin-left:auto;font-family:'Oswald',sans-serif;font-weight:700;color:var(--purple)}
#bbtm-ac-root .mcard{padding:16px;margin-bottom:14px}
#bbtm-ac-root .mcard .top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
#bbtm-ac-root .mcard .bal{margin-left:auto;text-align:right}
#bbtm-ac-root .mcard .bal .num{font-family:'Oswald',sans-serif;font-weight:700;font-size:1.5rem;line-height:1;color:var(--purple)}
#bbtm-ac-root .mcard .bal .lab{font-size:10.5px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.05em}
#bbtm-ac-root .chips{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}
#bbtm-ac-root .chip{flex:1;min-width:60px;border:1.5px solid var(--line);background:var(--soft);border-radius:11px;padding:11px 0;font-family:'Oswald',sans-serif;font-weight:600;font-size:1rem;cursor:pointer;text-align:center;color:var(--ink)}
#bbtm-ac-root .chip.sel{border-color:var(--purple);background:#efeefb;color:var(--purple)}
#bbtm-ac-root .custom{display:flex;gap:9px;margin-bottom:13px}
#bbtm-ac-root .custom input{flex:1;border:1.5px solid var(--line);border-radius:11px;padding:11px 14px;font-family:inherit;font-size:14px;outline:none;background:#fbfdff}

/* Announce */
#bbtm-ac-root .field{margin-bottom:13px}
#bbtm-ac-root .field label{display:block;font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:0 2px 6px}
#bbtm-ac-root .field input,#bbtm-ac-root .field textarea{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;font-family:inherit;font-size:14px;outline:none;background:#fbfdff;resize:vertical}
#bbtm-ac-root .field input:focus,#bbtm-ac-root .field textarea:focus{border-color:var(--blue)}
#bbtm-ac-root .toggle{display:flex;align-items:center;gap:12px;padding:13px 15px;margin-bottom:11px}
#bbtm-ac-root .toggle .tx{flex:1}
#bbtm-ac-root .toggle .tx b{font-size:14px;display:block}
#bbtm-ac-root .toggle .tx span{font-size:11.5px;color:var(--muted)}
#bbtm-ac-root .sw{width:48px;height:28px;border-radius:999px;background:#d3deec;position:relative;flex:0 0 auto;transition:.2s;cursor:pointer}
#bbtm-ac-root .sw::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
#bbtm-ac-root .sw.on{background:var(--green)}
#bbtm-ac-root .sw.on::after{left:23px}

/* Tab bar */
#bbtm-ac-root .tabbar{flex:0 0 auto;display:flex;background:#fff;border-top:1px solid var(--line);padding:8px 2px calc(8px + env(safe-area-inset-bottom))}
#bbtm-ac-root .tab{flex:1;border:none;background:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 0;color:#9aa8bd;position:relative}
#bbtm-ac-root .tab .ti{font-size:20px;line-height:1}
#bbtm-ac-root .tab .tl{font-size:10px;font-weight:800}
#bbtm-ac-root .tab.active{color:var(--purple)}
#bbtm-ac-root .tab .badge{position:absolute;top:0;right:50%;transform:translateX(16px);background:var(--red);color:#fff;font-size:9.5px;font-weight:800;min-width:16px;height:16px;border-radius:9px;display:none;align-items:center;justify-content:center;padding:0 4px}
#bbtm-ac-root .tab .badge.show{display:flex}

/* Toast */
#bbtm-ac-root .toast{position:absolute;left:50%;bottom:92px;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:11px 18px;border-radius:999px;font-weight:800;font-size:13px;opacity:0;pointer-events:none;transition:.28s;white-space:nowrap;z-index:9;box-shadow:0 10px 26px rgba(0,0,0,.3)}
#bbtm-ac-root .toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
