/* ===== Bugnet Docs — Shared Styles ===== */

:root {
  --cream:#FFFBF3;--cream2:#FFF6E8;--cream3:#FEF0D4;--paper:#F9F3E8;
  --coral:#E8624A;--coral-lt:#FBEAE6;--coral-md:#F4A38F;
  --sage:#4A7C6F;--sage-lt:#E4F0ED;--sage-md:#8ABCB2;
  --mustard:#D4953A;--mustard-lt:#FDF3E1;
  --navy:#1E2B3A;--ink:#2C2416;--ink2:#5C4F3D;--ink3:#9C8E7A;--ink4:#C8BDAD;--border:#E8DFD0;
  --f-head:'Fraunces',serif;--f-body:'Nunito',sans-serif;--f-hand:'Fraunces',serif;
  --shadow-sm:0 2px 8px rgba(44,36,22,0.08);--shadow-md:0 6px 24px rgba(44,36,22,0.10);--shadow-lg:0 16px 48px rgba(44,36,22,0.12);
  --sidebar-w:260px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;scroll-padding-top:88px;overflow-x:hidden;}
body{background:var(--cream);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.65;}
a{color:inherit;text-decoration:none;}
.container{max-width:1180px;margin:0 auto;padding:0 28px;}


/* ===== HERO ===== */
.docs-hero{padding:56px 0 36px;text-align:center;position:relative;overflow:visible;}
.docs-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 30% 20%,rgba(232,98,74,0.06),transparent 50%),radial-gradient(ellipse at 70% 80%,rgba(74,124,111,0.05),transparent 50%);}
.docs-hero h1{font-family:var(--f-head);font-size:clamp(28px,4vw,44px);font-weight:900;line-height:1.1;letter-spacing:-0.03em;margin-bottom:12px;position:relative;}
.docs-hero h1 em{font-style:italic;color:var(--coral);}
.docs-hero p{font-size:16px;color:var(--ink2);max-width:520px;margin:0 auto;line-height:1.7;position:relative;}

/* ===== SEARCH (hero) ===== */
.hero-search{max-width:480px;margin:24px auto 0;position:relative;z-index:50;}
.hero-search input{width:100%;padding:14px 20px 14px 46px;border:2px solid var(--border);border-radius:12px;font-family:var(--f-body);font-size:15px;background:white;color:var(--ink);outline:none;transition:border-color 0.2s,box-shadow 0.2s;}
.hero-search input:focus{border-color:var(--coral);box-shadow:0 0 0 4px rgba(232,98,74,0.1);}
.hero-search input::placeholder{color:var(--ink4);}
.hero-search svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--ink3);pointer-events:none;}
.search-results{position:absolute;top:calc(100% + 6px);left:0;right:0;background:white;border:1.5px solid var(--border);border-radius:12px;box-shadow:var(--shadow-md);max-height:360px;overflow-y:auto;z-index:200;display:none;}
.search-results.open{display:block;}
.search-results a{display:block;padding:12px 18px;font-size:14px;font-weight:600;color:var(--ink2);border-bottom:1px solid var(--border);transition:background 0.1s;}
.search-results a:last-child{border-bottom:none;}
.search-results a:hover,.search-results a.focused{background:var(--coral-lt);color:var(--coral);}
.search-results a small{display:block;font-weight:400;font-size:12px;color:var(--ink3);margin-top:2px;}
.search-results .no-results{padding:18px;text-align:center;color:var(--ink3);font-size:14px;}

/* ===== CATEGORY CARDS (index page) ===== */
.doc-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;padding:12px 0 80px;}
.doc-card{background:white;border:1.5px solid var(--border);border-radius:16px;padding:28px 24px;transition:all 0.2s;display:flex;flex-direction:column;gap:10px;}
.doc-card:hover{border-color:var(--coral-md);transform:translateY(-3px);box-shadow:var(--shadow-md);}
.doc-card-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;}
.doc-card h3{font-family:var(--f-head);font-size:18px;font-weight:700;color:var(--ink);}
.doc-card p{font-size:14px;color:var(--ink2);line-height:1.6;flex:1;}
.doc-card .card-link{font-size:13px;font-weight:700;color:var(--coral);display:inline-flex;align-items:center;gap:4px;margin-top:4px;}

/* ===== LAYOUT ===== */
.docs-layout{display:grid;grid-template-columns:var(--sidebar-w) 1fr;gap:48px;padding:40px 0 96px;align-items:start;}

