/* ============================================================================
   FlowCMS — Site frontend CSS (fls- prefix, admin fl- ile karışmaz)
   ============================================================================ */

.fls-body{
    background:var(--fl-bg);
    color:var(--fl-ink);
    margin:0;
    min-height:100vh;
    display:flex;
    flex-direction:column;
}
.fls-wrap{max-width:1100px;margin:0 auto;padding:0 1.25rem;width:100%;}

/* ─── Header ───────────────────────────────────────────────────────────── */

.fls-header{background:var(--fl-sidebar);color:#fff;border-bottom:3px solid var(--fl-accent);position:sticky;top:0;z-index:100;}
.fls-header-row{display:flex;align-items:center;gap:1.5rem;padding:.85rem 1.25rem;}
.fls-logo{display:flex;align-items:center;gap:.6rem;color:#fff;text-decoration:none;}
.fls-logo:hover{text-decoration:none;color:#fff;}
.fls-logo-mark{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;background:var(--fl-accent);color:var(--fl-sidebar);border-radius:8px;font-weight:700;font-size:1rem;}
.fls-logo-mark-light{background:var(--fl-accent);color:var(--fl-sidebar);}
.fls-logo-text{display:flex;flex-direction:column;line-height:1.1;}
.fls-logo-name{font-size:1.05rem;font-weight:700;letter-spacing:-0.02em;}
.fls-logo-tag{font-size:.7rem;color:rgba(255,255,255,0.65);margin-top:.1rem;}

.fls-nav{display:flex;gap:.2rem;margin-left:auto;}
.fls-nav-link{padding:.55rem .85rem;color:rgba(255,255,255,0.85);font-size:.86rem;font-weight:500;border-radius:6px;text-decoration:none;}
.fls-nav-link:hover{background:rgba(255,255,255,0.08);color:#fff;text-decoration:none;}

.fls-nav-toggle{display:none;background:none;border:none;color:#fff;cursor:pointer;padding:.5rem;border-radius:6px;}

@media(max-width:780px){
    .fls-nav{position:absolute;top:100%;left:0;right:0;background:var(--fl-sidebar);border-top:1px solid var(--fl-sidebar-soft);flex-direction:column;gap:0;padding:.5rem 0;display:none;}
    .fls-nav.is-open{display:flex;}
    .fls-nav-link{padding:.7rem 1.5rem;border-radius:0;}
    .fls-nav-toggle{display:inline-flex;}
}

/* ─── Main content ──────────────────────────────────────────────────────── */

.fls-main{flex:1;padding:2rem 0;}

/* ─── Article (page) layout ─────────────────────────────────────────────── */

.fls-article{background:var(--fl-surface);border:1px solid var(--fl-border);border-radius:var(--fl-radius-xl);padding:2rem 2.2rem;margin-bottom:2rem;box-shadow:var(--fl-shadow-sm);}
.fls-article-meta{display:flex;gap:.6rem;align-items:center;font-size:.78rem;color:var(--fl-muted);margin-bottom:.7rem;flex-wrap:wrap;}
.fls-article h1{font-size:1.85rem;letter-spacing:-0.025em;margin:0 0 1rem;line-height:1.25;}
.fls-article-content{font-size:1rem;line-height:1.75;color:var(--fl-ink);}
.fls-article-content p{margin:0 0 1.1rem;}
.fls-article-content h2{font-size:1.4rem;margin:1.6rem 0 .8rem;}
.fls-article-content h3{font-size:1.15rem;margin:1.4rem 0 .6rem;}
.fls-article-content ul,.fls-article-content ol{margin:0 0 1.1rem 1.4rem;}
.fls-article-content li{margin-bottom:.4rem;}
.fls-article-content blockquote{border-left:3px solid var(--fl-accent);background:var(--fl-bg-soft);padding:.85rem 1.2rem;margin:1.2rem 0;color:var(--fl-ink-soft);font-style:italic;border-radius:0 8px 8px 0;}
.fls-article-content img{max-width:100%;height:auto;border-radius:var(--fl-radius);margin:1rem 0;}
.fls-article-content table{width:100%;border-collapse:collapse;margin:1.2rem 0;font-size:.92rem;}
.fls-article-content table th,.fls-article-content table td{border:1px solid var(--fl-border);padding:.6rem .85rem;text-align:left;}
.fls-article-content table th{background:var(--fl-bg-soft);font-weight:600;}
.fls-article-content a{color:var(--fl-link);text-decoration:underline;}
.fls-article-content code{background:var(--fl-bg-soft);padding:.1em .4em;border-radius:4px;font-size:.92em;}
.fls-article-content pre{background:#1a1c22;color:#e6e6e6;padding:1rem;border-radius:8px;overflow-x:auto;}
.fls-article-content pre code{background:transparent;color:inherit;padding:0;}

/* ─── Adjacent (prev / next) ────────────────────────────────────────────── */

.fls-adj{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin:1.5rem 0;}
@media(max-width:600px){.fls-adj{grid-template-columns:1fr;}}
.fls-adj-link{display:block;padding:1rem 1.2rem;border:1px solid var(--fl-border);border-radius:var(--fl-radius-lg);background:var(--fl-surface);color:var(--fl-ink);text-decoration:none;transition:all .15s;}
.fls-adj-link:hover{border-color:var(--fl-sidebar);background:var(--fl-bg-soft);text-decoration:none;color:var(--fl-ink);transform:translateY(-1px);box-shadow:var(--fl-shadow-sm);}
.fls-adj-dir{font-size:.7rem;color:var(--fl-accent);font-weight:600;text-transform:uppercase;letter-spacing:0.06em;margin-bottom:.25rem;}
.fls-adj-title{font-weight:600;font-size:.92rem;}
.fls-adj-disabled{opacity:.5;pointer-events:none;}
.fls-adj-next{text-align:right;}

/* ─── Listing (latest, similar) ─────────────────────────────────────────── */

.fls-list-section{margin:2rem 0;}
.fls-list-section h2{font-size:1.15rem;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem;}
.fls-list-section h2::before{content:"";width:4px;height:18px;background:var(--fl-accent);border-radius:2px;}

.fls-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:.85rem;}
.fls-list-item{background:var(--fl-surface);border:1px solid var(--fl-border);border-radius:var(--fl-radius-lg);padding:1rem 1.2rem;text-decoration:none;color:var(--fl-ink);transition:all .15s;}
.fls-list-item:hover{border-color:var(--fl-sidebar);text-decoration:none;color:var(--fl-ink);transform:translateY(-2px);box-shadow:var(--fl-shadow);}
.fls-list-item h3{font-size:.95rem;margin:0 0 .35rem;letter-spacing:-0.01em;}
.fls-list-item p{font-size:.78rem;color:var(--fl-muted);margin:0;line-height:1.5;}
.fls-list-item .fls-li-date{font-size:.7rem;color:var(--fl-muted);margin-top:.5rem;}

/* ─── Comments ──────────────────────────────────────────────────────────── */

.fls-comments{margin-top:2.5rem;}
.fls-comment{background:var(--fl-bg-soft);border-left:3px solid var(--fl-accent);padding:1rem 1.2rem;border-radius:0 8px 8px 0;margin-bottom:.9rem;}
.fls-comment-head{display:flex;align-items:center;gap:.6rem;margin-bottom:.4rem;}
.fls-comment-author{font-weight:600;font-size:.88rem;}
.fls-comment-date{color:var(--fl-muted);font-size:.72rem;}
.fls-comment-body{font-size:.9rem;line-height:1.55;}
.fls-comment-form{background:var(--fl-surface);border:1px solid var(--fl-border);border-radius:var(--fl-radius-lg);padding:1.4rem;margin-top:1.5rem;}
.fls-comment-form h3{margin:0 0 .8rem;}

/* ─── Pagination (frontend, reuse fl-pagination) ────────────────────────── */
.fls-pagination{display:flex;flex-wrap:wrap;gap:.25rem;justify-content:center;padding:1.5rem 0;}

/* ─── Hero (homepage) ───────────────────────────────────────────────────── */

.fls-hero{background:var(--fl-surface);border:1px solid var(--fl-border);border-radius:var(--fl-radius-xl);padding:2.5rem 2.2rem;margin-bottom:2rem;text-align:center;box-shadow:var(--fl-shadow-sm);}
.fls-hero h1{font-size:1.9rem;letter-spacing:-0.025em;margin:0 0 .6rem;}
.fls-hero-sub{font-size:1rem;color:var(--fl-muted);max-width:600px;margin:0 auto;line-height:1.6;}

/* ─── Forms (frontend) ──────────────────────────────────────────────────── */

.fls-form-row{display:grid;gap:.85rem;}
.fls-form-row.fls-row-2{grid-template-columns:1fr 1fr;}
@media(max-width:600px){.fls-form-row.fls-row-2{grid-template-columns:1fr;}}

/* ─── Footer ────────────────────────────────────────────────────────────── */

.fls-footer{background:var(--fl-sidebar);color:var(--fl-sidebar-text);padding:2.5rem 0 1rem;margin-top:auto;}
.fls-footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem;padding:0 1.25rem 2rem;}
@media(max-width:780px){.fls-footer-grid{grid-template-columns:1fr;gap:1.5rem;}}
.fls-footer-col{}
.fls-footer-brand{display:flex;align-items:center;gap:.5rem;color:#fff;font-size:1rem;margin-bottom:.7rem;}
.fls-footer-desc{color:var(--fl-sidebar-text);font-size:.85rem;line-height:1.6;margin:0;max-width:400px;}
.fls-footer-title{font-size:.7rem;text-transform:uppercase;letter-spacing:0.12em;color:var(--fl-accent);font-weight:600;margin-bottom:.7rem;}
.fls-footer-col ul{list-style:none;padding:0;margin:0;}
.fls-footer-col li{margin-bottom:.4rem;}
.fls-footer-col a{color:var(--fl-sidebar-text);font-size:.85rem;text-decoration:none;}
.fls-footer-col a:hover{color:#fff;text-decoration:underline;}

.fls-footer-bottom{padding:1.2rem 1.25rem 0;border-top:1px solid var(--fl-sidebar-soft);font-size:.78rem;color:var(--fl-sidebar-muted);text-align:center;margin-top:1rem;}

/* ─── Misc ──────────────────────────────────────────────────────────────── */

.fls-tag-cccc{display:inline-flex;align-items:center;gap:.25rem;background:var(--fl-accent-bg);color:#a06a00;border:1px solid rgba(252,163,17,0.3);font-size:.7rem;font-weight:600;padding:.2rem .55rem;border-radius:99px;}

.fls-captcha-row{display:flex;align-items:center;gap:.6rem;}
.fls-captcha-q{background:var(--fl-bg-soft);padding:.5rem .85rem;border-radius:8px;font-family:var(--fl-mono);font-size:.92rem;font-weight:600;border:1px solid var(--fl-border);}