:root {
    /* Marca real GEOINGCOL: degradado terracota del isotipo (la "G") */
    --geo-primary: #a63b13;
    --geo-secondary: #e9652e;
    --geo-accent: #e9652e;
    --geo-accent-dark: #a63b13;
    --geo-accent-soft: #fff0e8;
    --geo-blue: #2166b1;

    /* Reemplaza el azul por defecto de Bootstrap por el naranja de marca
       en todos los componentes/utilidades ".primary" (botones, badges,
       bg-primary, text-primary, links, etc.) */
    --bs-primary: var(--geo-accent);
    --bs-primary-rgb: 233, 101, 46;
    --bs-link-color: var(--geo-accent-dark);
    --bs-link-color-rgb: 166, 59, 19;
    --bs-link-hover-color: var(--geo-accent);
    --bs-link-hover-color-rgb: 233, 101, 46;
}

body { background: #f4f6f9; }

a { color: var(--geo-accent-dark); }
a:hover { color: var(--geo-accent); }

/* -------------------------------------------------------------
   Barra superior (igual estilo que la herramienta de laboratorio):
   fondo oscuro, ícono de marca a la izquierda, texto blanco.
   ------------------------------------------------------------- */
.topbar {
    position: sticky;
    top: 0;
    z-index: 30;
    height: 64px;
    background: #111111;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 18px;
    box-shadow: 0 2px 12px rgba(0,0,0,.25);
}

.topbar-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.topbar-brand img {
    height: 38px;
    width: 38px;
    max-height: 38px;
    max-width: 38px;
    object-fit: contain;
    flex: 0 0 auto;
    display: block;
}

.topbar-text {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    min-width: 0;
}

.topbar-title {
    font-weight: 800;
    font-size: 1.15rem;
    color: #fff;
    letter-spacing: .3px;
}

.topbar-text small {
    color: rgba(255,255,255,0.6);
    font-size: .72rem;
}

.topbar-user {
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(255,255,255,0.85);
    font-size: .85rem;
    white-space: nowrap;
}

.bg-login {
    background: linear-gradient(135deg, var(--geo-primary) 0%, var(--geo-secondary) 100%);
    min-height: 100vh;
}

.login-card {
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
    border: none;
}

.login-card .btn-primary,
.login-card button[type="submit"] {
    background-color: var(--geo-accent);
    border-color: var(--geo-accent);
}

.login-logo {
    height: 72px;
    width: 72px;
    max-height: 72px;
    max-width: 72px;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}

/* -------------------------------------------------------------
   Menú lateral: degradado terracota de marca GEOINGCOL, texto
   blanco (el ícono ya no vive aquí, ahora está en la barra negra
   superior, así que no hay problema de contraste con el logo).
   ------------------------------------------------------------- */
.sidebar {
    position: relative;
    background: linear-gradient(180deg, var(--geo-primary), var(--geo-secondary));
    min-height: calc(100vh - 64px);
    color: #fff;
    border-right: none;
}

.sidebar a {
    color: rgba(255,255,255,0.92);
    text-decoration: none;
    padding: 11px 16px;
    margin: 3px 10px;
    display: block;
    border-radius: 10px;
    font-weight: 600;
    font-size: .93rem;
    transition: all 0.15s;
}

.sidebar a i {
    color: rgba(255,255,255,0.85);
    width: 20px;
    display: inline-block;
    text-align: center;
}

.sidebar a:hover {
    background: rgba(0,0,0,0.18);
    color: #fff;
}

.sidebar a.active {
    background: rgba(0,0,0,0.28);
    color: #fff;
}

.sidebar a.active i {
    color: #fff;
}

.sidebar a.text-danger {
    color: #ffc4b8 !important;
}
.sidebar a.text-danger i { color: #ffc4b8; }
.sidebar a.text-danger:hover { background: rgba(0,0,0,0.18); }


/* -------------------------------------------------------------
   Submenú de "Ensayo Cilindros" (Nuevo Ensayo / Ver Ensayos):
   flechita que gira al abrir, y sub-links indentados y un poco
   más pequeños para distinguirlos del nivel principal.
   ------------------------------------------------------------- */
.sidebar a.sidebar-toggle {
    display: flex;
    align-items: center;
}
.sidebar a.sidebar-toggle .submenu-caret {
    margin-left: auto;
    font-size: .75rem;
    transition: transform 0.2s;
}
.sidebar a.sidebar-toggle.collapsed .submenu-caret {
    transform: rotate(-90deg);
}
.sidebar a.submenu-link {
    padding-left: 40px;
    margin: 2px 10px;
    font-size: .85rem;
    font-weight: 500;
    color: rgba(255,255,255,0.85);
}
.sidebar a.submenu-link:hover {
    color: #fff;
}
.sidebar a.submenu-link i {
    font-size: .8rem;
}

/* -------------------------------------------------------------
   Naranja de marca sobre los componentes "primary" de Bootstrap
   (botones, badges, encabezados de tarjeta, bg/text utilitarios)
   ------------------------------------------------------------- */
.btn-primary {
    background-color: var(--geo-accent);
    border-color: var(--geo-accent);
    color: #fff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: var(--geo-accent-dark) !important;
    border-color: var(--geo-accent-dark) !important;
    color: #fff;
}
.bg-primary { background-color: var(--geo-accent) !important; }
.text-primary { color: var(--geo-accent) !important; }
.border-primary { border-color: var(--geo-accent) !important; }
.badge.bg-primary { background-color: var(--geo-accent) !important; }
.card-header.bg-primary { background-color: var(--geo-accent) !important; }

.stat-card {
    border-left: 4px solid var(--geo-accent);
    transition: transform 0.2s;
}

.stat-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.table th { font-size: 0.85rem; }
.table td { font-size: 0.85rem; vertical-align: middle; }

/* Estilos para la tabla de ensayos (similar al Excel) */
.ensayos-table {
    font-size: 0.8rem;
}

.ensayos-table thead th {
    background-color: #2c3e50 !important;
    color: white !important;
    text-align: center;
    vertical-align: middle;
    white-space: normal;
    line-height: 1.2;
    padding: 8px 6px;
    font-weight: 600;
    border: 1px solid #34495e;
    min-width: 70px;
}

.ensayos-table tbody td {
    vertical-align: middle;
    border: 1px solid #dee2e6;
    padding: 6px 8px;
}

.ensayos-table tbody tr:hover {
    background-color: #f8f9fa;
}

.ensayos-table .text-end {
    text-align: right;
}

.ensayos-table .text-center {
    text-align: center;
}