/* ===== SIDEBAR ===== */
.docs-sidebar{position:sticky;top:80px;align-self:start;max-height:calc(100vh - 96px);overflow-y:auto;padding-bottom:24px;}
.sidebar-search{position:relative;margin-bottom:18px;}
.sidebar-search input{width:100%;padding:9px 14px 9px 36px;border:1.5px solid var(--border);border-radius:8px;font-family:var(--f-body);font-size:13px;background:white;color:var(--ink);outline:none;transition:border-color 0.2s;}
.sidebar-search input:focus{border-color:var(--coral);}
.sidebar-search input::placeholder{color:var(--ink4);}
.sidebar-search svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--ink3);pointer-events:none;width:16px;height:16px;}

.sidebar-section{margin-bottom:6px;}
.sidebar-heading{display:flex;align-items:center;justify-content:space-between;padding:8px 0;cursor:pointer;user-select:none;}
.sidebar-heading h4{font-family:var(--f-hand);font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ink3);font-weight:400;}
.sidebar-heading svg{width:14px;height:14px;color:var(--ink4);transition:transform 0.2s;flex-shrink:0;}
.sidebar-section.collapsed .sidebar-heading svg{transform:rotate(-90deg);}
.sidebar-section.collapsed .sidebar-links{display:none;}
.sidebar-links a{display:block;font-size:13.5px;font-weight:600;color:var(--ink2);padding:6px 14px;border-radius:8px;margin-bottom:1px;transition:all 0.12s;border-left:2px solid transparent;}
.sidebar-links a:hover{background:var(--coral-lt);color:var(--coral);}
.sidebar-links a.active{background:var(--coral-lt);color:var(--coral);font-weight:700;border-left-color:var(--coral);}
.sidebar-links a.page-link{font-weight:700;color:var(--ink);}
.sidebar-links a.page-link.active{color:var(--coral);}
.sidebar-links .sub-link{padding-left:28px;font-size:13px;font-weight:500;}

/* ===== BREADCRUMBS ===== */
.breadcrumbs{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink3);margin-bottom:8px;flex-wrap:wrap;}
.breadcrumbs a{color:var(--ink3);font-weight:600;transition:color 0.15s;}
.breadcrumbs a:hover{color:var(--coral);}
.breadcrumbs .sep{font-size:11px;}

/* ===== CONTENT ===== */
.docs-content{min-width:0;}
.docs-content h2{font-family:var(--f-head);font-size:26px;font-weight:800;letter-spacing:-0.02em;color:var(--ink);margin-bottom:12px;margin-top:48px;padding-top:20px;border-top:1.5px solid var(--border);}
.docs-content h2:first-of-type{margin-top:0;border-top:none;padding-top:0;}
.docs-content h3{font-family:var(--f-head);font-size:19px;font-weight:700;color:var(--ink);margin-top:32px;margin-bottom:10px;}
.docs-content h4{font-family:var(--f-head);font-size:16px;font-weight:700;color:var(--ink);margin-top:24px;margin-bottom:8px;}
.docs-content p{font-size:15px;color:var(--ink2);line-height:1.75;margin-bottom:16px;}
.docs-content ul,.docs-content ol{margin-bottom:16px;padding-left:24px;}
.docs-content li{font-size:15px;color:var(--ink2);line-height:1.75;margin-bottom:6px;}
.docs-content li strong{color:var(--ink);}
.docs-content code{font-family:'SF Mono','Fira Code','Courier New',monospace;font-size:13px;background:var(--cream2);border:1px solid var(--border);padding:2px 7px;border-radius:5px;color:var(--coral);font-weight:600;}
.docs-content a{color:var(--coral);font-weight:600;}
.docs-content a:hover{text-decoration:underline;}

/* ===== TABLE ===== */
.docs-content table{width:100%;border-collapse:collapse;margin-bottom:24px;font-size:14px;}
.docs-content th{text-align:left;padding:10px 14px;background:var(--cream2);border:1.5px solid var(--border);font-weight:700;color:var(--ink);font-size:13px;text-transform:uppercase;letter-spacing:0.04em;}
.docs-content td{padding:10px 14px;border:1.5px solid var(--border);color:var(--ink2);vertical-align:top;}
.docs-content td code{font-size:12px;}
.docs-content tr:hover td{background:var(--cream2);}

