body{
    background:#efefef;
    font-family:Arial, Helvetica, sans-serif;
    color:#111;
}
.topbar{
    background:#032b63;
    padding:20px 0;
    box-shadow:0 2px 8px rgba(0,0,0,.08);
}
.main-logo{
    height:85px;
    width:auto;
    display:block;
}
.lang-btn{
    font-size:15px;
    padding:10px 16px;
    border-radius:6px;
}
.flag-dot{
    display:inline-block;
    width:21px;
    height:14px;
    border-radius:2px;
    margin-right:7px;
    vertical-align:-2px;
    box-shadow:0 0 0 1px rgba(0,0,0,.15);
    background:linear-gradient(#c60b1e 0 25%, #ffc400 25% 75%, #c60b1e 75%);
}
.flag-en{ background:linear-gradient(90deg,#002868 0 33%,#fff 33% 66%,#bf0a30 66%); }
.flag-br{ background:linear-gradient(135deg,#009b3a 0 45%,#ffdf00 45% 60%,#002776 60%); }
.client-card{
    background:#fff;
    border:1px solid #d9d9d9;
    border-radius:6px;
    padding:28px;
    margin-top:40px;
    margin-bottom:50px;
    box-shadow:0 2px 6px rgba(0,0,0,.04);
}
.auth-card{
    max-width:520px;
    margin:42px auto 60px;
}
.page-title{
    font-size:34px;
    line-height:1.15;
    font-weight:800;
    margin-bottom:8px;
    color:#111;
}
.section-title{
    font-size:17px;
    font-weight:700;
    margin:26px 0 14px;
    color:#111;
}
.separator{
    border-top:1px solid #ddd;
    margin:22px 0;
}
.form-label{
    font-weight:600;
    margin-bottom:6px;
}
.form-control,.form-select{
    border-radius:6px;
    border:1px solid #d0d0d0;
    height:46px;
    font-size:15px;
}
textarea.form-control{height:auto;}
.form-control:focus,.form-select:focus{
    border-color:#0d6efd;
    box-shadow:none;
}
.btn-primary{
    background:#0d6efd;
    border-color:#0d6efd;
    padding:10px 22px;
    font-weight:600;
}
.btn-primary:hover{background:#0b5ed7;border-color:#0b5ed7;}
.smallhint{
    font-size:12px;
    color:#777;
    margin-top:4px;
}
.password-wrap{position:relative;}
.password-wrap .form-control{padding-right:88px;}
.password-toggle{
    position:absolute;
    right:10px;
    top:50%;
    transform:translateY(-50%);
    border:0;
    background:transparent;
    color:#0d6efd;
    font-size:14px;
    font-weight:600;
    padding:4px 6px;
}
.preview-img{
    max-height:74px;
    max-width:140px;
    border:1px solid #ddd;
    border-radius:4px;
    padding:2px;
    background:#fff;
}
@media(max-width:768px){
    .topbar{padding:16px 0;}
    .main-logo{height:65px;}
    .page-title{font-size:28px;}
    .client-card{padding:20px;margin-top:22px;}
    .auth-card{margin-top:24px;}
}


/* Smart Combo: input real + lista dinámica + permite valores nuevos */
.smart-combo{
    position:relative;
}
.smart-combo .form-control{
    padding-right:42px;
}
.smart-combo-clear{
    position:absolute;
    right:10px;
    top:50%;
    transform:translateY(-50%);
    width:24px;
    height:24px;
    border:0;
    background:transparent;
    color:#0d6efd;
    font-size:22px;
    line-height:20px;
    z-index:3;
}
.smart-combo-menu{
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:calc(100% + 4px);
    background:#fff;
    border:1px solid #d0d0d0;
    border-radius:6px;
    box-shadow:0 8px 20px rgba(0,0,0,.10);
    max-height:260px;
    overflow:auto;
    z-index:2000;
}
.smart-combo.open .smart-combo-menu{
    display:block;
}
.smart-combo-option{
    display:block;
    width:100%;
    padding:9px 12px;
    border:0;
    background:#fff;
    text-align:left;
    color:#111;
    font-size:15px;
}
.smart-combo-option:hover,
.smart-combo-option:focus{
    background:#e9f2ff;
    outline:0;
}
.smart-combo-add{
    font-weight:700;
    color:#032b63;
    border-bottom:1px solid #eee;
}
.smart-combo-empty{
    padding:9px 12px;
    color:#666;
    font-size:14px;
}

@media(max-width:768px){
    .smart-combo-menu{
        max-height:220px;
        font-size:16px;
    }
    .smart-combo-option{
        padding:12px 14px;
        font-size:16px;
    }
}
