/* Chirp font-face declarations - place Chirp .woff2 files in /assets/fonts/ */
@font-face {
    font-family: 'Chirp';
    src: url('/assets/fonts/Chirp-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Chirp';
    src: url('/assets/fonts/Chirp-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Chirp';
    src: url('/assets/fonts/Chirp-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Chirp';
    src: url('/assets/fonts/Chirp-Heavy.woff2') format('woff2');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

/* Provide a mapping for weight 800 so declarations using 800 resolve to Chirp Heavy */
@font-face {
    font-family: 'Chirp';
    src: url('/assets/fonts/Chirp-Heavy.woff2') format('woff2');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

/* Utility alias */
:root{--app-font: 'Chirp', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif}

/* Sidebar rail uses social.css X layout; Chirp font only */
.sidebar,
.btn-post {
    font-family: var(--app-font);
}

.comment-toolbar, .composer-toolbar { display:flex;gap:2px;align-items:center;flex-wrap:wrap; }
body:not(.social-page) .composer-control,
body:not(.social-page) .comment-toolbar button {
    border:none;background:transparent;color:#9fbfe8;font-size:1rem;padding:8px;border-radius:12px;cursor:pointer;transition:background .18s,color .18s;
}
body:not(.social-page) .composer-control:hover,
body:not(.social-page) .comment-toolbar button:hover {
    background:rgba(255,255,255,.06);color:#fff;
}
/* Legacy boxed inputs — not on X-style social pages */
body:not(.social-page) .comment-textarea,
body:not(.social-page) .post-comment-form textarea,
body:not(.social-page) .login-panel textarea {
    width: 100%;
    padding: 14px;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    color: #eef3fb;
    font-size: 1rem;
    line-height: 1.5;
    resize: none;
    overflow: hidden;
    box-sizing: border-box;
    min-height: 88px;
}
/* Legacy like pills — only outside X-style post action row */
.like-button:not(.post-actions-btn):not(.post-action-btn){display:inline-flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:transparent;color:#d7e1f2;font-weight:700;transition:background .18s,color .18s,border-color .18s;cursor:pointer;}
.like-button:not(.post-actions-btn):not(.post-action-btn):hover{background:rgba(255,255,255,.06);}
.like-button:not(.post-actions-btn):not(.post-action-btn).liked,
.like-button:not(.post-actions-btn):not(.post-action-btn).is-liked{background:rgba(29,155,240,.18);border-color:rgba(29,155,240,.35);color:#1d9bf0;}
.like-button .like-icon{display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem;}
.like-button .like-count{display:inline;}
.gif-picker-backdrop{position:fixed;inset:0;z-index:4490;background:rgba(0,0,0,.65);}
.gif-picker{position:fixed;z-index:4500;top:50%;left:50%;transform:translate(-50%,-50%);background:#071018;border:1px solid rgba(255,255,255,.08);border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.6);width:min(600px,90vw);max-height:80vh;padding:16px;display:flex;flex-direction:column;}
.gif-picker-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;}
.gif-search{width:100%;padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:#08111d;color:#eef3fb;font-size:0.95rem;outline:none;}
.gif-search:focus{border-color:rgba(29,155,240,.35);background:#0a141f;}
.gif-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;overflow-y:auto;flex:1;}
.gif-card{display:flex;flex-direction:column;overflow:hidden;border-radius:16px;background:#0d1320;border:1px solid rgba(255,255,255,.08);padding:0;cursor:pointer;transition:transform .18s,box-shadow .18s;}
.gif-card:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,0,0,.35);}
.gif-thumb{height:120px;background-size:cover;background-position:center center;}
.gif-label{padding:8px 10px;font-size:0.85rem;color:#d1d9e7;font-weight:600;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.media-preview{display:flex;align-items:flex-start;gap:8px;padding:10px;background:rgba(255,255,255,.02);border-radius:12px;border:1px solid rgba(255,255,255,.06);margin-top:8px;}
.media-preview video,.media-preview img{max-width:200px;max-height:120px;border-radius:10px;object-fit:cover;}


/* Ensure controls using font-weight:800 use the Chirp 800 mapping */
strong, b { font-family: var(--app-font); }