/* ===== CODE BLOCKS ===== */
.code-wrap{position:relative;margin-bottom:24px;border-radius:12px;overflow:hidden;background:var(--navy);border:1.5px solid rgba(255,255,255,0.08);box-shadow:0 4px 16px rgba(30,43,58,0.25);}
.code-bar{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;background:rgba(255,255,255,0.05);border-bottom:1px solid rgba(255,255,255,0.06);}
.code-lang{font-family:var(--f-body);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:rgba(255,255,255,0.6);}
.code-lang::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:8px;vertical-align:middle;}
.code-lang.lang-csharp::before{background:#68217a;}.code-lang.lang-gdscript::before{background:#478cbf;}
.code-lang.lang-cpp::before{background:#f34b7d;}.code-lang.lang-js::before{background:#f7df1e;}
.code-lang.lang-bash::before{background:#4eaa25;}.code-lang.lang-http::before{background:#e8624a;}
.code-lang.lang-json::before{background:#f5a623;}.code-lang.lang-html::before{background:#e44d26;}
.copy-code{background:none;border:1px solid rgba(255,255,255,0.12);border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;color:rgba(255,255,255,0.65);cursor:pointer;font-family:var(--f-body);transition:all 0.15s;}
.copy-code:hover{background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.8);border-color:rgba(255,255,255,0.25);}
.copy-code.copied{color:var(--sage-md);border-color:var(--sage-md);}
.docs-content .code-wrap pre{background:none;border:none;border-radius:0;padding:18px 20px;margin-bottom:0;overflow-x:auto;}
.docs-content .code-wrap pre code,.docs-content pre code{background:none;border:none;padding:0;color:#e2e8f0;font-family:'SF Mono','Fira Code','Courier New',monospace;font-size:13px;line-height:1.8;font-weight:400;}
.docs-content pre:not(.code-wrap pre){background:var(--navy);border-radius:12px;padding:20px;margin-bottom:24px;overflow-x:auto;border:1.5px solid rgba(255,255,255,0.08);box-shadow:0 4px 16px rgba(30,43,58,0.25);}
.cm{color:#6b7280;font-style:italic;}
.kw{color:#c792ea;}.fn{color:#82aaff;}.st{color:#c3e88d;}.nr{color:#f78c6c;}.op{color:#89ddff;}.ty{color:#ffcb6b;}

/* ===== CALLOUTS ===== */
.callout{background:var(--sage-lt);border:1.5px solid var(--sage-md);border-radius:12px;padding:16px 20px;margin-bottom:20px;display:flex;gap:12px;align-items:flex-start;}
.callout-warn{background:var(--mustard-lt);border-color:var(--mustard);}
.callout-info{background:#eef4ff;border-color:#93b4f5;}
.callout span.callout-icon{font-size:20px;flex-shrink:0;line-height:1;}
.callout p{margin:0;font-size:14px;color:var(--ink2);}
.callout p strong{color:var(--ink);}

/* ===== FEATURE GRID ===== */
.feature-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin-bottom:24px;}
.feature-item{background:white;border:1.5px solid var(--border);border-radius:12px;padding:18px;transition:border-color 0.15s;text-decoration:none;color:inherit;cursor:pointer;display:block;}
.feature-item:hover{border-color:var(--coral-md);}
.feature-item h4{font-size:14px;margin:0 0 6px;font-family:var(--f-head);}
.feature-item p{font-size:13px;margin:0;color:var(--ink3);line-height:1.5;}

/* ===== STATUS BADGES ===== */
.badge{display:inline-block;font-size:11px;font-weight:700;padding:3px 10px;border-radius:100px;text-transform:uppercase;letter-spacing:0.04em;}
.badge-free{background:var(--sage-lt);color:var(--sage);}
.badge-studio{background:var(--coral-lt);color:var(--coral);}
.badge-aaa{background:var(--mustard-lt);color:var(--mustard);}

/* ===== ENDPOINT BLOCK ===== */
.endpoint{background:white;border:1.5px solid var(--border);border-radius:12px;padding:16px 20px;margin-bottom:16px;}
.endpoint-method{display:inline-block;font-size:11px;font-weight:800;padding:3px 10px;border-radius:6px;text-transform:uppercase;letter-spacing:0.04em;margin-right:10px;font-family:'SF Mono',monospace;}
.endpoint-method.get{background:#E4F0ED;color:#2D6A5A;}
.endpoint-method.post{background:#EEF4FF;color:#3B6AC9;}
.endpoint-method.patch{background:var(--mustard-lt);color:#9A7020;}
.endpoint-method.put{background:var(--mustard-lt);color:#9A7020;}
.endpoint-method.delete{background:var(--coral-lt);color:var(--coral);}
.endpoint-path{font-family:'SF Mono',monospace;font-size:14px;font-weight:600;color:var(--ink);}
.endpoint-desc{font-size:13px;color:var(--ink2);margin-top:6px;}

/* ===== FOOTER ===== */
.footer-wave{display:block;width:100%;height:80px;margin-bottom:-2px;background:var(--cream);}
footer{background:#1a2636;padding:24px 0 40px;color:rgba(255,255,255,0.6);position:relative;overflow:hidden;}
footer::after{content:'';position:absolute;inset:0;background:linear-gradient(175deg,transparent 0%,transparent 8%,rgba(15,25,35,0.4) 35%,rgba(15,25,35,0.7) 65%,rgba(22,37,56,0.5) 100%);pointer-events:none;}
footer::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 10% 0%,rgba(232,98,74,0.06),transparent 45%),radial-gradient(ellipse at 85% 100%,rgba(74,124,111,0.06),transparent 45%),radial-gradient(ellipse at 50% 50%,rgba(255,255,255,0.015),transparent 60%);}
.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-bottom:52px;position:relative;z-index:1;}
.footer-links{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;}
.footer-logo{display:flex;align-items:center;gap:10px;font-family:var(--f-head);font-size:20px;font-weight:700;color:#fff;margin-bottom:14px;letter-spacing:-0.02em;}
.footer-logo .wordmark{letter-spacing:-0.02em;}
.footer-logo .net{color:var(--coral);}
.footer-brand p{font-size:14px;line-height:1.75;color:rgba(255,255,255,0.6);max-width:260px;}
.footer-col{position:relative;z-index:1;}
.footer-col h4{font-family:var(--f-hand);font-size:12px;letter-spacing:0.2em;text-transform:uppercase;color:#fff;margin-bottom:16px;}
.footer-col a{display:block;font-size:14px;color:rgba(255,255,255,0.75);margin-bottom:10px;transition:color 0.15s,transform 0.15s;}
.footer-col a:hover{color:#fff;transform:translateX(3px);}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:28px;border-top:1px solid rgba(255,255,255,0.06);position:relative;z-index:1;}
.footer-bottom p{font-size:12px;color:rgba(255,255,255,0.5);font-family:var(--f-hand);}
@media(max-width:768px){.footer-grid{grid-template-columns:1fr;}.footer-links{grid-template-columns:repeat(2,1fr);}}

.docs-index-content {
  padding: 0 0 96px;
}

/* ===== SECTION LIST (index page) ===== */
.doc-section-list{display:flex;flex-direction:column;gap:8px;}
.doc-section-item{display:flex;align-items:center;gap:16px;padding:18px 20px;background:white;border:1.5px solid var(--border);border-radius:12px;transition:all 0.18s;text-decoration:none;color:inherit;}
.doc-section-item:hover{border-color:var(--coral-md);transform:translateX(4px);box-shadow:var(--shadow-sm);}
.doc-section-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.doc-section-text{flex:1;min-width:0;}
.doc-section-text h3{font-family:var(--f-head);font-size:16px;font-weight:700;color:var(--ink);margin:0 0 4px;}
.doc-section-text p{font-size:13px;color:var(--ink2);line-height:1.5;margin:0;}
.doc-section-arrow{color:var(--ink4);flex-shrink:0;transition:color 0.15s,transform 0.15s;}
.doc-section-item:hover .doc-section-arrow{color:var(--coral);transform:translateX(3px);}

/* ===== ENGINE TABS (quickstart) ===== */
.engine-tabs{display:flex;gap:0;border:1.5px solid var(--border);border-radius:10px;overflow:hidden;margin-bottom:16px;background:var(--cream2);}
.engine-tab{flex:1;padding:10px 16px;font-family:var(--f-body);font-size:13px;font-weight:700;color:var(--ink2);background:none;border:none;cursor:pointer;transition:all 0.15s;text-align:center;border-right:1px solid var(--border);}
.engine-tab:last-child{border-right:none;}
.engine-tab:hover{color:var(--ink);background:rgba(255,255,255,0.5);}
.engine-tab.active{background:white;color:var(--coral);box-shadow:0 1px 3px rgba(0,0,0,0.06);}
.engine-code{display:none;}
.engine-code.active{display:block;}

/* ===== RESPONSIVE ===== */
@media(max-width:768px){
  .hero-search{z-index:50;}
}
@media(max-width:900px){
  .docs-layout{grid-template-columns:1fr;gap:0;}
  .docs-sidebar{position:static;max-height:none;border-bottom:1.5px solid var(--border);padding-bottom:16px;margin-bottom:32px;}
  .sidebar-links a{font-size:13px;padding:6px 14px;}
  .sidebar-links .sub-link{padding-left:28px;}
  .doc-cards{grid-template-columns:1fr 1fr;}
}
@media(max-width:720px){
  .doc-cards{grid-template-columns:1fr;}
}