/*
 ITS WHAT I GOT - MERGED REQUEST FEED CSS
 PHP / AJAX / DATABASE UNCHANGED
 Duplicate style blocks consolidated safely
*/

/* ==========================================================
   ITS WHAT I GOT - PREMIUM MARKETPLACE REQUEST UI
   UI ONLY - PHP / AJAX / DATABASE UNCHANGED
========================================================== */

:root{
 --iwg-yellow:#f8c91c;
 --iwg-dark:#202428;
 --iwg-bg:#f8f9fb;
 --iwg-border:#e9edf2;
 --iwg-green:#15965b;
}

.product-row{
 background:#fff;
}

.request-feed,
#requestResultsArea{
 max-width:900px!important;
 margin:auto;
}

/* Cards */
.request-search-card,
.new-request-card,
.fb-post{
 background:#fff!important;
 border:1px dashed #f4c327 !important;
 border-radius:26px!important;
 box-shadow:0 15px 45px rgba(20,25,30,.07)!important;
 overflow:hidden;
 transition:.3s ease;
}

.fb-post:hover,
.new-request-card:hover,
.request-search-card:hover{
 transform:translateY(-3px);
 box-shadow:0 20px 55px rgba(20,25,30,.1)!important;
}

/* Search */
.search-filter-row{
 background:#fff!important;
 padding:8px!important;
 border-radius:18px!important;
 border:1px solid #e5e8ed!important;
 gap:8px;
}

.search-filter-row .form-control,
.search-filter-row .form-select{
 border:0!important;
 background:#f7f8fa!important;
 border-radius:14px!important;
 height:48px!important;
}

.search-filter-row .btn{
 border-radius:14px!important;
 height:48px!important;
 background:var(--iwg-dark)!important;
}

/* New Request */
.new-request-card .card-body{
 padding:30px!important;
}

.new-request-card .card-title{
 font-size:22px!important;
 font-weight:800!important;
}

.new-request-card .form-control,
.new-request-card .form-select{
 border-radius:15px!important;
 border:1px solid #e4e8ee!important;
 padding:13px!important;
}

.new-request-card textarea{
 min-height:130px!important;
}

.new-request-card button{
 border-radius:15px!important;
 height:50px!important;
}

/* Request post */
.fb-post-header{
 padding:25px!important;
}

.fb-post-avatar{
 width:55px!important;
 height:55px!important;
 background:var(--iwg-yellow)!important;
 color:#222!important;
 font-size:15px!important;
}

.fb-post-title{
 padding:5px 25px!important;
}

.fb-post-title h5{
 font-size:25px!important;
 font-weight:800!important;
}

.fb-post-body{
 padding:5px 25px 25px!important;
}

.fb-post-description{
 color:#59616a!important;
 font-size:15px!important;
 line-height:1.7;
}

/* Responses */
.fb-comments-area{
 background:#f8fafc!important;
 padding:22px!important;
}

.fb-comment{
 background:#fff!important;
 border:1px solid #edf0f4!important;
 border-radius:20px!important;
 padding:18px!important;
 margin-bottom:15px!important;
}

.fb-comment-avatar{
 background:#eef2f6!important;
}

.fb-response-badge{
 border-radius:30px!important;
 padding:7px 14px!important;
}

.fb-offer{
 border-radius:30px!important;
 padding:9px 16px!important;
 font-size:13px!important;
}

/* Chat */
.fb-conversation{
 background:#fff!important;
 border-radius:20px!important;
 padding:20px!important;
 border:1px solid #edf0f4!important;
}

.fb-chat-bubble{
 border-radius:20px!important;
 padding:14px 18px!important;
}

.fb-chat-own .fb-chat-bubble{
 background:var(--iwg-yellow)!important;
 color:#222!important;
}

.fb-chat-form{
 background:#fff!important;
 border:1px solid #e7ebef!important;
 border-radius:20px!important;
 padding:18px!important;
}

.fb-chat-input-row textarea{
 border-radius:18px!important;
 background:#f7f8fa!important;
}

.fb-send-btn{
 background:var(--iwg-dark)!important;
 border:0!important;
 border-radius:15px!important;
}

/* Action buttons */
.fb-action-buttons button{
 border-radius:14px!important;
 height:46px!important;
 font-weight:700!important;
}

/* Mobile */
@media(max-width:768px){
 .fb-post-title h5{
  font-size:20px!important;
 }
 .new-request-card .card-body{
  padding:20px!important;
 }
}
/* =========================================================
   ITS WHAT I GOT - PREMIUM DARK THEME
   Applies ONLY when body.dark-mode is active
   Light theme remains unchanged
   ========================================================= */

body.dark-mode {
    background:#111111!important;
    color:#ffffff!important;
}

/* Main cards */
body.dark-mode .request-search-card,
body.dark-mode .new-request-card,
body.dark-mode .fb-post {
    background:#1b1b1b!important;
    border:1px solid #3b3210!important;
    box-shadow:0 10px 35px rgba(0,0,0,.35)!important;
    color:#fff!important;
}

/* Search */
body.dark-mode .search-filter-row {
    background:#151515!important;
    border:1px solid #4a3d00!important;
}

body.dark-mode .input-group-text {
    color:#f5c400!important;
}

body.dark-mode .form-control,
body.dark-mode .form-select {
    background:#151515!important;
    color:#fff!important;
    border-color:#4a3d00!important;
}

body.dark-mode .form-control::placeholder {
    color:#888!important;
}

body.dark-mode .btn-dark,
body.dark-mode .search-filter-row .btn {
    background:#f5c400!important;
    border-color:#f5c400!important;
    color:#111!important;
    font-weight:700!important;
}

/* Request header */
body.dark-mode .fb-post-header,
body.dark-mode .fb-post-title,
body.dark-mode .fb-post-body {
    background:#1b1b1b!important;
}

body.dark-mode .fb-post-avatar {
    background:#f5c400!important;
    color:#111!important;
}

body.dark-mode .fb-post-author,
body.dark-mode .fb-post-title h5,
body.dark-mode h5,
body.dark-mode strong {
    color:#fff!important;
}

body.dark-mode .fb-post-description,
body.dark-mode .fb-comment-actions,
body.dark-mode .fb-post-time {
    color:#aaa!important;
}

/* Responses */
body.dark-mode .fb-response-summary {
    background:#151515!important;
    color:#aaa!important;
    border-color:#332900!important;
}

