/* Shared styles for the Team Leader portal and admin page */
  :root{--ink:#15171c;--muted:#6a6f78;--line:#e6e4df;--bg:#f5f3ef;--card:#fff;
    --accent:#b5121b;--good:#0e8a4e;--good-soft:#e8f6ee;--soft:#faf9f7;--warn:#8a4b12;--warn-soft:#fdf1e7}
  *{box-sizing:border-box}
  [hidden]{display:none!important}
  body{margin:0;background:var(--bg);color:var(--ink);
    font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
  .num{font-variant-numeric:tabular-nums}
  button{font:inherit;color:inherit}
  a{color:inherit}

  /* buttons */
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 14px;border:1px solid #d9d6cf;
    border-radius:10px;background:#fff;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;text-decoration:none}
  .btn:hover{border-color:var(--ink)}
  .btn.primary{background:var(--ink);border-color:var(--ink);color:#fff}.btn.primary:hover{background:#000}
  .btn.big{padding:14px 18px;font-size:15px;border-radius:12px}
  .btn.danger{color:var(--accent)}.btn.danger:hover{border-color:var(--accent)}
  .btn.ghost{border-color:transparent;background:transparent}.btn.ghost:hover{background:#fff;border-color:#d9d6cf}
  .btn.ok{border-color:var(--good)!important;color:var(--good)}

  /* top bar */
  .top{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
  .top .in{max-width:1000px;margin:0 auto;padding:12px 16px;display:flex;align-items:center;gap:12px}
  .brand-logo{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;overflow:hidden;flex:none;
    background:var(--accent);color:#fff;font-weight:800;font-size:15px}
  .brand-logo.img{background:#fff;border:1px solid var(--line)}
  .brand-logo img{max-width:100%;max-height:100%;object-fit:contain}
  .who b{display:block;font-size:14px;line-height:1.2}.who span{font-size:12px;color:var(--muted)}
  .top .sp{flex:1}

  .wrap{max-width:1000px;margin:0 auto;padding:30px 16px 80px}
  h1{font-size:28px;letter-spacing:-.02em;margin:0}
  .head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;flex-wrap:wrap}

  /* login */
  .login{max-width:400px;margin:14vh auto 0;padding:0 16px}
  .login .eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:700}
  .login h1{margin:8px 0 6px;font-size:30px}
  .login p{color:var(--muted);margin:0 0 22px}
  .card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px;
    box-shadow:0 1px 2px rgba(0,0,0,.03),0 12px 32px -18px rgba(0,0,0,.18)}

  /* stats */
  .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}
  .stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px}
  .stat .k{font-size:12px;color:var(--muted)}
  .stat .v{font-size:26px;font-weight:800;letter-spacing:-.02em}
  .stat .v small{font-size:13px;font-weight:600;color:var(--muted);margin-left:4px}

  /* toolbar */
  .toolbar{display:flex;gap:10px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
  .tabs{display:flex;background:#ebe8e2;border-radius:10px;padding:3px}
  .tabs button{border:0;background:transparent;padding:6px 12px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;color:var(--muted)}
  .tabs button.on{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}
  .search{flex:1;min-width:180px}

  /* offers */
  .offer{background:#fff;border:1px solid var(--line);border-radius:14px;margin-bottom:10px;overflow:hidden}
  .orow{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1.2fr) auto;gap:16px;align-items:center;padding:16px 18px}
  .oname{font-weight:700;font-size:16px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  .osub{font-size:13px;color:var(--muted)}
  .chip{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:2px 8px;border-radius:99px}
  .chip.active{background:var(--good-soft);color:var(--good)}
  .chip.revoked{background:#f1eeee;color:#7d1016}
  .chip.expired{background:var(--warn-soft);color:var(--warn)}
  .track{display:flex;align-items:center;gap:10px}
  .dot{width:10px;height:10px;border-radius:50%;background:#cfccc5;flex:none}
  .dot.on{background:var(--good);box-shadow:0 0 0 4px rgba(14,138,78,.15)}
  .track b{font-size:14px;display:block}.track span{font-size:12px;color:var(--muted)}
  .badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
  .badge{font-size:11px;font-weight:600;padding:2px 8px;border-radius:6px;background:#f0eee9;color:#4b4f57}
  .badge.hot{background:#fdecec;color:#7d1016}
  .acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
  .activity{border-top:1px solid var(--line);background:var(--soft);padding:12px 18px;font-size:13px}
  .activity ul{list-style:none;margin:0;padding:0}
  .activity li{display:flex;gap:10px;padding:5px 0;border-bottom:1px dashed #e4e1da}
  .activity li:last-child{border-bottom:0}
  .activity time{color:var(--muted);min-width:170px}
  .empty{text-align:center;padding:50px 16px;color:var(--muted);background:#fff;border:1px dashed #d9d6cf;border-radius:14px}
  .empty b{display:block;color:var(--ink);font-size:17px;margin-bottom:4px}

  /* forms */
  label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
  label .opt{font-weight:400;color:var(--muted)}
  input[type=text],input[type=email],input[type=tel],input[type=number],input[type=url],input[type=date],input[type=password],select,textarea{
    width:100%;padding:11px 13px;border:1px solid #d9d6cf;border-radius:10px;background:#fff;font:inherit;color:inherit}
  textarea{resize:vertical;min-height:80px}
  input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(181,18,27,.12)}
  .grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .full{grid-column:1/-1}
  .hint{font-size:12px;color:var(--muted);margin-top:5px}
  .count{float:right;font-weight:400;color:var(--muted)}
  .section{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700;
    margin:22px 0 12px;padding-top:18px;border-top:1px solid var(--line)}
  .section:first-child{margin-top:0;padding-top:0;border-top:0}
  .err{color:var(--accent);font-size:13px;margin-top:10px}
  .slider-head{display:flex;justify-content:space-between;align-items:baseline}
  .slider-head b{font-size:20px}.slider-head b small{font-size:12px;color:var(--muted);font-weight:500;margin-left:6px}
  input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:8px;border-radius:99px;background:#ecebe7;outline:none;cursor:pointer;margin:12px 0 4px}
  input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:#fff;border:1px solid #d6d3cc;box-shadow:0 2px 6px rgba(0,0,0,.18)}
  input[type=range]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:#fff;border:1px solid #d6d3cc;box-shadow:0 2px 6px rgba(0,0,0,.18)}
  .ends{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}
  .preview{margin-top:16px;border-radius:14px;background:var(--soft);border:1px solid var(--line);padding:14px 16px}
  .preview .ttl{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:8px}
  .pv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
  .pv-grid .k{font-size:12px;color:var(--muted)}
  .pv-grid .v{font-size:20px;font-weight:700}.pv-grid .v.good{color:var(--good)}
  .pv-line{font-size:13px;color:var(--muted);margin-top:8px}
  .toggle{display:flex;align-items:flex-start;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);cursor:pointer;margin:0;font-weight:400}
  .toggle:last-of-type{border-bottom:0}
  .toggle input{position:absolute;opacity:0;pointer-events:none}
  .sw{flex:none;width:40px;height:24px;border-radius:99px;background:#d7d4cd;position:relative;transition:background .15s;margin-top:1px}
  .sw:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .15s}
  .toggle input:checked + .sw{background:var(--good)}
  .toggle input:checked + .sw:after{transform:translateX(16px)}
  .toggle input:focus-visible + .sw{box-shadow:0 0 0 3px rgba(14,138,78,.25)}
  .toggle b{display:block;font-size:14px}.toggle span.d{font-size:13px;color:var(--muted)}

  /* modal */
  .modal{position:fixed;inset:0;background:rgba(21,23,28,.45);display:flex;align-items:flex-start;justify-content:center;
    padding:40px 16px;overflow:auto;z-index:20}
  .sheet{background:#fff;border-radius:18px;width:100%;max-width:640px;box-shadow:0 30px 80px -20px rgba(0,0,0,.4)}
  .sheet-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line)}
  .sheet-head h2{margin:0;font-size:19px;letter-spacing:-.01em}
  .sheet-body{padding:20px 22px}
  .sheet-foot{display:flex;gap:10px;justify-content:flex-end;padding:16px 22px;border-top:1px solid var(--line);background:var(--soft);border-radius:0 0 18px 18px}
  .x{border:0;background:transparent;font-size:22px;cursor:pointer;color:var(--muted);line-height:1}
  .linkbox{background:var(--good-soft);border:1px solid #cfe7d8;border-radius:12px;padding:16px}
  .linkbox input{font-size:15px;font-weight:600}
  .notice{background:var(--warn-soft);color:var(--warn);border-radius:10px;padding:10px 12px;font-size:13px;margin-bottom:14px}

  .toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);opacity:0;background:var(--ink);color:#fff;
    padding:10px 16px;border-radius:10px;font-size:14px;transition:all .25s;pointer-events:none;z-index:30}
  .toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

  @media (max-width:760px){
    .stats{grid-template-columns:1fr 1fr}
    .orow{grid-template-columns:1fr}
    .acts{justify-content:flex-start}
    .grid,.pv-grid{grid-template-columns:1fr}
    .activity time{min-width:0}
    .modal{padding:0}.sheet{border-radius:0;min-height:100%}
    .who span{display:none}
  }