body{

    margin:0;

    font-family:Arial, sans-serif;

    background:#0b1020;

    color:white;

    padding-bottom:80px;

}



/* HEADER */

header{

    text-align:center;

    padding:20px;

    background:#111;

    border-bottom:2px solid gold;

}



header h1{

    color:gold;

    margin:0;

    font-size:32px;

}



header p{

    margin-top:5px;

    color:#ccc;

    font-size:14px;

}



/* LOGIN / AUTH BOX */

.auth-box{

    width:90%;

    max-width:500px;

    margin:25px auto;

    background:#111827;

    padding:25px;

    border-radius:15px;

    box-shadow:0 0 20px rgba(0,0,0,.4);

}



.auth-box h2{

    color:gold;

    margin-bottom:15px;

}



.auth-box input{

    width:100%;

    padding:12px;

    margin:8px 0;

    border:none;

    border-radius:10px;

    box-sizing:border-box;

}



.auth-box button{

    width:100%;

    padding:12px;

    margin-top:10px;

    border:none;

    border-radius:10px;

    background:gold;

    color:black;

    font-weight:bold;

    cursor:pointer;

}



.auth-box button:hover{

    background:#ffd700;

}



/* SEARCH */

.search-bar{

    width:90%;

    max-width:600px;

    margin:20px auto;

}



.search-bar input{

    width:100%;

    padding:14px;

    border:none;

    border-radius:12px;

    box-sizing:border-box;

}



/* POST PRODUCT BOX */

.post-section{

    width:90%;

    max-width:700px;

    margin:20px auto;

    background:#111827;

    padding:20px;

    border-radius:15px;

}



.post-section h2{

    color:gold;

}



.post-section input,

.post-section textarea{

    width:100%;

    padding:12px;

    margin:8px 0;

    border:none;

    border-radius:10px;

    box-sizing:border-box;

}



.post-section button{

    width:100%;

    padding:12px;

    border:none;

    border-radius:10px;

    background:gold;

    color:black;

    font-weight:bold;

    cursor:pointer;

}



/* PRODUCT GRID */

#itemFeed{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

    gap:20px;

    padding:20px;

}



.item-card{

    background:#111827;

    border-radius:16px;

    overflow:hidden;

    box-shadow:0 0 15px rgba(0,0,0,.3);

}



.item-card img{

    width:100%;

    height:220px;

    object-fit:cover;

}



.item-content{

    padding:15px;

}



.item-content h2{

    margin:0 0 10px;

}



.item-content p{

    color:#ddd;

}



.price{

    color:gold;

    font-size:24px;

    font-weight:bold;

}



.buy-btn,

.chat-btn{

    width:100%;

    padding:12px;

    margin-top:10px;

    border:none;

    border-radius:10px;

    font-weight:bold;

    cursor:pointer;

}



.buy-btn{

    background:gold;

    color:black;

}



.chat-btn{

    background:#2563eb;

    color:white;

}



/* CHAT BOX */

#chatSection{

    width:90%;

    max-width:500px;

    margin:20px auto;

    background:#111827;

    padding:20px;

    border-radius:15px;

}



#chatSection input{

    width:100%;

    padding:12px;

    margin:8px 0;

    border:none;

    border-radius:10px;

    box-sizing:border-box;

}



#chatSection button{

    width:100%;

    padding:12px;

    margin-top:8px;

    border:none;

    border-radius:10px;

}



/* BOTTOM NAV */

.bottom-nav{

    position:fixed;

    bottom:0;

    left:0;

    width:100%;

    display:flex;

    justify-content:space-around;

    background:#111;

    padding:12px 0;

    border-top:1px solid #333;

}



.bottom-nav button{

    background:none;

    color:white;

    border:none;

    font-size:16px;

    cursor:pointer;

}

/* GLOBAL FIX */

*{

  margin:0;

  padding:0;

  box-sizing:border-box;

}



body{

  font-family:Arial, sans-serif;

  background:linear-gradient(135deg,#050816,#11193a,#1a1f3d);

  color:white;

  min-height:100vh;

  padding-bottom:90px;

}



/* HEADER */

header{

  text-align:center;

  padding:20px;

}



header h1{

  font-size:32px;

  color:#ffd700;

}



header p{

  color:#ccc;

  margin-top:5px;

}



/* LOGIN SECTION */

.auth-box{

  width:95%;

  max-width:900px;

  margin:20px auto;

  background:rgba(255,255,255,0.05);

  padding:20px;

  border-radius:20px;

}



.auth-box h2{

  margin-bottom:15px;

}



.auth-row{

  display:flex;

  gap:10px;

  flex-wrap:wrap;

}



.auth-row input{

  flex:1;

  min-width:180px;

}



/* INPUTS */

input, textarea{

  width:100%;

  padding:14px;

  border:none;

  border-radius:12px;

  margin:8px 0;

  font-size:15px;

}



/* BUTTONS */

button{

  background:#ffd700;

  color:black;

  border:none;

  padding:14px;

  border-radius:12px;

  cursor:pointer;

  font-weight:bold;

  margin-top:8px;

}



button:hover{

  opacity:0.9;

}



/* SELL FORM */

.sell-box{

  width:95%;

  max-width:700px;

  margin:30px auto;

  background:rgba(255,255,255,0.05);

  padding:25px;

  border-radius:20px;

}



.sell-box h2{

  text-align:center;

  color:#ffd700;

  margin-bottom:15px;

}



/* BOTTOM NAV */

.bottom-nav{

  position:fixed;

  bottom:0;

  left:0;

  width:100%;

  background:#111;

  display:flex;

  justify-content:space-around;

  padding:15px;

  border-top:1px solid #333;

}



.bottom-nav button{

  background:none;

  color:white;

  padding:0;

}