body.dark-mode .fb-comments-area {
    background:#141414!important;
}

body.dark-mode .fb-comment {
    background:#222!important;
    border:1px solid #332900!important;
    border-radius:16px!important;
}

body.dark-mode .fb-comment-message {
    background:#171717!important;
    color:#ddd!important;
    border-color:#443700!important;
}

body.dark-mode .fb-comment-author {
    color:#fff!important;
}

/* Badges */
body.dark-mode .fb-response-badge {
    background:#332900!important;
    color:#f5c400!important;
}

body.dark-mode .fb-offer {
    background:#193b24!important;
    color:#8cff9a!important;
}

/* Conversation */
body.dark-mode .fb-conversation {
    background:#151515!important;
}

body.dark-mode .fb-chat-bubble {
    background:#292929!important;
    color:#fff!important;
}

body.dark-mode .fb-chat-own .fb-chat-bubble {
    background:#f5c400!important;
    color:#111!important;
}

body.dark-mode .fb-chat-form,
body.dark-mode .fb-response-form {
    background:#1b1b1b!important;
    border-color:#332900!important;
}

/* Pagination */
body.dark-mode .pagination .page-link {
    background:#1b1b1b!important;
    color:#fff!important;
    border-color:#4a3d00!important;
}

body.dark-mode .pagination .active .page-link {
    background:#f5c400!important;
    color:#111!important;
}

/* ================= MERGED STYLE BLOCK ================= */

/* =====================================================
   ITS WHAT I GOT - HOMEPAGE MATCH REQUEST PAGE UI
   ONLY DESIGN UPDATE - PHP/AJAX UNCHANGED
===================================================== */

:root{
    --iwg-yellow:#f5c400;
    --iwg-soft:#fff7dc;
    --iwg-dark:#263238;
    --iwg-text:#333;
    --iwg-border:#eadca8;
}

