/* ── RDI Brand Variables ─────────────────────────────────────────── */
:root {
  --rdi-black:   #111111;
  --rdi-dark:    #1a1a1a;
  --rdi-green:   #38B038;
  --rdi-green-d: #2B8B2B;
  --rdi-green-bg:#E8F5E8;
  --rdi-cream:   #EDE8DF;
  --rdi-silver:  #9E9284;
  --rdi-bg:      #F2F4F6;
  --rdi-warn:    #FF8C42;
}

body { background: var(--rdi-bg); color: #222; }

/* ── Navbar ──────────────────────────────────────────────────────── */
.navbar {
  background: var(--rdi-black) !important;
  border-bottom: 2px solid var(--rdi-green);
  padding-top: .6rem; padding-bottom: .6rem;
}
.nav-logo img { height: 54px; }
.navbar .btn-outline-light { border-color: #555; color: #ccc; }
.navbar .btn-outline-light:hover { background: #333; border-color: #888; }

/* ── Buttons ─────────────────────────────────────────────────────── */
.btn-rdi { background: var(--rdi-green); color: #fff; border: none; font-weight: 600; }
.btn-rdi:hover, .btn-rdi:focus { background: var(--rdi-green-d); color: #fff; }
.btn-dark { background: var(--rdi-black) !important; border-color: var(--rdi-black) !important; }
.btn-dark:hover { background: #333 !important; }

/* ── Cards ───────────────────────────────────────────────────────── */
.card {
  border: none;
  box-shadow: 0 1px 6px rgba(0,0,0,.09);
  border-radius: .6rem;
}
.card-header-dark {
  background: var(--rdi-black);
  color: var(--rdi-cream);
  border-radius: .6rem .6rem 0 0 !important;
  font-weight: 600;
  font-size: .9rem;
  letter-spacing: .3px;
}

/* ── Metric cards ────────────────────────────────────────────────── */
.metric-card {
  background: var(--rdi-black);
  color: var(--rdi-cream);
  border-radius: .6rem;
  padding: 1rem 1.25rem;
  height: 100%;
}
.metric-val {
  font-size: 1.7rem;
  font-weight: 700;
  color: var(--rdi-green);
  line-height: 1.1;
  word-break: break-word;
}
.metric-lbl {
  font-size: .72rem;
  color: var(--rdi-silver);
  text-transform: uppercase;
  letter-spacing: .6px;
  margin-top: .2rem;
}
.metric-warn .metric-val  { color: var(--rdi-warn); }
.metric-alert .metric-val { color: #ff4e4e; }
.metric-ok .metric-val    { color: var(--rdi-green); }

/* ── Chart wrapper ───────────────────────────────────────────────── */
.chart-wrap {
  background: #fff;
  border-radius: .6rem;
  padding: 1.1rem 1rem .8rem;
  box-shadow: 0 1px 4px rgba(0,0,0,.07);
}
.chart-title {
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: #555;
  margin-bottom: .6rem;
}

/* ── Property photo ──────────────────────────────────────────────── */
.prop-photo {
  width: 100%;
  height: 180px;
  object-fit: cover;
  border-radius: .5rem;
  background: #1a1a1a;
}
.prop-photo-placeholder {
  width: 100%;
  height: 180px;
  background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
  border-radius: .5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--rdi-silver);
  font-size: 2.5rem;
}

/* ── Status badges ───────────────────────────────────────────────── */
.badge-pendiente { background: #ffc107; color: #000; }
.badge-enviado   { background: var(--rdi-green); color: #fff; }
.badge-error     { background: #dc3545; color: #fff; }

/* ── Table ───────────────────────────────────────────────────────── */
.table-rdi thead th {
  background: var(--rdi-black);
  color: var(--rdi-silver);
  font-size: .74rem;
  text-transform: uppercase;
  letter-spacing: .5px;
  border: none;
}
.table-rdi tbody tr:hover { background: var(--rdi-green-bg); }

/* ── Price tag ───────────────────────────────────────────────────── */
.price-tag {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--rdi-black);
}
.price-diff-up    { color: var(--rdi-warn); }
.price-diff-down  { color: var(--rdi-green); }
.price-diff-ok    { color: #6c757d; }

/* ── Comparables list ────────────────────────────────────────────── */
.comp-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: .45rem 0;
  border-bottom: 1px solid #f0f0f0;
  font-size: .85rem;
}
.comp-row:last-child { border-bottom: none; }
.comp-price { font-weight: 700; color: var(--rdi-black); }

/* ── Login ───────────────────────────────────────────────────────── */
.login-wrap {
  min-height: 100vh;
  background: var(--rdi-black);
  display: flex;
  align-items: center;
  justify-content: center;
}
.login-card {
  background: #1c1c1c;
  border-radius: 1rem;
  padding: 2.5rem 2rem;
  width: 100%;
  max-width: 380px;
  box-shadow: 0 4px 40px rgba(0,0,0,.6);
}
.login-card .form-control {
  background: #2a2a2a;
  border-color: #3a3a3a;
  color: #fff;
}
.login-card .form-control:focus {
  background: #2a2a2a;
  border-color: var(--rdi-green);
  color: #fff;
  box-shadow: 0 0 0 .2rem rgba(56,176,56,.25);
}
.login-card label { color: var(--rdi-silver); font-size: .85rem; }

/* ── Análisis / conclusión ───────────────────────────────────────── */
.analysis-text {
  white-space: pre-wrap;
  font-size: .87rem;
  line-height: 1.7;
  color: #222;
  padding: 1rem 1.1rem;
}

/* ── Fuente badges (Tokko / MercadoLibre) ────────────────────────── */
.badge-fuente {
  display: inline-block;
  font-size: .6rem;
  font-weight: 700;
  padding: 1px 4px;
  border-radius: 3px;
  vertical-align: middle;
  line-height: 1.4;
  letter-spacing: .3px;
}
.badge-ml     { background: #FFE600; color: #333; }
.badge-tokko  { background: #38B038; color: #fff; }

/* ── Print / PDF ─────────────────────────────────────────────────── */
@media print {
  /* Forzar reproducción exacta de colores de fondo */
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }

  .navbar, .no-print { display: none !important; }

  /* Página A4 — sin desborde */
  @page { size: A4 portrait; margin: 1.4cm 1.2cm; }
  html, body {
    background: white !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  /* Contenedor Bootstrap: full-width en A4 */
  .container, .container-fluid {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Cards */
  .card {
    box-shadow: none !important;
    border: 1px solid #ccc !important;
    break-inside: avoid;
  }

  /* Card headers — se mantienen oscuros en print */
  .card-header-dark {
    background: #111 !important;
    color: #EDE8DF !important;
  }

  /* Metric cards — paleta RDI en PDF */
  .metric-card {
    background: #111 !important;
    color: #EDE8DF !important;
    border: 1px solid #333 !important;
  }
  .metric-val               { color: #38B038 !important; font-size: 1.3rem !important; }
  .metric-warn .metric-val  { color: #FF8C42 !important; }
  .metric-alert .metric-val { color: #ff4e4e !important; }

  /* Tabla comparables */
  .table-rdi thead th { background: #111 !important; color: #9E9284 !important; }

  /* Foto y gráfico */
  .prop-photo, .prop-photo-placeholder { height: 140px !important; }
  .chart-wrap { page-break-inside: avoid; }

  /* Layout 2 columnas forzado en print */
  .row.g-3  { display: flex !important; flex-wrap: nowrap !important; }
  .col-lg-5 { width: 40% !important; flex: 0 0 40% !important; max-width: 40% !important; }
  .col-lg-7 { width: 60% !important; flex: 0 0 60% !important; max-width: 60% !important; }

  /* Métricas: 5 en una fila */
  .row-cols-lg-5 > * { flex: 0 0 20% !important; max-width: 20% !important; }

  /* Textarea del borrador: solo texto plano */
  textarea.form-control {
    border: none !important;
    background: transparent !important;
    resize: none !important;
    font-size: .8rem !important;
    line-height: 1.6 !important;
    color: #222 !important;
    height: auto !important;
    min-height: 0 !important;
  }
  .card-footer { display: none !important; }

  /* Logo en cabecera de impresión */
  .print-logo { height: 44px !important; width: auto !important; }

  /* Análisis: texto completo, sin recorte */
  .analysis-text {
    font-size: .82rem !important;
    line-height: 1.6 !important;
    padding: .6rem .8rem !important;
    height: auto !important;
    overflow: visible !important;
  }
  /* Ocultar botones de edición en print */
  #btn-edit, #edit-mode { display: none !important; }
  #view-mode { display: block !important; }
}