/**
 * App cotización – Grupo Inversor H&S
 * Colores: azul oscuro del logo (#0f3460), fondo claro.
 */
:root {
  --app-primary: #0f3460;
  --app-primary-dark: #0a2540;
  --app-hero-bg: #ffffff;
  --app-hero-border: #0f3460;
  --app-btn-hover: #0d2d4a;
}

.layout-app-cotizar .cotizar-hero {
  background: var(--app-hero-bg) !important;
  color: var(--app-primary);
  border-bottom: 3px solid var(--app-hero-border);
  box-shadow: 0 1px 0 0 rgba(15, 52, 96, 0.08);
  padding-top: 0.35rem !important;
  padding-bottom: 0.35rem !important;
  margin-top: 0 !important;
}

.layout-app-cotizar .cotizar-hero .app-brand {
  color: var(--app-primary) !important;
}

.layout-app-cotizar .cotizar-hero .app-brand:hover {
  color: var(--app-primary-dark) !important;
}

.layout-app-cotizar .cotizar-hero .btn-outline-light {
  color: var(--app-primary) !important;
  border-color: var(--app-primary) !important;
}

.layout-app-cotizar .cotizar-hero .btn-outline-light:hover {
  background-color: var(--app-primary) !important;
  color: #fff !important;
  border-color: var(--app-primary) !important;
}

.layout-app-cotizar .cotizar-hero .btn-light {
  background-color: var(--app-primary) !important;
  border-color: var(--app-primary) !important;
  color: #fff !important;
}

.layout-app-cotizar .cotizar-hero .btn-light:hover {
  background-color: var(--app-btn-hover) !important;
  border-color: var(--app-btn-hover) !important;
  color: #fff !important;
}

.layout-app-cotizar .btn-primary,
.layout-app-cotizar .btn-primary:hover,
.layout-app-cotizar .btn-primary:focus,
.layout-app-cotizar .btn-primary:focus-visible {
  background-color: var(--app-primary) !important;
  border-color: var(--app-primary) !important;
}

.layout-app-cotizar .btn-primary:hover,
.layout-app-cotizar .btn-primary:focus-visible {
  background-color: var(--app-btn-hover) !important;
  border-color: var(--app-btn-hover) !important;
}

.layout-app-cotizar .btn-outline-primary {
  color: var(--app-primary) !important;
  border-color: var(--app-primary) !important;
}

.layout-app-cotizar .btn-outline-primary:hover {
  background-color: var(--app-primary) !important;
  color: #fff !important;
  border-color: var(--app-primary) !important;
}

.layout-app-cotizar .badge.bg-primary {
  background-color: var(--app-primary) !important;
}

.layout-app-cotizar .app-logo {
  max-height: 150px;
  width: auto;
  max-width: 680px;
  min-height: 64px;
  height: auto;
  object-fit: contain;
  object-position: left center;
  vertical-align: middle;
}

.layout-app-cotizar .app-brand {
  display: inline-flex !important;
  align-items: center;
  gap: 0.5rem;
}

/* Fallback visible solo cuando no hay logo */
.layout-app-cotizar #app-logo-fallback.d-none {
  display: none !important;
}

@media (min-width: 768px) {
  .layout-app-cotizar .app-logo {
    max-height: 160px;
    max-width: 720px;
  }
}