.page-banner{
    background:linear-gradient(120deg,#fff8dc,#ffe99a)!important;
    /*border-radius:0 0 40px 40px;*/
    min-height:180px!important;
    display:flex;
    align-items:center;
    justify-content:center;
}

.page-banner h1{
    font-size:42px!important;
    font-weight:700!important;
    color:#273238!important;
}

/* Main width */
.product-row .container{
    max-width:1180px!important;
}

/* Search box */
.request-search-card,
.new-request-card,
.fb-post{
    border:1px solid #f0dfaa!important;
    border-radius:24px!important;
    background:#fff!important;
    box-shadow:0 12px 35px rgba(0,0,0,.06)!important;
}

.request-search-card .card-body,
.new-request-card .card-body{
    padding:30px!important;
}

.search-filter-row{
    background:#fff!important;
    border:1px solid #ecdca6!important;
    border-radius:18px!important;
    padding:6px!important;
}

.search-filter-row .form-control,
.search-filter-row .form-select{
    background:#fffdf5!important;
    border:0!important;
    height:48px!important;
}

.search-filter-row .btn-dark{
    background:#263238!important;
    border-radius:14px!important;
}

/* Post request */
.new-request-card .card-title{
    font-size:24px!important;
    color:#263238;
    font-weight:700;
}

.new-request-card .form-control,
.new-request-card .form-select{
    border-radius:14px!important;
    border:1px solid #eadca8!important;
    background:#fffdf6;
}

.new-request-card .btn-dark{
    background:#f5c400!important;
    color:#263238!important;
    border:0!important;
    border-radius:14px!important;
}

/* Request cards */
.fb-post{
    overflow:hidden;
    transition:.3s ease;
}

.fb-post:hover{
    transform:translateY(-5px);
    box-shadow:0 20px 45px rgba(245,196,0,.18)!important;
}

.fb-post-header{
    padding:25px!important;
}

.fb-post-avatar{
    background:#f5c400!important;
    color:#263238!important;
    width:55px!important;
    height:55px!important;
}

.fb-post-title{
    padding:10px 25px!important;
}

.fb-post-title h5{
    font-size:26px!important;
    font-weight:700!important;
}

.fb-post-body{
    padding:5px 25px 25px!important;
}

.fb-post-description{
    color:#777!important;
}

/* Replies */
.fb-comments-area{
    background:#fffaf0!important;
    padding:20px!important;
}

.fb-comment{
    background:#fff!important;
    border:1px solid #f0dfaa!important;
    border-radius:18px!important;
    padding:18px!important;
}

.fb-comment-avatar{
    background:#f5c400!important;
    color:#263238!important;
}

.fb-response-badge{
    background:#fff1ae!important;
    color:#263238!important;
    border-radius:30px!important;
}

.fb-offer{
    background:#fff0a6!important;
    color:#263238!important;
    border-radius:30px!important;
}

/* Chat */
.fb-conversation{
    background:#fffaf0!important;
    border-radius:18px!important;
    border:0!important;
}

.fb-chat-bubble{
    border-radius:20px!important;
}

.fb-chat-own .fb-chat-bubble{
    background:#f5c400!important;
    color:#263238!important;
}

/* Buttons */
.fb-action-buttons button,
.fb-send-btn{
    border-radius:14px!important;
}

.fb-send-btn{
    background:#263238!important;
}

/* Pagination */
.pagination .page-link{
    border-radius:50%!important;
}

.pagination .active .page-link{
    background:#f5c400!important;
    border-color:#f5c400!important;
    color:#263238!important;
}

/* Animation */
.fb-post,
.new-request-card,
.request-search-card{
    animation:fadeUp .5s ease;
}

@keyframes fadeUp{
    from{
        opacity:0;
        transform:translateY(20px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* DARK THEME */

body.dark-mode {
    background:#111!important;
    color:#fff;
}

body.dark-mode .request-search-card,
body.dark-mode .new-request-card,
body.dark-mode .fb-post {
    background:#1c1c1c!important;
    border-color:#333!important;
    box-shadow:0 10px 30px rgba(0,0,0,.4)!important;
}


body.dark-mode .search-filter-row {
    background:#222!important;
    border-color:#333!important;
}


body.dark-mode .form-control,
body.dark-mode .form-select {
    background:#222!important;
    color:#fff!important;
    border-color:#444!important;
}


body.dark-mode .fb-comments-area {
    background:#161616!important;
}


body.dark-mode .fb-comment {
    background:#252525!important;
    border-color:#333!important;
}


body.dark-mode .fb-comment-message {
    background:#202020!important;
    color:#ddd!important;
}


body.dark-mode h5,
body.dark-mode strong {
    color:#fff!important;
}


body.dark-mode .fb-post-description,
body.dark-mode .fb-comment-actions {
    color:#aaa!important;
}

/* =========================================================
   ITS WHAT I GOT - PREMIUM DARK THEME
   Applies ONLY when body.dark-mode is active
   Light theme remains unchanged
   ========================================================= */

body.dark-mode {
    background:#111111!important;
    color:#ffffff!important;
}

/* Main cards */
body.dark-mode .request-search-card,
body.dark-mode .new-request-card,
body.dark-mode .fb-post {
    background:#1b1b1b!important;
    border:1px solid #3b3210!important;
    box-shadow:0 10px 35px rgba(0,0,0,.35)!important;
    color:#fff!important;
}

/* Search */
body.dark-mode .search-filter-row {
    background:#151515!important;
    border:1px solid #4a3d00!important;
}

body.dark-mode .input-group-text {
    color:#f5c400!important;
}

body.dark-mode .form-control,
body.dark-mode .form-select {
    background:#151515!important;
    color:#fff!important;
    border-color:#4a3d00!important;
}

body.dark-mode .form-control::placeholder {
    color:#888!important;
}

body.dark-mode .btn-dark,
body.dark-mode .search-filter-row .btn {
    background:#f5c400!important;
    border-color:#f5c400!important;
    color:#111!important;
    font-weight:700!important;
}

/* Request header */
body.dark-mode .fb-post-header,
body.dark-mode .fb-post-title,
body.dark-mode .fb-post-body {
    background:#1b1b1b!important;
}

body.dark-mode .fb-post-avatar {
    background:#f5c400!important;
    color:#111!important;
}

body.dark-mode .fb-post-author,
body.dark-mode .fb-post-title h5,
body.dark-mode h5,
body.dark-mode strong {
    color:#fff!important;
}

body.dark-mode .fb-post-description,
body.dark-mode .fb-comment-actions,
body.dark-mode .fb-post-time {
    color:#aaa!important;
}

/* Responses */
body.dark-mode .fb-response-summary {
    background:#151515!important;
    color:#aaa!important;
    border-color:#332900!important;
}

body.dark-mode .fb-comments-area {
    background:#141414!important;
}

body.dark-mode .fb-comment {
    background:#222!important;
    border:1px solid #332900!important;
    border-radius:16px!important;
}

body.dark-mode .fb-comment-message {
    background:#171717!important;
    color:#ddd!important;
    border-color:#443700!important;
}

body.dark-mode .fb-comment-author {
    color:#fff!important;
}

/* Badges */
body.dark-mode .fb-response-badge {
    background:#332900!important;
    color:#f5c400!important;
}

body.dark-mode .fb-offer {
    background:#193b24!important;
    color:#8cff9a!important;
}

/* Conversation */
body.dark-mode .fb-conversation {
    background:#151515!important;
}

body.dark-mode .fb-chat-bubble {
    background:#292929!important;
    color:#fff!important;
}

body.dark-mode .fb-chat-own .fb-chat-bubble {
    background:#f5c400!important;
    color:#111!important;
}

body.dark-mode .fb-chat-form,
body.dark-mode .fb-response-form {
    background:#1b1b1b!important;
    border-color:#332900!important;
}

/* Pagination */
body.dark-mode .pagination .page-link {
    background:#1b1b1b!important;
    color:#fff!important;
    border-color:#4a3d00!important;
}

body.dark-mode .pagination .active .page-link {
    background:#f5c400!important;
    color:#111!important;
}


/* =========================================================
   FINAL DARK THEME MATCHING REFERENCE DESIGN
   ONLY BODY.DARK-MODE
   ========================================================= */

body.dark-mode,
body.dark-mode .product-row {
    background:#111111 !important;
    color:#fff !important;
}

body.dark-mode .request-feed,
body.dark-mode #requestResultsArea {
    max-width:820px !important;
}

/* Cards */
body.dark-mode .request-search-card,
body.dark-mode .new-request-card,
body.dark-mode .fb-post {
    background:#181818 !important;
    border:1px solid rgba(245,196,0,.25) !important;
    border-radius:20px !important;
    box-shadow:0 12px 35px rgba(0,0,0,.55) !important;
}

/* Search box */
body.dark-mode .search-filter-row {
    background:#141414 !important;
    border:1px solid #5b4700 !important;
}

body.dark-mode .search-filter-row .form-control,
body.dark-mode .search-filter-row .form-select {
    color:#fff !important;
    background:#141414 !important;
}

body.dark-mode .search-filter-row .btn {
    background:#f5c400 !important;
    color:#111 !important;
    border:0 !important;
}

/* New Request */
body.dark-mode .new-request-card .card-title,
body.dark-mode .new-request-card label {
    color:#fff !important;
}

body.dark-mode .new-request-card .form-control,
body.dark-mode .new-request-card .form-select,
body.dark-mode textarea {
    background:#151515 !important;
    color:#fff !important;
    border:1px solid #4d3b00 !important;
}

body.dark-mode .new-request-card .btn-dark {
    background:#f5c400 !important;
    color:#111 !important;
}

/* Posts */
body.dark-mode .fb-post-header,
body.dark-mode .fb-post-title,
body.dark-mode .fb-post-body {
    background:#181818 !important;
}

body.dark-mode .fb-post-avatar {
    background:#f5c400 !important;
    color:#111 !important;
}

body.dark-mode .fb-post-title h5,
body.dark-mode .fb-post-author,
body.dark-mode strong {
    color:#fff !important;
}

body.dark-mode .fb-post-description,
body.dark-mode .fb-post-time {
    color:#aaa !important;
}

/* Response area */
body.dark-mode .fb-response-summary {
    background:#141414 !important;
    color:#aaa !important;
    border-color:#332800 !important;
}

body.dark-mode .fb-comments-area {
    background:#111 !important;
}

body.dark-mode .fb-comment {
    background:#202020 !important;
    border:1px solid #332800 !important;
}

body.dark-mode .fb-comment-message {
    background:#151515 !important;
    color:#ddd !important;
}

/* Yellow buttons/action */
body.dark-mode .fb-action-buttons .btn-dark,
body.dark-mode .responseActionBtn.btn-dark {
    background:#f5c400 !important;
    color:#111 !important;
}

body.dark-mode .fb-action-buttons .btn-outline-success,
body.dark-mode .fb-action-buttons .btn-outline-primary {
    background:#191919 !important;
}

/* Conversation */
body.dark-mode .fb-conversation,
body.dark-mode .fb-chat-form,
body.dark-mode .fb-response-form {
    background:#161616 !important;
    border-color:#3d3000 !important;
}

body.dark-mode .fb-chat-bubble {
    background:#292929 !important;
    color:#fff !important;
}

body.dark-mode .fb-chat-own .fb-chat-bubble {
    background:#f5c400 !important;
    color:#111 !important;
}

/* Pagination */
body.dark-mode .pagination .page-link {
    background:#181818 !important;
    color:#fff !important;
    border-color:#4d3b00 !important;
}

body.dark-mode .pagination .active .page-link {
    background:#f5c400 !important;
    color:#111 !important;
}
body.dark-mode .page-banner {
    background: linear-gradient(142deg, #191919 22.03%, #E9AF00 129.81%) !important;
}
body.dark-mode .page-banner h1 {
    color: #fff !important;
}

/* ================= MERGED STYLE BLOCK ================= */

/* =========================================================
   ITS WHAT I GOT - MODERN REQUEST FEED
   UI ONLY - PHP / AJAX FUNCTIONALITY UNCHANGED
   ========================================================= */

:root {
    --iwg-dark: #202428;
    --iwg-text: #202428;
    --iwg-muted: #737980;
    --iwg-border: #e8eaed;
    --iwg-soft: #f7f8fa;
    --iwg-yellow: #f5c400;
    --iwg-blue: #2878f0;
    --iwg-green: #15965b;
    --iwg-radius: 16px;
}

.request-feed {
    max-width: 820px;
    margin: 0 auto;
}


/* =========================================================
   SEARCH
   ========================================================= */

.request-search-card {
    border: 1px solid var(--iwg-border) !important;
    border-radius: 16px !important;
    background: #fff;
    box-shadow: 0 4px 18px rgba(32, 36, 40, .05) !important;
}

.request-search-card .card-body {
    padding: 16px;
}

.search-filter-row {
    display: flex;
    align-items: center;
    background: #f7f8fa;
    border: 1px solid #e2e5e8;
    border-radius: 12px;
    overflow: hidden;
}

.search-filter-row .input-group-text {
    border: 0;
    background: transparent;
    color: #7a8087;
    padding-left: 15px;
}

.search-filter-row .form-control {
    height: 46px;
    border: 0;
    background: transparent;
    box-shadow: none !important;
}

.search-filter-row .form-select {
    height: 46px;
    border: 0;
    border-left: 1px solid #e1e4e7;
    background-color: transparent;
    box-shadow: none !important;
    max-width: 230px;
}

.search-filter-row .btn {
    height: 38px;
    margin-right: 4px;
    border-radius: 9px !important;
    padding: 0 18px;
    font-weight: 600;
}

.search-result-summary {
    color: var(--iwg-muted);
    font-size: 13px;
    padding-left: 4px;
}

.search-result-summary strong {
    color: var(--iwg-text);
}


/* =========================================================
   NEW REQUEST
   ========================================================= */

.new-request-card {
    border: 1px solid var(--iwg-border) !important;
    border-radius: var(--iwg-radius) !important;
    box-shadow: 0 4px 18px rgba(32, 36, 40, .05) !important;
    overflow: hidden;
}

.new-request-card .card-body {
    padding: 22px;
}

.new-request-card .card-title {
    font-size: 17px;
    font-weight: 700;
    color: var(--iwg-text);
    display: flex;
    align-items: center;
    gap: 9px;
}

.new-request-card .card-title::before {
    content: "+";
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #fff7d6;
    color: #bd9200;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 700;
}

.new-request-card .form-control,
.new-request-card .form-select {
    border: 1px solid #e2e5e8;
    border-radius: 10px;
    min-height: 46px;
    box-shadow: none !important;
    font-size: 14px;
}

.new-request-card textarea.form-control {
    min-height: 105px;
    resize: vertical;
}

.new-request-card .form-control:focus,
.new-request-card .form-select:focus {
    border-color: #bfc8d4;
    box-shadow: 0 0 0 3px rgba(40, 120, 240, .08) !important;
}

.new-request-card .form-label {
    font-size: 12px;
    font-weight: 600;
    color: #626870;
    margin-bottom: 6px;
}

.new-request-card .btn-dark {
    height: 44px;
    border-radius: 10px;
    background: var(--iwg-dark);
    border: 0;
}


/* =========================================================
   REQUEST CARD
   ========================================================= */

.fb-post {
    background: #fff;
    border: 1px dashed #f4c327 !important;
    border-radius: var(--iwg-radius) !important;
    overflow: hidden;
    margin-bottom: 18px;
    box-shadow: 0 5px 20px rgba(32, 36, 40, .055) !important;
    transition:
        transform .2s ease,
        box-shadow .2s ease,
        border-color .2s ease;
}

.fb-post:hover {
    box-shadow: 0 8px 28px rgba(32, 36, 40, .09) !important;
}

.fb-post.highlighted {
    border: 2px solid var(--iwg-blue) !important;
    box-shadow:
        0 0 0 4px rgba(40, 120, 240, .08),
        0 8px 28px rgba(32, 36, 40, .09) !important;
}


/* =========================================================
   REQUEST HEADER
   ========================================================= */

.fb-post-header {
    padding: 18px 20px 8px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.fb-post-avatar {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border-radius: 50%;
    background: linear-gradient(145deg, #2679ee, #5a9bf5);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    box-shadow: 0 2px 7px rgba(40, 120, 240, .2);
}

.fb-post-header-info {
    min-width: 0;
    flex: 1;
}

.fb-post-author {
    color: var(--iwg-text);
    font-size: 13px;
    line-height: 1.4;
}

.fb-post-author strong {
    font-weight: 700;
}

.fb-post-time {
    color: #9a9fa5;
    font-size: 11px;
    margin-top: 2px;
}


/* =========================================================
   REQUEST TITLE
   ========================================================= */

.fb-post-title {
    padding: 7px 20px 5px;
}

.fb-post-title h5 {
    margin: 0;
    color: var(--iwg-text);
    font-size: 20px;
    line-height: 1.3;
    font-weight: 750;
    letter-spacing: -.2px;
}


/* =========================================================
   REQUEST DESCRIPTION
   ========================================================= */

.fb-post-body {
    padding: 4px 20px 19px;
}

.fb-post-description {
    color: #565c63;
    font-size: 14px;
    line-height: 1.65;
    word-break: break-word;
}


/* =========================================================
   RESPONSE HEADER
   ========================================================= */

.fb-post-divider {
    border-top: 1px solid var(--iwg-border);
}

.fb-response-summary {
    min-height: 45px;
    padding: 0 20px;
    color: #8a9097;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fb-response-summary strong {
    color: #50565c;
    font-weight: 700;
}

.fb-response-summary i {
    color: #8d949b;
}


/* =========================================================
   RESPONSE AREA
   ========================================================= */

.fb-comments-area {
    padding: 7px 14px 13px;
    background: #fafbfc;
}


/* =========================================================
   INDIVIDUAL RESPONSE
   ========================================================= */

.fb-comment {
    display: flex;
    gap: 10px;
    padding: 13px 8px;
    border-bottom: 1px solid #eceff2;
}

.fb-comment:last-child {
    border-bottom: 0;
}

.fb-comment-avatar {
    width: 34px;
    height: 34px;
    min-width: 34px;
    border-radius: 50%;
    background: #edf0f3;
    color: #646a71;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
}

.fb-comment-content {
    min-width: 0;
    flex: 1;
}


/* =========================================================
   RESPONSE HEADER
   ========================================================= */

.fb-comment-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.fb-comment-author-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
}

.fb-comment-author {
    color: #30353a;
    font-size: 13px;
    font-weight: 700;
}


/* =========================================================
   RESPONSE TYPE BADGES
   ========================================================= */

.fb-response-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .25px;
}

.response-request {
    background: #edf5ff;
    color: #2675df;
}

.response-interested {
    background: #eaf8f1;
    color: #138853;
}

.response-contact_seller {
    background: #eef3ff;
    color: #416ee8;
}


/* =========================================================
   OFFER
   ========================================================= */

.fb-offer {
    color: #168653;
    background: #edf9f3;
    border: 1px solid #d9f0e3;
    padding: 5px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 750;
    white-space: nowrap;
}


/* =========================================================
   RESPONSE MESSAGE
   ========================================================= */

.fb-comment-message {
    margin-top: 7px;
    color: #4f555b;
    background: #fff;
    border: 1px solid #e8ebee;
    border-radius: 9px;
    padding: 9px 11px;
    font-size: 13px;
    line-height: 1.5;
    display: block;
    width: 100%;
    word-break: break-word;
}


/* =========================================================
   RESPONSE FOOTER
   ========================================================= */

.fb-comment-actions {
    display: flex;
    gap: 7px;
    align-items: center;
    margin-top: 7px;
    margin-left: 2px;
    font-size: 10px;
    color: #999fa5;
}

.fb-status-dot {
    width: 4px;
    height: 4px;
    background: #b8bdc2;
    border-radius: 50%;
}


/* =========================================================
   ATTACHMENTS
   ========================================================= */

.fb-comment-attachments {
    margin-top: 8px;
}

.fb-attachment-list {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.fb-attachment-image {
    width: 70px;
    height: 58px;
    border-radius: 8px;
    overflow: hidden;
    display: block;
    border: 1px solid #e1e4e7;
}

.fb-attachment-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fb-attachment-file {
    min-width: 70px;
    height: 44px;
    padding: 5px 9px;
    border: 1px solid #e1e4e7;
    border-radius: 8px;
    background: #fff;
    color: #676d73;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-size: 10px;
}

.fb-attachment-file:hover {
    background: #f6f8fa;
    color: var(--iwg-blue);
}


/* =========================================================
   MORE RESPONSES
   ========================================================= */

.toggleReplies {
    color: #4f76bc !important;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none !important;
    padding: 7px 12px;
    border-radius: 8px;
}

.toggleReplies:hover {
    background: #edf3fc;
}


/* =========================================================
   CONVERSATION
   ========================================================= */

.fb-conversation-toggle {
    display: inline-flex;
    align-items: center;
    border: 0;
    background: #f2f5f8;
    padding: 6px 9px;
    margin-top: 7px;
    border-radius: 7px;
    color: #5d718b;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
}

.fb-conversation-toggle:hover {
    background: #e8edf3;
    color: #3d6087;
    text-decoration: none;
}

.fb-conversation {
    margin-top: 9px;
    margin-left: 2px;
    padding: 10px 4px 2px 13px;
    border-left: 2px solid #e2e7ec;
}


/* =========================================================
   CHAT
   ========================================================= */

.fb-chat-row {
    display: flex;
    gap: 7px;
    margin-bottom: 10px;
}

.fb-chat-row.fb-chat-own {
    flex-direction: row-reverse;
}

.fb-chat-avatar {
    width: 25px;
    height: 25px;
    min-width: 25px;
    border-radius: 50%;
    background: #e9edf1;
    color: #60666c;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 8px;
    font-weight: 700;
}

.fb-chat-content {
    max-width: 72%;
}

.fb-chat-own .fb-chat-content {
    text-align: right;
}

.fb-chat-bubble {
    display: inline-block;
    background: #f0f2f5;
    border-radius: 11px;
    padding: 7px 10px;
    text-align: left;
}

.fb-chat-own .fb-chat-bubble {
    background: var(--iwg-dark);
    color: #fff;
}

.fb-chat-text {
    font-size: 12px;
    line-height: 1.45;
    word-break: break-word;
}

.fb-chat-time {
    display: block;
    margin-top: 3px;
    color: #a0a5aa;
    font-size: 9px;
}

.fb-chat-own .fb-chat-time {
    text-align: right;
}


/* =========================================================
   CHAT FORM
   ========================================================= */

.fb-chat-form {
    border-top: 1px solid #eceff2;
    padding-top: 10px;
    margin-top: 9px !important;
}

.fb-chat-input-row {
    display: flex;
    gap: 7px;
    align-items: flex-end;
}

.fb-chat-input-row textarea {
    border: 1px solid #e0e4e8;
    background: #f7f8fa;
    border-radius: 11px;
    resize: vertical;
    font-size: 12px;
    box-shadow: none !important;
}

.fb-chat-input-row textarea:focus {
    background: #fff;
    border-color: #bfc7d0;
}

.fb-send-btn {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 10px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fb-chat-tools {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
}

.fb-chat-tools .file-help-text {
    margin: 0;
    color: #92989e;
    font-size: 10px;
}
/* =========================================================
   SELLER ACTION BAR
   ========================================================= */

.fb-post-actions {
    border-top: 1px solid var(--iwg-border);
    padding: 12px 16px 14px;
    background: #fff;
}

.fb-action-buttons {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7px;
}

.fb-action-buttons .responseActionBtn {
    height: 39px;
    border-radius: 9px !important;
    font-size: 12px;
    font-weight: 650;
    transition: all .15s ease;
}

.fb-action-buttons .responseActionBtn:hover {
    transform: translateY(-1px);
}

.fb-action-buttons .btn-dark {
    background: #252a2e;
    border-color: #252a2e;
}

.fb-action-buttons .btn-outline-success {
    color: #168653;
    border-color: #ccebdc;
    background: #f7fcf9;
}

.fb-action-buttons .btn-outline-success:hover {
    color: #fff;
    background: #168653;
    border-color: #168653;
}

.fb-action-buttons .btn-outline-primary {
    color: #3e72d9;
    border-color: #d5e0f7;
    background: #f8faff;
}

.fb-action-buttons .btn-outline-primary:hover {
    color: #fff;
    background: #3e72d9;
    border-color: #3e72d9;
}


/* =========================================================
   RESPONSE FORMS
   ========================================================= */

.fb-response-forms {
    margin-top: 10px;
}

.fb-response-form {
    background: #f8f9fa !important;
    border: 1px solid #e5e8eb !important;
    border-radius: 12px !important;
    padding: 16px !important;
}

.fb-response-form h6 {
    color: #30353a;
    font-size: 14px;
    margin-bottom: 13px !important;
}

.fb-response-form .form-label {
    font-size: 11px;
    color: #656b72;
    font-weight: 650;
    margin-bottom: 5px;
}

.fb-response-form .form-control {
    border: 1px solid #dde1e5;
    border-radius: 9px;
    font-size: 12px;
    box-shadow: none !important;
}

.fb-response-form .form-control:focus {
    border-color: #aeb8c4;
    box-shadow: 0 0 0 3px rgba(40, 120, 240, .07) !important;
}

.fb-response-form textarea {
    resize: vertical;
}

.fb-response-form .btn {
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
}


/* =========================================================
   FILE UPLOAD
   ========================================================= */

.custom-file-upload {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.custom-file-upload input[type="file"] {
    display: none;
}

.custom-file-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 11px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #dce1e5;
    color: #626970;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
}

.custom-file-button:hover {
    background: #f2f5f7;
}

.selected-file-name {
    color: #8c9399;
    font-size: 10px;
}

.file-help-text {
    color: #999fa5;
    font-size: 10px;
}


/* =========================================================
   PAGINATION
   ========================================================= */

.pagination {
    gap: 5px;
}

.pagination .page-item .page-link {
    border: 1px solid #e2e5e8;
    border-radius: 8px !important;
    color: #60666c;
    font-size: 12px;
    min-width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pagination .page-item.active .page-link {
    background: var(--iwg-dark);
    border-color: var(--iwg-dark);
    color: #fff;
}

.pagination .page-link:hover {
    background: #f3f5f7;
}


/* =========================================================
   EMPTY STATE
   ========================================================= */

#requestResultsArea .alert {
    border-radius: 14px;
    padding: 28px 20px;
    color: #747a80;
    background: #fafbfc;
}


/* =========================================================
   SEARCH LOADING
   ========================================================= */

.ajax-search-loading {
    opacity: .55;
    pointer-events: none;
    transition: opacity .2s ease;
}


/* =========================================================
   HIGHLIGHT
   ========================================================= */

.flash-highlight {
    animation: requestFlash 1s ease-in-out 3;
}

@keyframes requestFlash {

    0% {
        box-shadow:
            0 0 0 0 rgba(40, 120, 240, .4);
    }

    50% {
        box-shadow:
            0 0 0 8px rgba(40, 120, 240, .1),
            0 10px 30px rgba(32, 36, 40, .08);
    }

    100% {
        box-shadow:
            0 0 0 0 rgba(40, 120, 240, 0);
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .request-search-card .card-body {
        padding: 11px;
    }

    .search-filter-row {
        display: grid;
        grid-template-columns: 38px 1fr;
        overflow: visible;
        background: transparent;
        border: 0;
        gap: 0;
    }

    .search-filter-row .input-group-text {
        height: 44px;
        border: 1px solid #e2e5e8;
        border-right: 0;
        border-radius: 10px 0 0 10px;
        background: #f7f8fa;
    }

    .search-filter-row .form-control {
        height: 44px;
        border: 1px solid #e2e5e8;
        border-left: 0;
        border-radius: 0 10px 10px 0;
        background: #f7f8fa;
    }

    .search-filter-row .form-select {
        grid-column: 1 / -1;
        width: 100%;
        max-width: 100%;
        margin-top: 7px;
        border: 1px solid #e2e5e8;
        border-radius: 10px;
        background: #f7f8fa;
    }

    .search-filter-row .btn {
        margin: 7px 0 0;
        width: 100%;
        grid-column: 1 / -1;
    }

    .search-filter-row .btn-outline-secondary {
        margin-top: 5px;
    }


    .new-request-card .card-body {
        padding: 17px;
    }


    .fb-post {
        border-radius: 13px !important;
        margin-bottom: 14px;
    }

    .fb-post-header {
        padding: 14px 14px 7px;
    }

    .fb-post-avatar {
        width: 38px;
        height: 38px;
        min-width: 38px;
    }

    .fb-post-title {
        padding: 7px 14px 4px;
    }

    .fb-post-title h5 {
        font-size: 18px;
    }

    .fb-post-body {
        padding: 3px 14px 15px;
    }

    .fb-post-description {
        font-size: 13px;
    }

    .fb-response-summary {
        padding: 0 14px;
    }

    .fb-comments-area {
        padding: 4px 8px 9px;
    }

    .fb-comment {
        padding: 11px 5px;
        gap: 8px;
    }

    .fb-comment-top {
        align-items: flex-start;
    }

    .fb-comment-author-row {
        gap: 5px;
    }

    .fb-comment-author {
        font-size: 12px;
    }

    .fb-offer {
        font-size: 11px;
        padding: 4px 7px;
    }

    .fb-comment-message {
        font-size: 12px;
        padding: 8px 9px;
    }

    .fb-action-buttons {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .fb-action-buttons .responseActionBtn {
        width: 100%;
    }

    .fb-response-form {
        padding: 13px !important;
    }

    .fb-chat-content {
        max-width: 84%;
    }

    .fb-chat-tools {
        align-items: flex-start;
        flex-direction: column;
    }

}


/* =========================================================
   NEW IT'S WHAT I GOT REQUEST UI OVERRIDE
   Functionality unchanged - UI replacement only
   ========================================================= */

.request-feed{
    max-width:1180px!important;
}

.product-row .container{
    max-width:1180px!important;
}

#requestResultsArea{
    max-width:820px;
}

.request-search-card,
.new-request-card,
.fb-post{
    border-radius:22px!important;
    border:1px solid #ededed!important;
    box-shadow:0 10px 35px rgba(0,0,0,.06)!important;
}

.search-filter-row{
    background:#fff!important;
    border:1px solid #ececec!important;
    padding:5px!important;
    border-radius:16px!important;
}

.search-filter-row .btn{
    background:#202428!important;
    color:#fff!important;
    height:44px!important;
}

.new-request-card{
    background:#fff!important;
}

.fb-post{
    padding:0!important;
    overflow:hidden!important;
    margin-bottom:20px!important;
}

.fb-post-header{
    padding:22px 24px 10px!important;
}

.fb-post-avatar{
    background:#f8c91c!important;
    color:#202428!important;
    width:48px!important;
    height:48px!important;
}

.fb-post-title{
    padding:12px 24px 5px!important;
}

.fb-post-title h5{
    font-size:22px!important;
}

.fb-post-body{
    padding:5px 24px 20px!important;
}

.fb-response-summary{
    background:#fafafa!important;
    padding:14px 24px!important;
}

.fb-comments-area{
    background:#fff!important;
    padding:15px 24px!important;
}

.fb-comment{
    background:#f8fafc!important;
    border:1px solid #edf0f4!important;
    border-radius:16px!important;
    padding:16px!important;
    margin-bottom:12px!important;
}

.fb-comment-message{
    background:#fff!important;
    border-radius:12px!important;
    padding:12px 14px!important;
    border:1px solid #edf0f4!important;
}

.fb-response-badge{
    border-radius:20px!important;
    padding:5px 12px!important;
}

.fb-offer{
    background:#eaf8ef!important;
    color:#15965b!important;
    border-radius:20px!important;
    padding:8px 14px!important;
}

.fb-conversation{
    margin-top:15px!important;
    border-left:0!important;
    padding:15px!important;
    background:#fff!important;
}

.fb-chat-bubble{
    border-radius:18px!important;
    padding:12px 16px!important;
}

.fb-chat-own .fb-chat-bubble{
    background:#f5c400!important;
    color:#202428!important;
}

.fb-chat-form{
    background:#fff!important;
    padding:15px!important;
    border-radius:18px!important;
    border:1px solid #eee!important;
}

.fb-chat-input-row textarea{
    border-radius:18px!important;
    min-height:45px!important;
}

.fb-send-btn{
    width:100px!important;
    background:#202428!important;
    border:0!important;
}

.fb-post-actions{
    background:#fff!important;
    padding:15px 24px!important;
}

.fb-action-buttons{
    gap:12px!important;
}

.fb-action-buttons button{
    border-radius:12px!important;
}

.pagination .page-link{
    border-radius:50%!important;
}

@media(max-width:768px){
    .fb-comment{
        padding:12px!important;
    }
}


/* ================================
   CLEAN MARKETPLACE UI UPDATE
   UI ONLY - FUNCTIONALITY UNCHANGED
================================ */

.product-row .container{
    max-width:1100px !important;
}

.request-feed,
#requestResultsArea{
    max-width:100% !important;
}

.request-search-card,
.new-request-card{
    border-radius:18px !important;
    border:1px solid #e9e9e9 !important;
    box-shadow:0 8px 25px rgba(0,0,0,.05) !important;
}

.request-search-card .card-body,
.new-request-card .card-body{
    padding:24px !important;
}

/* Search */
.search-filter-row{
    background:#fff !important;
    border:1px solid #ddd !important;
    border-radius:12px !important;
    padding:5px !important;
}

.search-filter-row .btn{
    border-radius:10px !important;
    height:42px !important;
}

/* New request */
.new-request-card{
    background:#fff !important;
}

.new-request-card .form-control,
.new-request-card .form-select{
    height:46px;
    border-radius:10px !important;
}

.new-request-card textarea{
    height:100px !important;
}

/* Main post */
.fb-post{
    border-radius:18px !important;
    border:1px dashed #f4c327 !important;
    box-shadow:0 6px 22px rgba(0,0,0,.05) !important;
    margin-bottom:22px !important;
}

/* Header */
.fb-post-header{
    padding:20px 22px 12px !important;
}

.fb-post-avatar{
    width:44px !important;
    height:44px !important;
    background:#f5c400 !important;
    color:#222 !important;
}

.fb-post-title{
    padding:10px 22px !important;
}

.fb-post-title h5{
    font-size:21px !important;
    font-weight:700 !important;
}

.fb-post-body{
    padding:0 22px 20px !important;
}

/* Replies */
.fb-comments-area{
    background:#f8f9fa !important;
    padding:16px !important;
}

.fb-comment{
    background:#fff !important;
    border:1px solid #ececec !important;
    border-radius:14px !important;
    padding:15px !important;
    margin-bottom:12px !important;
}

.fb-comment-message{
    background:#f8f9fb !important;
    border:0 !important;
    border-radius:10px !important;
}

.fb-response-badge{
    border-radius:20px !important;
}

.fb-offer{
    border-radius:20px !important;
}

/* Chat */
.fb-conversation{
    background:#f8f9fa !important;
    border-radius:14px !important;
    padding:14px !important;
    border:0 !important;
}

.fb-chat-bubble{
    border-radius:16px !important;
}

.fb-chat-own .fb-chat-bubble{
    background:#f5c400 !important;
    color:#222 !important;
}

/* Bottom buttons */
.fb-post-actions{
    padding:18px 22px !important;
}

.fb-action-buttons button{
    height:42px !important;
    border-radius:12px !important;
}

/* forms */
.fb-response-form,
.fb-chat-form{
    background:#fff !important;
    border:1px solid #e8e8e8 !important;
    border-radius:16px !important;
}

/* Remove excessive narrow look */
@media(min-width:992px){
    .col-lg-9{
        width:85% !important;
    }
}

/* Mobile */
@media(max-width:768px){
    .request-search-card .card-body,
    .new-request-card .card-body{
        padding:16px !important;
    }
}

/* =========================================================
   ITS WHAT I GOT - PREMIUM DARK THEME
   Applies ONLY when body.dark-mode is active
   Light theme remains unchanged
   ========================================================= */

body.dark-mode {
    background:#111111!important;
    color:#ffffff!important;
}

/* Main cards */
body.dark-mode .request-search-card,
body.dark-mode .new-request-card,
body.dark-mode .fb-post {
    background:#1b1b1b!important;
    border:1px solid #3b3210!important;
    box-shadow:0 10px 35px rgba(0,0,0,.35)!important;
    color:#fff!important;
}

/* Search */
body.dark-mode .search-filter-row {
    background:#151515!important;
    border:1px solid #4a3d00!important;
}

body.dark-mode .input-group-text {
    color:#f5c400!important;
}

body.dark-mode .form-control,
body.dark-mode .form-select {
    background:#151515!important;
    color:#fff!important;
    border-color:#4a3d00!important;
}

body.dark-mode .form-control::placeholder {
    color:#888!important;
}

body.dark-mode .btn-dark,
body.dark-mode .search-filter-row .btn {
    background:#f5c400!important;
    border-color:#f5c400!important;
    color:#111!important;
    font-weight:700!important;
}

/* Request header */
body.dark-mode .fb-post-header,
body.dark-mode .fb-post-title,
body.dark-mode .fb-post-body {
    background:#1b1b1b!important;
}

body.dark-mode .fb-post-avatar {
    background:#f5c400!important;
    color:#111!important;
}

body.dark-mode .fb-post-author,
body.dark-mode .fb-post-title h5,
body.dark-mode h5,
body.dark-mode strong {
    color:#fff!important;
}

body.dark-mode .fb-post-description,
body.dark-mode .fb-comment-actions,
body.dark-mode .fb-post-time {
    color:#aaa!important;
}

/* Responses */
body.dark-mode .fb-response-summary {
    background:#151515!important;
    color:#aaa!important;
    border-color:#332900!important;
}

body.dark-mode .fb-comments-area {
    background:#141414!important;
}

body.dark-mode .fb-comment {
    background:#222!important;
    border:1px solid #332900!important;
    border-radius:16px!important;
}

body.dark-mode .fb-comment-message {
    background:#171717!important;
    color:#ddd!important;
    border-color:#443700!important;
}

body.dark-mode .fb-comment-author {
    color:#fff!important;
}

/* Badges */
body.dark-mode .fb-response-badge {
    background:#332900!important;
    color:#f5c400!important;
}

body.dark-mode .fb-offer {
    background:#193b24!important;
    color:#8cff9a!important;
}

/* Conversation */
body.dark-mode .fb-conversation {
    background:#151515!important;
}

body.dark-mode .fb-chat-bubble {
    background:#292929!important;
    color:#fff!important;
}

body.dark-mode .fb-chat-own .fb-chat-bubble {
    background:#f5c400!important;
    color:#111!important;
}

body.dark-mode .fb-chat-form,
body.dark-mode .fb-response-form {
    background:#1b1b1b!important;
    border-color:#332900!important;
}

/* Pagination */
body.dark-mode .pagination .page-link {
    background:#1b1b1b!important;
    color:#fff!important;
    border-color:#4a3d00!important;
}

body.dark-mode .pagination .active .page-link {
    background:#f5c400!important;
    color:#111!important;
}



/* =========================================================
   PREMIUM DARK MARKETPLACE V2
   Cleaner reference-style finish
========================================================= */

body.dark-mode .page-banner{
    background:linear-gradient(110deg,#171717,#4b3900,#c29a00)!important;
}

body.dark-mode .request-feed,
body.dark-mode .product-row{
    background:#111!important;
}

body.dark-mode .request-search-card,
body.dark-mode .new-request-card,
body.dark-mode .fb-post{
    background:#181818!important;
    border:1px solid rgba(245,196,0,.35)!important;
    box-shadow:0 20px 50px rgba(0,0,0,.45)!important;
}

body.dark-mode .search-filter-row{
    background:#202020!important;
    border-color:#6b5200!important;
}

body.dark-mode .form-control,
body.dark-mode .form-select,
body.dark-mode textarea{
    background:#101010!important;
    color:#fff!important;
}

body.dark-mode .fb-post-title h5{
    font-size:24px!important;
    letter-spacing:.2px;
}

body.dark-mode .fb-post-description{
    color:#c7c7c7!important;
}

body.dark-mode .fb-comments-area{
    background:#101010!important;
}

body.dark-mode .fb-comment{
    background:#202020!important;
    border:1px solid #393000!important;
}

body.dark-mode .fb-post-actions{
    background:#181818!important;
    border-top:1px solid #393000!important;
}

body.dark-mode .fb-action-buttons button{
    height:45px!important;
    font-size:13px!important;
}

body.dark-mode .pagination .page-link{
    background:#181818!important;
    color:#f5c400!important;
}

body.dark-mode .pagination .active .page-link{
    background:#f5c400!important;
    color:#111!important;
}

/* Better width like reference */
@media(min-width:992px){
    body.dark-mode #requestResultsArea{
        max-width:760px!important;
    }

    body.dark-mode .request-search-card,
    body.dark-mode .new-request-card{
        max-width:760px;
        margin-left:auto;
        margin-right:auto;
    }
}



/* =========================================================
   FIX DARK THEME CARD WIDTH MATCH LIGHT THEME
   ========================================================= */

body.dark-mode .request-feed,
body.dark-mode .product-row .container {
    max-width: 1100px !important;
}

body.dark-mode #requestResultsArea {
    max-width: 100% !important;
}

body.dark-mode .request-search-card,
body.dark-mode .new-request-card,
body.dark-mode .fb-post {
    width: 100% !important;
    max-width: 820px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Keep same card width as light theme */
@media (min-width: 992px) {
    body.dark-mode .col-lg-9 {
        width: 75% !important;
    }
}

/* Remove dark-only narrow layout */
body.dark-mode .fb-post {
    transform: none !important;
}

body.dark-mode #new-req {
    background: #1b1b1b;
}


body.dark-mode #requestResultsArea .alert {
    border-radius: 14px;
    padding: 28px 20px;
    color: #ffffff;
    background: #1b1b1b;
    
}