/* Background */
body{
    background: linear-gradient(135deg,#0f0f0f,#1c1c1c);
    min-height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
    font-family: 'Segoe UI', sans-serif;
}

/* Card */
.brand-card{
    background:#111;
    color:white;
    border-radius:20px;
    padding:30px;
    width:100%;
    max-width:500px;
    box-shadow:0 0 40px rgba(255,0,80,0.3);
    border-top:4px solid #ff2d55;
}

/* Logo */
.logo{
    display:block;
    margin:auto;
    width:140px;
    margin-bottom:15px;
}

/* Title */
.brand-title{
    text-align:center;
    font-weight:700;
    margin-bottom:20px;
}

/* Inputs */
.form-control{
    /* background:#1c1c1c;
     color:white; */
    border:1px solid #333;
   
    border-radius:10px;
    padding:12px;
}

.form-control:focus{
    background:#1c1c1c;
    color:white;
    border-color:#ff2d55;
    box-shadow:none;
}

/* Button */
.btn-brand{
    background: linear-gradient(45deg,#ff2d55,#ff6b81);
    border:none;
    padding:12px;
    border-radius:10px;
    font-weight:600;
    width:100%;
    color:white;
}

.btn-brand:hover{
    opacity:0.9;
}

/* Icons */
.input-group-text{
    background:#ff2d55;
    border:none;
    color:white;
}

/* Modern browsers */
textarea::placeholder,
input::placeholder {
  color: #fff !important; /* Important ensures override */
  opacity: 1; /* Firefox */
}

/* WebKit, Blink, Edge */
textarea::-webkit-input-placeholder,
input::-webkit-input-placeholder {
  color: #fff !important;
  opacity: 1;
}

/* Firefox 4-18 */
textarea:-moz-placeholder,
input:-moz-placeholder {
  color: #fff !important;
  opacity: 1;
}

/* Firefox 19+ */
textarea::-moz-placeholder,
input::-moz-placeholder {
  color: #fff !important;
  opacity: 1;
}

/* IE 10-11 */
textarea:-ms-input-placeholder,
input:-ms-input-placeholder {
  color: #fff !important;
}



/* Mobile */
@media(max-width:576px){
    .brand-card{
        margin:15px;
        padding:20px;
    }
}