/* ===== Tema de BP Minex para login, portal y páginas web ===== */
:root { --font-stack: var(--v-font); --bg-color: var(--v-bg); --text-color: var(--v-ink); --primary: var(--v-ink); --primary-color: var(--v-ink); --border-color: var(--v-line); --card-bg: var(--v-glass-solid); }
[data-theme="dark"] { --primary: var(--v-amber); --primary-color: var(--v-amber); }
html, body { font-family: var(--v-font) !important; font-weight: 300; background: var(--v-bg) !important; color: var(--v-ink); }
.page-content-wrapper, .page_content, main.container, .for-login, .for-signup, .for-forgot, .for-email-login, .for-login-with-email-link { background: transparent !important; }
h1, h2, h3, h4, h5 { font-weight: 400; letter-spacing: -.01em; }
.navbar { background: var(--v-glass) !important; backdrop-filter: blur(10px); border-bottom: 1px solid var(--v-line); }
.navbar .navbar-brand img { max-height: 36px; }   /* logo de dos renglones (BP Minex / ERP MINING): más bajo no se lee */
.page-card-head img.app-logo { max-height: 48px; height: 48px; width: auto; }

/* Login */
.for-login, .for-signup, .for-forgot { background: var(--v-bg); }
.for-login .page-card, .login-content.page-card, .page-card { background: var(--v-glass-solid) !important; border: 1px solid var(--v-line) !important; border-radius: var(--v-radius) !important; box-shadow: var(--v-shadow) !important; padding: 34px 32px !important; max-width: 440px; }
.page-card .page-card-head h4, .login-content h4 { font-weight: 400 !important; font-size: 1.35rem; letter-spacing: -.01em; margin-top: 8px; }
.page-card .page-card-head p, .login-content p { color: var(--v-muted); font-weight: 300; }
.page-card .field-icon, .login-content .field-icon { color: var(--v-muted); }
.page-card .form-control::placeholder { color: var(--v-muted); font-weight: 300; }
.page-card .page-card-head { border-bottom: 0; }
.page-card-head h4, .page-card .page-card-head .indicator { font-weight: 400; font-size: 1.25rem; }
.page-card .form-control, .login-content .form-control { border-radius: 12px !important; background: var(--v-field-solid) !important; border: 1px solid transparent !important; min-height: 44px; font-family: var(--v-font); }
.page-card .form-control:focus { border-color: var(--v-line2) !important; box-shadow: 0 0 0 3px var(--v-line) !important; background: var(--v-glass-solid) !important; }
.page-card .btn, .login-content .btn { border-radius: 999px !important; min-height: 44px; font-weight: 500; }
.page-card .btn-primary, .login-content .btn-primary { background: var(--v-ink) !important; border-color: var(--v-ink) !important; color: var(--v-bg) !important; }
[data-theme="dark"] .page-card .btn-primary { background: var(--v-amber) !important; border-color: var(--v-amber) !important; color: #0A0C0E !important; }
.page-card .forgot-password-message, .page-card a { color: var(--v-ink2); }
.login-content .social-logins .btn { background: var(--v-field-solid) !important; color: var(--v-ink) !important; }
.splash { background: var(--v-bg); }

/* Portal (proveedores, contratistas, clientes) */
.web-list-container, .web-form-container, .web-form, .page_content .card, .web-list-table { background: var(--v-glass-solid); border: 1px solid var(--v-line); border-radius: var(--v-radius-md); }
.web-form .form-control { border-radius: 12px !important; background: var(--v-field-solid) !important; border: 1px solid transparent !important; }
.web-list-table .table th { color: var(--v-ink2); font-weight: 400; }
.btn-primary { background: var(--v-ink); border-color: var(--v-ink); border-radius: 999px; }
.sidebar-item.active > a, .portal-sidebar .sidebar-item.active { background: var(--v-ink); color: var(--v-bg); border-radius: 999px; }
.footer-logo-extension, .web-footer { color: var(--v-muted); border-top: 1px solid var(--v-line); }

/* Barra del portal en celular: el ícono del menú viene de un sprite que las páginas web no cargan (quedaba un botón vacío) */
.navbar .navbar-brand { display: flex; align-items: center; }
.navbar .navbar-toggler { border: 1px solid var(--v-line) !important; border-radius: 999px; width: 44px; height: 38px; padding: 0;
  background: var(--v-glass-solid) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231C2226' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E") center / 20px no-repeat; }
.navbar .navbar-toggler > span { display: none; }
.navbar .navbar-collapse.show, .navbar .navbar-collapse.collapsing { padding: 8px 0 4px; }
/* En celular el menú abierto mostraba solo las iniciales (había que tocar de nuevo): se ven las opciones directo */
@media (max-width: 991px) {
  .navbar-collapse .nav-avatar { display: none; }
  .navbar-collapse .logged-in { display: block !important; width: 100%; height: auto !important; }
  .navbar-collapse .logged-in .dropdown-menu { display: block !important; position: static !important; transform: none !important; inset: auto !important; float: none; width: 100%; min-width: 0; border: 0 !important; box-shadow: none !important; background: transparent !important; padding: 0 !important; margin: 0 !important; }
  .navbar-collapse .logged-in .dropdown-item { padding: 12px 4px; font-size: 16px; border-bottom: 1px solid var(--v-line); color: var(--v-ink); }
  .navbar-collapse .logged-in .dropdown-item:last-child { border-bottom: 0; }
}

/* Pie: sin bloques vacíos ni franja blanca enorme; solo la firma */
.web-footer { background: transparent !important; padding: 14px 0 !important; margin-top: 24px; }
.web-footer .footer-logo-extension:not(:has(img, a, input)), .web-footer .footer-links:not(:has(a)) { display: none; }
.web-footer .footer-info { border: 0 !important; padding: 0 !important; margin: 0 !important; font-size: 12px; }


/* «¿Problemas para entrar?» (veta_mining/public/js/veta_login.js): pasos y a quién pedir ayuda, dentro de la tarjeta de ingreso */
.veta-problemas { margin: 2px 0 0; display: flex; justify-content: flex-end; width: 100%; }
.veta-problemas .btn-link { padding: 0 !important; width: auto !important; display: inline-block; font-size: 13px; color: var(--v-ink2) !important; text-decoration: underline; min-height: 0 !important; background: transparent !important; border: 0 !important; }
.veta-ayuda-entrar { margin-top: 18px; padding: 16px 18px; border-radius: var(--v-radius-md); background: var(--v-field-solid); color: var(--v-ink); font-size: 14px; line-height: 1.45; text-align: left; }
.veta-ayuda-entrar h5 { font-weight: 500; font-size: 15px; margin: 0 0 8px; }
.veta-ayuda-entrar ol { padding-left: 18px; margin: 0 0 12px; }
.veta-ayuda-entrar li { margin-bottom: 6px; }
.veta-ayuda-entrar li b { font-weight: 500; }
.veta-ayuda-contacto { border-top: 1px solid var(--v-line); padding-top: 10px; }
.veta-ayuda-contacto small { display: block; color: var(--v-muted); margin-top: 4px; }
.veta-ayuda-entrar a, .veta-pista-codigo a, .login-error-banner a { color: var(--v-ink); text-decoration: underline; }
.login-error-banner .veta-pista { color: var(--v-ink2); }
.veta-pista-codigo { margin-top: 10px; font-size: 13px; color: var(--v-ink2); }

/* App instalable (ADR-042): tarjeta del portal en el celular para instalar BP Minex (la arma veta-app.js) */
.bp-instalar { position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); z-index: 1050;
  display: grid; grid-template-columns: 40px minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 10px 8px 10px 12px;
  background: var(--v-glass-solid); border: 1px solid var(--v-line); border-radius: 20px; box-shadow: var(--v-shadow);
  animation: bp-entrar 280ms cubic-bezier(.2, .7, .2, 1) backwards; }
.bp-instalar img { width: 40px; height: 40px; border-radius: 11px; }
.bp-instalar p { margin: 0; display: grid; line-height: 1.25; font-size: .86rem; color: var(--v-ink2); }
.bp-instalar b { font-weight: 500; font-size: .95rem; color: var(--v-ink); }
.bp-instalar__si { min-height: 40px; padding: 0 16px; border: 0; border-radius: 999px; background: var(--v-ink); color: var(--v-bg);
  font: inherit; font-weight: 500; cursor: pointer; }
[data-theme="dark"] .bp-instalar__si { background: var(--v-amber); color: #0A0C0E; }
.bp-instalar__no { width: 36px; height: 36px; border: 0; border-radius: 999px; background: transparent; color: var(--v-muted);
  font-size: 1.4rem; line-height: 1; cursor: pointer; }
.bp-instalar button:focus-visible { outline: 2px solid var(--v-amber); outline-offset: 2px; }
@media print { .bp-instalar { display: none; } }
