/* ══════════════════ DOCS / PLAYGROUND THEME ══════════════════ */
.docs-page{background:#fff;color:#1F2937;font-family:'Poppins',sans-serif;min-height:100vh;display:flex;flex-direction:column;}
.docs-layout{display:flex;flex:1;padding-top:70px;}

/* ── MAIN CONTENT (full width, no sidebar) ── */
.docs-main{flex:1;margin:0 auto;padding:40px 5% 80px;max-width:960px;width:100%;}
.docs-main h1{font-size:2.2rem;font-weight:800;color:#0d1117;margin-bottom:0.6rem;letter-spacing:-0.02em;}
.docs-main h2{font-size:1.4rem;font-weight:700;color:#0d1117;margin:2.5rem 0 1rem;padding-bottom:0.5rem;border-bottom:1px solid #d0d7de;}
.docs-main h3{font-size:1.1rem;font-weight:600;color:#1F2937;margin:2rem 0 0.8rem;}
.docs-main p{font-size:0.9rem;line-height:1.8;color:#1F2937;margin-bottom:1rem;}
.docs-main ul,.docs-main ol{padding-left:1.5rem;margin-bottom:1.2rem;}
.docs-main li{font-size:0.9rem;line-height:1.8;color:#1F2937;margin-bottom:0.3rem;}
.docs-main a{color:#0969da;font-weight:500;}
.docs-main a:hover{text-decoration:underline;}
.docs-main strong{color:#0d1117;}
.docs-main code:not(pre code){background:#e8eaed;color:#cf222e;padding:2px 6px;border-radius:3px;font-size:0.82rem;}

/* In-page nav links */
.doc-nav-links{display:flex;flex-wrap:wrap;gap:8px;margin:1.5rem 0 2rem;padding:0.8rem 1rem;background:#f6f8fa;border:1px solid #d0d7de;border-radius:8px;}
.doc-nav-links a{font-size:0.8rem;padding:4px 12px;border-radius:4px;color:#57606a;text-decoration:none;transition:all 0.15s;border:1px solid transparent;}
.doc-nav-links a:hover{color:#0969da;background:#fff;border-color:#d0d7de;}
.doc-nav-links a.active{color:#0969da;background:#fff;border-color:#0969da;font-weight:600;}

/* Version bar */
.doc-version-bar{display:flex;align-items:center;gap:10px;margin-bottom:1.5rem;padding:10px 14px;background:#f6f8fa;border:1px solid #d0d7de;border-radius:8px;}
.doc-version-label{font-size:0.75rem;font-weight:600;text-transform:uppercase;letter-spacing:0.05em;color:#656d76;}
.doc-version-bar select{background:#fff;color:#1F2937;border:1px solid #d0d7de;border-radius:4px;padding:4px 8px;font-family:'Poppins',sans-serif;font-size:0.8rem;cursor:pointer;outline:none;}
.doc-version-bar select:focus{border-color:#0969da;}

/* ── PLAYGROUND ROW: form + phone side by side ── */
.pg-row{display:flex;gap:2rem;align-items:flex-start;margin-top:1.5rem;}
.pg-col-form{flex:1;min-width:0;}
.pg-col-phone{flex-shrink:0;width:240px;padding-top:1rem;}

/* Dark code blocks */
.docs-main pre{background:#0d1117;border:1px solid #30363d;border-radius:6px;padding:1.2rem 1.5rem;overflow-x:auto;margin:1rem 0;}
.docs-main pre code{background:none;color:#e6edf3;padding:0;font-size:0.8rem;line-height:1.7;font-family:'Courier New',monospace;}
.docs-main .ck{color:#bc8cff;font-weight:600;}
.docs-main .cs{color:#3fb950;}
.docs-main .cv{color:#d29922;}
.docs-main .cc{color:#8b949e;font-style:italic;}
.docs-main .cf{color:#58a6ff;}

/* Info / Warning boxes */
.doc-box{border:1px solid #d0d7de;border-radius:6px;padding:1rem 1.3rem;margin:1.2rem 0;font-size:0.88rem;background:#f6f8fa;}
.doc-info{border-color:#0969da;background:rgba(9,105,218,0.06);}
.doc-info::before{content:'\f05a';font-family:'Font Awesome 6 Free';font-weight:900;color:#0969da;margin-right:8px;}
.doc-warn{border-color:#cf222e;background:rgba(207,34,46,0.06);}
.doc-warn::before{content:'\f071';font-family:'Font Awesome 6 Free';font-weight:900;color:#cf222e;margin-right:8px;}

/* Endpoint box */
.endpoint-box{background:#f6f8fa;border:1px solid #d0d7de;border-radius:6px;padding:1rem 1.3rem;margin:1rem 0;display:flex;align-items:center;gap:1rem;flex-wrap:wrap;}
.endpoint-method{background:#2da44e;color:#fff;font-size:0.7rem;font-weight:700;padding:3px 8px;border-radius:3px;text-transform:uppercase;letter-spacing:0.05em;}
.endpoint-url{font-family:'Courier New',monospace;font-size:0.85rem;color:#0969da;word-break:break-all;}

/* Param table */
.param-table{width:100%;border-collapse:collapse;margin:1.2rem 0;border:1px solid #d0d7de;border-radius:6px;overflow:hidden;}
.param-table th,.param-table td{padding:0.8rem 1rem;text-align:left;font-size:0.82rem;border-bottom:1px solid #d0d7de;}
.param-table th{background:#f6f8fa;color:#0d1117;font-weight:600;}
.param-table tr:last-child td{border-bottom:none;}
.param-table td:first-child{font-family:'Courier New',monospace;color:#0969da;}
.param-table .req{color:#cf222e;font-weight:600;font-size:0.7rem;}

/* Dark response JSON */
.json-response{background:#0d1117;border:1px solid #30363d;border-radius:6px;padding:1.2rem 1.5rem;overflow-x:auto;margin:1rem 0;}
.json-response pre{margin:0;background:none;border:none;padding:0;}
.json-response code{background:none;color:#e6edf3;font-size:0.8rem;line-height:1.7;}

/* Language tabs */
.lang-tabs{display:flex;gap:0;border-bottom:2px solid #d0d7de;margin:1.2rem 0 0;}
.lang-tab{background:none;border:none;padding:0.6rem 1.2rem;font-family:'Poppins',sans-serif;font-size:0.8rem;font-weight:500;color:#656d76;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all 0.2s;}
.lang-tab:hover{color:#0969da;}
.lang-tab.active{color:#0969da;border-bottom-color:#0969da;}
.lang-content{display:none;}
.lang-content.active{display:block;}

/* Playground form */
.playground-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.pg-field{grid-column:span 1;}
.pg-field-wide{grid-column:span 2;}
.pg-field label{display:block;font-weight:600;font-size:0.82rem;color:#1F2937;margin-bottom:4px;}
.pg-field input,.pg-field textarea{width:100%;padding:9px 12px;border:1px solid #d0d7de;border-radius:6px;font-family:'Poppins',sans-serif;font-size:0.85rem;color:#1F2937;background:#fff;box-sizing:border-box;}
.pg-field input:focus,.pg-field textarea:focus{border-color:#0969da;outline:none;box-shadow:0 0 0 3px rgba(9,105,218,0.15);}
.pg-field textarea{resize:vertical;min-height:70px;}
.pg-req{color:#cf222e;}
.pg-btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:1rem;}

/* ── SMS Phone Animation ── */
.sms-animation-wrap{text-align:center;}
.sms-phone{display:inline-block;position:relative;width:200px;height:360px;background:#0d1117;border-radius:28px;border:3px solid #30363d;box-shadow:0 8px 32px rgba(0,0,0,0.15);overflow:hidden;text-align:left;}
.sms-phone-screen{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#1a1a2e;color:#fff;font-size:0.85rem;padding:20px;text-align:center;transition:opacity 0.5s;}
.sms-phone-screen .phone-icon{font-size:2.2rem;color:#58a6ff;margin-bottom:8px;}
.sms-phone-screen .phone-power{font-size:0.72rem;color:#8b949e;}
.sms-phone-screen .status-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:middle;}
.status-dot.off{background:#cf222e;}
.status-dot.on{background:#3fb950;box-shadow:0 0 6px rgba(63,185,80,0.6);}
.sms-msg-bubble{position:absolute;bottom:18px;right:14px;max-width:150px;background:#0969da;color:#fff;padding:7px 10px;border-radius:12px 12px 4px 12px;font-size:0.75rem;line-height:1.4;word-wrap:break-word;opacity:0;transform:translateY(20px);transition:all 0.6s ease;box-shadow:0 2px 10px rgba(9,105,218,0.3);}
.sms-msg-bubble.show{opacity:1;transform:translateY(0);}
.sms-msg-bubble .msg-sender{font-size:0.62rem;color:rgba(255,255,255,0.7);margin-bottom:2px;}
.sms-msg-bubble .msg-tail{position:absolute;bottom:0;right:-6px;width:0;height:0;border-style:solid;border-width:0 0 10px 10px;border-color:transparent transparent #0969da transparent;}

/* Copy button */
.copy-btn{position:absolute;top:8px;right:8px;background:#21262d;color:#8b949e;border:1px solid #30363d;border-radius:4px;padding:4px 10px;font-size:0.72rem;font-family:'Poppins',sans-serif;cursor:pointer;z-index:2;transition:all 0.15s;display:flex;align-items:center;gap:4px;}
.copy-btn:hover{background:#30363d;color:#e6edf3;}