/* =========================================================
   TAREVISOS — BUSINESS APPLICATION (WORLD CLASS UI)
   Split layout: image left, form right, centered
   ========================================================= */

:root{
  --tv-bg: #f5f7fb;
  --tv-card: #ffffff;
  --tv-text: #101828;
  --tv-muted: #667085;
  --tv-border: #eaecf0;

  --tv-black: #000;
  --tv-red: #dc3545;

  --tv-radius: 22px;
  --tv-shadow: 0 28px 90px rgba(16,24,40,.14);
}

/* page */
.tv-ba-page{
  background:
    radial-gradient(900px 500px at 20% 10%, rgba(220,53,69,.10), transparent 60%),
    radial-gradient(900px 500px at 80% 90%, rgba(0,0,0,.06), transparent 60%),
    var(--tv-bg);
  color: var(--tv-text);
}

.tv-ba-shell{
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 28px 0;
}

.tv-ba-wrap{
  width: 100%;
  display: flex;
  justify-content: center;
}

/* main card */
.tv-ba-card{
  width: min(1100px, 100%);
  background: var(--tv-card);
  border: 1px solid var(--tv-border);
  border-radius: var(--tv-radius);
  overflow: hidden;
  box-shadow: var(--tv-shadow);
}

/* left visual */
.tv-ba-visual{
  min-height: 780px;
  height: 100%;
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 40px;
  display: flex;
  align-items: flex-end;
}

.tv-ba-visual__overlay{
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.80) 100%);
}

.tv-ba-visual__content{
  position: relative;
  z-index: 2;
  color: #fff;
  max-width: 360px;
}

.tv-ba-visual__logo{
  width: 70px;
  height: 70px;
  object-fit: contain;
  border-radius: 16px;
  padding: 10px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  margin-bottom: 14px;
}

.tv-ba-visual__content h2{
  font-weight: 900;
  letter-spacing: -.5px;
  margin: 0 0 10px;
}

.tv-ba-visual__content p{
  margin: 0 0 18px;
  opacity: .92;
  line-height: 1.6;
}

.tv-ba-visual__points{
  display: grid;
  gap: 10px;
  margin-top: 10px;
}

.tv-ba-point{
  display: flex;
  gap: 10px;
  align-items: center;
  font-weight: 800;
  font-size: 14px;
}

.tv-ba-point i{
  width: 18px;
}

/* right panel */
.tv-ba-panel{
  padding: 34px 34px 28px;
}

.tv-ba-header h3{
  font-weight: 900;
  letter-spacing: -.5px;
}

.tv-ba-header p{
  color: var(--tv-muted);
}

/* progress */
.tv-ba-progress{
  margin-top: 18px;
  margin-bottom: 20px;
}

.progress-custom{
  height: 10px;
  background: #eef2f6;
  border-radius: 999px;
  overflow: hidden;
}

.progress-bar-custom{
  background: var(--tv-black);
  transition: width .25s ease;
}

/* ✅ THIS FIXES “ALL STEPS SHOWING” */
.form-section{ display: none; }
.form-section.active{
  display: block;
  animation: tvFade .25s ease;
}

@keyframes tvFade{
  from{ opacity: .6; transform: translateY(4px); }
  to{ opacity: 1; transform: translateY(0); }
}

/* titles */
.tv-ba-step-title{
  font-weight: 900;
  letter-spacing: -.3px;
  margin: 8px 0 14px;
  display: flex;
  align-items: center;
}

/* fields */
.form-label{
  font-weight: 800;
  color: #111827;
}

.required-field::after{
  content: " *";
  color: var(--tv-red);
  font-weight: 900;
}

/* inputs */
.form-control,
.form-select,
textarea{
  border-radius: 14px !important;
  border: 1px solid var(--tv-border) !important;
  padding: 12px 14px !important;
  box-shadow: none !important;
}

.form-control:focus,
.form-select:focus,
textarea:focus{
  border-color: rgba(220,53,69,.55) !important;
  outline: none !important;
}

/* file upload */
.file-upload{
  border: 2px dashed #d0d5dd;
  border-radius: 16px;
  padding: 18px;
  text-align: center;
  cursor: pointer;
  transition: all .18s ease;
  background: #fff;
}

.file-upload:hover{
  border-color: #111827;
  transform: translateY(-1px);
}

.file-upload i{
  font-size: 34px;
  color: #111827;
  margin-bottom: 6px;
}

/* invalid */
.is-invalid{
  border-color: var(--tv-red) !important;
}

.file-upload.is-invalid{
  border-color: var(--tv-red) !important;
}

.invalid-feedback{
  color: var(--tv-red);
  font-weight: 700;
  font-size: .9rem;
}

/* buttons — keep your class names */
.btn-custom-primary{
  background: var(--tv-black);
  border-color: var(--tv-black);
  color: #fff;
  border-radius: 14px;
  padding: 12px 16px;
  font-weight: 900;
}

.btn-custom-primary:hover{
  background: #1b1f24;
  border-color: #1b1f24;
  color: #fff;
}

.btn-outline-custom-secondary{
  border: 1px solid #c9ced6;
  color: #344054;
  border-radius: 14px;
  padding: 12px 16px;
  font-weight: 900;
  background: transparent;
}

.btn-outline-custom-secondary:hover{
  background: #eef2f6;
}

.btn-custom-success{
  background: var(--tv-red);
  border-color: var(--tv-red);
  color: #fff;
  border-radius: 14px;
  padding: 12px 16px;
  font-weight: 900;
}

.btn-custom-success:hover{
  background: #b02a37;
  border-color: #b02a37;
}

/* badges */
.badge-custom{
  background: var(--tv-black);
  color: #fff;
}

/* mobile */
@media (max-width: 991px){
  .tv-ba-panel{ padding: 26px 18px; }
}


