/* Tenavor Landing Page - Simple Bootstrap Approach */

/* Color base del body */
body {
  background: #fff;
}

/* Por defecto (extra small): container es 100% (no hay gutters) */
:root {
  --container-max: 100vw;
}

/* Bootstrap container max-width por breakpoints (aprox. BS5) */
@media (min-width: 576px) {
  :root {
    --container-max: 540px;
  }
}

@media (min-width: 768px) {
  :root {
    --container-max: 720px;
  }
}

@media (min-width: 992px) {
  :root {
    --container-max: 960px;
  }
}

@media (min-width: 1200px) {
  :root {
    --container-max: 1140px;
  }
}

@media (min-width: 1400px) {
  :root {
    --container-max: 1320px;
  }
}

/* Gutter izquierdo = (viewport - container) / 2 */
body {
  background-image: linear-gradient(
    to right,
    #f0f0f0 0,
    #f0f0f0 calc((100vw - var(--container-max)) / 2),
    transparent calc((100vw - var(--container-max)) / 2)
  );
  background-repeat: no-repeat;
  background-color: #fff; /* resto del body */
}

/* Global Inter Font Family for Landing Page */
body, html {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

body.no-gutter .container { 
  padding-left: 0 !important; 
  padding-right: 0 !important; 
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

p, span, div, a, button, input, textarea, select, label {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

/* Basic styling for the login form */
.form-control {
  border-radius: 8px;
  border: 2px solid #e9ecef;
  transition: all 0.3s ease;
}

.form-control:focus {
  border-color: #0d6efd;
  box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
}

.btn-primary {
  background-color: #2C6372;
  border-color: #2C6372;
  color: white;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.btn-primary:hover {
  background-color: #1e4a54;
  border-color: #1e4a54;
  color: white;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(44, 99, 114, 0.4);
}

.form-password-toggle .input-group-text {
  cursor: pointer;
}

/* Ensure proper spacing */
.vh-100 {
  height: 100vh !important;
}

/* Logo styles */
.logo {
  max-height: 6rem;
  max-width: 100%;
  width: auto;
  height: auto;
  opacity: 0.8;
  object-fit: contain;
}

/* Left panel background */
.d-none.d-lg-flex.col-lg-7.p-0 {
  background-color: #f0f0f0; /* gris claro */
}

/* Mobile adjustments */
@media (max-width: 991.98px) {
  .col-lg-7 {
    display: none !important;
  }
}