/* ============================================================
   DMR TERMINAL v7.0 — assets/v7.css
   Additive stylesheet — extends ../dmr-terminal/assets/style.css
   Only NEW v7.0 elements are defined here.
   ============================================================ */

/* ─────────────────────────────────────────────────────────── */
/* [1] PING / LATENCY BADGE                                    */
/* ─────────────────────────────────────────────────────────── */
.ping-badge {
  display:       flex;
  align-items:   center;
  gap:           4px;
  font-family:   var(--ffm, 'Share Tech Mono', monospace);
  font-size:     .6rem;
  letter-spacing:.05em;
  color:         var(--txt3, #4a6a4a);
  padding:       2px 6px;
  border:        1px solid var(--bdr, rgba(0,180,0,.15));
  border-radius: 3px;
  background:    rgba(0,0,0,.25);
  min-width:     52px;
}
.ping-dot {
  width:  6px;
  height: 6px;
  border-radius: 50%;
  background: var(--txt3, #4a6a4a);
  flex-shrink: 0;
  transition: background .4s;
}
.ping-dot.good { background: #22c55e; box-shadow: 0 0 4px #22c55e80; }
.ping-dot.warn { background: #f59e0b; box-shadow: 0 0 4px #f59e0b80; }
.ping-dot.bad  { background: #ef4444; box-shadow: 0 0 4px #ef444480; }

/* ─────────────────────────────────────────────────────────── */
/* [2] SHARE TOAST                                             */
/* ─────────────────────────────────────────────────────────── */
.share-toast {
  position:   fixed;
  bottom:     24px;
  left:       50%;
  transform:  translateX(-50%) translateY(16px);
  background: var(--grn, #00b400);
  color:      #000;
  font-family: var(--ffm, 'Share Tech Mono', monospace);
  font-size:  .72rem;
  letter-spacing: .12em;
  padding:    8px 20px;
  border-radius: 4px;
  opacity:    0;
  pointer-events: none;
  transition: opacity .25s, transform .25s;
  z-index:    99999;
  white-space: nowrap;
}
.share-toast.visible {
  opacity:   1;
  transform: translateX(-50%) translateY(0);
}

/* ─────────────────────────────────────────────────────────── */
/* [3] KEYBOARD SHORTCUTS TABLE                               */
/* ─────────────────────────────────────────────────────────── */
.kb-table {
  width:           100%;
  border-collapse: collapse;
  font-family:     var(--ffm, 'Share Tech Mono', monospace);
  font-size:       .75rem;
  color:           var(--txt, #4dff4d);
}
.kb-table tr {
  border-bottom: 1px solid var(--bdr, rgba(0,180,0,.12));
}
.kb-table tr:last-child { border-bottom: none; }
.kb-table td {
  padding: 7px 10px;
  vertical-align: middle;
}
.kb-table td:first-child {
  width:      120px;
  text-align: left;
}
kbd {
  display:       inline-block;
  font-family:   var(--ffm, 'Share Tech Mono', monospace);
  font-size:     .68rem;
  background:    rgba(0,180,0,.12);
  border:        1px solid var(--grn, rgba(0,180,0,.4));
  border-radius: 3px;
  padding:       2px 7px;
  color:         var(--grn, #00b400);
  letter-spacing:.05em;
  white-space:   nowrap;
}

/* ─────────────────────────────────────────────────────────── */
/* [4] CUSTOM TG DOT (marker for custom entries)              */
/* ─────────────────────────────────────────────────────────── */
.tg-custom-dot {
  display:       inline-block;
  width:         5px;
  height:        5px;
  border-radius: 50%;
  background:    var(--grn, #00b400);
  margin-left:   5px;
  vertical-align: middle;
  opacity:       .7;
}

/* ─────────────────────────────────────────────────────────── */
/* [5] TG HISTORY SECTION in modal                            */
/* ─────────────────────────────────────────────────────────── */
#tgHistSection .tg-section-label::before {
  content: '';
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--grn, #00b400);
  margin-right: 7px;
  vertical-align: middle;
  animation: pulse-dot 1.5s ease-in-out infinite;
}
@keyframes pulse-dot {
  0%, 100% { opacity: 1; }
  50%       { opacity: .3; }
}

/* ─────────────────────────────────────────────────────────── */
/* [6] ACTIVE STATE for top-bar icon buttons                  */
/* ─────────────────────────────────────────────────────────── */
.theme-toggle-btn.active {
  background: rgba(0,180,0,.18);
  border-color: var(--grn, rgba(0,180,0,.5));
  color: var(--grn, #00b400);
}
.theme-toggle-btn.active svg {
  stroke: var(--grn, #00b400);
}

/* ─────────────────────────────────────────────────────────── */
/* [9] STATS BAR — 5-column responsive override               */
/* ─────────────────────────────────────────────────────────── */
@media(max-width:580px){
  #statsBar { grid-template-columns: repeat(3,1fr) !important; }
  #statsBar .sc:nth-child(3){ border-right: none !important; }
  #statsBar .sc:nth-child(4){ border-top: 1px solid #222 !important; }
}

/* ─────────────────────────────────────────────────────────── */
/* THEME OVERRIDES — ensure v7 elements match each theme      */
/* ─────────────────────────────────────────────────────────── */
[data-theme="blue"]    .ping-dot.good { background: #22c55e; }
[data-theme="amber"]   .ping-dot.good { background: #f59e0b; }
[data-theme="night"]   .ping-dot.good { background: #ef4444; }
[data-theme="blue"]    kbd { background:rgba(0,120,255,.12); border-color:rgba(0,120,255,.4); color:#4da6ff; }
[data-theme="amber"]   kbd { background:rgba(255,160,0,.12); border-color:rgba(255,160,0,.4);  color:#ffa500; }
[data-theme="night"]   kbd { background:rgba(255,60,60,.12); border-color:rgba(255,60,60,.4);  color:#ff4444; }
[data-theme="p25"]     kbd { background:rgba(0,200,220,.12); border-color:rgba(0,200,220,.4);  color:#00dce0; }
[data-theme="hytera"]  kbd { background:rgba(200,210,220,.12);border-color:rgba(200,210,220,.4);color:#ccd2dc; }
[data-theme="kenwood"] kbd { background:rgba(0,190,160,.12); border-color:rgba(0,190,160,.4);  color:#00bea0; }
[data-theme="military"]kbd { background:rgba(100,140,60,.12);border-color:rgba(100,140,60,.4); color:#7a9a40; }

[data-theme="blue"]    .share-toast { background:#4da6ff; }
[data-theme="amber"]   .share-toast { background:#ffa500; }
[data-theme="night"]   .share-toast { background:#ff4444; color:#fff; }
[data-theme="p25"]     .share-toast { background:#00dce0; color:#000; }
[data-theme="hytera"]  .share-toast { background:#ccd2dc; color:#000; }
[data-theme="kenwood"] .share-toast { background:#00bea0; color:#000; }
[data-theme="military"].share-toast { background:#7a9a40; color:#000; }