/* ═══════════════════════════════════════════════════════════════════════════
   ATC Guide — Compass Virtual Airlines
   user/themes/compass-virtual/css/atc-guide.css

   ⚑ Lifted out of the page on 2026-09-16 so nothing under this page's folder
   carries a <style> or <script> tag, which Grav 2's markdown tagfilter escapes.

   ⚑ Class prefix ag- is used by this page alone.
   ═══════════════════════════════════════════════════════════════════════════ */

.ag-tabs{display:flex;border-bottom:2px solid #e8f0f3;margin-bottom:20px;flex-wrap:wrap;gap:0}
.ag-tab{padding:9px 16px;font-size:13px;font-weight:500;color:#8a9099;cursor:pointer;border:none;background:none;border-bottom:2px solid transparent;margin-bottom:-2px;font-family:inherit;transition:color 0.15s}
.ag-tab:hover{color:#4a7a8a}
.ag-tab.active{color:#4a7a8a;border-bottom-color:#c8962e}
.ag-panel{display:none}
.ag-panel.active{display:block}
.ag-intro{background:white;border-radius:8px;border:0.5px solid #dde0e4;padding:16px 20px;margin-bottom:16px;font-size:13px;color:#555;line-height:1.7}
.ag-intro strong{color:#4a7a8a}
.ag-section{background:white;border-radius:8px;border:0.5px solid #dde0e4;overflow:hidden;margin-bottom:12px}
.ag-section-title{background:#e8f0f3;padding:8px 14px;font-size:11px;font-weight:500;color:#4a7a8a;text-transform:uppercase;letter-spacing:0.5px;border-bottom:0.5px solid rgba(109,151,168,0.2)}
.ag-body{padding:14px 16px;font-size:13px;color:#555;line-height:1.75}
.ag-body p{margin:0 0 10px}
.ag-body p:last-child{margin:0}
.ag-body strong{color:#4a7a8a}
.ag-body ul{margin:6px 0 10px 18px;padding:0}
.ag-body ul li{margin-bottom:4px}
.ag-table{width:100%;border-collapse:collapse;font-size:12px;margin:8px 0}
.ag-table th{text-align:left;padding:7px 10px;font-size:11px;font-weight:500;color:#8a9099;background:#f7fafc;border-bottom:0.5px solid #e8f0f3}
.ag-table td{padding:7px 10px;border-bottom:0.5px solid #f0f2f3;color:#444}
.ag-table tr:last-child td{border-bottom:none}
.ag-table tr:hover td{background:#f7fafc}
.ag-table .mono{font-family:monospace;color:#4a7a8a;font-weight:600}
.ag-table .metric{font-family:monospace;color:#c8962e;font-weight:600}
.ag-tip{background:#fff8ee;border:0.5px solid rgba(200,150,46,0.4);border-radius:6px;padding:10px 14px;font-size:12px;color:#7a5010;line-height:1.6;margin:10px 0}
.ag-tip strong{color:#c8962e}
.ag-warn{background:#fef3f3;border:0.5px solid rgba(200,80,46,0.3);border-radius:6px;padding:10px 14px;font-size:12px;color:#7a2010;line-height:1.6;margin:10px 0}
.ag-warn strong{color:#c85030}
/* SVG diagram container */
.ag-diagram{display:flex;justify-content:center;padding:16px 14px;background:#fafbfc;border-top:0.5px solid #f0f2f3}
.ag-diagram svg{max-width:100%;height:auto}
/* Position report tool */
.ag-tool{background:white;border-radius:8px;border:0.5px solid #dde0e4;overflow:hidden;margin-bottom:12px}
.ag-tool-title{background:#1a3a4a;padding:10px 14px;font-size:12px;font-weight:500;color:white;letter-spacing:0.5px;text-transform:uppercase}
.ag-tool-body{padding:16px}
.ag-field-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.ag-field{display:flex;flex-direction:column;gap:4px}
.ag-field label{font-size:11px;color:#8a9099;text-transform:uppercase;letter-spacing:0.5px;font-weight:500}
.ag-field label .optional{color:#bbb;font-weight:400;text-transform:none;letter-spacing:0;font-size:10px;margin-left:4px}
.ag-field input,.ag-field select{padding:7px 10px;border:0.5px solid #dde0e4;border-radius:5px;font-size:13px;font-family:inherit;color:#333;background:white;outline:none}
.ag-field input:focus,.ag-field select:focus{border-color:#6d97a8}
.ag-field input::placeholder{color:#bbb}
.ag-field.full{grid-column:1/-1}
.ag-generate-btn{background:#4a7a8a;color:white;border:none;border-radius:5px;padding:9px 20px;font-size:13px;font-family:inherit;font-weight:500;cursor:pointer;width:100%;margin-bottom:12px;transition:background 0.15s}
.ag-generate-btn:hover{background:#3a6a7a}
.ag-output{display:none;margin-top:4px}
.ag-output-block{background:#0e1419;border-radius:6px;padding:14px 16px;margin-bottom:10px}
.ag-output-label{font-size:10px;color:#6d97a8;text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;display:flex;align-items:center;justify-content:space-between}
.ag-output-text{font-family:monospace;font-size:12px;color:#FFFDF9;line-height:1.8;white-space:pre-wrap}
.ag-copy-btn{background:rgba(109,151,168,0.2);color:#6d97a8;border:0.5px solid rgba(109,151,168,0.3);border-radius:3px;padding:2px 8px;font-size:10px;cursor:pointer;font-family:inherit;transition:all 0.15s}
.ag-copy-btn:hover{background:rgba(109,151,168,0.35);color:#FFFDF9}
.ag-copy-btn.copied{background:rgba(46,150,80,0.2);color:#2a9a5a;border-color:rgba(46,150,80,0.3)}
