/* Enhanced Fiverr-like style */
.bfma-wrap { max-width:100%; margin:40px auto; font-family: "Helvetica Neue", Arial, sans-serif; color:#222; padding:0 0px; }
.bfma-header { font-size:32px; font-weight:700; margin-bottom:18px; }
.bfma-tabs { display:flex; gap:20px; border-bottom:1px solid #eee; margin-bottom:20px; position:relative; }
.bfma-tab { padding:14px 6px; cursor:pointer; color:#6b6b6b; border-bottom:3px solid transparent; position:relative; font-weight:600; }
.bfma-tab:hover { color:#111; }
.bfma-tab.active { color:#111; }
.bfma-tab:after { content:''; position:absolute; left:0; right:0; bottom:-1px; height:3px; background:transparent; transform:translateX(-10px); transition:transform .25s cubic-bezier(.2,.9,.2,1), background .25s; }
.bfma-tab.active:after { background:#111; transform:translateX(0); }

/* controls */
.bfma-controls { display:flex; gap:12px; align-items:center; margin-bottom:18px; flex-wrap:wrap; }
.bfma-search { padding:10px 12px; border:1px solid #e6e6e6; border-radius:6px; width:320px; box-shadow:none; }
.bfma-filter { padding:10px 12px; border:1px solid #e6e6e6; border-radius:6px; background:#fff; min-width:150px; }

.bfma-orders-container { border:1px solid #f1f1f1; border-radius:8px; padding:18px; background:#fff; min-height:140px; }
.bfma-order { border:1px solid #f0f0f0; padding:14px; border-radius:6px; display:flex; justify-content:space-between; margin-bottom:12px; align-items:center; }
.bfma-order .left { max-width:70%; }
.bfma-order .right { text-align:right; min-width:180px; }
.bfma-empty { text-align:center; padding:60px 0; color:#666; }

/* --- BUTTON FIX START --- */
.bfma-btn { 
    background:#111; 
    color:#fff; /* Default text color is white */
    padding:10px 14px; 
    border-radius:6px; 
    text-decoration:none; 
    display:inline-block; 
    border:0; 
    cursor:pointer; 
    /* Remove default shadow if any, to keep it clean */
}
.bfma-btn:hover { 
    /* Background slightly darker on hover */
    background:#000; 
    color:#fff; /* Fix: Ensure text remains white on hover */
} 
.bfma-btn:active { 
    /* Background color when clicked */
    background:#111; 
    color:#fff; /* Fix: Ensure text remains white when clicked */
}
/* --- BUTTON FIX END --- */


.bfma-boxes { display:flex; gap:20px; flex-wrap:wrap; }
.bfma-box { border:1px solid #eee; padding:20px; border-radius:6px; flex:1; background:#fff; min-width:220px; box-sizing:border-box; }

.bfma-form label { display:block; margin-top:10px; font-size:13px; color:#555; }
.bfma-form input, .bfma-form select { padding:10px; width:100%; border:1px solid #e6e6e6; border-radius:6px; margin-top:6px; box-sizing:border-box; }

/* responsive: mobile tabs horizontal scroll and underline */
@media (max-width:768px) {
    .bfma-wrap { padding:10px; margin:20px auto; }
    .bfma-tabs { overflow-x:auto; -webkit-overflow-scrolling:touch; gap:8px; }
    .bfma-tab { white-space:nowrap; padding:12px 10px; font-size:15px; }
    .bfma-orders-container { padding:12px; }
    .bfma-order { flex-direction:column; align-items:flex-start; gap:10px; }
    .bfma-order .right { width:100%; text-align:left; }
    .bfma-header { font-size:20px; font-weight:600; }
}